[% WRAPPER layout.tt title="Project $project.name" %]
[% PROCESS common.tt %]

<ul class="nav nav-tabs">
  [% IF c.user_exists %]
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">Actions</a>
      <div class="dropdown-menu">
        [% INCLUDE menuItem title="Edit configuration" icon="icon-edit" uri=c.uri_for(c.controller('Project').action_for('edit'), c.req.captures) %]
        [% INCLUDE menuItem title="Delete this project" icon="icon-trash" uri="javascript:deleteProject()" %]
        [% UNLESS project.declfile %]
          [% INCLUDE menuItem title="Create jobset" icon="icon-plus" uri=c.uri_for(c.controller('Project').action_for('create_jobset'), c.req.captures) %]
        [% END %]
      </div>
    </li>
  [% END %]

  <li class="nav-item"><a class="nav-link active" href="#tabs-project" data-toggle="tab">Jobsets</a></li>
  <li class="nav-item"><a class="nav-link" href="#tabs-configuration" data-toggle="tab">Configuration</a></li>
</ul>

<div class="tab-content">

  <script type="text/javascript">
    function showJobsets() {
      var showHidden = $('#show-hidden').hasClass('active');
      var showDisabled = $('#show-disabled').hasClass('active');
      $('tr.jobset').map(function() {
        var hide =
          ($(this).hasClass('hidden-jobset') && !showHidden) ||
          ($(this).hasClass('disabled-jobset') && !showDisabled);
        if (hide) $(this).hide(); else $(this).show();
      });
      return false;
    };

    $(document).ready(function() {
      $('#show-hidden, #show-disabled').on('click', function(e) {
        $(this).toggleClass('active');
        showJobsets();
        return false;
      });

      showJobsets();
    });
  </script>

  <div id="tabs-project" class="tab-pane active">
    [% IF project.jobsets %]
      <div class="row">
        <div class="col">
          This project has the following jobsets:
        </div>
        <div class="col-auto">
          <label id="show-disabled" class="btn btn-secondary" data-toggle="button">Show disabled jobsets</label>
          [% IF isProjectOwner %]
            <label id="show-hidden" class="btn btn-secondary" data-toggle="button">Show hidden jobsets</label>
          [% END %]
        </div>
      </div>
      [% INCLUDE renderJobsetOverview %]
    [% ELSE %]
      <p>No jobsets have been defined yet.</p>
    [% END %]
  </div>

  <div id="tabs-configuration" class="tab-pane">
    <table class="info-table">
      <tr>
        <th>Display name:</th>
        <td>[% HTML.escape(project.displayname) %]</td>
      </tr>
      <tr>
        <th>Description:</th>
        <td>[% HTML.escape(project.description) %]</td>
      </tr>
      <tr>
        <th>Homepage:</th>
        <td>
          [% IF project.homepage %]
            <a [% HTML.attributes(href => project.homepage) %]>[% HTML.escape(project.homepage) %]</a>
          [% ELSE %]
            <em>(not specified)</em>
          [% END %]
        </td>
      </tr>
      <tr>
        <th>Owner:</th>
        <td><tt>[% HTML.escape(project.owner.username) %]</tt></td>
      </tr>
      <tr>
        <th>Enabled:</th>
        <td>[% project.enabled ? "Yes" : "No" %]</td>
      </tr>
      <tr>
        <th>Enable Dynamic RunCommand Hooks:</th>
        <td>[% c.config.dynamicruncommand.enable ? project.enable_dynamic_run_command ? "Yes" : "No (not enabled by project)" : "No (not enabled by server)" %]</td>
      </tr>
    </table>
  </div>

</div>

<script>
  function deleteProject() {
    bootbox.confirm(
      'Are you sure you want to delete this project?',
      function(c) {
        if (!c) return;
        redirectJSON({
          url: "[% c.uri_for('/project' project.name) %]",
          type: 'DELETE'
        });
      });
  };
</script>

[% END %]