joplin-plugin-explorer 1.1.4 → 1.2.1

package/publish/webview/panel.js

@@ -1,485 +1 @@
-/* Webview script for Notes In List panel */
-
-// Persist scroll position across setHtml calls
-var _savedScrollTop = 0;
-var _isFirstRender = true;
-
-function postMsg(msg) {
-  webviewApi.postMessage(msg);
-}
-
-// Save scroll position continuously
-document.addEventListener('scroll', function(e) {
-  if (e.target && e.target.id === 'tree-container') {
-    _savedScrollTop = e.target.scrollTop;
-  }
-}, true);
-
-// Observe DOM changes to restore scroll position after setHtml
-var _observer = new MutationObserver(function() {
-  var container = document.getElementById('tree-container');
-  if (!container) return;
-
-  if (_isFirstRender) {
-    _isFirstRender = false;
-    var selected = container.querySelector('.tree-item.note.selected');
-    if (selected) {
-      setTimeout(function() {
-        selected.scrollIntoView({ block: 'nearest', behavior: 'instant' });
-      }, 30);
-    }
-  } else {
-    container.scrollTop = _savedScrollTop;
-  }
-});
-_observer.observe(document.body, { childList: true, subtree: true });
-
-function loadI18n() {
-  var root = document.getElementById('notes-in-list-root');
-  if (root && root.dataset.i18n) {
-    try { window._i18n = JSON.parse(root.dataset.i18n); } catch(e) {}
-  }
-}
-
-function T(key) {
-  if (!window._i18n) loadI18n();
-  return (window._i18n && window._i18n[key]) || key;
-}
-
-// Inline input dialog (replaces prompt() which may not work in webview)
-function showInlineInput(label, defaultValue, callback) {
-  var existing = document.getElementById('inline-input-overlay');
-  if (existing) existing.remove();
-
-  var overlay = document.createElement('div');
-  overlay.id = 'inline-input-overlay';
-  overlay.className = 'inline-input-overlay';
-  overlay.innerHTML = '<div class="inline-input-dialog">'
-    + '<div class="inline-input-label">' + label + '</div>'
-    + '<input class="inline-input-field" type="text" value="' + (defaultValue || '').replace(/"/g, '&quot;') + '" />'
-    + '<div class="inline-input-buttons">'
-    + '<button class="inline-input-ok">OK</button>'
-    + '<button class="inline-input-cancel">' + (T('cancel') || 'Cancel') + '</button>'
-    + '</div></div>';
-
-  document.body.appendChild(overlay);
-
-  var input = overlay.querySelector('.inline-input-field');
-  input.focus();
-  input.select();
-
-  function submit() {
-    var val = input.value;
-    overlay.remove();
-    callback(val);
-  }
-  function cancel() {
-    overlay.remove();
-    callback(null);
-  }
-
-  overlay.querySelector('.inline-input-ok').addEventListener('click', submit);
-  overlay.querySelector('.inline-input-cancel').addEventListener('click', cancel);
-  input.addEventListener('keydown', function(e) {
-    if (e.key === 'Enter') submit();
-    if (e.key === 'Escape') cancel();
-  });
-  overlay.addEventListener('click', function(e) {
-    if (e.target === overlay) cancel();
-  });
-}
-
-// Left click: open note / toggle folder
-document.addEventListener('click', function(e) {
-  var existingMenu = document.getElementById('ctx-menu');
-  if (existingMenu) existingMenu.remove();
-
-  var item = e.target.closest('.tree-item');
-  if (!item) return;
-
-  var type = item.dataset.type;
-  var id = item.dataset.id;
-
-  if (type === 'note') {
-    document.querySelectorAll('.tree-item.note.selected').forEach(function(el) {
-      el.classList.remove('selected');
-    });
-    item.classList.add('selected');
-    postMsg({ name: 'openNote', id: id });
-  }
-
-  if (type === 'folder') {
-    postMsg({ name: 'toggleFolder', id: id });
-  }
-});
-
-// Right click: context menu
-document.addEventListener('contextmenu', function(e) {
-  var existingMenu = document.getElementById('ctx-menu');
-  if (existingMenu) existingMenu.remove();
-
-  var item = e.target.closest('.tree-item');
-  if (!item) return;
-
-  e.preventDefault();
-
-  var type = item.dataset.type;
-  var id = item.dataset.id;
-  var title = '';
-  var labelEl = item.querySelector('.label');
-  if (labelEl) title = labelEl.textContent;
-
-  var menuHtml = '<div id="ctx-menu" class="context-menu" style="left:' + e.pageX + 'px;top:' + e.pageY + 'px;">';
-
-  if (type === 'folder') {
-    menuHtml += '<div class="ctx-item" data-action="newNote" data-id="' + id + '" data-type="folder">' + T('ctxNewNoteHere') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="newTodo" data-id="' + id + '" data-type="folder">' + T('ctxNewTodoHere') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="newSubNotebook" data-id="' + id + '" data-type="folder">' + T('ctxNewSubNotebook') + '</div>';
-    menuHtml += '<div class="ctx-sep"></div>';
-    menuHtml += '<div class="ctx-item" data-action="renameFolder" data-id="' + id + '" data-type="folder" data-title="' + title.replace(/"/g, '&quot;') + '">' + T('ctxRenameFolder') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="exportFolder" data-id="' + id + '" data-type="folder">' + T('ctxExportFolder') + '</div>';
-    menuHtml += '<div class="ctx-sep"></div>';
-    menuHtml += '<div class="ctx-item ctx-danger" data-action="deleteFolder" data-id="' + id + '" data-type="folder">' + T('ctxDeleteFolder') + '</div>';
-  } else if (type === 'note') {
-    menuHtml += '<div class="ctx-item" data-action="openNote" data-id="' + id + '" data-type="note">' + T('ctxOpenNote') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="openInNewWindow" data-id="' + id + '" data-type="note">' + T('ctxOpenInNewWindow') + '</div>';
-    menuHtml += '<div class="ctx-sep"></div>';
-    menuHtml += '<div class="ctx-item" data-action="copyLink" data-id="' + id + '" data-type="note">' + T('ctxCopyLink') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="duplicateNote" data-id="' + id + '" data-type="note">' + T('ctxDuplicateNote') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="switchNoteType" data-id="' + id + '" data-type="note">' + T('ctxSwitchNoteType') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="toggleTodo" data-id="' + id + '" data-type="note">' + T('ctxToggleTodo') + '</div>';
-    menuHtml += '<div class="ctx-sep"></div>';
-    menuHtml += '<div class="ctx-item" data-action="renameNote" data-id="' + id + '" data-type="note" data-title="' + title.replace(/"/g, '&quot;') + '">' + T('ctxRenameNote') + '</div>';
-    menuHtml += '<div class="ctx-item" data-action="noteInfo" data-id="' + id + '" data-type="note">' + T('ctxNoteInfo') + '</div>';
-    menuHtml += '<div class="ctx-sep"></div>';
-    menuHtml += '<div class="ctx-item ctx-danger" data-action="deleteNote" data-id="' + id + '" data-type="note">' + T('ctxDeleteNote') + '</div>';
-  }
-
-  menuHtml += '</div>';
-  document.body.insertAdjacentHTML('beforeend', menuHtml);
-
-  var menu = document.getElementById('ctx-menu');
-  var rect = menu.getBoundingClientRect();
-  if (rect.right > window.innerWidth) menu.style.left = (window.innerWidth - rect.width - 4) + 'px';
-  if (rect.bottom > window.innerHeight) menu.style.top = (window.innerHeight - rect.height - 4) + 'px';
-});
-
-// Context menu item click
-document.addEventListener('click', function(e) {
-  var ctxItem = e.target.closest('.ctx-item');
-  if (!ctxItem) return;
-
-  var action = ctxItem.dataset.action;
-  var id = ctxItem.dataset.id;
-  var itemType = ctxItem.dataset.type;
-
-  // All dialogs handled by backend using native Joplin dialogs
-  postMsg({ name: 'contextMenu', action: action, id: id, itemType: itemType });
-
-  var menu = document.getElementById('ctx-menu');
-  if (menu) menu.remove();
-});
-
-// Close context menu
-document.addEventListener('mousedown', function(e) {
-  if (!e.target.closest('#ctx-menu')) {
-    var menu = document.getElementById('ctx-menu');
-    if (menu) menu.remove();
-  }
-});
-
-// Toolbar buttons
-document.addEventListener('click', function(e) {
-  var btn = e.target.closest('button');
-  if (!btn) return;
-
-  switch (btn.id) {
-    case 'btn-new-notebook': postMsg({ name: 'newNotebook' }); break;
-    case 'btn-new-note': postMsg({ name: 'newNote' }); break;
-    case 'btn-new-todo': postMsg({ name: 'newTodo' }); break;
-    case 'btn-sort': postMsg({ name: 'cycleSort' }); break;
-    case 'btn-collapse-all': postMsg({ name: 'collapseAll' }); break;
-    case 'btn-sync':
-      var syncBtn = document.getElementById('btn-sync');
-      if (syncBtn && !syncBtn.disabled) {
-        syncBtn.disabled = true;
-        syncBtn.classList.add('syncing');
-        syncBtn.textContent = '\uD83D\uDD04 ' + T('syncing');
-        postMsg({ name: 'sync' });
-      }
-      break;
-  }
-});
-
-// Listen for messages from plugin backend
-webviewApi.onMessage(function(msg) {
-  if (!msg || !msg.message) return;
-  var m = msg.message;
-
-  if (m.name === 'syncState') {
-    var syncBtn = document.getElementById('btn-sync');
-    if (!syncBtn) return;
-    if (m.state === 'done') {
-      syncBtn.classList.remove('syncing');
-      syncBtn.classList.add('sync-done');
-      syncBtn.textContent = T('syncDone');
-      // Show "done" for 2 seconds, then restore
-      setTimeout(function() {
-        var btn = document.getElementById('btn-sync');
-        if (btn) {
-          btn.disabled = false;
-          btn.classList.remove('sync-done');
-          btn.textContent = '\uD83D\uDD04 ' + T('sync');
-        }
-      }, 2000);
-    }
-  } else if (m.name === 'searchResults') {
-    // Ignore stale search results
-    if (m.searchId !== undefined && m.searchId !== _searchId) return;
-    if (m.results === null) {
-      if (_searchMode) exitSearchMode();
-    } else {
-      renderSearchResults(m.results, m.query);
-    }
-  } else if (m.name === 'copyText') {
-    // Fallback clipboard copy via webview
-    if (navigator.clipboard && navigator.clipboard.writeText) {
-      navigator.clipboard.writeText(m.text);
-    } else {
-      var ta = document.createElement('textarea');
-      ta.value = m.text;
-      document.body.appendChild(ta);
-      ta.select();
-      document.execCommand('copy');
-      ta.remove();
-    }
-  } else if (m.name === 'selectNote') {
-    // Update selection without full re-render
-    document.querySelectorAll('.tree-item.note.selected').forEach(function(el) {
-      el.classList.remove('selected');
-    });
-    var noteEl = document.querySelector('.tree-item.note[data-id="' + m.id + '"]');
-    if (noteEl) {
-      noteEl.classList.add('selected');
-      noteEl.scrollIntoView({ block: 'nearest', behavior: 'instant' });
-    }
-  }
-});
-
-// ======================== Drag & Drop ========================
-// Make tree items draggable
-document.addEventListener('mousedown', function(e) {
-  var item = e.target.closest('.tree-item');
-  if (!item || e.button !== 0) return;
-  item.setAttribute('draggable', 'true');
-});
-
-document.addEventListener('dragstart', function(e) {
-  var item = e.target.closest('.tree-item');
-  if (!item) return;
-  e.dataTransfer.setData('text/plain', JSON.stringify({
-    id: item.dataset.id,
-    type: item.dataset.type,
-  }));
-  e.dataTransfer.effectAllowed = 'move';
-  item.classList.add('dragging');
-});
-
-document.addEventListener('dragend', function(e) {
-  var item = e.target.closest('.tree-item');
-  if (item) {
-    item.classList.remove('dragging');
-    item.removeAttribute('draggable');
-  }
-  // Clean up all drop indicators
-  document.querySelectorAll('.drop-target').forEach(function(el) { el.classList.remove('drop-target'); });
-  document.querySelectorAll('.drop-above').forEach(function(el) { el.classList.remove('drop-above'); });
-  document.querySelectorAll('.drop-below').forEach(function(el) { el.classList.remove('drop-below'); });
-});
-
-document.addEventListener('dragover', function(e) {
-  var target = e.target.closest('.tree-item');
-  if (!target) return;
-
-  e.preventDefault();
-  e.dataTransfer.dropEffect = 'move';
-
-  // Clean previous indicators
-  document.querySelectorAll('.drop-target').forEach(function(el) { el.classList.remove('drop-target'); });
-  document.querySelectorAll('.drop-above').forEach(function(el) { el.classList.remove('drop-above'); });
-  document.querySelectorAll('.drop-below').forEach(function(el) { el.classList.remove('drop-below'); });
-
-  var targetType = target.dataset.type;
-  var rect = target.getBoundingClientRect();
-  var y = e.clientY - rect.top;
-  var height = rect.height;
-
-  if (targetType === 'folder') {
-    // Top 25%: drop above, middle 50%: drop into, bottom 25%: drop below
-    if (y < height * 0.25) {
-      target.classList.add('drop-above');
-    } else if (y > height * 0.75) {
-      target.classList.add('drop-below');
-    } else {
-      target.classList.add('drop-target');
-    }
-  } else {
-    // Notes: just show drop-target (will move to same folder)
-    if (y < height * 0.5) {
-      target.classList.add('drop-above');
-    } else {
-      target.classList.add('drop-below');
-    }
-  }
-});
-
-document.addEventListener('dragleave', function(e) {
-  var target = e.target.closest('.tree-item');
-  if (target) {
-    target.classList.remove('drop-target');
-    target.classList.remove('drop-above');
-    target.classList.remove('drop-below');
-  }
-});
-
-document.addEventListener('drop', function(e) {
-  e.preventDefault();
-  var target = e.target.closest('.tree-item');
-  if (!target) return;
-
-  var data;
-  try { data = JSON.parse(e.dataTransfer.getData('text/plain')); } catch(err) { return; }
-
-  var targetId = target.dataset.id;
-  var targetType = target.dataset.type;
-  var dragId = data.id;
-  var dragType = data.type;
-
-  if (dragId === targetId) return; // Can't drop on self
-
-  var rect = target.getBoundingClientRect();
-  var y = e.clientY - rect.top;
-  var height = rect.height;
-
-  if (targetType === 'folder') {
-    if (y >= height * 0.25 && y <= height * 0.75) {
-      // Drop INTO folder
-      postMsg({ name: 'dragDrop', dragId: dragId, dragType: dragType, targetId: targetId, position: 'into' });
-    } else {
-      // Drop above/below folder (reorder)
-      var pos = y < height * 0.25 ? 'above' : 'below';
-      postMsg({ name: 'dragDrop', dragId: dragId, dragType: dragType, targetId: targetId, position: pos });
-    }
-  } else {
-    // Drop on note -> move to same folder as note
-    postMsg({ name: 'dragDrop', dragId: dragId, dragType: dragType, targetId: targetId, position: 'into' });
-  }
-
-  // Clean up
-  document.querySelectorAll('.drop-target, .drop-above, .drop-below').forEach(function(el) {
-    el.classList.remove('drop-target', 'drop-above', 'drop-below');
-  });
-});
-
-// ======================== Content Search ========================
-var _searchTimer = null;
-var _searchMode = false;
-var _searchId = 0;
-
-function escapeRegex(str) {
-  return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-}
-
-function highlightText(text, query) {
-  if (!query) return text;
-  // Escape HTML first
-  var escaped = text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
-  var regex = new RegExp('(' + escapeRegex(query) + ')', 'gi');
-  return escaped.replace(regex, '<mark class="search-highlight">$1</mark>');
-}
-
-function showSearchContainer(show) {
-  var tree = document.getElementById('tree-container');
-  var search = document.getElementById('search-results');
-  if (tree) tree.style.display = show ? 'none' : '';
-  if (search) search.style.display = show ? '' : 'none';
-}
-
-function renderSearchResults(results, query) {
-  var container = document.getElementById('search-results');
-  if (!container) return;
-
-  showSearchContainer(true);
-
-  if (!results || results.length === 0) {
-    container.innerHTML = '<div class="search-status">' + T('searchNoResult') + '</div>';
-    return;
-  }
-
-  var countText = T('searchResultCount').replace('{count}', results.length);
-  var html = '<div class="search-status">' + countText + '</div>';
-
-  for (var i = 0; i < results.length; i++) {
-    var item = results[i];
-    var icon = '\uD83D\uDCDD';
-    if (item.is_todo) {
-      icon = item.todo_completed ? '\u2611' : '\u2610';
-    }
-    html += '<div class="search-result-item tree-item note" data-id="' + item.id + '" data-type="note">';
-    html += '<span class="icon note-icon">' + icon + '</span>';
-    html += '<div class="search-result-content">';
-    html += '<div class="search-result-title">' + highlightText(item.title, query) + '</div>';
-    if (item.folderName) {
-      html += '<div class="search-result-folder">\uD83D\uDCC2 ' + item.folderName + '</div>';
-    }
-    if (item.snippet) {
-      html += '<div class="search-result-snippet">' + highlightText(item.snippet, query) + '</div>';
-    }
-    html += '</div></div>';
-  }
-
-  container.innerHTML = html;
-  _searchMode = true;
-}
-
-function exitSearchMode() {
-  _searchMode = false;
-  showSearchContainer(false);
-}
-
-document.addEventListener('input', function(e) {
-  if (e.target.id !== 'search-input') return;
-  var query = e.target.value.trim();
-
-  if (_searchTimer) clearTimeout(_searchTimer);
-  _searchId++;
-  var currentSearchId = _searchId;
-
-  if (!query) {
-    if (_searchMode) exitSearchMode();
-    return;
-  }
-
-  _searchMode = true;
-  var searchContainer = document.getElementById('search-results');
-  if (searchContainer) {
-    searchContainer.innerHTML = '<div class="search-status">' + T('searching') + '</div>';
-  }
-  showSearchContainer(true);
-
-  // Debounce: wait 400ms after typing stops
-  _searchTimer = setTimeout(function() {
-    postMsg({ name: 'search', query: query, searchId: currentSearchId });
-  }, 400);
-});
-
-// Handle Escape key to clear search
-document.addEventListener('keydown', function(e) {
-  if (e.key === 'Escape') {
-    var input = document.getElementById('search-input');
-    if (input && input.value) {
-      input.value = '';
-      if (_searchMode) exitSearchMode();
-    }
-  }
-});
+var _savedScrollTop=0,_isFirstRender=!0;function postMsg(e){webviewApi.postMessage(e)}document.addEventListener("scroll",function(e){e.target&&"tree-container"===e.target.id&&(_savedScrollTop=e.target.scrollTop)},!0);var _observer=new MutationObserver(function(){var e=document.getElementById("tree-container");if(e)if(_isFirstRender){_isFirstRender=!1;var t=e.querySelector(".tree-item.note.selected");t&&setTimeout(function(){t.scrollIntoView({block:"nearest",behavior:"instant"})},30)}else e.scrollTop=_savedScrollTop});function loadI18n(){var e=document.getElementById("notes-in-list-root");if(e&&e.dataset.i18n)try{window._i18n=JSON.parse(e.dataset.i18n)}catch(e){}}function T(e){return window._i18n||loadI18n(),window._i18n&&window._i18n[e]||e}function getPinnedData(){var e=document.getElementById("notes-in-list-root");if(e&&e.dataset.pinned)try{return JSON.parse(e.dataset.pinned)}catch(e){}return[]}function isPinned(e){for(var t=getPinnedData(),a=0;a<t.length;a++)if(t[a].id===e)return!0;return!1}function showInlineInput(e,t,a){var n=document.getElementById("inline-input-overlay");n&&n.remove();var i=document.createElement("div");i.id="inline-input-overlay",i.className="inline-input-overlay",i.innerHTML='<div class="inline-input-dialog"><div class="inline-input-label">'+e+'</div><input class="inline-input-field" type="text" value="'+(t||"").replace(/"/g,"&quot;")+'" /><div class="inline-input-buttons"><button class="inline-input-ok">OK</button><button class="inline-input-cancel">'+(T("cancel")||"Cancel")+"</button></div></div>",document.body.appendChild(i);var s=i.querySelector(".inline-input-field");function d(){var e=s.value;i.remove(),a(e)}function o(){i.remove(),a(null)}s.focus(),s.select(),i.querySelector(".inline-input-ok").addEventListener("click",d),i.querySelector(".inline-input-cancel").addEventListener("click",o),s.addEventListener("keydown",function(e){"Enter"===e.key&&d(),"Escape"===e.key&&o()}),i.addEventListener("click",function(e){e.target===i&&o()})}function clearDropIndicators(){document.querySelectorAll(".drop-target").forEach(function(e){e.classList.remove("drop-target")}),document.querySelectorAll(".drop-above").forEach(function(e){e.classList.remove("drop-above")}),document.querySelectorAll(".drop-below").forEach(function(e){e.classList.remove("drop-below")})}function endDrag(){clearDropIndicators();var e=document.getElementById("tree-container");e&&e.classList.remove("dragging-active")}_observer.observe(document.body,{childList:!0,subtree:!0}),document.addEventListener("click",function(e){var t=document.getElementById("ctx-menu");t&&t.remove();var a=e.target.closest(".search-tag-item");if(a){var n=a.dataset.tagId;n&&postMsg({name:"loadTagNotes",tagId:n})}else{var i=e.target.closest(".search-folder-item");if(i){var s=i.dataset.folderId;s&&postMsg({name:"locateFolder",folderId:s})}else{var d=e.target.closest(".tree-item");if(d){var o=d.dataset.type,r=d.dataset.id,c=d.classList.contains("pinned-item");"note"===o&&(document.querySelectorAll(".tree-item.note.selected").forEach(function(e){e.classList.remove("selected")}),d.classList.add("selected"),postMsg({name:"openNote",id:r})),"folder"===o&&postMsg(c?{name:"locatePinnedFolder",folderId:r}:{name:"toggleFolder",id:r})}}}}),document.addEventListener("contextmenu",function(e){var t=document.getElementById("ctx-menu");t&&t.remove();var a=e.target.closest(".tree-item");if(a){e.preventDefault();var n=a.dataset.type,i=a.dataset.id,s="",d=a.querySelector(".label");d&&(s=d.textContent);var o='<div id="ctx-menu" class="context-menu" style="left:'+e.pageX+"px;top:"+e.pageY+'px;">';if("folder"===n){var r=isPinned(i);o+='<div class="ctx-item" data-action="'+(r?"unpinFolder":"pinFolder")+'" data-id="'+i+'" data-type="folder">'+T(r?"ctxUnpin":"ctxPin")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item" data-action="newNote" data-id="'+i+'" data-type="folder">'+T("ctxNewNoteHere")+"</div>",o+='<div class="ctx-item" data-action="newTodo" data-id="'+i+'" data-type="folder">'+T("ctxNewTodoHere")+"</div>",o+='<div class="ctx-item" data-action="newSubNotebook" data-id="'+i+'" data-type="folder">'+T("ctxNewSubNotebook")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item" data-action="renameFolder" data-id="'+i+'" data-type="folder" data-title="'+s.replace(/"/g,"&quot;")+'">'+T("ctxRenameFolder")+"</div>",o+='<div class="ctx-item" data-action="exportFolder" data-id="'+i+'" data-type="folder">'+T("ctxExportFolder")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item ctx-danger" data-action="deleteFolder" data-id="'+i+'" data-type="folder">'+T("ctxDeleteFolder")+"</div>"}else if("note"===n){var c=isPinned(i);o+='<div class="ctx-item" data-action="'+(c?"unpinNote":"pinNote")+'" data-id="'+i+'" data-type="note">'+T(c?"ctxUnpin":"ctxPin")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item" data-action="openNote" data-id="'+i+'" data-type="note">'+T("ctxOpenNote")+"</div>",o+='<div class="ctx-item" data-action="openInNewWindow" data-id="'+i+'" data-type="note">'+T("ctxOpenInNewWindow")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item" data-action="copyLink" data-id="'+i+'" data-type="note">'+T("ctxCopyLink")+"</div>",o+='<div class="ctx-item" data-action="duplicateNote" data-id="'+i+'" data-type="note">'+T("ctxDuplicateNote")+"</div>",o+='<div class="ctx-item" data-action="switchNoteType" data-id="'+i+'" data-type="note">'+T("ctxSwitchNoteType")+"</div>",o+='<div class="ctx-item" data-action="toggleTodo" data-id="'+i+'" data-type="note">'+T("ctxToggleTodo")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item" data-action="renameNote" data-id="'+i+'" data-type="note" data-title="'+s.replace(/"/g,"&quot;")+'">'+T("ctxRenameNote")+"</div>",o+='<div class="ctx-item" data-action="noteInfo" data-id="'+i+'" data-type="note">'+T("ctxNoteInfo")+"</div>",o+='<div class="ctx-sep"></div>',o+='<div class="ctx-item ctx-danger" data-action="deleteNote" data-id="'+i+'" data-type="note">'+T("ctxDeleteNote")+"</div>"}o+="</div>",document.body.insertAdjacentHTML("beforeend",o);var l=document.getElementById("ctx-menu"),v=l.getBoundingClientRect();v.right>window.innerWidth&&(l.style.left=window.innerWidth-v.width-4+"px"),v.bottom>window.innerHeight&&(l.style.top=window.innerHeight-v.height-4+"px")}}),document.addEventListener("click",function(e){var t=e.target.closest(".ctx-item");if(t){postMsg({name:"contextMenu",action:t.dataset.action,id:t.dataset.id,itemType:t.dataset.type});var a=document.getElementById("ctx-menu");a&&a.remove()}}),document.addEventListener("mousedown",function(e){if(!e.target.closest("#ctx-menu")){var t=document.getElementById("ctx-menu");t&&t.remove()}}),document.addEventListener("click",function(e){e.target.closest(".pinned-section-header")&&postMsg({name:"togglePinnedCollapse"})}),document.addEventListener("click",function(e){var t=e.target.closest(".search-section-header");if(t){var a=t.dataset.section,n=document.getElementById("search-section-"+a);if(n){var i=t.querySelector(".section-toggle");n.classList.contains("collapsed")?(n.classList.remove("collapsed"),i&&(i.textContent="▼")):(n.classList.add("collapsed"),i&&(i.textContent="▶"))}}}),document.addEventListener("click",function(e){var t=e.target.closest("button");if(t)switch(t.id){case"btn-new-notebook":postMsg({name:"newNotebook"});break;case"btn-new-note":postMsg({name:"newNote"});break;case"btn-new-todo":postMsg({name:"newTodo"});break;case"btn-sort":postMsg({name:"cycleSort"});break;case"btn-collapse-all":postMsg({name:"collapseAll"});break;case"btn-sync":var a=document.getElementById("btn-sync");a&&!a.disabled&&(a.disabled=!0,a.classList.add("syncing"),a.textContent="🔄 "+T("syncing"),postMsg({name:"sync"}))}}),webviewApi.onMessage(function(e){if(e&&e.message){var t=e.message;if("syncState"===t.name){var a=document.getElementById("btn-sync");if(!a)return;"done"===t.state&&(a.classList.remove("syncing"),a.classList.add("sync-done"),a.textContent=T("syncDone"),setTimeout(function(){var e=document.getElementById("btn-sync");e&&(e.disabled=!1,e.classList.remove("sync-done"),e.textContent="🔄 "+T("sync"))},2e3))}else if("searchResults"===t.name){if(void 0!==t.searchId&&t.searchId!==_searchId)return;t.notes||t.tags||t.folders?renderSearchResults(t.notes||[],t.tags||[],t.folders||[],t.query):_searchMode&&exitSearchMode()}else if("tagNotes"===t.name)expandTagNotes(t.tagId,t.notes);else if("scrollToFolder"===t.name)setTimeout(function(){var e=document.querySelector('.tree-item.folder:not(.pinned-item)[data-id="'+t.folderId+'"]');e&&(e.scrollIntoView({block:"center",behavior:"smooth"}),e.classList.add("locate-flash"),setTimeout(function(){e.classList.remove("locate-flash")},1500))},80);else if("exitSearch"===t.name){var n=document.getElementById("search-input");n&&(n.value=""),_searchMode&&exitSearchMode()}else if("exitSearchAndLocate"===t.name){var i=document.getElementById("search-input");i&&(i.value=""),_searchMode=!1,showSearchContainer(!1),setTimeout(function(){var e=document.querySelector('.tree-item.folder[data-id="'+t.folderId+'"]');e&&(e.scrollIntoView({block:"center",behavior:"smooth"}),e.classList.add("locate-flash"),setTimeout(function(){e.classList.remove("locate-flash")},1500))},80)}else if("copyText"===t.name)if(navigator.clipboard&&navigator.clipboard.writeText)navigator.clipboard.writeText(t.text);else{var s=document.createElement("textarea");s.value=t.text,document.body.appendChild(s),s.select(),document.execCommand("copy"),s.remove()}else if("selectNote"===t.name){document.querySelectorAll(".tree-item.note.selected").forEach(function(e){e.classList.remove("selected")});var d=document.querySelector('.tree-item.note[data-id="'+t.id+'"]');d&&(d.classList.add("selected"),d.scrollIntoView({block:"nearest",behavior:"instant"}))}}}),document.addEventListener("mousedown",function(e){var t=e.target.closest(".tree-item");t&&0===e.button&&t.setAttribute("draggable","true")}),document.addEventListener("dragstart",function(e){var t=e.target.closest(".tree-item");if(t){var a=t.classList.contains("pinned-item");e.dataTransfer.setData("text/plain",JSON.stringify({id:t.dataset.id,type:t.dataset.type,pinned:a})),e.dataTransfer.effectAllowed="move",t.classList.add("dragging");var n=document.getElementById("tree-container");n&&n.classList.add("dragging-active")}}),document.addEventListener("dragend",function(e){var t=e.target.closest(".tree-item");t&&(t.classList.remove("dragging"),t.removeAttribute("draggable")),endDrag()}),document.addEventListener("dragover",function(e){var t=e.target;if(t&&3===t.nodeType&&(t=t.parentElement),t){var a=t.closest(".tree-item");if(document.getElementById("tree-container"),t.closest("#drop-zone-empty"))return e.preventDefault(),void(e.dataTransfer.dropEffect="move");if(t.closest(".pinned-section-header")||t.closest(".pinned-section-body")){if(e.preventDefault(),e.dataTransfer.dropEffect="move",clearDropIndicators(),a&&a.classList.contains("pinned-item")){var n=a.getBoundingClientRect();e.clientY-n.top<.5*n.height?a.classList.add("drop-above"):a.classList.add("drop-below")}}else if(a){var i=document.querySelector(".tree-item.dragging");if(!i||!i.classList.contains("pinned-item")){e.preventDefault(),e.dataTransfer.dropEffect="move",clearDropIndicators();var s=a.dataset.type,d=a.getBoundingClientRect(),o=e.clientY-d.top,r=d.height;"folder"===s?o<.25*r?a.classList.add("drop-above"):o>.75*r?a.classList.add("drop-below"):a.classList.add("drop-target"):o<.5*r?a.classList.add("drop-above"):a.classList.add("drop-below")}}}}),document.addEventListener("dragleave",function(e){var t=e.target.closest(".tree-item");t&&(t.classList.remove("drop-target"),t.classList.remove("drop-above"),t.classList.remove("drop-below"));var a=document.getElementById("tree-container");a&&e.target===a&&a.classList.remove("drop-empty")}),document.addEventListener("drop",function(e){e.preventDefault();var t=e.target;t&&3===t.nodeType&&(t=t.parentElement);var a,n=t?t.closest(".tree-item"):null;document.getElementById("tree-container");try{a=JSON.parse(e.dataTransfer.getData("text/plain"))}catch(e){return void endDrag()}var i=a.id,s=a.type,d=a.pinned;if(t&&t.closest("#drop-zone-empty"))return postMsg({name:"dragToEmpty",dragId:i,dragType:s}),void endDrag();if(t&&(t.closest(".pinned-section-header")||t.closest(".pinned-section-body"))){if(d){var o=n&&n.classList.contains("pinned-item")?n:null;if(o&&o.dataset.id!==i){var r=o.getBoundingClientRect(),c=e.clientY-r.top<.5*r.height?"before":"after";postMsg({name:"reorderPinned",dragId:i,dragType:s,targetId:o.dataset.id,position:c})}}else"note"===s?postMsg({name:"contextMenu",action:"pinNote",id:i,itemType:"note"}):"folder"===s&&postMsg({name:"contextMenu",action:"pinFolder",id:i,itemType:"folder"});endDrag()}else if(d)endDrag();else if(n){var l=n.dataset.id,v=n.dataset.type;if(i!==l){var u=n.getBoundingClientRect(),m=e.clientY-u.top,p=u.height;postMsg("folder"===v?m>=.25*p&&m<=.75*p?{name:"dragDrop",dragId:i,dragType:s,targetId:l,position:"into"}:{name:"dragDrop",dragId:i,dragType:s,targetId:l,position:m<.25*p?"above":"below"}:{name:"dragDrop",dragId:i,dragType:s,targetId:l,position:"into"}),endDrag()}else endDrag()}else endDrag()});var _searchTimer=null,_searchMode=!1,_searchId=0;function escapeRegex(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function highlightText(e,t){if(!t)return e;var a=e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),n=new RegExp("("+escapeRegex(t)+")","gi");return a.replace(n,'<mark class="search-highlight">$1</mark>')}function showSearchContainer(e){var t=document.getElementById("tree-container"),a=document.getElementById("search-results");t&&(t.style.display=e?"none":""),a&&(a.style.display=e?"":"none")}function renderNoteItem(e,t){var a="📝";e.is_todo&&(a=e.todo_completed?"☑":"☐");var n='<div class="search-result-item tree-item note" data-id="'+e.id+'" data-type="note">';return n+='<span class="icon note-icon">'+a+"</span>",n+='<div class="search-result-content">',n+='<div class="search-result-title">'+highlightText(e.title,t)+"</div>",e.folderName&&(n+='<div class="search-result-folder">📂 '+e.folderName+"</div>"),e.snippet&&(n+='<div class="search-result-snippet">'+highlightText(e.snippet,t)+"</div>"),n+"</div></div>"}function renderSearchResults(e,t,a,n){var i=document.getElementById("search-results");if(i){showSearchContainer(!0);var s=e.length+t.length+a.length;if(0!==s){var d='<div class="search-status">'+T("searchResultCount").replace("{count}",s)+"</div>";if(a.length>0){d+=p("📁",T("searchSectionFolders"),a.length,"folders"),d+='<div class="search-section-body" id="search-section-folders">';for(var o=0;o<a.length;o++){var r=a[o],c=r.icon&&r.icon.emoji?r.icon.emoji:"📁";d+='<div class="search-result-item search-folder-item" data-folder-id="'+r.id+'">',d+='<span class="icon">'+c+"</span>",d+='<div class="search-result-content">',d+='<div class="search-result-title">'+highlightText(r.title,n)+"</div>",d+="</div></div>"}d+="</div>"}if(e.length>0){d+=p("📝",T("searchSectionNotes"),e.length,"notes"),d+='<div class="search-section-body" id="search-section-notes">';for(var l=0;l<e.length;l++)d+=renderNoteItem(e[l],n);d+="</div>"}if(t.length>0){d+=p("🏷️",T("searchSectionTags"),t.length,"tags"),d+='<div class="search-section-body" id="search-section-tags">';for(var v=0;v<t.length;v++){var u=t[v],m=T("searchTagNoteCount").replace("{count}",u.noteCount);d+='<div class="search-result-item search-tag-item" data-tag-id="'+u.id+'">',d+='<span class="icon">🏷️</span>',d+='<div class="search-result-content">',d+='<div class="search-result-title">'+highlightText(u.title,n)+"</div>",d+='<div class="search-result-folder">'+m+"</div>",d+="</div>",d+='<span class="tag-expand-arrow">▶</span>',d+="</div>",d+='<div class="tag-notes-container" id="tag-notes-'+u.id+'"></div>'}d+="</div>"}i.innerHTML=d,_searchMode=!0}else i.innerHTML='<div class="search-status">'+T("searchNoResult")+"</div>"}function p(e,t,a,n){return'<div class="search-section-header" data-section="'+n+'"><span class="section-toggle">▼</span> '+e+" "+t+" ("+a+")</div>"}}function expandTagNotes(e,t){var a=document.getElementById("tag-notes-"+e);if(a){var n;if(a.children.length>0)return a.innerHTML="",void((n=document.querySelector('.search-tag-item[data-tag-id="'+e+'"] .tag-expand-arrow'))&&n.classList.remove("expanded"));for(var i="",s=0;s<t.length;s++)i+=renderNoteItem(t[s],"");0===t.length&&(i='<div class="search-status" style="padding-left:30px;">'+T("searchNoResult")+"</div>"),a.innerHTML=i,(n=document.querySelector('.search-tag-item[data-tag-id="'+e+'"] .tag-expand-arrow'))&&n.classList.add("expanded")}}function exitSearchMode(){_searchMode=!1,showSearchContainer(!1)}document.addEventListener("input",function(e){if("search-input"===e.target.id){var t=e.target.value.trim();_searchTimer&&clearTimeout(_searchTimer);var a=++_searchId;if(t){_searchMode=!0;var n=document.getElementById("search-results");n&&(n.innerHTML='<div class="search-status">'+T("searching")+"</div>"),showSearchContainer(!0),_searchTimer=setTimeout(function(){postMsg({name:"search",query:t,searchId:a})},400)}else _searchMode&&exitSearchMode()}}),document.addEventListener("keydown",function(e){if("Escape"===e.key){var t=document.getElementById("search-input");t&&t.value&&(t.value="",_searchMode&&exitSearchMode())}});