{% extends "repo_master.html" %}

{% set tag = "groups" %}

{% block header %}
<link nonce="{{ g.nonce }}" rel="stylesheet" href="{{
  url_for('static', filename='vendor/selectize/selectize.bootstrap3.css') }}?version={{ g.version}}"/>
{% endblock %}

{% block title %}Add group - {{
    repo.namespace + '/' if repo.namespace }}{{ repo.name }}{% endblock %}


{% block repo %}

<div class="row col-sm-8 col-sm-offset-2">
  <div class="card">
    <div class="card-header" id="card-topic">
      <strong>Add group to the {{repo.name}} project</strong>
    </div>
    <div class="card-block">
      <form action="{{
        url_for('ui_ns.add_group_project',
            username=username, repo=repo.name, namespace=repo.namespace)
        }}" method="post">

      <fieldset class="form-group">
        <label for="group"><strong>Group Name</strong></label>
        <input class="form-control" name="group" id="group"
          placeholder="Start typing to search groups" value=""/>
        <select class="form-control" id="access" name="access">
          {% for access in access_levels %}
            <option value="{{ access }}" id="{{ access }}"> {{ access }} </option>
          {% endfor %}
        </select>
      </fieldset>

      <p class="buttons indent">
        <input type="button" value="Cancel" class="btn btn-secondary cancel_btn">
        <input type="submit" class="btn btn-primary" id="add_update_button" value="Add">
        {{ form.csrf_token }}
      </p>
    </form>
    <p class="center"> <strong>Access Levels</strong> </p>
    <p class="justify">
    <strong>Ticket</strong>: A user or a group with this level of access can only edit metadata
      of an issue. This includes changing the status of an issue, adding/removing
      tags from them, adding/removing assignees and every other option which can
      be accessed when you click "Edit Metadata" button in an issue page. However,
      this user can not "create" a new tag or "delete" an existing tag because,
      that would involve access to settings page of the project which this user
      won't have. It also won't be able to "delete" the issue because, it falls
      outside of "Edit Metadata".
    </p>
    <p class="justify">
    <strong>Commit</strong>: A user or a group with this level of access can do everything what
      a user/group with ticket access can do + it can do everything on the project
      which doesn't include access to settings page. It can "Edit Metadata" of an issue
      just like a user with ticket access would do, can merge a pull request, can push
      to the main repository directly, delete an issue, cancel a pull request etc.
    </p>
    <p class="justify">
    <strong>Admin</strong>: The user/group with this access has access to everything on the project.
      All the "users" of the project that have been added till now are having this access.
      They can change the settings of the project, add/remove users/groups on the project.
    </p>
    </div>
  </div>
</div>

{% endblock %}

{% block jscripts %}
{{ super() }}
<script type="text/javascript" nonce="{{ g.nonce }}" src="{{
    url_for('static', filename='vendor/selectize/selectize.min.js') }}?version={{ g.version}}"></script>

<script type="text/javascript" nonce="{{ g.nonce }}">
function set_up_group_list(url, query, callback) {
  $.getJSON(
      url, {
      pattern: query.term
    },
    function( data ) {
      callback( data.groups.map(function(x) { return { group: x }; }) );
      if (data.pagination.next){
        set_up_group_list(data.pagination.next, query, callback)
      }
    }
  );
}

$( document ).ready(function() {
  var group_to_update = "{{ group_to_update }}";
  if (!group_to_update || group_to_update === "None") {
    $('#group').selectize({
        valueField: 'group',
        labelField: 'group',
        searchField: 'group',
        maxItems: 1,
        create: {{ (not config.get('ENABLE_GROUP_MNGT', False)) | lower }},
        load: function(query, callback) {
          if (!query.length){
            return callback();
          } else {
            set_up_group_list("{{ url_for('api_ns.api_groups') }}", query, callback);
          }
        }
    });
  } else {
    $("#group").attr("value", group_to_update);
    $("#group").attr("readonly", true);
    var group_access = "{{ group_access }}";
    if (group_access !== "None") {
      $("#" + "{{ group_access.access }}").attr("selected", "selected");
    }
    $("#card-topic").html("<strong>Update group access in {{repo.name}}</strong>");
    $("#add_update_button").attr("value", "Update");
  }
});
</script>
{% endblock %}