{% extends "standalone.html" %}
{% block title %}Escher{% endblock %}
{% block head %}
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootswatch/3.1.1/simplex/bootstrap.min.css">
  <script src="//use.edgefonts.net/tulpen-one.js"></script>

  <link href="css/index.css" rel="stylesheet" type="text/css" media="all">
{% endblock %}
{% block content %}
  <main>
    <div class="container">
      <header class="row">
	<div class="col-sm-12">
	  <img src="resources/escher-logo@2x.png" id="logo">
	  <h1 id="title">ESCHER</h1>
	</div>
      </header>
      <div class="row">
	<div class="col-sm-3">
	  <h3>Model</h3>
	  <select id="model" class="form-control">
	    <option value="none">None</option>
	    <option value="iJO1366">iJO1366</option>
	  </select>
	</div>
	<div class="col-sm-3">
	  <h3>Map</h3>
	  <select id="map" class="form-control">
	    <option value="iJO1366_central_metabolism">iJO1366 central metabolism</option>
	    <option value="empty">Emtpy builder</option>
	  </select>
	</div>
	<div class="col-sm-3">
	  <h3>Options</h3>
	  <select id="options" class="form-control">
	    <option value="viewer">Viewer</option>
	    <option value="builder">Builder</option>
	    <option value="dev_viewer">Viewer (Dev)</option>
	    <option value="dev_builder">Builder (Dev)</option>
	  </select>
	</div>
	<div class="col-sm-3">
	  <button type="button" class="btn btn-default column-button" onClick="submit()">
	    Submit
	  </button>
	</div>
      </div>
    </div>
    <div id="push"></div>
  </main>
  <footer>
    <div class="container">
      <p class="more">
	Learn more about <a href="http://zakandrewking.github.io/escher">Escher</a>.
      </p>
    </div>
  </footer>

  <script type="application/javascript">
   function get_value(id) {
     var a = document.getElementById(id);
     return a.options[a.selectedIndex].value
   }

   function submit() {
     var map_value = get_value('map'),
     model_value = get_value('model'),
     options_value = get_value('options'),
     add = [];
     if (model_value!='none')
     add.push('model_name=' + model_value);	 
     if (map_value!='empty')
     add.push('map_name=' + map_value);

     if (options_value=='dev_viewer') {
       url = 'dev/viewer.html';
     } else if (options_value=='dev_builder') {
       url = 'dev/builder.html';
     } else if (options_value=='viewer') {
       url = 'viewer.html';
     } else {
       url = 'builder.html';
     }

     url += '?';
     for (var i=0, l=add.length; i < l; i++) {
       if (i > 0) url += '&';
       url += add[i];
     }
     window.location.href = url;
   }
  </script>
{% endblock %}
