simple text form 2

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>Paste and Download Indexed Words</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    #output {
      margin: 20px 0;
      font-size: 1.2em;
    }
    .word {
      display: inline-block;
      margin-right: 10px;
      cursor: text;
    }
    .index {
      font-size: 0.1em;
      vertical-align: super;
      margin-left: 2px;
    }
    #copied {
      margin-top: 20px;
      width: 100%;
      height: 100px;
      font-size: 1.2em;
      white-space: pre-wrap; /* Preserve spaces and line breaks */
      border: 1px solid #ccc;
      padding: 10px;
      background-color: #f9f9f9;
      font-family: Arial, sans-serif;
      overflow-y: auto;
    }
    button {
      margin-top: 20px;
      padding: 10px 20px;
      font-size: 1em;
      cursor: pointer;
    }
    .highlight {
      background-color: yellow;
    }
    .index-pasted {
      font-size: 0.7em; /* Make the index small */
      vertical-align: super;
      margin-left: 2px;
    }
  </style>
</head>
<body>
  <h1>Paste and Download Indexed Words</h1>
  <p id="output"></p>
  <div id="copied" contenteditable="true" placeholder="Paste words here..."></div>
  <button id="downloadBtn">Download Words as JSON</button>

  <script>
    // Input string
    const inputString = " 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...