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


<link rel="stylesheet" href="{% static "webclient/css/layout.css" %}" type="text/css" media="screen"/>

<link rel="stylesheet" type="text/css" href="{% static "3rdparty/panojs/panojs.css" %}" media="all" />

<link rel="stylesheet" href="{% static "webgateway/css/ome.gs_slider.css" %}" type="text/css" media="screen"/>
<link rel="stylesheet" href="{% static "webgateway/css/ome.viewport.css" %}" type="text/css" media="screen"/>


<script>
/**
 * This script is included in the main containers.html page as well as the container_tags.html and public.html pages,
 * adding itself as a selection listener to the jsTree in each case.
 * It loads appropriate data into the middle panel on selection changes in the jsTree.
 * For the main containers.html page, it also responds to switching between 'plugins'
**/

$(document).ready(function() {
    
    // this script is an 'include' within a django for-loop, so we can get our index:
    var fullviewer_plugin_index = {{ forloop.counter }};
    
    var update_dataset_full_viewer = function() {
        
        // this may have been called before datatree was initialised...
        var datatree = $.jstree._focused();
        if (!datatree) return;
        
        // get the selected id etc
        var selected = datatree.data.ui.selected;
        var oid = selected.attr('id');
        var orel = selected.attr('rel').replace("-locked", "");
        
        // if the tab is visible and not loaded yet...
        $full_viewer_panel = $("#full_viewer_panel");
        
        //var full_viewer_url;
        if ($full_viewer_panel.is(":visible") && $full_viewer_panel.is(":empty")) {
            // if image(s) selected, show typical full viewer directly
            full_viewer_url = '{% url 'webtest_index' %}img_detail/'+ oid.split("-")[1] + "/";
            $full_viewer_panel.load(full_viewer_url);
            
            // example of loading viewer directly
            //$('<div class="miniview" id="full-viewport"></div>').appendTo($full_viewer_panel);
            //var viewport = $.WeblitzViewport($("#full-viewport"), "{% url 'webindex' %}", {'mediaroot': '{{ STATIC_URL }}' } );
            //viewport.load(oid.split("-")[1]);
            
        };
    };
    
    // update plugin when we switch between plugins
    $('#center_panel_chooser').bind('center_plugin_changed.ome', update_dataset_full_viewer);

    // on change of selection in tree, update which plugins are enabled
    $("#dataTree").bind("select_node.jstree deselect_node.jstree", function(e, data) {

        // clear contents of all panels
        $("#full_viewer_panel").empty();

        var selected = data.inst.get_selected();
        if (selected.length == 0) {
            OME.set_center_plugin_enabled(fullviewer_plugin_index, false);
            return;
        }
        var orel = selected.attr('rel').replace("-locked", "");

        // update enabled state... split-view supports multiple 'image' or single dataset
        if ((orel=="image") && (selected.length === 1)) {
            OME.set_center_plugin_enabled(fullviewer_plugin_index, true);
            // update tab content
            update_dataset_full_viewer();
        } else {
            // otherwise, disable this option
            OME.set_center_plugin_enabled(fullviewer_plugin_index, false);
        }

    });

});

</script>

