<!DOCTYPE html> <html>

<head>
  <meta content="text/html; charset=UTF-8" http-equiv="content-type" />
  <meta charset="utf-8" />
  <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible" />
  <meta content="width=device-width, initial-scale=1.0" name="viewport" />
  <link href="stylesheets/railscasts.css" rel="stylesheet" type="text/css" />
  <link href="stylesheets/all.css" rel="stylesheet" type="text/css" />
  <link href="stylesheets/scrollbar.css" rel="stylesheet" type="text/css" />
  <script src="javascripts/all.js" type="text/javascript"></script>
  <script>
    hljs.initHighlightingOnLoad();
  </script>
  <script>
    (function () {
      $(document).ready(function () {
        var term;
        term = new Terminal({
          cols: 80,
          rows: 24,
          screenKeys: true,
        });
        term.on("data", function (data) {
          return console.log(data);
        });
        term.on("title", function (title) {
          return (document.title = title);
        });
        term.open($("#console-default")[0]);
        return term.write("HEllo World");
      });
    }).call(this);
  </script>
  <script>
    (function () {
      $.extend(WSClient.prototype.actions, {
        term: function (data) {
          return term.write(data.data);
        },
      });
    }).call(this);
  </script>
</head>
<body>
  <div class="hidden" id="toolbar">
    <a class="tool-button" href="#">Open</a
    ><a class="tool-button" href="#">Save</a>
  </div>
  <div id="panes">
    <pre class="pane" id="console-default" style="height: 100%"></pre>
  </div>
  <div class="hidden" id="dialog">
    <pre id="message">Hi World</pre>
    <a class="full-button" href="#">Ok</a>
  </div>
  <div id="status">
    <div class="left"></div>
    <div class="center"></div>
    <div class="right"></div>
  </div>
</body>

</html>