{% load i18n %}
{% load common_tags %}
{% load common_filters %}
{% load wikitags %}


{% comment %}
<!--
  Copyright (C) 2011-2017 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 %}


    <script type="text/javascript">
        $(document).ready(function() 
            {
                var acquisition_load = false;
                var preview_load = false;
                
                // handle submit of Add Comment form
                $("#add_share_comment_form").ajaxForm({
                    beforeSubmit: function(data) {
                        var textArea = $('#add_share_comment_form textarea');
                        if ($.trim(textArea.val()).length == 0) return false;
                    },
                    success: function(html) {
                        var $comment = $(html)
                        $('#share_comments_container').prepend( $comment ).show();
                        $(".removeComment", $comment).click(function(event) {
                            removeItem(event, "ann_comment_wrapper");
                        });
                        var textArea = $('#add_share_comment_form textarea');
                        textArea.val('');
                    },
                });

                $(".removeComment").click(function(event) {
                    removeItem(event, "ann_comment_wrapper");
                });
                
                // handle deleting of Tag, File, Comment
                // on successful delete via AJAX, the parent .domClass is hidden
                var removeItem = function(event, domClass) {
                    var removeId = $(event.target).attr('id');
                    var dType = removeId.split("-")[1]; // E.g. 461-comment
                    var annId = parseInt(removeId);
                    // /webclient/action/remove/comment/461/?parent=image-257
                    var parentId = $.trim($("#parent-id").text());
                    var url = '{% url 'manage_action_containers' "delete" %}'+ dType +'/'+ annId +'/';
                    var $parent = $(event.target).parents("."+domClass);
                    var $annContainer = $parent.parent();
                    var confirm_remove = OME.confirm_dialog('Remove '+ dType + '?',
                        function() {
                            if(confirm_remove.data("clicked_button") == "OK") {
                                $.ajax({
                                    type: "POST",
                                    url: url,
                                    data: {'parent':parentId},
                                    dataType:'json',
                                    success: function(r){
                                        if(eval(r.bad)) {
                                            alert(r.errs);
                                        } else {
                                            // simply remove the item (parent class div)
                                            $parent.remove();
                                        }
                                    }
                                });
                            }
                        }
                    );
                    return false;
                }
                
                // Edit share: launch dialog with edit-share form

                // AJAX handling of create-discussion form
                $("#edit_share_form").ajaxForm({
                    success: function(html) {
                        if ($.inArray(html, ["enable", "disable"]) > -1) {
                            $("#edit_share_form").empty().dialog( "close" ).attr("action", "#");
                            OME.share_selection_changed(
                                "{{ manager.share.getShareType }}-{{ manager.share.id }}");
                        } else {
                            $("#edit_share_form").html(html);
                        }
                    },
                });

                $("#edit_share_form").dialog({
                    autoOpen: false,
                    resizable: true,
                    height: 600,
                    width:450,
                    modal: true,
                    buttons: {
                        "Accept": function() {
                            // simply submit the form
                            $("#edit_share_form").submit();
                        },
                        "Cancel": function() {
                            $( this ).empty().dialog( "close" ).attr("action", "#");
                        }
                    }
                });

                {% if manager.share.id %}
                $("#editshareButton").click(function() {

                    $("#edit_share_form").dialog("open");
                    $("#edit_share_form").load(
                        "{% url 'manage_action_containers' 'edit' 'share' manager.share.id %}");
                    $("#edit_share_form").attr("action",
                        "{% url 'manage_action_containers' 'save' 'share' manager.share.id %}");
                });
                {% endif %}
            });
    </script>


    <!-- This is used by AJAX loading the right panel, to check it matches current selection -->
    <div id='object-id' style="display:none">{{manager.obj_type}}-{{ manager.obj_id }}</div>

        <!-- ANNOTATIONS "General" -->
        <div class="right_tab_inner">

            {% if manager.image %}

            {% with image=manager.image canDownload=manager.image.canDownload %}
                {% include "webclient/annotations/includes/toolbar.html" %}
            {% endwith %}


            <!-- panel for extra info shown by toolbar buttons if needed - Duplicated under well below -->
            <div id="toolbar_info_panel" style="display:none; background: #fff; border: solid 1px #ddd; margin:5px 0">
                <img title="Close" src="{% static 'webgateway/img/close.gif' %}" style="float:right; margin:3px"/>
                <div class="panel_title" style="margin: 4px">
                    <!-- text loaded here -->
                </div>
                <div class="panel_div"></div>
                <div style="clear:both"></div>
            </div>

            <div id="link_info_popup" class="info_popup" style="right:0px; top:30px; padding:4px; display:none">
                <input type="text" size="30">
                <img title="Close" src="{% static 'webgateway/img/close.gif' %}" />
            </div>

            <!-- Image Name, ID, owner -->
            {% with obj=manager.image nameText=manager.image.name %}
                {% include "webclient/annotations/includes/name.html" %}
            {% endwith %}

            <hr/><!-- Temporary Solution. Not the right way to add borders to elements! -->

            <!-- Image Description -->
            {% with obj=manager.image %}
                {% include "webclient/annotations/includes/description.html" %}
            {% endwith %}

            <!-- Include table of core metadata, Owner, SizeX,Y,Z, Channels etc -->
            {% with image=manager.image %}
                {% include "webclient/annotations/includes/core_metadata.html" %}
            {% endwith %}

            {% endif %}

            {% if manager.share %}
                <h2>{{ manager.share.getShareType }} <strong>{{ manager.share.id }}</strong>
                    {% if manager.share.isOwned %}
                        <input id="editshareButton" class="button" type="image" src="{% static 'webclient/image/color_line16.png' %}" alt="Edit Share" title="Edit Share">
                        </a>
                    {% endif %}</h2>

				<hr/>
				
                <div class="description">
                    <div class="data_heading">
						<p><span>{{ manager.share.message|default:""|escape|linebreaks }}</span></p>
					</div>
                </div>

                <table>
                    <tr>
                        <th>Owner:</th>
                        <td id='owner_fullname'>{{ manager.share.getOwner.getFullName }}</td>
                    </tr>
                    <tr>
                        <th>Status:</th>
                        <td id='status'>{% if manager.share.isExpired %}EXPIRED{% else %}{% if manager.share.active %}ACTIVE{% else %}NOT ACTIVE{% endif %}{% endif %}</td>
                    </tr>
                    <tr>
                        <th>Creation Date:</th>
                        <td id='creation_date'>{{ manager.share.getStartDate|date:"Y-m-d H:i:s" }}</td>
                    </tr> 
                    <tr>
                        <th>Expiry Date:</th>
                        <td id='creation_date'>{{ manager.share.getExpireDate|date:"Y-m-d H:i:s" }}</td>
                    </tr>                   
                    <tr>
                        <th>Share Count:</th>
                        <td id='child_count'>{{ manager.share.itemCount }} {% plural manager.share.itemCount 'image' 'images' %}</td>
                    </tr>
                    <tr>
                        <th colspan="2">Members:</th>
                    </tr>
                    <tr>
                        <td id='members' colspan="2">
                            <ol>
                                {% for m in manager.allInShare %}
                                <li>{{ m.getFullName }}</li>
                                {% endfor %}
                            </ol>
                        </td>
                    </tr>
                </table>
            
        
            <!-- ANNOTATIONS -->
            <h1>{% trans "Annotations" %}</h1>
            
            <table>
                <!-- SHARE COMMENT -->
                {% if ome.can_create %}
                <tr>
                    <th colspan="3"> 
                        {% trans "Comment:" %}
                        {% if manager.share.isExpired %}
                            This {{ manager.share.getShareType|lower }} has expired and you no longer can make any comments.
                        {% else %}
                        <form id="add_share_comment_form" action="{% url 'annotate_comment' %}" method="post">{% csrf_token %}
                        <table>
                            <tr class="hiddenField"><td>{{ form_comment.share }}</td></tr>
                            <tr>
                                <td>{{ form_comment.comment }}</td>
                            </tr>
                            <tr>
                                <td><input type="submit" value="{% trans 'Add Comment' %}" /></td>
                            </tr>
                        </table>
                        </form>
                        {% endif %}
                    </th>
                </tr>
                {% endif %}
                <tr>
                    <td colspan="3">
                        <div id="share_comments_container" class="lncomments">
                            {% for tann in manager.comments %}
                                {% include "webclient/annotations/comment.html" %}
                            {% endfor %}
                        </div>
                    </td>
                </tr>            
            </table>
            {% endif %}         
            <div class="clear"></div>          

        </div>


    {% if manager.share.id %}
    <!-- hidden form for edit share - shown in dialog & loaded by AJAX -->
    <form id="edit_share_form" action="#" method="post" title="Edit Share" class="standard_form">{% csrf_token %}
    </form>
    {% endif %}
