{% extends "webadmin/base.html" %}
{% load i18n %}
{% load common_filters %}


{% comment %}
<!--
  Copyright (C) 2011-2014 University of Dundee & Open Microscopy Environment.
  All rights reserved.

  This program is free software: you can redistribute it and/or modify
  it under the terms of the GNU Affero General Public License as
  published by the Free Software Foundation, either version 3 of the
  License, or (at your option) any later version.

  This program is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  GNU Affero General Public License for more details.

  You should have received a copy of the GNU Affero General Public License
  along with this program.  If not, see <http://www.gnu.org/licenses/>.
-->
{% endcomment %}

{% block link %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static "webadmin/css/picklist.css"|add:url_suffix %}" type="text/css" media="screen"/>
    <link rel="stylesheet" href="{% static '3rdparty/jquery.chosen-1.8.7/chosen.css' %}" type="text/css" media="screen"/>
    <link rel="stylesheet" href="{% static 'webadmin/css/chosen.css'|add:url_suffix %}" type="text/css" media="screen"/>
{% endblock %}

{% block title %}
{% if gid %}
    {% trans "Edit group" %}
{% else %}
    {% trans "Add group" %}
{% endif %}
{% endblock %}

{% block script %}
    {{ block.super }}
    <script type="text/javascript" src="{% static '3rdparty/jquery.chosen-1.8.7/chosen.jquery.js' %}"></script>
    <script type="text/javascript">
        $(document).ready(function() 
            {
                
                var highlightCurrent = function() {
                    var userId = {{ userId }};
                    var selected = $.grep($('#id_members').data('chosen').results_data, function(item){
                        return item.value == userId;
                    });
                    $("#id_owners_chosen a[data-option-array-index='"+selected[0].options_index+"']").parent().addClass('search-choice-current');
                    $("#id_members_chosen a[data-option-array-index='"+selected[0].options_index+"']").parent().addClass('search-choice-current');
                }
                
                // Since we want to disable removal of 'system' users from chosen, this hides the 'X'
                var admins = {{ admins|jsonify|safe }};
                var hideSystemUserX = function() {
                    for (i=0; i<admins.length; i++) {
                        var optText = $("#id_members").find("option[value=" + admins[i] + "]").text(),
                            $system_li = $("#id_members_chzn").find("span:contains('"+optText+"')").parent();
                        $system_li.find('a').hide();
                    }
                }
                
                $("#id_owners").chosen({placeholder_text:'Type owner names to add...'});
                $("#id_members").chosen({placeholder_text:'Type member names to add...'}).on('change', function(evt, data) {
                    if (data && data.deselected) {
                        var selected = $.grep($('#id_owners').data('chosen').results_data, function(item){
                            if(item.selected && item.value === data.deselected) {
                                $('#id_owners option[value='+data.deselected+']').prop('selected', false);
                                $("#id_owners").trigger("chosen:updated");
                                highlightCurrent();
                            }
                        });
                    }
                    hideSystemUserX();
                });
                
                highlightCurrent();
                hideSystemUserX();
                
                $('#id_permissions_0').on('click', function(){
                    OME.confirm_dialog("Changing group to Private unlinks data from other users'" +
                                    " containers and unlinks other users' annotations from data." +
                                    " The change to Private will abort if different users' data" +
                                    " is too closely related to be separated.",
                        null, "WARNING", ['OK'], null, 200);
                });
                $('#id_permissions_3').on('click', function(){
                    OME.confirm_dialog("Read-Write groups allow members to delete other members' data. " +
                        "Follow the 'OMERO permissions' link below for full details.",
                        null, "WARNING", ['OK'], null, 180);
                });

        })
    </script>

{% endblock %}

{% block center_details %}

{{ block.super }}

<div class="one_column_content">
{% if gid %}
    <h1>{% trans "Edit group" %}</h1>
{% else %}
    <h1>{% trans "Add group" %}</h1>
{% endif %}

<h1><a href="{% url 'wagroups' %}" style="position:relative; top:-38px; float:right" title="Go Back to Groups">Cancel</a></h1>


{% if gid %}
    <form action="{% url 'wamanagegroupid' "save" gid %}"  class="standard_form settings_form" method="POST">{% csrf_token %}
{% else %}
    <form action="{% url 'wamanagegroupid' "create" %}" class="standard_form settings_form" method="POST">{% csrf_token %}
{% endif %}

        <p>{% trans "Fields marked in red are mandatory." %}</p>
        <br/>

        <div>
            {% for field in form %}
            {% if field.errors %}<div style="clear:both">{{ field.errors }}</div>{% endif %}
        
		    {% if field.field.required %}<span class="required">{{ field.label_tag }}</span>{% else %}{{ field.label_tag }}{% endif %}
		    {{ field }}
		
		    <div>{{ field.help_text|safe }}</div>
	        <br/>
    
            {% endfor %}  
            
            
            <input type="submit" 
                {% if not can_modify_group and not can_add_member or not ome.can_create %}
                    disabled title="You don't have permissions to edit Groups"
                {% endif %}
                value="{% trans 'Save' %}" />
            <div style="clear: both"></div>
        </div>
    </form>

    <p>
        Full details on various Permissions levels can be found on the 
        <a href="https://docs.openmicroscopy.org/latest/omero/sysadmins/server-permissions.html" target="new">
            OMERO Permissions
        </a>
        page.
    </p>
</div>
{% endblock %}
