{% extends "webgateway/base/container2.html" %}
{% load i18n %}


{% comment %}
<!--
  Copyright (C) 2011 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 script %}
    <!--
        This template is no-longer used by omero-web
        Since it will be removed soon, we need to be sure that any users are warned:
    -->
    <script>alert("WARNING: Django template webclient/base/base.html has been deprecated")</script>

    {{ block.super }}
    <!-- required for the script_launch html below -->
    {% include "webclient/base/includes/script_launch_head.html" %}

    <script type="text/javascript" src="{% static "webclient/javascript/ome.webclient.actions.js"|add:url_suffix %}"></script>

    <!-- The following are required by the right-hand panel, E.g. annotations/metadata_general.html -->
    <script src="{% static 'webclient/javascript/jquery.infieldlabel-0.1.js' %}" type="text/javascript"></script>
    <script type="text/javascript" src="{% static "3rdparty/jquery.quicksearch-1.0.js" %}"></script>
    <script type="text/javascript" src="{% static "webclient/javascript/jquery.editinplace-0.1.2.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/jquery.form-4.3.0.js" %}"></script>
    <script type="text/javascript" src="{% static "webclient/javascript/ome.tagging_form.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webclient/javascript/ome.progress_overlay.js"|add:url_suffix %}"></script>

    <!-- preview viewer... -->
    <script type="text/javascript" src="{% static "3rdparty/jquery.blockUI-2.66.0.js" %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.viewport.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.viewportImage.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.gs_slider.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.gs_utils.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.scalebardisplay.js"|add:url_suffix %}"></script>
    <link rel="stylesheet" type="text/css" href="{% static "3rdparty/JQuerySpinBtn-1.3a/JQuerySpinBtn.css" %}" />
    <link rel="stylesheet" type="text/css" href="{% static "webgateway/css/ome.colorbtn.css"|add:url_suffix %}" />
    <link rel="stylesheet" type="text/css" href="{% static "3rdparty/farbtastic-1.2/farbtastic.css" %}" media="all" />
    <link rel="stylesheet" type="text/css" href="{% static "webgateway/css/ome.postit.css"|add:url_suffix %}" />
    <script type="text/javascript" src="{% static "3rdparty/JQuerySpinBtn-1.3a/JQuerySpinBtn.js" %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.colorbtn.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/omero_image.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.smartdialog.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/aop-1.3.js" %}"></script>
    <script type="text/javascript" src="{% static "webgateway/js/ome.postit.js"|add:url_suffix %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/farbtastic-1.2/farbtastic.js" %}"></script>


    <!-- ...including big images -->
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/utils.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/PanoJS.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/controls.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/pyramid_Bisque.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/pyramid_imgcnv.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/pyramid_Zoomify.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/control_thumbnail.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/control_info.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/control_svg.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/control_roi.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/panojs-2.0.0/control_scalebar.js" %}"></script>
    <script type="text/javascript" src="{% static "3rdparty/jquery.mousewheel-3.1.13.js" %}"></script>

    <!-- hammer.js for tablet gestures -->
    <script type="text/javascript" src="{% static "3rdparty/hammer-2.0.8/hammer.min.js" %}"></script>

    <link rel="stylesheet" type="text/css" href="{% static "3rdparty/panojs-2.0.0/panojs.css" %}" media="all" />
    <link rel="stylesheet" href="{% static "webgateway/css/ome.gs_slider.css"|add:url_suffix %}" type="text/css" media="screen"/>
    <link rel="stylesheet" href="{% static "webgateway/css/ome.viewport.css"|add:url_suffix %}" type="text/css" media="screen"/>

    <script>
        $(document).ready(function(){

            // setup in-line labels on top search field
            $("#top_search_field label").inFieldLabels();

            // initially hidden
            $("#user_dropdown ul").css('visibility', 'hidden');
            // show on click
            $("#show_user_dropdown").on('click', function(e) {
                
                $("ul", $(this).parent()).css('visibility', 'visible');
                e.preventDefault();
                return false;
            });
            // on hover-out, hide drop-down menus
            $("#user_dropdown ul").hover(function(){}, function(){
                $(this).css('visibility', 'hidden');
            });
        });
    </script>
    
    <!-- keep-alive ping so that OMERO session doesn't die -->
    {% include "webclient/base/includes/ping.html" %}

    <!-- set-up right panel tabs -->
    {% include "webclient/data/includes/right_plugin.general.js.html" %}

    <!-- include scripts for loading data into right-hand tabs -->
    <!-- these are configured in settings.py under "omero.web.ui.right_tabs" -->
    {% for rt in ome.right_plugins %}
        {% include rt.include %}
    {% endfor %}


{% endblock %}


{% block middle_header_left %}
    {% include "webclient/base/includes/menu.html" %}
{% endblock %}


{% block middle_header_right %}


        <!-- Global Tools -->
        <ul class="header_toolbar" id="script_notifications">
                {% include "webclient/base/includes/script_launch.html" %}
            {% include "webclient/base/includes/activities_info.html" %}
        </ul>
        
        <!-- Global Search -->
        {% include "webclient/base/includes/search_field.html" %}
        
        <!-- User Dropdown -->
        {% include "webclient/base/includes/user_dropdown.html" %}
{% endblock %}






{% block right %}
<div>
    <div id="annotation_tabs" class="absolute_fill">
        <ul id="annotation_tabs_list">
            <li><a href="#metadata_general">{% trans "General" %}</a></li>
            <!-- include right tabs, as configured in settings.py under "omero.web.ui.right_tabs" -->
            {% for rt in ome.right_plugins %}
                <li><a href="#{{ rt.plugin_id }}">{{ rt.label }}</a></li>
            {% endfor %}
        </ul>
        <div id="metadata_general" class="right_tab_content"></div>
        <!-- include right tab bodies, as configured in settings.py under "omero.web.ui.right_tabs" -->
        {% for rt in ome.right_plugins %}
            <div id="{{ rt.plugin_id }}" class="right_tab_content" style="padding:10px"></div>
        {% endfor %}
    </div>
</div>
{% endblock %}
