79         const li = target.closest('li');
80         if (!li) return;
87         if(li.classList.contains('tree-root')) return;
92             li.classList.toggle('selected');
99             this.renameGui(li);
104         if (clicked.tagName.toLowerCase() === 'span' && li.classList.contains('move-ns')) {
106             this.toggleNamespace(li);
118         this.#mainElement.querySelectorAll('.changed').forEach(li => {
120                 src: li.dataset.orig,
121                 dst: li.dataset.id,
122                 type: this.isItemMedia(li) ? 'media' : 'page',
123                 class: this.isItemNamespace(li) ? 'ns' : 'doc',
128             if (entry.class === 'ns' && entry.type === 'media' && this.isItemPage(li)) {
150         const li = ev.target.closest('li');
151         if (!li) return;
153         ev.dataTransfer.setData('text/plain', li.dataset.id); // FIXME needed?
158         li.classList.add('selected');
174         const li = ev.target.closest('li');
175         if (!li)  return;
178         if (li.classList.contains('move-ns')) {
180             ul = li.querySelector('ul');
273             const li = this.#mainElement.querySelectorAll(`li[data-orig="${ns}"].move-ns`);
274             if (!li.length) return;
279             for (const el of li) {
294     renameGui(li) {  argument
295         const basename = this.getBase(li.dataset.id);
304         if (!this.isItemNamespace(li) && this.isItemMedia(li)) {
305             if (this.getExtension(li.dataset.id) !== this.getExtension(clean)) {
312         const ns = this.getNamespace(li.dataset.id);
314         if (this.itemTree(li).querySelector(`li[data-id="${newID}"]`)) {
320         this.updateMovedItem(li, newID);
323         if (this.isItemNamespace(li)) {
324             this.updatePassiveSubNamespaces(li.querySelector('ul'));
335     async toggleNamespace(li) {  argument
336         const isOpen = li.classList.toggle('open');
339         const icon = li.querySelector('i');
345             let ul = li.querySelector('ul');
353             ul.classList = li.classList;
354             ul.dataset.id = li.dataset.id;
355             ul.dataset.orig = li.dataset.orig;
356             li.appendChild(ul);
360             if (li.classList.contains('move-pages')) {
361                 promises.push(this.loadSubTree(li.dataset.orig, 'pages'));
363             if (li.classList.contains('move-media')) {
364                 promises.push(this.loadSubTree(li.dataset.orig, 'media'));
368             const ul = li.querySelector('ul');
409             let li;
412                 li = parent.querySelector(`li[data-orig="${item.id}"].move-ns`);
415             if (!li) {
416                 li = this.createListItem(item, type);
417                 parent.appendChild(li);
420             li.classList.add(`move-${type}`);
461         for (const li of parent.children) {
462             if (!this.isItemNamespace(li)) continue;
464             const newID = this.getNewId(li.dataset.id, ns);
465             li.dataset.id = newID;
467             const sub = li.getElementsByTagName('ul');
493     updateMovedItem(li, newID) {  argument
494         const name = li.querySelector('span');
496         if (li.dataset.orig === newID) {
498             li.classList.remove('changed');
500         } else if (li.dataset.id !== newID) {
501             li.dataset.id = newID;
502             li.classList.add('changed');
504             name.title = li.dataset.orig + ' → ' + newID;
506             const ul = li.querySelector('ul');
511             li.classList.remove('changed');
522     isItemNamespace(li) {  argument
523         return li.classList.contains('move-ns');
532     isItemMedia(li) {  argument
533         return li.classList.contains('move-media');
542     isItemPage(li) {  argument
543         return li.classList.contains('move-pages');
552     itemTree(li) {  argument
553         if (this.isItemMedia(li)) {
568         const li = document.createElement('li');
569         li.dataset.id = item.id;
570         li.dataset.orig = item.id; // track the original ID
571         li.classList.add(`move-${type}`);
572         li.draggable = true;
576         li.appendChild(wrapper);
580             li.classList.add('move-ns');
599         return li;