{% extends "base.html" %}

{% block title %}{{ org.name }} settings{% endblock %}

{% block content %}

<div class="head"><h1>{{ org.name }} <small>organisation settings · <a href="/{{ org.name }}">repositories</a></small></h1></div>

<div class="sectioned">

<nav class="section-nav" aria-label="Sections">

  <a href="#general">General</a>

  <a href="#logo">Logo</a>

  <a href="#members">Members</a>

  <a href="#teams">Teams</a>

</nav>

<div class="sections">

{% if let Some(n) = notice %}<p class="note">{{ n }}</p>{% endif %}

{% if let Some(e) = error %}<p class="error">{{ e }}</p>{% endif %}

<form class="card" id="general" method="post" action="/orgs/{{ org.name }}/settings">

  <input type="hidden" name="_csrf" value="{{ shell.csrf }}">

  <label for="display_name">Display name</label><input type="text" id="display_name" name="display_name" value="{{ org.display_name }}">

  <label for="description">Description</label><input type="text" id="description" name="description" value="{{ org.description }}">

  <label for="default_role">Members' default role on the organisation's repositories</label>

  <select id="default_role" name="default_role">{% for r in ["none", "read", "triage", "write", "maintain", "admin"] %}<option value="{{ r }}"{% if org.default_role.as_str() == *r %} selected{% endif %}>{{ r }}</option>{% endfor %}</select>

  <button type="submit">SAVE</button>

</form>

<form class="card picture-card" id="logo" method="post" action="/orgs/{{ org.name }}/settings/avatar" enctype="multipart/form-data">

  <input type="hidden" name="_csrf" value="{{ shell.csrf }}">

  <h2>Logo</h2>

  <div class="picture-row">

    <img class="avatar xl" src="/avatar/{{ org.name }}?v={{ org.avatar }}" alt="{{ org.name }} logo" width="96" height="96">

    <div>

      <label for="logo-file">Upload a logo</label>

      <input type="file" id="logo-file" name="picture" accept="image/png,image/jpeg,image/webp">

      <p class="small mute">PNG (transparency is kept), JPEG or WebP, up to 5 MiB. It is cropped to the middle square and resized to 400×400.</p>

      <button type="submit" name="action" value="upload">UPLOAD</button>

      {% if !org.avatar.is_empty() %}<button type="submit" name="action" value="remove" class="danger-btn">REMOVE</button>{% endif %}

    </div>

  </div>

</form>

<section class="panel" id="members">

  <h2>Members</h2>

  <table class="small">{% for (a, r) in members %}<tr><td><a href="/{{ a.username }}">{{ a.username }}</a></td><td>{{ r }}</td>

  <td><form class="tiny" method="post" action="/orgs/{{ org.name }}/settings/members"><input type="hidden" name="_csrf" value="{{ shell.csrf }}"><input type="hidden" name="username" value="{{ a.username }}"><button name="remove" value="1">remove</button></form></td></tr>{% endfor %}</table>

  <form class="card" method="post" action="/orgs/{{ org.name }}/settings/members">

    <input type="hidden" name="_csrf" value="{{ shell.csrf }}">

    <div class="row"><div><label for="username">Account</label><input type="text" id="username" name="username" required></div>

    <div><label for="role">Role</label><select id="role" name="role"><option value="member">member</option><option value="owner">owner</option></select></div></div>

    <button type="submit">ADD OR CHANGE</button>

  </form>

</section>

<section class="panel" id="teams">

  <h2>Teams</h2>

  {% for (t, ms) in teams %}

  <p><strong>{{ t.name }}</strong>: {% for a in ms %}{{ a.username }}{% if !loop.last %}, {% endif %}{% endfor %}{% if ms.is_empty() %}<span class="mute">nobody yet</span>{% endif %}

  <form class="tiny" method="post" action="/orgs/{{ org.name }}/settings/teams"><input type="hidden" name="_csrf" value="{{ shell.csrf }}"><input type="hidden" name="team" value="{{ t.name }}"><button name="action" value="delete">delete team</button></form></p>

  {% endfor %}

  <form class="card" method="post" action="/orgs/{{ org.name }}/settings/teams">

    <input type="hidden" name="_csrf" value="{{ shell.csrf }}">

    <div class="row"><div><label for="team">Team</label><input type="text" id="team" name="team" required></div>

    <div><label for="tuser">Account (for add or remove)</label><input type="text" id="tuser" name="username"></div></div>

    <div class="choice"><button type="submit" name="action" value="create">CREATE TEAM</button> <button type="submit" name="action" value="add">ADD MEMBER</button> <button type="submit" name="action" value="remove">REMOVE MEMBER</button></div>

  </form>

</section>

</div>

</div>

{% endblock %}