libreqda 1.2.0__py3-none-any.whl

taguette/static/css/vendor/jquery.contextMenu.min.css

@@ -0,0 +1,16 @@
+@charset "UTF-8";/*!
+ * jQuery contextMenu - Plugin for simple contextMenu handling
+ *
+ * Version: v2.7.0
+ *
+ * Authors: Björn Brala (SWIS.nl), Rodney Rehm, Addy Osmani (patches for FF)
+ * Web: http://swisnl.github.io/jQuery-contextMenu/
+ *
+ * Copyright (c) 2011-2018 SWIS BV and contributors
+ *
+ * Licensed under
+ *   MIT License http://www.opensource.org/licenses/mit-license
+ *
+ * Date: 2018-10-02T14:29:27.829Z
+ */@-webkit-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@-o-keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@keyframes cm-spin{0%{-webkit-transform:translateY(-50%) rotate(0);-o-transform:translateY(-50%) rotate(0);transform:translateY(-50%) rotate(0)}100%{-webkit-transform:translateY(-50%) rotate(359deg);-o-transform:translateY(-50%) rotate(359deg);transform:translateY(-50%) rotate(359deg)}}@font-face{font-family:context-menu-icons;font-style:normal;font-weight:400;src:url(font/context-menu-icons.eot?2gb3e);src:url(font/context-menu-icons.eot?2gb3e#iefix) format("embedded-opentype"),url(font/context-menu-icons.woff2?2gb3e) format("woff2"),url(font/context-menu-icons.woff?2gb3e) format("woff"),url(font/context-menu-icons.ttf?2gb3e) format("truetype")}.context-menu-icon-add:before{content:"\EA01"}.context-menu-icon-copy:before{content:"\EA02"}.context-menu-icon-cut:before{content:"\EA03"}.context-menu-icon-delete:before{content:"\EA04"}.context-menu-icon-edit:before{content:"\EA05"}.context-menu-icon-loading:before{content:"\EA06"}.context-menu-icon-paste:before{content:"\EA07"}.context-menu-icon-quit:before{content:"\EA08"}.context-menu-icon::before{position:absolute;top:50%;left:0;width:2em;font-family:context-menu-icons;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#018849;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon-loading:before{-webkit-animation:cm-spin 2s infinite;-o-animation:cm-spin 2s infinite;animation:cm-spin 2s infinite}.context-menu-icon.context-menu-icon--fa{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa::before{position:absolute;top:50%;left:0;width:2em;font-family:FontAwesome;font-size:1em;font-style:normal;font-weight:400;line-height:1;color:#018849;text-align:center;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.context-menu-icon.context-menu-icon--fa.context-menu-hover:before{color:#fff}.context-menu-icon.context-menu-icon--fa.context-menu-disabled::before{color:#bbb}.context-menu-icon.context-menu-icon--fa5{display:list-item;font-family:inherit;line-height:inherit}.context-menu-icon.context-menu-icon--fa5 i,.context-menu-icon.context-menu-icon--fa5 svg{position:absolute;top:.3em;left:.5em;color:#018849}.context-menu-icon.context-menu-icon--fa5.context-menu-hover>i,.context-menu-icon.context-menu-icon--fa5.context-menu-hover>svg{color:#fff}.context-menu-icon.context-menu-icon--fa5.context-menu-disabled i,.context-menu-icon.context-menu-icon--fa5.context-menu-disabled svg{color:#bbb}.context-menu-list{position:absolute;display:inline-block;min-width:13em;max-width:26em;padding:.25em 0;margin:.3em;font-family:inherit;font-size:inherit;list-style-type:none;background:#fff;border:1px solid #bebebe;border-radius:.2em;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.5);box-shadow:0 2px 5px rgba(0,0,0,.5)}.context-menu-item{position:relative;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;padding:.2em 2em;color:#2f2f2f;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:#fff}.context-menu-separator{padding:0;margin:.35em 0;border-bottom:1px solid #e6e6e6}.context-menu-item>label>input,.context-menu-item>label>textarea{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.context-menu-item.context-menu-hover{color:#fff;cursor:pointer;background-color:#018849}.context-menu-item.context-menu-disabled{color:#bbb;cursor:default;background-color:#fff}.context-menu-input.context-menu-hover{color:#2f2f2f;cursor:default}.context-menu-submenu:after{position:absolute;top:50%;right:.5em;z-index:1;width:0;height:0;content:'';border-color:transparent transparent transparent #2f2f2f;border-style:solid;border-width:.25em 0 .25em .25em;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}.context-menu-item.context-menu-input{padding:.3em .6em}.context-menu-input>label>*{vertical-align:top}.context-menu-input>label>input[type=checkbox],.context-menu-input>label>input[type=radio]{position:relative;top:.12em;margin-right:.4em}.context-menu-input>label{margin:0}.context-menu-input>label,.context-menu-input>label>input[type=text],.context-menu-input>label>select,.context-menu-input>label>textarea{display:block;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.context-menu-input>label>textarea{height:7em}.context-menu-item>.context-menu-list{top:.3em;right:-.3em;display:none}.context-menu-item.context-menu-visible>.context-menu-list{display:block}.context-menu-accesskey{text-decoration:underline}
+/*# sourceMappingURL=jquery.contextMenu.min.css.map */

taguette/static/js/codebook-viz.js

@@ -0,0 +1,428 @@
+(function () {
+  'use strict';
+
+  const NODE_W   = 160;
+  const NODE_H   = 40;   // minimum badge height (single-line)
+  const INDENT   = 190;  // horizontal offset per depth level (NODE_W + 30px gap)
+  const V_GAP    = 14;   // vertical gap between nodes
+  const LINE_H   = 16;   // px per text line
+  const TEXT_PAD = 12;   // top + bottom padding inside badge
+  const MAX_CHARS = 16;  // chars per line before wrapping
+  const PADDING  = 24;
+  const COUNT_R  = 11;
+  const SVG_NS   = 'http://www.w3.org/2000/svg';
+
+  let nodeMap  = {};
+  let rootNodes = [];
+  let allEdges  = [];
+
+  // ── Text wrapping ────────────────────────────────────────────────────────────
+
+  function wrapText(text, maxChars) {
+    const words = text.split(/\s+/);
+    const lines = [];
+    let current = '';
+    for (const word of words) {
+      if (!current) {
+        current = word;
+      } else if ((current + ' ' + word).length <= maxChars) {
+        current += ' ' + word;
+      } else {
+        lines.push(current);
+        current = word;
+      }
+    }
+    if (current) lines.push(current);
+    return lines.length ? lines : [''];
+  }
+
+  function nodeHeight(lines) {
+    return Math.max(NODE_H, TEXT_PAD * 2 + lines.length * LINE_H);
+  }
+
+  // ── Tree building ───────────────────────────────────────────────────────────
+
+  function processTag(tag, parentId) {
+    const lines = wrapText(tag.path, MAX_CHARS);
+    const node = {
+      id: tag.id,
+      path: tag.path,
+      lines: lines,
+      height: nodeHeight(lines),
+      color: (tag.color && /^#[0-9a-fA-F]{6}$/.test(tag.color)) ? tag.color : '#6c757d',
+      count: tag.count || 0,
+      parentId: parentId,
+      children: [],
+      x: 0,
+      y: 0,
+      _groupEl: null,
+    };
+    nodeMap[tag.id] = node;
+    for (const child of (tag.children || [])) {
+      node.children.push(processTag(child, tag.id));
+    }
+    return node;
+  }
+
+  function buildNodes(tagsData) {
+    nodeMap = {};
+    rootNodes = [];
+    for (const tag of tagsData) {
+      rootNodes.push(processTag(tag, null));
+    }
+  }
+
+  // ── Layout ──────────────────────────────────────────────────────────────────
+
+  function applyDefaultLayout() {
+    let y = PADDING;
+
+    function place(node, depth) {
+      node.x = PADDING + depth * INDENT;
+      node.y = y;
+      y += node.height + V_GAP;
+      for (const child of node.children) place(child, depth + 1);
+    }
+
+    rootNodes.forEach((root, i) => {
+      if (i > 0) y += V_GAP * 2;  // extra gap between separate root trees
+      place(root, 0);
+    });
+  }
+
+  // ── SVG helpers ─────────────────────────────────────────────────────────────
+
+  function mk(tag, attrs, children) {
+    const e = document.createElementNS(SVG_NS, tag);
+    if (attrs) for (const [k, v] of Object.entries(attrs)) e.setAttribute(k, String(v));
+    if (children) {
+      for (const c of children) {
+        e.appendChild(typeof c === 'string' ? document.createTextNode(c) : c);
+      }
+    }
+    return e;
+  }
+
+  function luminance(c) {
+    if (!c || c.length !== 7 || c[0] !== '#') return 0.5;
+    const r = parseInt(c.slice(1, 3), 16);
+    const g = parseInt(c.slice(3, 5), 16);
+    const b = parseInt(c.slice(5, 7), 16);
+    return (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+  }
+
+  function edgePath(parent, child) {
+    // S-curve from parent's right-center to child's left-center.
+    const x1 = parent.x + NODE_W, y1 = parent.y + parent.height / 2;
+    const x2 = child.x,           y2 = child.y  + child.height  / 2;
+    const mx = (x1 + x2) / 2;
+    return `M${x1.toFixed(1)},${y1.toFixed(1)} C${mx.toFixed(1)},${y1.toFixed(1)} ${mx.toFixed(1)},${y2.toFixed(1)} ${x2.toFixed(1)},${y2.toFixed(1)}`;
+  }
+
+  // ── Delete ──────────────────────────────────────────────────────────────────
+
+  function deleteNode(node) {
+    delete nodeMap[node.id];
+    allEdges = allEdges.filter(edge => {
+      if (edge.p.id === node.id || edge.c.id === node.id) {
+        edge.el.remove();
+        return false;
+      }
+      return true;
+    });
+    node._groupEl.remove();
+  }
+
+  // ── Drag ────────────────────────────────────────────────────────────────────
+
+  function getDescendants(node) {
+    const result = [node];
+    for (const c of node.children) result.push(...getDescendants(c));
+    return result;
+  }
+
+  function expandSvg(svg) {
+    const allNodes = Object.values(nodeMap);
+    const newW = allNodes.reduce((m, n) => Math.max(m, n.x + NODE_W), 0) + PADDING;
+    const newH = allNodes.reduce((m, n) => Math.max(m, n.y + n.height), 0) + PADDING;
+    const curW = parseFloat(svg.getAttribute('width')  || 0);
+    const curH = parseFloat(svg.getAttribute('height') || 0);
+    if (newW > curW || newH > curH) {
+      const w = Math.max(newW, curW);
+      const h = Math.max(newH, curH);
+      svg.setAttribute('width', w);
+      svg.setAttribute('height', h);
+      const bg = svg.querySelector('#viz-bg');
+      if (bg) { bg.setAttribute('width', w); bg.setAttribute('height', h); }
+    }
+  }
+
+  function setupDrag(g, node, svg) {
+    let dragging = false;
+    let startCX = 0, startCY = 0;
+    let startPos = null;
+
+    g.addEventListener('pointerdown', e => {
+      if (e.button !== 0) return;
+      e.preventDefault();
+      e.stopPropagation();
+      dragging = true;
+      startCX = e.clientX;
+      startCY = e.clientY;
+      const desc = getDescendants(node);
+      startPos = new Map(desc.map(d => [d.id, { x: d.x, y: d.y }]));
+      g.style.cursor = 'grabbing';
+      g.setPointerCapture(e.pointerId);
+    });
+
+    g.addEventListener('pointermove', e => {
+      if (!dragging) return;
+      e.preventDefault();
+      const dx = e.clientX - startCX;
+      const dy = e.clientY - startCY;
+      const desc = getDescendants(node);
+      const movedIds = new Set(desc.map(d => d.id));
+
+      for (const d of desc) {
+        const s = startPos.get(d.id);
+        d.x = s.x + dx;
+        d.y = s.y + dy;
+        d._groupEl.setAttribute('transform', `translate(${d.x.toFixed(1)},${d.y.toFixed(1)})`);
+      }
+      for (const edge of allEdges) {
+        if (movedIds.has(edge.p.id) || movedIds.has(edge.c.id)) {
+          edge.el.setAttribute('d', edgePath(edge.p, edge.c));
+        }
+      }
+      expandSvg(svg);
+    });
+
+    const end = () => { dragging = false; startPos = null; g.style.cursor = 'grab'; };
+    g.addEventListener('pointerup', end);
+    g.addEventListener('pointercancel', end);
+  }
+
+  // ── Render ──────────────────────────────────────────────────────────────────
+
+  function renderViz(container) {
+    allEdges = [];
+    const allNodes = Object.values(nodeMap);
+
+    if (!allNodes.length) {
+      container.innerHTML = '<p class="text-muted text-center p-5">No codes defined.</p>';
+      return null;
+    }
+
+    const maxX = allNodes.reduce((m, n) => Math.max(m, n.x + NODE_W), 0) + PADDING;
+    const maxY = allNodes.reduce((m, n) => Math.max(m, n.y + n.height), 0) + PADDING;
+
+    const svg = mk('svg', {
+      xmlns: 'http://www.w3.org/2000/svg',
+      width: maxX, height: maxY,
+      'font-family': 'Arial, Helvetica, sans-serif',
+    });
+
+    svg.appendChild(mk('rect', { id: 'viz-bg', width: maxX, height: maxY, fill: '#ffffff' }));
+
+    const edgeLayer = mk('g');
+    const nodeLayer = mk('g');
+    svg.appendChild(edgeLayer);
+    svg.appendChild(nodeLayer);
+
+    // Edges
+    for (const node of allNodes) {
+      for (const child of node.children) {
+        const pathEl = mk('path', {
+          d: edgePath(node, child),
+          fill: 'none',
+          stroke: '#ced4da',
+          'stroke-width': 2,
+        });
+        edgeLayer.appendChild(pathEl);
+        allEdges.push({ el: pathEl, p: node, c: child });
+      }
+    }
+
+    // Nodes
+    for (const node of allNodes) {
+      const h   = node.height;
+      const lum = luminance(node.color);
+      const textColor = lum > 0.55 ? '#212529' : '#ffffff';
+      const countStr  = node.count > 999 ? '999+' : String(node.count);
+      const bx = NODE_W - COUNT_R - 3;
+      const by = COUNT_R + 3;
+
+      const g = mk('g', {
+        transform: `translate(${node.x.toFixed(1)},${node.y.toFixed(1)})`,
+        cursor: 'grab',
+      });
+
+      const title = document.createElementNS(SVG_NS, 'title');
+      title.textContent = `${node.path} — ${node.count} highlight${node.count !== 1 ? 's' : ''}`;
+      g.appendChild(title);
+
+      // Badge background
+      g.appendChild(mk('rect', { width: NODE_W, height: h, rx: 8, ry: 8, fill: node.color }));
+
+      // Wrapped label — lines vertically centered in the badge
+      const totalTextH = node.lines.length * LINE_H;
+      const firstBaseline = (h - totalTextH) / 2 + LINE_H * 0.78;
+      const textEl = mk('text', {
+        'text-anchor': 'middle',
+        fill: textColor,
+        'font-size': 12,
+        'font-weight': 500,
+      });
+      node.lines.forEach((line, i) => {
+        const tspan = document.createElementNS(SVG_NS, 'tspan');
+        tspan.setAttribute('x', NODE_W / 2);
+        tspan.setAttribute('y', (firstBaseline + i * LINE_H).toFixed(1));
+        tspan.textContent = line;
+        textEl.appendChild(tspan);
+      });
+      g.appendChild(textEl);
+
+      // Count badge
+      g.appendChild(mk('circle', {
+        cx: bx, cy: by, r: COUNT_R,
+        fill: '#ffffff', stroke: node.color, 'stroke-width': 1.5,
+      }));
+      g.appendChild(mk('text', {
+        x: bx, y: by,
+        'dominant-baseline': 'middle', 'text-anchor': 'middle',
+        fill: '#212529', 'font-size': 9, 'font-weight': 'bold',
+      }, [countStr]));
+
+      // Delete button (top-left corner, mirrors count badge at top-right)
+      const delBx = COUNT_R + 3, delBy = COUNT_R + 3;
+      const delBtn = mk('g', { cursor: 'pointer', 'data-viz-delete': '1' });
+      delBtn.appendChild(mk('circle', {
+        cx: delBx, cy: delBy, r: COUNT_R,
+        fill: '#ffffff', stroke: node.color, 'stroke-width': 1.5,
+      }));
+      delBtn.appendChild(mk('text', {
+        x: delBx, y: delBy,
+        'dominant-baseline': 'middle', 'text-anchor': 'middle',
+        fill: '#666', 'font-size': 13, 'pointer-events': 'none',
+      }, ['×']));
+      delBtn.addEventListener('pointerdown', e => e.stopPropagation());
+      delBtn.addEventListener('click', e => { e.stopPropagation(); deleteNode(node); });
+      g.appendChild(delBtn);
+
+      node._groupEl = g;
+      nodeLayer.appendChild(g);
+      setupDrag(g, node, svg);
+    }
+
+    container.innerHTML = '';
+    container.appendChild(svg);
+    return svg;
+  }
+
+  // ── Export ──────────────────────────────────────────────────────────────────
+
+  function exportBounds() {
+    const allNodes = Object.values(nodeMap);
+    const pad = PADDING / 2;
+    return {
+      minX: allNodes.reduce((m, n) => Math.min(m, n.x),          Infinity) - pad,
+      minY: allNodes.reduce((m, n) => Math.min(m, n.y),          Infinity) - pad,
+      maxX: allNodes.reduce((m, n) => Math.max(m, n.x + NODE_W), -Infinity) + pad,
+      maxY: allNodes.reduce((m, n) => Math.max(m, n.y + n.height), -Infinity) + pad,
+    };
+  }
+
+  function cloneForExport(svg, transparent) {
+    const { minX, minY, maxX, maxY } = exportBounds();
+    const w = maxX - minX, h = maxY - minY;
+    const clone = svg.cloneNode(true);
+    clone.setAttribute('width', w);
+    clone.setAttribute('height', h);
+    clone.setAttribute('viewBox', `${minX} ${minY} ${w} ${h}`);
+    clone.querySelectorAll('[data-viz-delete]').forEach(el => el.remove());
+    const bg = clone.querySelector('#viz-bg');
+    if (transparent) {
+      if (bg) bg.remove();
+    } else if (bg) {
+      bg.setAttribute('x', minX); bg.setAttribute('y', minY);
+      bg.setAttribute('width', w); bg.setAttribute('height', h);
+    }
+    return clone;
+  }
+
+  function exportSVG(svg, transparent) {
+    if (!svg || !Object.keys(nodeMap).length) return;
+    const clone = cloneForExport(svg, transparent);
+    const svgStr = '<?xml version="1.0" encoding="UTF-8"?>\n' + new XMLSerializer().serializeToString(clone);
+    download(new Blob([svgStr], { type: 'image/svg+xml;charset=utf-8' }), `${datePrefix()}_codebook.svg`);
+  }
+
+  function exportPNG(svg, transparent) {
+    if (!svg || !Object.keys(nodeMap).length) return;
+    const { minX, minY, maxX, maxY } = exportBounds();
+    const w = maxX - minX, h = maxY - minY;
+    const scale = 2;
+
+    const clone = cloneForExport(svg, transparent);
+    const svgStr = new XMLSerializer().serializeToString(clone);
+    const svgUrl = URL.createObjectURL(new Blob([svgStr], { type: 'image/svg+xml;charset=utf-8' }));
+
+    const img = new Image();
+    img.onload = () => {
+      const canvas = document.createElement('canvas');
+      canvas.width  = Math.round(w * scale);
+      canvas.height = Math.round(h * scale);
+      const ctx = canvas.getContext('2d');
+      if (!transparent) { ctx.fillStyle = '#ffffff'; ctx.fillRect(0, 0, canvas.width, canvas.height); }
+      ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
+      URL.revokeObjectURL(svgUrl);
+      canvas.toBlob(blob => download(blob, `${datePrefix()}_codebook.png`), 'image/png');
+    };
+    img.src = svgUrl;
+  }
+
+  function download(blob, filename) {
+    const url = URL.createObjectURL(blob);
+    const a = Object.assign(document.createElement('a'), { href: url, download: filename });
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    URL.revokeObjectURL(url);
+  }
+
+  function datePrefix() {
+    const d = new Date();
+    return `${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`;
+  }
+
+  // ── Init ────────────────────────────────────────────────────────────────────
+
+  document.addEventListener('DOMContentLoaded', () => {
+    const modal     = document.getElementById('codebook-viz-modal');
+    const container = document.getElementById('codebook-viz-container');
+    if (!modal || !container) return;
+
+    let currentSvg = null;
+
+    const trigger = document.getElementById('codebook-viz-trigger');
+    if (trigger) {
+      trigger.addEventListener('click', (e) => {
+        e.stopPropagation();
+        const toggleEl = trigger.closest('.dropdown')?.querySelector('[data-bs-toggle="dropdown"]');
+        bootstrap.Dropdown.getInstance(toggleEl)?.hide();
+        buildNodes(tags);
+        applyDefaultLayout();
+        currentSvg = renderViz(container);
+        bootstrap.Modal.getOrCreateInstance(modal).show();
+      });
+    }
+
+    const transparentChk = document.getElementById('codebook-viz-transparent');
+    const getTransparent = () => transparentChk ? transparentChk.checked : false;
+
+    const btnSvg = document.getElementById('codebook-viz-export-svg');
+    const btnPng = document.getElementById('codebook-viz-export-png');
+    if (btnSvg) btnSvg.addEventListener('click', () => exportSVG(currentSvg, getTransparent()));
+    if (btnPng) btnPng.addEventListener('click', () => exportPNG(currentSvg, getTransparent()));
+  });
+})();

taguette/static/js/collection/context-menu.js

@@ -0,0 +1,180 @@
+function addCollectionContextMenu() {
+    $.contextMenu({
+        selector: '.collection-context-menu',
+        build: function ($trigger) {
+            const nodeId = $trigger.attr('id');
+            const collectionId = extractCollectionId(nodeId);
+            
+            if (!collectionId) return false;
+            
+            const collection = findCollection(collectionId);
+            if (!collection) return false;
+
+            let items = generateCollectionContextMenuItems(collection);
+
+            return {
+                callback: (key, options) => collectionContextMenuAction(key, options.$trigger.attr("id")),
+                items
+            };
+        }
+    });
+}
+
+function generateCollectionContextMenuItems(collection) {
+    const items = {
+        "addChildCollection": {
+            name: gettext('Add sub-collection'),
+            icon: 'fas fa-plus-circle',
+            callback: (key, options) => collectionContextMenuAction('addChildCollection', collection.id)
+        },
+        "edit": {
+            name: gettext('Edit collection'),
+            icon: "fas fa-edit",
+            callback: (key, options) => collectionContextMenuAction('edit', collection.id)
+        }
+    };
+    
+    if (collection.parent) {
+        items["removeParent"] = {
+            name: gettext('Remove parent'),
+            icon: "fas fa-level-up-alt",
+            callback: (key, options) => collectionContextMenuAction('removeParent', collection.id)
+        };
+    }
+    
+    items["separator1"] = "---------";
+    items["delete"] = {
+        name: gettext('Delete collection'),
+        icon: "fas fa-trash",
+        callback: (key, options) => collectionContextMenuAction('delete', collection.id)
+    };
+    
+    return items;
+}
+
+function collectionContextMenuAction(action, param) {
+    const actionFunction = collectionActions[action];
+
+    if (actionFunction) {
+        actionFunction(param);
+    } else {
+       log('No action found for:', action);
+    }
+}
+
+const collectionActions = {
+    addChildCollection: collectionId => createChildCollection(collectionId),
+    edit: collectionId => editCollection(collectionId),
+    removeParent: collectionId => removeCollectionParent(collectionId),
+    delete: collectionId => deleteCollection(collectionId)
+};
+
+function extractCollectionId(nodeId) {
+    if (!nodeId) return null;
+    
+    const match = nodeId.match(/collection_(\d+)/);
+    return match ? parseInt(match[1]) : null;
+}
+
+function findCollection(collectionId) {
+
+    function searchInTree(collections) {
+        if (!collections || !Array.isArray(collections)) {
+            return null;
+        }
+        
+        for (let collection of collections) {
+            if (collection.id === collectionId) {
+                return collection;
+            }
+            if (collection.children && collection.children.length > 0) {
+                const found = searchInTree(collection.children);
+                if (found) return found;
+            }
+        }
+        return null;
+    }
+    
+    const result = searchInTree(collections);
+    return result;
+}
+
+
+let selectedCollectionId = null;
+
+
+function handleCollectionKeyboardShortcuts(e) {
+
+    if ($('.collection-context-menu').length === 0) return;
+    
+    // if (e.key.toLowerCase() === 'm') {
+    //     e.preventDefault();
+    //     if (selectedCollectionId) {
+    //         const element = $(`.collection-context-menu[id*="collection_${selectedCollectionId}"]`);
+    //         if (element.length > 0) {
+    //             element.contextMenu();
+    //         }
+    //     }
+    //     return;
+    // }
+    
+    if (selectedCollectionId) {
+        switch(e.key.toLowerCase()) {
+            case 'e':
+                e.preventDefault();
+                editCollection(selectedCollectionId);
+                break;
+            case 'd':
+                e.preventDefault();
+                deleteCollection(selectedCollectionId);
+                break;
+            case 'c':
+                e.preventDefault();
+                createChildCollection(selectedCollectionId);
+                break;
+            case 'u':
+                e.preventDefault();
+                const collection = findCollection(selectedCollectionId);
+                if (collection && collection.parent) {
+                    removeCollectionParent(selectedCollectionId);
+                }
+                break;
+        }
+    }
+}
+
+function updateSelectedCollection(collectionId) {
+    selectedCollectionId = collectionId;
+    
+    $('.collection-context-menu').removeClass('collection-selected');
+    
+    if (collectionId) {
+        const element = $(`.collection-context-menu[id*="collection_${collectionId}"]`);
+        if (element.length > 0) {
+            element.addClass('collection-selected');
+        }
+    }
+}
+
+function addCollectionSelectionHandlers() {
+    $(document).on('mouseenter', '.collection-context-menu', function() {
+        const nodeId = $(this).attr('id');
+        const collectionId = extractCollectionId(nodeId);
+        if (collectionId) {
+            updateSelectedCollection(collectionId);
+        }
+    });
+    
+    $(document).on('click', function(e) {
+        if (!$(e.target).closest('.collection-context-menu').length) {
+            updateSelectedCollection(null);
+        }
+    });
+}
+
+$(document).ready(function() {
+    addCollectionContextMenu();
+    addCollectionSelectionHandlers();
+    $(document).on('keydown', handleCollectionKeyboardShortcuts);
+});
+