{% if not included %}
{% extends 'index.html' %}

{% block title %}
Editor
{% endblock title %}

{% endif %}

{% set included = True %}

{% block head %}
{% endblock head %}

{% block content %}

<h3>Ob editor</h3>

<div class="row mt-2">
  <label for="ob-list-options" class="col-2 col-form-label">Load OB</label>
  <div class="col">
    <select id="ob-list-options" data-parameter="blocks-list-options" class="form-select">
      <option  selected disabled hidden>
        -- Select a saved OB --
      </option>
      {% for ob in data | sort(attribute='name') %}
      <option data-index="{{loop.iterator}}" value="{{ob.name}}">
        {{ob.name}}
      </option>
        {% endfor %}
    </select>
  </div>
  
  <span class="col-auto form-text mt-2">or</span>
  <label for="new-ob-name" class="col-2 col-form-label">Create new</label>
  <div class="col input-group mb-3">
    <input class="form-control" id="new-ob-name" placeholder="insert name">
    <button class="btn btn-outline-secondary" type="button"
            id="create-ob">Create</button>
  </div>
  
</div>

<section id="ob-list">
  <h4>OB list</h4>
</section>

{% endblock content %}

{% block footer %}
{% endblock footer %}
