new word tracker 2025 indexing and position

by Julian

HTML

<!DOCTYPE html>
<html lang="en">
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Word Index Tracker</title>
</head>
<body>
    <h1>Word Index Tracker</h1>
    <textarea id="source" placeholder="Source text" rows="10" cols="50"></textarea>
    <textarea id="target" placeholder="Target area" rows="10" cols="50"></textarea>
    <div id="indexesDisplay">Copied Indexes: None</div>
    <button id="downloadJson">Download JSON</button>
</body>
</html>

CSS

body {
      font-family: Arial, sans-serif;
      margin: 20px;
    }
    div[contenteditable] {
      border: 1px solid #ccc;
      padding: 10px;
      height: 100px;
      overflow-y: auto;
      margin-bottom: 10px;
    }
    .output {
      margin-top: 10px;
    }

JavaScript

const sourceTextArea = document.getElementById("source");
        const targetTextArea = document.getElementById("target");
        const indexesDisplay = document.getElementById("indexesDisplay");
        const downloadButton = document.getElementById("downloadJson");

        let wordIndexList = [];
        let nextIndex = 1;
        let copiedIndexes = [];

        // Assign unique indexes and track positions in the source text
        sourceTextArea.addEventListener("input", () => {
            const text = sourceTextArea.value;
            const words = text.split(/\s+/).filter(word => word.trim() !== "");

            wordIndexList = [];
            nextIndex = 1;

            words.forEach((word, position) => {
                wordIndexList.push({ word, index: nextIndex, position });
                nextIndex++;
            });

            console.log("Word Index List:", wordIndexList);
        });

        // Track pasted words and their correct indexes and remove them from the source
        const trackPastedIndexes = () => {
            const targetText = targetTextArea.value;
            const words = targetText.split(/\s+/).filter(word => word.trim() !== "");

            copiedIndexes = [];
            let usedInstances = new Set(); // Track used instances by position

            words.forEach((word, targetPosition) => {
                const matchIndex = wordIndexList.findIndex((entry) => {
                    return (
                        entry.word === word &&
                        !usedInstances.has(entry.position) // Match unused instances
                    );
                });

                if (matchIndex !== -1) {
                    const match = wordIndexList[matchIndex];
                    copiedIndexes.push({ index: match.index, position: match.position });
                    usedInstances.add(match.position); // Mark this position as used

                    // Remove the matched word from the source list
                ...