[[ include ../_header ]]

	<h1>[[- project.name ]]</h1>

  <nav>
    <a href="/staff">home</a>
    <a href="/staff/users">users</a>
    <a href="/staff/projects">projects</a>
    <a href="/staff/media">media</a>
  </nav>
  
  <hr>

  <table>
    <tr>
      <td>
        <a href="/staff/projects/[[- project.slug ]]">[[- project.name ]]</a>
      </td>
      <td class="editLinks">
        <a href="/project/[[- project.slug ]]">[view]</a>
        <a href="/project/[[- project.slug ]]/edit">[edit]</a>
        <a href="/api/rooms/[[- project.slug ]]">[api]</a>
      </td>
      <td>
        [[- project.date ]]
      </td>
      <td>
        [[- project.privacy ? "private" : "" ]]
      </td>
    </tr>
    <tr>
      <td>
        [[ if (projectUser.photo) { ]]
          <a href="/staff/users/[[- projectUser.username ]]"><div style="background-image:url([[- projectUser.photo ]])" class="avatar"></div></a>
        [[ } ]]
        <a href="/staff/users/[[- projectUser.username ]]">[[- projectUser.username ]]</a>
      </td>
    </tr>
    <tr>
      <td colspan="999" class="description">
        "[[- project.description ]]"
      </td>
    </tr>
    <tr>
      <th>
        featured?
      </th>
      <td id="isFeaturedProject">
        [[- project.featured ? "yes" : "no" ]]
      </td>
    </tr>
  </table>

  <br><br>
  <div id="actions">
    <button id="toggle-featured" data-featured="[[- !! project.featured ]]">Feature this Project</button>
  </div>
  
  <br>
  <br>
  <table id="iframe-embed" class="projectList">
    <tr>
      <td class="border">
        <iframe src="/project/[[- project.slug ]]/view?noui=1&mute=1" class="embed"></iframe>
      </td>
    </tr>
  </table>
  <br>
  <br>

  <div class="json">
    [[- projectJSON ]]
  </div>

  <h2>Author</h2>

  <div class="json">
    [[- projectUserJSON ]]
  </div>

  <h2>Collaborators</h2>

  <div class="json">
    [[- collaborators.length ? collaboratorsJSON : '"no collaborators"' ]]
  </div>

[[ include ../_footer ]]