<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Hare Playground</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="github.min.css" />
    <link rel="stylesheet" href="writ.min.css" />
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <h1>Hare Playground</h1>

    <span>
      <a href="https://harelang.org/">Hare Lang</a>
      |
      <a href="https://docs.harelang.org/">Standard Library Reference</a>
    </span>

    <section class="toolbar">
      <button
        hx-post="/v1/exec"
        hx-target=".code-output code"
        hx-swap="innerHTML"
        hx-vals="js:{code: getCode()}"
        hx-ext="json-enc"
      >
        Run
      </button>

      <button id="share-button">
        Share
      </button>

      <span id="htmx-indicator">
            <svg width="1em" height="1em" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z"><animateTransform attributeName="transform" type="rotate" dur="0.75s" values="0 12 12;360 12 12" repeatCount="indefinite"/></path></svg>
      </span>
      <span id="status" class="status"></span>
    </section>
    <section class="code">
      <div class="editor language-c">Sorry, this playground requires JavaScript. :(</div>

      <div class="code-output">
        <div class="std-output">
          Standard Error
        </div>

        <pre><code class="stderr"></code></pre>

        <div class="std-output">
          Standard Output
        </div>

        <pre><code class="stdout"></code></pre>
      </div>
    </div>

    </section>

    <footer>
      <p>
      built by <a href="https://hachyderm.io/@jer">jan-erik</a>
      using hare
      /
      <a href="https://fnordig.de">fnordig.de</a>
      </p>
    </footer>

    <script type="module" src="app.js"></script>
  </body>
</html>