feat: sidebar compact + menu contextuel (clic droit/long press) + boutons Expand/Collapse All
Sidebar workspace: - Arbre plus compact: padding réduit (4+12*depth au lieu de 8+16), gap 4px, min-height 24px, font 13px, chevron 12px - Boutons d'action (📄📁✏️🗑) remplacés par menu contextuel au clic droit (@contextmenu.prevent) et long-press mobile (500ms) - Menu: New File, New Folder (si dossier), Rename, Delete - Nom de l'item affiché en bas du menu Page workspace: - Boutons ⊞ (Expand All) et ⊟ (Collapse All) dans la toolbar - expandAll(): parcourt l'arbre, set expanded[id]=true, toggle DOM - collapseAll(): vide expanded, masque tous les <ul>
This commit is contained in:
@@ -158,6 +158,8 @@
|
||||
📁 <span x-text="breadcrumb.length > 0 ? breadcrumb[breadcrumb.length-1].name : ''"></span>
|
||||
</h1>
|
||||
<div class="ws-toolbar">
|
||||
<button class="btn-icon" @click="expandAll()" title="Expand all">⊞</button>
|
||||
<button class="btn-icon" @click="collapseAll()" title="Collapse all">⊟</button>
|
||||
<button class="btn-icon" @click="openModal('file')" title="New file">📄</button>
|
||||
<button class="btn-icon" @click="openModal('folder')" title="New folder">📁</button>
|
||||
</div>
|
||||
@@ -448,6 +450,41 @@ document.addEventListener('alpine:init', function() {
|
||||
window.location = '/local-workspace?folder=' + id;
|
||||
},
|
||||
|
||||
// ── Expand / Collapse all ──
|
||||
expandAll() {
|
||||
var self = this;
|
||||
this._walkTree(this.tree, function(n) {
|
||||
if (n.is_folder && n.children && n.children.length > 0) {
|
||||
self.expanded[n.id] = true;
|
||||
}
|
||||
});
|
||||
this.expanded = Object.assign({}, this.expanded);
|
||||
// Toggle static HTML for renderChildren
|
||||
this._toggleAllUl(this.$el, true);
|
||||
},
|
||||
collapseAll() {
|
||||
this.expanded = {};
|
||||
this._toggleAllUl(this.$el, false);
|
||||
},
|
||||
_walkTree(nodes, fn) {
|
||||
for (var i=0; i<nodes.length; i++) {
|
||||
fn(nodes[i]);
|
||||
if (nodes[i].children) this._walkTree(nodes[i].children, fn);
|
||||
}
|
||||
},
|
||||
_toggleAllUl(el, show) {
|
||||
var uls = el.querySelectorAll('ul.ws-tree');
|
||||
for (var i=0; i<uls.length; i++) {
|
||||
uls[i].style.display = show ? '' : 'none';
|
||||
}
|
||||
// Also toggle chevrons
|
||||
var chevs = el.querySelectorAll('.ws-chevron');
|
||||
for (var j=0; j<chevs.length; j++) {
|
||||
if (show) chevs[j].classList.add('open');
|
||||
else chevs[j].classList.remove('open');
|
||||
}
|
||||
},
|
||||
|
||||
// ── Search / Filter ──
|
||||
doFilter() {
|
||||
var q = (this.searchQuery || '').toLowerCase().trim();
|
||||
|
||||
Reference in New Issue
Block a user