libreqda 1.2.0__py3-none-any.whl

taguette/static/js/highlight/crud.js

@@ -0,0 +1,119 @@
+function editHighlight() {
+    const selection = describeSelection();
+    if (selection) {
+        createHighlight(selection);
+        return;
+    }
+
+    highlightModalReset();
+    const id = this.dataset.highlightId;
+    const highlight = highlights['' + id];
+
+    if (!highlight) {
+        log('Highlight not found: ' + id, 'error');
+        return;
+    }
+
+    document.getElementById('highlight-add-id').value = id;
+    document.getElementById('highlight-add-start').value = highlight.start_offset;
+    document.getElementById('highlight-add-end').value = highlight.end_offset;
+
+    const hl_tags = highlight.tags;
+    const allNodes = treeview_tags_highlight.treeview('getEnabled');
+
+    for (const tagId of hl_tags) {
+        highlightSelectedTags.push(tagId);
+        const node = allNodes.find(n => n.id === tagId);
+        if (node) treeview_tags_highlight.treeview('selectNode', node.nodeId);
+    }
+
+    showHighlightTagSelection();
+    $(highlight_add_modal).modal('show').drags({handle: '.modal-header'});
+}
+
+function addHighlight(highlight, documentId) {
+    const targetDoc = documentId || current_document;
+    if (targetDoc !== current_document) {
+        updateDocumentHighlightsCount(targetDoc, +1);
+        return;
+    }
+    const id = '' + highlight.id;
+    const isNew = !highlights[id];
+    highlights[id] = highlight;
+    renderHighlights(Object.values(highlights));
+    if (isNew) {
+        updateDocumentHighlightsCount(targetDoc, +1);
+    }
+}
+
+function removeHighlight(highlightId, documentId) {
+    const targetDoc = documentId || current_document;
+    if (targetDoc !== current_document) {
+        updateDocumentHighlightsCount(targetDoc, -1);
+        return;
+    }
+    const id = '' + highlightId;
+    if (!highlights[id]) return;
+    delete highlights[id];
+    renderHighlights(Object.values(highlights));
+    updateDocumentHighlightsCount(targetDoc, -1);
+}
+
+function updateDocumentHighlightsCount(documentId, delta) {
+    if (!documentId) return;
+    const doc = documents['' + documentId];
+    if (!doc) return;
+    doc.highlights_count = Math.max(0, (doc.highlights_count || 0) + delta);
+    if (typeof initDocumentsTreeview === 'function') {
+        initDocumentsTreeview();
+    }
+}
+
+function saveHighlightDragDrop(tagId) {
+    const selection = globalThis.getSelection();
+    if (!selection?.rangeCount || selection.isCollapsed) return;
+
+    const range = selection.getRangeAt(0);
+    const container = document.getElementById('highlight-content');
+    if (!container?.contains(range.commonAncestorContainer)) return;
+
+    const snippet = range.toString().trim();
+    if (!snippet) return;
+
+    const beforeRange = document.createRange();
+    beforeRange.selectNodeContents(container);
+    beforeRange.setEnd(range.startContainer, range.startOffset);
+
+    const afterRange = document.createRange();
+    afterRange.selectNodeContents(container);
+    afterRange.setStart(range.endContainer, range.endOffset);
+
+    const startOffset = lengthUTF8(beforeRange.toString());
+    const endOffset = startOffset + lengthUTF8(snippet);
+
+    submitHighLightCreation(
+        { selection: [startOffset, endOffset], tags: [tagId] },
+        reply => addHighlight(reply),
+        error => {
+            log("Failed to create highlight", 'error', error);
+            const createHighlightErrorMessage = gettext("Couldn't create highlight!");
+            showAlert(`${createHighlightErrorMessage}`, 'error');
+        }
+    );
+}
+
+function submitHighLightCreation(highlight, callbackSuccess, callbackFail) {
+    const { id, selection, tags } = highlight;
+    const requestData = {
+        start_offset: selection[0],
+        end_offset: selection[1],
+        tags: tags,
+    };
+
+    const url = id
+        ? `/api/project/${project_id}/document/${current_document}/highlight/${id}`
+        : `/api/project/${project_id}/document/${current_document}/highlight/new`;
+
+    showSpinner();
+    postJSON(url, requestData).then(callbackSuccess).catch(callbackFail).finally(hideSpinner);
+}

