index.html

﻿<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta charset="utf-8" />
  <title>Convert TSV to Markdown or HTML</title>
  <link href="Main.css" rel="stylesheet" />
  <!-- <script src="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js?autorun=false"></script> -->
  <script src="Main.js"></script>
</head>

<body onload="delayedGeneration()">
  <span>
    <input type="checkbox" name="hasHeader" id="hasHeader" checked="checked" onchange="delayedGeneration()" />
    <label for="hasHeader" id="hasHeaderLegend">Header</label>
  </span>

  <div class="textwrapper">
    <textarea rows="20" id="input" class="monospace" placeholder="Paste the TSV here"
      oninput="delayedGeneration()"></textarea>
  </div>

  <button onclick="clearAll()" class="button" id="clearAll">Clear all</button>
  <button onclick="copyMdCode()" class="button copy" id="copyMdButton">Copy Markdown</button>
  <button onclick="copyHtmlCode()" class="button copy" id="copyCodeButton">Copy HTML</button>
  <span id="copy-message">copied to clipboard</span>
  <div class="resultWrapper">
    <input class="radio" id="one" name="group" type="radio">
    <input class="radio" id="two" name="group" type="radio">
    <input class="radio" id="three" name="group" type="radio" checked>
    <div class="tabs">
      <label class="tab" id="mdTab" for="three">Markdown code</label>
      <label class="tab" id="htmlTab" for="two">HTML code</label>
      <label class="tab" id="previewTab" for="one">Preview</label>
    </div>
    <div class="panels">
      <div class="panel" id="previewPanel">

      </div>
      <div class="panel" id="htmlPanel">
        <pre class="prettyprint lang-html" id="htmlContent" lang="HTML"></pre>
      </div>
      <div class="panel" id="mdPanel">
        <pre id="mdContent" lang="MD"></pre>
      </div>
    </div>
  </div>
</body>

</html>