elspais 0.9.3__py3-none-any.whl → 0.11.0__py3-none-any.whl

elspais/trace_view/html/templates/partials/review/review-init.js

@@ -0,0 +1,177 @@
+/**
+ * TraceView Review Init Module
+ * Orchestrates review mode initialization and provides global functions.
+ * IMPLEMENTS REQUIREMENTS: REQ-d00092
+ */
+window.TraceView = window.TraceView || {};
+TraceView.review = TraceView.review || {};
+window.ReviewSystem = window.ReviewSystem || {};
+var RS = window.ReviewSystem;
+
+(function(review, RS) {
+    'use strict';
+
+    let reviewModeActive = false;
+    let selectedCardElement = null;
+
+    /**
+     * Toggle review mode on/off
+     * @param {boolean} enabled - Optional: explicitly set mode state
+     * @returns {boolean} Current review mode state
+     */
+    function toggleReviewMode(enabled) {
+        if (enabled === undefined) {
+            reviewModeActive = !reviewModeActive;
+        } else {
+            reviewModeActive = !!enabled;
+        }
+
+        const column = document.getElementById('review-column');
+        const btn = document.getElementById('btnReviewMode');
+        const packagesPanel = document.getElementById('reviewPackagesPanel');
+
+        // Use classList.toggle for body class (REQ-d00092-G)
+        document.body.classList.toggle('review-mode-active', reviewModeActive);
+
+        if (reviewModeActive) {
+            if (column) column.classList.remove('hidden');
+            if (btn) btn.classList.add('active');
+            if (packagesPanel) packagesPanel.style.display = 'block';
+
+            // Initialize if first activation
+            if (review.init && !review._initialized) {
+                review.init();
+                review._initialized = true;
+            }
+
+            // If there are already open REQ cards, apply interactive line numbers to all of them
+            if (window.TraceView && window.TraceView.state && window.TraceView.state.reqCardStack) {
+                const openCards = window.TraceView.state.reqCardStack;
+
+                // Apply line numbers to ALL open cards
+                openCards.forEach(cardReqId => {
+                    const cardElement = document.getElementById(`req-card-${cardReqId}`);
+                    if (cardElement && review.applyLineNumbersToCard) {
+                        review.applyLineNumbersToCard(cardElement, cardReqId);
+                    }
+                });
+
+                // Select the most recently opened card (first in stack) for review
+                if (openCards.length > 0) {
+                    const reqId = openCards[0];
+                    const req = window.REQ_CONTENT_DATA ? window.REQ_CONTENT_DATA[reqId] : null;
+                    document.dispatchEvent(new CustomEvent('traceview:req-selected', {
+                        detail: { reqId, req }
+                    }));
+                }
+            }
+        } else {
+            if (column) column.classList.add('hidden');
+            if (btn) btn.classList.remove('active');
+            if (packagesPanel) packagesPanel.style.display = 'none';
+
+            // Clear selection when deactivating (REQ-d00092-G)
+            clearCurrentSelection();
+        }
+
+        // Dispatch event for review mode change (REQ-d00092-E)
+        document.dispatchEvent(new CustomEvent('rs:review-mode-changed', {
+            detail: { active: reviewModeActive }
+        }));
+
+        return reviewModeActive;
+    }
+
+    /**
+     * Clear current selection (card and line selections)
+     */
+    function clearCurrentSelection() {
+        if (selectedCardElement) {
+            selectedCardElement.classList.remove('rs-selected');
+            // Clear line selections using RS namespace
+            if (RS.clearAllLineSelections) {
+                RS.clearAllLineSelections();
+            }
+            selectedCardElement = null;
+        }
+        review.selectedReqId = null;
+    }
+
+    /**
+     * Apply line numbers to the currently selected requirement card
+     * @param {HTMLElement} cardElement - The card element
+     * @param {string} reqId - Requirement ID
+     */
+    function applyLineNumbersToReqCard(cardElement, reqId) {
+        // Use RS namespace to apply line numbers (REQ-d00092)
+        if (RS.applyLineNumbersToCard) {
+            RS.applyLineNumbersToCard(cardElement, reqId);
+        }
+    }
+
+    /**
+     * Select a requirement for review
+     * @param {string} reqId - Requirement ID to select
+     */
+    function selectReqForReview(reqId) {
+        if (!reviewModeActive) {
+            toggleReviewMode(true);
+        }
+
+        // Clear previous selection
+        clearCurrentSelection();
+
+        review.selectedReqId = reqId;
+        const req = window.REQ_CONTENT_DATA ? window.REQ_CONTENT_DATA[reqId] : null;
+
+        // Find and mark the card element
+        const cardElement = document.querySelector(`[data-req-id="${reqId}"]`);
+        if (cardElement) {
+            selectedCardElement = cardElement;
+            cardElement.classList.add('rs-selected');
+
+            // Apply line numbers to the selected card (REQ-d00092-E)
+            applyLineNumbersToReqCard(cardElement, reqId);
+        }
+
+        document.dispatchEvent(new CustomEvent('traceview:req-selected', {
+            detail: { reqId, req }
+        }));
+    }
+
+    /**
+     * Check if review mode is currently active
+     * @returns {boolean} True if review mode is active
+     */
+    function isReviewModeActive() {
+        return reviewModeActive;
+    }
+
+    // Auto-initialize on DOMContentLoaded if review mode data exists
+    document.addEventListener('DOMContentLoaded', function() {
+        if (document.body.getAttribute('data-review-mode') === 'true') {
+            if (window.REVIEW_DATA) {
+                console.log('Review mode auto-initializing...');
+                // Don't auto-enable review mode, just set up the system
+                if (review.init && !review._initialized) {
+                    review.init();
+                    review._initialized = true;
+                }
+            }
+        }
+    });
+
+    // Export functions to review namespace
+    review.toggleReviewMode = toggleReviewMode;
+    review.selectReqForReview = selectReqForReview;
+    review.isReviewModeActive = isReviewModeActive;
+    review.clearCurrentSelection = clearCurrentSelection;
+    review.applyLineNumbersToReqCard = applyLineNumbersToReqCard;
+
+    // Export to ReviewSystem alias (RS pattern)
+    RS.toggleReviewMode = toggleReviewMode;
+    RS.selectReqForReview = selectReqForReview;
+    RS.isReviewModeActive = isReviewModeActive;
+    RS.clearCurrentSelection = clearCurrentSelection;
+
+})(TraceView.review, RS);

