{% extends "base.html" %}

{% block body_class %}draw{% endblock %}

{% block body %}

  <header class="controls">
    <label>etherpad</label>
    <input id="pad-name" type="text" value="{{params['pad']}}" data-name="p"/>
    <button id="button-pad" data-use="pad-name">go</button>

    <hr>

    <button id="button-svg">generate</button>

    <label>weight</label>
    <input class="get-input" type="range" min="1" max="8" value="{{params['weight']}}" data-name="w" data-frame="svg-iframe"/>

  </header>

  <div class="split-screen reload" id="main">
    <iframe class="f-ascii" id="pad-iframe" src="{{params['pad-full']}}">
    </iframe>
    <div class="f-svg">
        <iframe id="svg-iframe" src="/drawing/{{params['pad']}}">
        </iframe>
    </div>
  </div>

  <script src="/static/js/generate_interface.js"></script>

{% endblock %}