taguette/static/js/highlight/extracts.js

@@ -0,0 +1,497 @@
+function showTagUnderlineTooltip(event, tagId, color) {
+    let tooltip = document.getElementById('tag-underline-tooltip');
+
+    if (!tooltip) {
+        tooltip = document.createElement('div');
+        tooltip.id = 'tag-underline-tooltip';
+        document.body.appendChild(tooltip);
+
+        Object.assign(tooltip.style, {
+            position: 'fixed',
+            padding: '10px',
+            background: '#fff',
+            border: '2px solid #333',
+            borderRadius: '6px',
+            boxShadow: '0 4px 12px rgba(0,0,0,0.2)',
+            fontSize: '13px',
+            pointerEvents: 'none',
+            zIndex: '10000',
+            maxWidth: '300px',
+            wordWrap: 'break-word',
+            overflowWrap: 'break-word',
+        });
+    }
+
+    const tag = findTag(tagId);
+    if (!tag) return;
+
+    tooltip.innerHTML = `
+        <div style="display: flex; gap: 4px; flex-wrap: wrap; max-width: 280px;">
+            <div style="
+                display: inline-block;
+                padding: 4px 8px;
+                border-radius: 3px;
+                background-color: ${color};
+                color: white;
+                font-size: 11px;
+                max-width: 100%;
+                word-wrap: break-word;
+                overflow-wrap: break-word;
+            ">
+                ${tag.path}
+            </div>
+        </div>
+    `;
+
+    tooltip.style.display = 'block';
+    tooltip.style.left = (event.clientX + 10) + 'px';
+    tooltip.style.top = (event.clientY + 10) + 'px';
+}
+
+function hideTagUnderlineTooltip() {
+    const tooltip = document.getElementById('tag-underline-tooltip');
+    if (tooltip) tooltip.style.display = 'none';
+}
+
+/**
+ * Apply colored SVG underlines to a content div based on tag_ranges.
+ * Uses Range.getClientRects() to get pixel positions, then draws SVG lines.
+ */
+function applyTagUnderlines(contentDiv, tagRanges, principalTagIds) {
+    if (!tagRanges || tagRanges.length === 0) return;
+
+    // Make contentDiv a positioning context for the SVG overlay
+    contentDiv.style.position = 'relative';
+
+    const textNodes = collectTextNodes(contentDiv);
+    const fullText = textNodes.map(n => n.nodeValue).join('');
+    if (fullText.length === 0) return;
+
+    // Build char index -> { node, offsetInNode } mapping
+    const charMap = [];
+    for (const textNode of textNodes) {
+        const nodeText = textNode.nodeValue;
+        for (let j = 0; j < nodeText.length; j++) {
+            charMap.push({ node: textNode, offset: j });
+        }
+    }
+
+    // Convert UTF-8 byte offsets to char indices
+    const utf8Map = buildUTF8ToCharMap(fullText);
+    const ranges = tagRanges.map(tr => ({
+        tag_id: tr.tag_id,
+        color: tr.color,
+        startChar: getCharIndexFromUTF8Index(fullText, tr.start, utf8Map),
+        endChar: getCharIndexFromUTF8Index(fullText, tr.end, utf8Map),
+    }));
+
+    // Sort by start, then larger ranges first
+    ranges.sort((a, b) => a.startChar - b.startChar || (b.endChar - b.startChar) - (a.endChar - a.startChar));
+
+    // Assign lanes for overlapping ranges
+    const laneEnds = [];
+    const rangeLanes = ranges.map(range => {
+        for (let lane = 0; lane < laneEnds.length; lane++) {
+            if (laneEnds[lane] <= range.startChar) {
+                laneEnds[lane] = range.endChar;
+                return lane;
+            }
+        }
+        laneEnds.push(range.endChar);
+        return laneEnds.length - 1;
+    });
+
+    const totalLanes = laneEnds.length;
+    const LINE_HEIGHT = 3;
+    const LINE_GAP = 2;
+    const BASE_OFFSET = 2;
+    const extraSpace = BASE_OFFSET + totalLanes * (LINE_HEIGHT + LINE_GAP);
+
+    // Add bottom padding so SVG lines don't overlap the badges
+    contentDiv.style.paddingBottom = extraSpace + 'px';
+
+    // Increase line-height to make room for stacked underlines between text lines
+    if (totalLanes > 0) {
+        contentDiv.style.lineHeight = (1.6 + totalLanes * 0.3) + 'em';
+    }
+
+    // Create SVG overlay
+    const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    svg.classList.add('tag-underline-svg');
+    svg.style.position = 'absolute';
+    svg.style.left = '0';
+    svg.style.top = '0';
+    svg.style.width = '100%';
+    svg.style.height = '100%';
+    svg.style.pointerEvents = 'none';
+    svg.style.overflow = 'visible';
+
+    const containerRect = contentDiv.getBoundingClientRect();
+
+    for (let ri = 0; ri < ranges.length; ri++) {
+        const range = ranges[ri];
+        const lane = rangeLanes[ri];
+        if (range.startChar >= range.endChar || range.startChar >= charMap.length) continue;
+
+        const effectiveEnd = Math.min(range.endChar, charMap.length);
+
+        // Create a DOM Range to get bounding rects
+        const domRange = document.createRange();
+        const startEntry = charMap[range.startChar];
+        const endEntry = charMap[effectiveEnd - 1];
+        domRange.setStart(startEntry.node, startEntry.offset);
+        domRange.setEnd(endEntry.node, endEntry.offset + 1);
+
+        const rawRects = Array.from(domRange.getClientRects()).map(r => ({
+            x: r.left,
+            y: r.top,
+            width: r.width,
+            height: r.height,
+        }));
+        const rects = deduplicateRects(rawRects);
+
+        for (const rect of rects) {
+            const x = rect.x - containerRect.left;
+            const y = (rect.y + rect.height) - containerRect.top + BASE_OFFSET + lane * (LINE_HEIGHT + LINE_GAP);
+
+            const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
+            line.setAttribute('x1', x);
+            line.setAttribute('y1', y + LINE_HEIGHT / 2);
+            line.setAttribute('x2', x + rect.width);
+            line.setAttribute('y2', y + LINE_HEIGHT / 2);
+            line.setAttribute('stroke', range.color);
+            line.setAttribute('stroke-width', LINE_HEIGHT);
+            line.setAttribute('stroke-linecap', 'round');
+            if (!principalTagIds.has(range.tag_id)) {
+                line.setAttribute('stroke-dasharray', '8 6');
+                line.setAttribute('stroke-linecap', 'butt');
+                line.setAttribute('data-overlay-tag-id', range.tag_id);
+                line.style.display = 'none';
+            }
+            line.classList.add('smooth-stroke');
+            line.style.pointerEvents = 'all';
+            line.style.cursor = 'pointer';
+            line.style.transition = 'stroke-width 0.2s';
+
+            line.addEventListener('mouseenter', function (e) {
+                line.setAttribute('stroke-width', LINE_HEIGHT + 2);
+                showTagUnderlineTooltip(e, range.tag_id, range.color);
+            });
+            line.addEventListener('mouseleave', function () {
+                line.setAttribute('stroke-width', LINE_HEIGHT);
+                hideTagUnderlineTooltip();
+            });
+
+            svg.appendChild(line);
+        }
+    }
+
+    contentDiv.appendChild(svg);
+}
+
+function loadTag(tag_path, page, minSpinnerMs) {
+    if (page === undefined) {
+        page = 1;
+    }
+    let spinnerShownAt;
+    const useProgressBar = tag_path !== undefined && minSpinnerMs !== undefined;
+    if(tag_path !== undefined) {
+        spinnerShownAt = Date.now();
+        showSpinner(null, useProgressBar);
+        if (useProgressBar) {
+            // Show the progress bar alone, not the spinner circle, for this cue.
+            document.getElementById('spinner').style.display = 'none';
+
+            // Drive the bar to 100% ourselves over minSpinnerMs, since this isn't
+            // a real byte-progress upload — just a deliberate "computing" cue.
+            const bar = document.querySelector('#progress .progress-bar');
+            bar.style.transition = 'none';
+            bar.style.width = '0%';
+            void bar.offsetWidth; // force reflow so the 0% is committed before animating
+            bar.style.transition = `width ${minSpinnerMs}ms linear`;
+            bar.style.width = '100%';
+        }
+    }
+    getJSON(
+        `/api/project/${project_id}/highlights/${encodeURIComponent(tag_path)}?page=${page}`
+    )
+        .then(function (result) {
+            log(`Loaded highlights for tag ${tag_path}`);
+            document_contents.style.direction = 'ltr';
+            current_tag = tag_path;
+            // current_document = null;
+            let document_links = document.getElementsByClassName('document-link-current');
+            for (let i = document_links.length - 1; i >= 0; --i) {
+                document_links[i].classList.remove('document-link-current');
+            }
+            // No need to clear the 'tag-current', we are calling updateTagsList() below
+            document_contents.innerHTML = '';
+            highlights = {};
+            for (const hl of result.highlights) {
+                let content = document.createElement('div');
+                if (hl.text_direction === 'RIGHT_TO_LEFT') {
+                    content.style.direction = 'rtl';
+                } else {
+                    content.style.direction = 'ltr';
+                }
+                content.innerHTML = hl.content;
+                let elem = document.createElement('div');
+                elem.className = 'highlight-entry';
+                elem.setAttribute('id', 'highlight-entry-' + hl.id);
+                elem.appendChild(content);
+                elem.appendChild(document.createTextNode(' '));
+
+                // Separate principal tags (the tag being viewed) from associated tags
+                // When tag_path contains operators (∩∪¬), extract individual tag paths
+                const principalTagIds = new Set();
+                const pathParts = tag_path.split(/[∩∪¬]/);
+                for (const part of pathParts) {
+                    const trimmed = part.trim();
+                    if (trimmed) {
+                        const t = findTag(trimmed);
+                        if (t) principalTagIds.add(t.id);
+                    }
+                }
+                // Remove NOT-excluded tags from principal set
+                const notParts = tag_path.split('¬').slice(1);
+                for (const part of notParts) {
+                    const trimmed = part.split(/[∩∪]/)[0].trim();
+                    if (trimmed) {
+                        const t = findTag(trimmed);
+                        if (t) principalTagIds.delete(t.id);
+                    }
+                }
+
+                let principalTags = [];
+                let associatedTags = [];
+                hl.tags.forEach(function (tagId) {
+                    const tag = findTag(tagId);
+                    if (tag) {
+                        if (principalTagIds.has(tag.id)) {
+                            principalTags.push(tag);
+                        } else {
+                            associatedTags.push(tag);
+                        }
+                    }
+                });
+
+                // Row 1: doclink + principal tag badges
+                let badgeRow = document.createElement('div');
+                badgeRow.className = 'd-flex flex-wrap gap-1 align-items-center';
+
+                let doclink = document.createElement('a');
+                doclink.className = 'badge badge-primary';
+                const documentPath = buildDocumentPath(hl.document_id);
+                doclink.textContent = documentPath;
+                linkDocument(doclink, hl.document_id, hl.id);
+                badgeRow.appendChild(doclink);
+
+                for (let j = 0; j < principalTags.length; j++) {
+                    let taglink = document.createElement('a');
+                    taglink.className = 'badge';
+                    taglink.setAttribute('style', `background-color: ${principalTags[j].color}; color: white; font-weight: bold;`);
+                    taglink.textContent = principalTags[j].path;
+                    badgeRow.appendChild(taglink);
+                }
+
+                elem.appendChild(badgeRow);
+
+                // Row 2: "Associated tags:" label + associated tag badges (only if any)
+                if (associatedTags.length > 0) {
+                    let assocRow = document.createElement('div');
+                    assocRow.className = 'd-flex flex-wrap gap-2 align-items-center mt-2';
+
+                    let label = document.createElement('small');
+                    label.style.color = '#6c757d';
+                    label.style.cursor = 'pointer';
+                    let allCheck = document.createElement('i');
+                    allCheck.className = 'far fa-square me-1';
+                    label.appendChild(allCheck);
+                    label.appendChild(document.createTextNode(gettext('Overlapping')));
+                    assocRow.appendChild(label);
+
+                    const syncAllCheck = () => {
+                        const badges = assocRow.querySelectorAll('.badge-outline-tag');
+                        const allPinned = badges.length > 0 && Array.from(badges).every(b => b.classList.contains('badge-outline-tag--pinned'));
+                        allCheck.className = allPinned ? 'fas fa-check-square me-1' : 'far fa-square me-1';
+                    };
+
+                    label.addEventListener('click', function () {
+                        const badges = assocRow.querySelectorAll('.badge-outline-tag');
+                        const allPinned = Array.from(badges).every(b => b.classList.contains('badge-outline-tag--pinned'));
+                        const newPinned = !allPinned;
+                        badges.forEach(function (badge) {
+                            badge.classList.toggle('badge-outline-tag--pinned', newPinned);
+                            const icon = badge.querySelector('.badge-outline-tag-check');
+                            icon.className = newPinned
+                                ? 'fas fa-check-square me-1 badge-outline-tag-check'
+                                : 'far fa-square me-1 badge-outline-tag-check';
+                            const tagId = parseInt(badge.getAttribute('data-overlay-tag-id'));
+                            content.querySelectorAll('line[data-overlay-tag-id="' + tagId + '"]').forEach(function (l) {
+                                l.style.display = newPinned ? '' : 'none';
+                            });
+                        });
+                        syncAllCheck();
+                    });
+
+                    associatedTags.sort((a, b) => a.path.localeCompare(b.path));
+                    for (let j = 0; j < associatedTags.length; j++) {
+                        let taglink = document.createElement('a');
+                        taglink.className = 'badge badge-outline-tag';
+                        taglink.setAttribute('style',
+                            `border: 2px dashed ${associatedTags[j].color}; color: ${associatedTags[j].color}; background: transparent; font-weight: bold; cursor: pointer;`
+                        );
+                        let checkIcon = document.createElement('i');
+                        checkIcon.className = 'far fa-square me-1 badge-outline-tag-check';
+                        taglink.appendChild(checkIcon);
+                        taglink.appendChild(document.createTextNode(associatedTags[j].path));
+                        taglink.setAttribute('data-overlay-tag-id', associatedTags[j].id);
+                        taglink.addEventListener('mouseenter', function () {
+                            const tagId = parseInt(this.getAttribute('data-overlay-tag-id'));
+                            content.querySelectorAll('line[data-overlay-tag-id="' + tagId + '"]').forEach(function (l) {
+                                l.style.display = '';
+                            });
+                        });
+                        taglink.addEventListener('mouseleave', function () {
+                            if (this.classList.contains('badge-outline-tag--pinned')) return;
+                            const tagId = parseInt(this.getAttribute('data-overlay-tag-id'));
+                            content.querySelectorAll('line[data-overlay-tag-id="' + tagId + '"]').forEach(function (l) {
+                                l.style.display = 'none';
+                            });
+                        });
+                        taglink.addEventListener('click', function () {
+                            const tagId = parseInt(this.getAttribute('data-overlay-tag-id'));
+                            const pinned = this.classList.toggle('badge-outline-tag--pinned');
+                            const icon = this.querySelector('.badge-outline-tag-check');
+                            icon.className = pinned
+                                ? 'fas fa-check-square me-1 badge-outline-tag-check'
+                                : 'far fa-square me-1 badge-outline-tag-check';
+                            content.querySelectorAll('line[data-overlay-tag-id="' + tagId + '"]').forEach(function (l) {
+                                l.style.display = pinned ? '' : 'none';
+                            });
+                            syncAllCheck();
+                        });
+                        assocRow.appendChild(taglink);
+                    }
+
+                    elem.appendChild(assocRow);
+                }
+
+                document_contents.appendChild(elem);
+
+                // Apply SVG underlines after element is in the DOM (needed for getBoundingClientRect)
+                if (hl.tag_ranges && hl.tag_ranges.length > 0) {
+                    applyTagUnderlines(content, hl.tag_ranges, principalTagIds);
+                }
+            }
+            if (result.highlights.length === 0) {
+                document_contents.innerHTML = '<p style="font-style: oblique; text-align: center;">' + gettext("No highlights with this tag yet.") + '</p>';
+            }
+
+            // Pagination controls
+            function makePageLink(page_nb, label, current, enabled) {
+                let item;
+                if (current) {
+                    item = document.createElement('li');
+                    item.className = 'page-item active';
+                    item.innerHTML = '<span class="page-link">' + label + '<span class="sr-only">(current)</span></span>';
+                } else if (!enabled) {
+                    item = document.createElement('li');
+                    item.className = 'page-item disabled';
+                    item.innerHTML = '<span class="page-link">' + label + '</span>';
+                } else {
+                    item = document.createElement('li');
+                    item.className = 'page-item';
+                    let link = document.createElement('a');
+                    link.className = 'page-link';
+                    link.setAttribute('href', '#');
+                    link.innerText = label;
+                    link.addEventListener('click', function (e) {
+                        e.preventDefault();
+                        loadTag(tag_path, page_nb);
+                    });
+                    item.appendChild(link);
+                }
+                return item;
+            }
+
+            if (result.pages > 1 || page !== 1) {
+                if (result.pages === undefined && page !== 1) {
+                    result.pages = 1;
+                }
+                let pagination = document.createElement('nav');
+                pagination.setAttribute('aria-label', "Page navigation");
+                let pagination_ul = document.createElement('ul');
+                pagination_ul.className = 'pagination justify-content-center';
+                const min_page = Math.max(2, page - 2);
+                const max_page = Math.min(result.pages - 1, page + 2);
+
+                // Previous button
+                pagination_ul.appendChild(makePageLink(page - 1, "Previous", false, page > 1));
+                // Page 1
+                pagination_ul.appendChild(makePageLink(1, 1, 1 === page, 1 !== page));
+                // "..." between 1 and other pages, if appropriate
+                if (min_page > 2) {
+                    pagination_ul.appendChild(makePageLink(page, "...", false, false));
+                }
+                // Other pages
+                for (let i = min_page; i <= max_page; ++i) {
+                    pagination_ul.appendChild(makePageLink(i, i, i === page, i !== page));
+                }
+                // "..." between other pages and last page, if appropriate
+                if (max_page < result.pages - 1) {
+                    pagination_ul.appendChild(makePageLink(page, "...", false, false));
+                }
+                // Last page
+                pagination_ul.appendChild(makePageLink(result.pages, result.pages, result.pages === page, result.pages !== page));
+                // Next button
+                pagination_ul.appendChild(makePageLink(page + 1, "Next", false, page < result.pages));
+
+                pagination.appendChild(pagination_ul);
+                document_contents.appendChild(pagination);
+            }
+
+            // Update export button
+            const items = document.querySelectorAll('#document-export-dropdown-menu a');
+            for (const item of items) {
+                const ext = item.dataset.extension;
+                if (item.dataset.highlights === 'false') {
+                    item.style.display = 'none';
+                } else {
+                    item.setAttribute('href', base_path + '/project/' + project_id + '/export/highlights/' + encodeURIComponent(tag_path) + '.' + ext);
+                    item.style.display = '';
+                }
+            }
+
+            toggleToolbarActions(true)
+
+            // Scroll up
+            window.setTimeout(function () {
+                window.scrollTo(0, 0);
+            }, 0);
+        })
+        .catch(function (error) {
+            console.error("Failed to load tag highlights", error);
+            log("Failed to load tag highlights", 'error', {error});
+            const loadTagHighlightsErrorMessage = gettext("Error loading tag highlights!");
+            showAlert(`${loadTagHighlightsErrorMessage} \n \n`, 'error', {error})
+        })
+        .then(function (result) {
+            if (minSpinnerMs === undefined || spinnerShownAt === undefined) {
+                hideSpinner();
+                return;
+            }
+            const remaining = minSpinnerMs - (Date.now() - spinnerShownAt);
+            setTimeout(function () {
+                if (useProgressBar) {
+                    // Reset the inline styles so a later real upload's spinner
+                    // circle and progress bar behave as before.
+                    document.getElementById('spinner').style.display = '';
+                    const bar = document.querySelector('#progress .progress-bar');
+                    bar.style.transition = '';
+                    bar.style.width = '0%';
+                }
+                hideSpinner();
+            }, Math.max(0, remaining));
+        });
+}