<div class="row">
  <div class="col-md-6">
    <h4>existing templates</h4>
    <div class="row">
      <div class="col-md-8">
        <div class="row" ng-show="paginator.getCollection().length">
          <div class="col-md-6 form-group">
            <input type="text" ng-model="paginator.filter.name" class="form-control" placeholder="template name">
          </div>
          <div class="col-md-6 form-group">
            <input type="text" ng-model="paginator.filter.pattern" class="form-control"
                   placeholder="template pattern">
          </div>
        </div>
      </div>
      <div class="col-md-4">
        <ng-pagination page="page" paginator="paginator"></ng-pagination>
      </div>
      <div class="col-xs-12">
        <table class="table">
          <tr ng-repeat="template in page.elements track by $index" ng-show="template">
            <td>
              <i class="fa fa-book"></i> {{template.name}} <span class="info-text"> with pattern</span>
              {{template.template.template}}
              <i class="fa fa-trash normal-action alert-danger pull-right" ng-click="delete(template.name)"
                 ng-hide="template.removed" data-toggle="modal" href="#confirm_dialog" target="_self"></i>
              <i class="fa fa-trash alert-danger pull-right disabled" ng-show="template.removed"></i>
              <i class="fa fa-pencil normal-action pull-right" ng-hide="template.removed" ng-click="edit(template.name, template.template)"></i>
            </td>
          </tr>
        </table>
      </div>
    </div>
  </div>
  <div class="col-md-6">
    <h4 ng-hide="editMode">create new template</h4>
    <h4 ng-show="editMode">update template {{name}}</h4>
    <div class="row">
      <div class="col-xs-12">
        <div class="form-group">
          <div class="form-group">
            <input type="text" class="form-control" placeholder="name" ng-model="name">
          </div>
        </div>
      </div>
      <div class="col-xs-12">
        <div class="form-group">
          <div id="template-body-editor" class="ace-cerebro" style="height: 600px"></div>
        </div>
      </div>
      <div class="col-xs-12 text-right">
        <button type="submit" class="btn btn-success" ng-click="create(name)" ng-hide="editMode">
          <i class="fa fa-file-o normal-action alert-success"> </i> create
        </button>
        <button type="submit" class="btn btn-warning" ng-click="create(name)" ng-show="editMode">
          <i class="fa fa-floppy-o normal-action alert-warning"> </i> update
        </button>
      </div>
    </div>
  </div>
</div>
