<h1 translate>Agenda</h1>

<div id="submenu">
  <a ui-sref="agenda.item.create" os-perms="agenda.can_manage" class="btn btn-primary btn-sm">
    <i class="fa fa-plus fa-lg"></i>
    <translate>New</translate>
  </a>
  <a ui-sref="agenda.item.sort" os-perms="agenda.can_manage" class="btn btn-default btn-sm">
    <i class="fa fa-sitemap fa-lg"></i>
    <translate>Sort agenda</translate>
  </a>
  <a ui-sref="agenda.item.import" os-perms="agenda.can_manage" class="btn btn-default btn-sm">
    <i class="fa fa-download fa-lg"></i>
    <translate>Import</translate>
  </a>
  <a ui-sref="core.tag.list" os-perms="core.can_manage_tags" class="btn btn-default btn-sm">
    <i class="fa fa-tags fa-lg"></i>
    <translate>Tags</translate>
  </a>
  <a ui-sref="agenda_pdf" target="_blank" class="btn btn-default btn-sm">
    <i class="fa fa-file-pdf-o fa-lg"></i>
    <translate>PDF</translate>
  </a>
</div>

<div class="row form-group">
  <div class="col-sm-8">
    <!-- project agenda -->
    <a os-perms="core.can_manage_projector" class="btn btn-default btn-sm"
        ng-click="projectAgenda()"
        ng-class="{ 'btn-primary': isAgendaProjected() }">
      <i class="fa fa-video-camera"></i>
      <translate>Project agenda</translate>
    </a>
  </div>
  <div class="col-sm-4">
    <input type="text" os-focus-me ng-model="filter.search" class="form-control"
        placeholder="{{ 'Filter' | translate}}">
  </div>
</div>

<i>{{ items.length }} {{ "items" | translate }}</i>
<table class="table table-striped table-bordered table-hover">
  <thead>
    <tr>
      <th class="minimum">
        <translate>Closed</translate>
      <th>
        <translate>Agenda item</translate>
      <th os-perms="agenda.can_manage">
        <translate>Duration</translate>
      <th os-perms="agenda.can_manage core.can_manage_projector" class="minimum">
        <translate>Actions</translate>
  <tbody>
    <tr ng-repeat="node in flattenedTree | filter: filter.search"
        ng-class="{ 'activeline': (items | filter: {id: node.id})[0].isProjected() }">
      <td><input type="checkbox" ng-model="(items | filter: {id: node.id})[0].closed" ng-click="save(node.id)">
      <td>
        <span ng-repeat="n in [].constructor(node.level) track by $index">&ndash;</span>
        <a ui-sref="agenda.item.detail({id: node.id})">
          {{ (items | filter: {id: node.id})[0].item_number }}
          {{ (items | filter: {id: node.id})[0].title }}
        </a>
        <div ng-if="(items | filter: {id: node.id})[0].comment">
          <small><i class="fa fa-info-circle"></i> {{ (items | filter: {id: node.id})[0].comment }}</small>
        </div>
      <td os-perms="agenda.can_manage" class="optional">
        <a href="#" editable-number="(items | filter: {id: node.id})[0].duration" e-min="1" onaftersave="save(node.id)">
          {{ (items | filter: {id: node.id})[0].duration }}
        </a>
        <span ng-if="(items | filter: {id: node.id})[0].duration" translate>min</span>
      <td os-perms="agenda.can_manage core.can_manage_projector" class="nobr">
        <!-- project -->
        <a os-perms="core.can_manage_projector" class="btn btn-default btn-sm"
            ng-class="{ 'btn-primary': (items | filter: {id: node.id})[0].isProjected() }"
            ng-click="(items | filter: {id: node.id})[0].project()"
            title="{{ 'Project item' | translate }}">
          <i class="fa fa-video-camera"></i>
        </a>
        <!-- edit -->
        <a ui-sref="agenda.item.detail.update({id: node.id })" os-perms="agenda.can_manage"
            class="btn btn-default btn-sm"
            title="{{ 'Edit' | translate}}">
          <i class="fa fa-pencil"></i>
        </a>
        <!-- delete -->
        <a os-perms="agenda.can_manage" class="btn btn-danger btn-sm"
            ng-bootbox-confirm="Are you sure you want to delete
              <b>{{ (items | filter: {id: node.id})[0].title }}</b>?"
            ng-bootbox-confirm-action="delete(node.id)"
            title="{{ 'Delete' | translate }}">
          <i class="fa fa-trash-o"></i>
        </a>
</table>
