Indexing words copy and paste new
by Julian
HTML
<!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>
<style>
#output {
margin-top: 10px;
padding: 10px;
border: 1px solid #ccc;
background: #f9f9f9;
}
</style>
</head>
<body>
<h1>Word Index Tracker</h1>
<p>Original Text: <span id="original-text"></span></p>
<textarea id="text-box" rows="5" cols="50" placeholder="Paste text here to see indexes"></textarea>
<div id="output">Indexes will appear here...</div>
</body>
</html>
JavaScript
// Original string
const originalString = " I love Turkey. I work in a Turkey restaurant. My friends are Turkish and Im always going to Turkey and obviously my partner is Turkish. What is it you love so much about Turkey? Okay. Part from my partner. I just love the people, the culture. Sorry. I love about yeah. What I love most about Turkey is the culture, the people, the lifestyle. Its just completely different to England and I wait, hang on, sorry. Im just trying to think about the culture, the people, the lifestyle. Its just completely different to England. Yeah, Ill say that. And what I love most about Turkey is the culture, the people";
document.getElementById('original-text').innerText = originalString;
// Create a map of words to arrays of their indexes
const wordIndexMap = {};
originalString.split(/\s+/).forEach((word, index) => {
word = word.replace(/[.,!?]/g, ''); // Remove punctuation for better matching
if (!wordIndexMap[word]) {
wordIndexMap[word] = [];
}
wordIndexMap[word].push(index);
});
// Textbox and output elements
const textBox = document.getElementById('text-box');
const output = document.getElementById('output');
// Event listener for tracking changes in the text box
textBox.addEventListener('input', () => {
const pastedWords = textBox.value.split(/\s+/).map(word => word.replace(/[.,!?]/g, '')); // Clean pasted words
const indexes = pastedWords
.filter(word => word in wordIndexMap) // Only track words in the original text
.flatMap(word => wordIndexMap[word]); // Flatten arrays of indexes for the matched words
// Display the indexes
output.innerText = `Indexes of words: ${indexes.join(', ')}`;
});