code/index.html

<!doctype html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Eloquent JavaScript :: Code Sandbox</title>

  <link rel=stylesheet href="../css/ejs.css">
  <script src="./chapter_info.js"></script>
  <script>
    var page = {type: "code"}
  </script>

  <style>
    .control { font-size: 15px }
  </style>
</head>

<article style="max-width: 50em;">
  <h1>Code Sandbox<div style="font-size: 70%"><a class="subtlelink" href="../index.html">Eloquent JavaScript</a></div></h2>

  <p>You can use this page to download source code and solutions to
  exercises for the book Eloquent JavaScript, and to directly run code
  in the context of chapters from that book, either to solve exercises
  to simply play around.</p>

  <p>
    Chapter: <select id="chapters" class=control></select>
    <select id="per_chapter" class=control></select>
    <button id="run" class=control>run code</button>
  </p>

  <div class="editor-wrap">
    <div id="editor"></div>
    <div class="sandbox-output" id="output" aria-live=polite></div>
  </div>

  <div id="runLocally">
    To run this chapter's code locally, use these files:
    <ul id="local-files" style="font-family: 'PT Mono', monospace; margin-top: 0"></ul>
  </div>

  <div id="fileInfo">
    These files contain this chapter’s project code:
    <ul id="files" style="font-family: 'PT Mono', monospace; margin-top: 0"></ul>
  </div>

  <p id="exercise_info">If you've solved the exercise and want to compare your code with
  mine, or you <em>really</em> tried, but can't get your code to work,
  you can <button id="solution" style="color: #c22;" class=control>look at the
  solution</button> (or <a id="download">download it</a>).</p>

  <p id="box_info">
    The base environment for this chapter (if any) is available in the
    sandbox above, allowing you to run the chapter's examples by
    simply pasting them into the editor.
  </p>
</article>

<script src="../ejs.js"></script>