elspais/trace_view/html/templates/partials/review/review-line-numbers.js

@@ -0,0 +1,429 @@
+/**
+ * TraceView Review Line Numbers Module
+ * Add line numbers to requirement content for click-to-comment.
+ * IMPLEMENTS REQUIREMENTS: REQ-d00092
+ */
+window.TraceView = window.TraceView || {};
+TraceView.review = TraceView.review || {};
+window.ReviewSystem = window.ReviewSystem || {};
+var RS = window.ReviewSystem;
+
+// Global selection state (REQ-d00092-H)
+window.selectedLineNumber = null;
+window.selectedLineRange = null;
+
+(function(review, RS) {
+    'use strict';
+
+    // Track current selection state
+    let currentReqId = null;
+    let selectionType = 'general';  // 'line', 'block', or 'general'
+
+    // Drag selection state
+    let isDragging = false;
+    let dragStartLine = null;
+    let dragContainer = null;
+    let dragReqId = null;
+
+    /**
+     * Convert markdown content to line-numbered HTML view
+     * @param {string} content - Raw markdown/text content
+     * @param {string} reqId - The requirement ID
+     * @returns {HTMLElement} Container element with line-numbered content
+     */
+    function convertToLineNumberedView(content, reqId) {
+        const container = document.createElement('div');
+        container.className = 'rs-line-numbers-container';
+        container.setAttribute('data-req-id', reqId);
+
+        // Create hint bar (shows click instructions in review mode)
+        const hint = document.createElement('div');
+        hint.className = 'rs-line-numbers-hint';
+        hint.textContent = 'Click or drag to select lines for commenting';
+        container.appendChild(hint);
+
+        // Create table structure for line numbers
+        const table = document.createElement('div');
+        table.className = 'rs-lines-table';
+
+        const lines = (content || '').split('\n');
+        lines.forEach((line, index) => {
+            const row = document.createElement('div');
+            row.className = 'rs-line-row';
+            row.setAttribute('data-line', index + 1);
+            row.style.cursor = 'pointer';
+
+            // Mousedown handler to start selection/drag
+            row.addEventListener('mousedown', function(event) {
+                event.preventDefault(); // Prevent text selection
+                handleLineMouseDown(event, reqId, index + 1, container);
+            });
+
+            // Mouseover handler for drag selection
+            row.addEventListener('mouseover', function(event) {
+                if (isDragging && dragContainer === container) {
+                    handleLineDragOver(reqId, index + 1, container);
+                }
+            });
+
+            // Line number
+            const lineNum = document.createElement('span');
+            lineNum.className = 'rs-line-number';
+            lineNum.textContent = index + 1;
+
+            // Line text
+            const lineText = document.createElement('span');
+            lineText.className = 'rs-line-text';
+            lineText.textContent = line || ' ';  // Preserve empty lines
+
+            row.appendChild(lineNum);
+            row.appendChild(lineText);
+            table.appendChild(row);
+        });
+
+        container.appendChild(table);
+        return container;
+    }
+
+    /**
+     * Handle mousedown on a line - start selection or drag
+     * @param {MouseEvent} event - Mouse event
+     * @param {string} reqId - Requirement ID
+     * @param {number} lineNumber - Line number
+     * @param {HTMLElement} container - Container element
+     */
+    function handleLineMouseDown(event, reqId, lineNumber, container) {
+        // Start drag tracking
+        isDragging = true;
+        dragStartLine = lineNumber;
+        dragContainer = container;
+        dragReqId = reqId;
+
+        // Select the starting line
+        selectSingleLine(reqId, lineNumber, container);
+
+        // Dispatch initial selection event
+        dispatchSelectionEvent(reqId, lineNumber);
+    }
+
+    /**
+     * Handle mouseover during drag - extend selection
+     * @param {string} reqId - Requirement ID
+     * @param {number} lineNumber - Line number being hovered
+     * @param {HTMLElement} container - Container element
+     */
+    function handleLineDragOver(reqId, lineNumber, container) {
+        if (!isDragging || dragStartLine === null) return;
+
+        if (lineNumber !== dragStartLine) {
+            // Extend selection to range
+            selectLineRange(reqId, dragStartLine, lineNumber, container);
+        } else {
+            // Back to single line
+            selectSingleLine(reqId, lineNumber, container);
+        }
+    }
+
+    /**
+     * Handle mouseup - finalize selection
+     */
+    function handleLineMouseUp() {
+        if (isDragging && dragReqId) {
+            // Dispatch final selection event
+            dispatchSelectionEvent(dragReqId, window.selectedLineNumber);
+        }
+
+        // Reset drag state
+        isDragging = false;
+        dragStartLine = null;
+        dragContainer = null;
+        dragReqId = null;
+    }
+
+    /**
+     * Dispatch selection event for line selection
+     * @param {string} reqId - Requirement ID
+     * @param {number} lineNumber - Primary line number
+     */
+    function dispatchSelectionEvent(reqId, lineNumber) {
+        // Dispatch event for line selection (REQ-d00092-C)
+        document.dispatchEvent(new CustomEvent('rs:line-selected', {
+            detail: {
+                reqId: reqId,
+                lineNumber: lineNumber,
+                lineRange: window.selectedLineRange,
+                selectionType: selectionType
+            }
+        }));
+
+        // Also update Review Panel focus to this REQ
+        const req = window.REQ_CONTENT_DATA ? window.REQ_CONTENT_DATA[reqId] : null;
+        document.dispatchEvent(new CustomEvent('traceview:req-selected', {
+            detail: { reqId: reqId, req: req }
+        }));
+    }
+
+    /**
+     * Handle click on a line (legacy support, also handles shift-click)
+     * @param {Event} event - Click event
+     * @param {string} reqId - Requirement ID
+     * @param {number} lineNumber - Line number clicked
+     * @param {HTMLElement} container - Container element
+     */
+    function handleLineClick(event, reqId, lineNumber, container) {
+        if (event.shiftKey && window.selectedLineNumber !== null) {
+            // Shift-click: select range
+            selectLineRange(reqId, window.selectedLineNumber, lineNumber, container);
+        } else {
+            // Single click: select single line
+            selectSingleLine(reqId, lineNumber, container);
+        }
+
+        dispatchSelectionEvent(reqId, lineNumber);
+    }
+
+    // Global mouseup handler to finalize drag selection
+    document.addEventListener('mouseup', handleLineMouseUp);
+
+    /**
+     * Select a single line
+     * @param {string} reqId - Requirement ID
+     * @param {number} lineNumber - Line number to select
+     * @param {HTMLElement} container - Container element (optional)
+     */
+    function selectSingleLine(reqId, lineNumber, container) {
+        currentReqId = reqId;
+        window.selectedLineNumber = lineNumber;
+        window.selectedLineRange = null;
+        selectionType = 'line';
+
+        // Clear previous selection
+        if (container) {
+            const prev = container.querySelectorAll('.rs-line-row.selected');
+            prev.forEach(el => el.classList.remove('selected'));
+
+            // Highlight selected line
+            const row = container.querySelector(`.rs-line-row[data-line="${lineNumber}"]`);
+            if (row) {
+                row.classList.add('selected');
+            }
+        }
+    }
+
+    /**
+     * Select a range of lines
+     * @param {string} reqId - Requirement ID
+     * @param {number} startLine - Start line number
+     * @param {number} endLine - End line number
+     * @param {HTMLElement} container - Container element (optional)
+     */
+    function selectLineRange(reqId, startLine, endLine, container) {
+        currentReqId = reqId;
+        const start = Math.min(startLine, endLine);
+        const end = Math.max(startLine, endLine);
+        window.selectedLineNumber = start;
+        window.selectedLineRange = { start: start, end: end };
+        selectionType = 'block';
+
+        // Clear previous selection
+        if (container) {
+            const prev = container.querySelectorAll('.rs-line-row.selected');
+            prev.forEach(el => el.classList.remove('selected'));
+
+            // Highlight range
+            for (let i = start; i <= end; i++) {
+                const row = container.querySelector(`.rs-line-row[data-line="${i}"]`);
+                if (row) {
+                    row.classList.add('selected');
+                }
+            }
+        }
+    }
+
+    /**
+     * Apply line numbers to a requirement card
+     * @param {HTMLElement} cardElement - The card element containing the requirement
+     * @param {string} reqId - The requirement ID
+     */
+    function applyLineNumbersToCard(cardElement, reqId) {
+        if (!cardElement) return;
+
+        // Find the body section of the requirement card
+        const bodySection = cardElement.querySelector('.req-body-section');
+        if (!bodySection) return;
+
+        // Check if already fully processed (has our container with click handlers)
+        if (bodySection.querySelector('.rs-line-numbers-container')) {
+            return;
+        }
+
+        // Check if line numbers already exist (from scripts.js renderMarkdownWithLines)
+        // If so, just add click handlers instead of recreating
+        const existingTable = bodySection.querySelector('.rs-lines-table');
+        if (existingTable) {
+            // Add wrapper container with hint
+            const container = document.createElement('div');
+            container.className = 'rs-line-numbers-container';
+            container.setAttribute('data-req-id', reqId);
+
+            // Create hint bar
+            const hint = document.createElement('div');
+            hint.className = 'rs-line-numbers-hint';
+            hint.textContent = 'Click or drag to select lines for commenting';
+            container.appendChild(hint);
+
+            // Move existing table into container
+            existingTable.parentNode.insertBefore(container, existingTable);
+            container.appendChild(existingTable);
+
+            // Add drag selection handlers to entire rows
+            const rows = existingTable.querySelectorAll('.rs-line-row');
+            rows.forEach(row => {
+                const lineNumber = parseInt(row.getAttribute('data-line'), 10);
+                if (lineNumber) {
+                    // Mousedown to start selection/drag
+                    row.addEventListener('mousedown', function(event) {
+                        event.preventDefault(); // Prevent text selection
+                        handleLineMouseDown(event, reqId, lineNumber, container);
+                    });
+
+                    // Mouseover for drag selection
+                    row.addEventListener('mouseover', function(event) {
+                        if (isDragging && dragContainer === container) {
+                            handleLineDragOver(reqId, lineNumber, container);
+                        }
+                    });
+
+                    row.style.cursor = 'pointer';
+                }
+            });
+
+            bodySection.classList.add('rs-with-line-numbers');
+            return;
+        }
+
+        // No existing line numbers - create from scratch
+        const content = bodySection.textContent || '';
+        const container = convertToLineNumberedView(content, reqId);
+
+        // Replace content with line-numbered version
+        bodySection.innerHTML = '';
+        bodySection.appendChild(container);
+        bodySection.classList.add('rs-with-line-numbers');
+    }
+
+    /**
+     * Get current line selection state
+     * @returns {Object} Selection state with type, lineNumber, and lineRange
+     */
+    function getLineSelection() {
+        return {
+            type: selectionType,
+            lineNumber: window.selectedLineNumber,
+            lineRange: window.selectedLineRange,
+            reqId: currentReqId
+        };
+    }
+
+    /**
+     * Clear line selection for a specific card
+     * @param {HTMLElement} cardElement - The card element
+     */
+    function clearLineSelection(cardElement) {
+        if (!cardElement) return;
+
+        const highlights = cardElement.querySelectorAll('.rs-line-row.selected');
+        highlights.forEach(el => el.classList.remove('selected'));
+
+        // Reset global state if this was the active selection
+        const container = cardElement.querySelector('.rs-line-numbers-container');
+        if (container && container.getAttribute('data-req-id') === currentReqId) {
+            window.selectedLineNumber = null;
+            window.selectedLineRange = null;
+            selectionType = 'general';
+            currentReqId = null;
+        }
+    }
+
+    /**
+     * Clear all line selections across all cards
+     */
+    function clearAllLineSelections() {
+        const containers = document.querySelectorAll('.rs-line-numbers-container');
+        containers.forEach(container => {
+            const highlights = container.querySelectorAll('.rs-line-row.selected');
+            highlights.forEach(el => el.classList.remove('selected'));
+        });
+
+        // Reset global state
+        window.selectedLineNumber = null;
+        window.selectedLineRange = null;
+        selectionType = 'general';
+        currentReqId = null;
+    }
+
+    /**
+     * Highlight a specific line in a requirement card
+     * @param {HTMLElement} cardElement - The card element
+     * @param {number} lineNumber - The line number to highlight
+     */
+    function highlightLine(cardElement, lineNumber) {
+        if (!cardElement) return;
+
+        // Remove existing highlights
+        const existingHighlights = cardElement.querySelectorAll('.rs-line-row.selected');
+        existingHighlights.forEach(el => el.classList.remove('selected'));
+
+        // Add highlight to target line
+        const targetRow = cardElement.querySelector(`.rs-line-row[data-line="${lineNumber}"]`);
+        if (targetRow) {
+            targetRow.classList.add('selected');
+            targetRow.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        }
+    }
+
+    /**
+     * Clear all line highlights in a card (alias for clearLineSelection)
+     * @param {HTMLElement} cardElement - The card element
+     */
+    function clearLineHighlights(cardElement) {
+        clearLineSelection(cardElement);
+    }
+
+    /**
+     * Handle keyboard events for line selection (REQ-d00092-I)
+     * @param {KeyboardEvent} event - Keyboard event
+     */
+    function handleKeyboard(event) {
+        if (event.key === 'Escape') {
+            clearAllLineSelections();
+            document.dispatchEvent(new CustomEvent('rs:line-selection-cleared'));
+        }
+    }
+
+    // Bind keyboard handler (REQ-d00092-I)
+    document.addEventListener('keydown', handleKeyboard);
+
+    // Export to review namespace
+    review.convertToLineNumberedView = convertToLineNumberedView;
+    review.applyLineNumbersToCard = applyLineNumbersToCard;
+    review.getLineSelection = getLineSelection;
+    review.clearLineSelection = clearLineSelection;
+    review.clearAllLineSelections = clearAllLineSelections;
+    review.highlightLine = highlightLine;
+    review.clearLineHighlights = clearLineHighlights;
+    review.selectSingleLine = selectSingleLine;
+    review.selectLineRange = selectLineRange;
+    review.handleLineClick = handleLineClick;
+    review.handleKeyboard = handleKeyboard;
+
+    // Export to ReviewSystem alias (RS) pattern for tests
+    RS.convertToLineNumberedView = convertToLineNumberedView;
+    RS.applyLineNumbersToCard = applyLineNumbersToCard;
+    RS.getLineSelection = getLineSelection;
+    RS.clearLineSelection = clearLineSelection;
+    RS.clearAllLineSelections = clearAllLineSelections;
+    RS.highlightLine = highlightLine;
+    RS.clearLineHighlights = clearLineHighlights;
+
+})(TraceView.review, RS);