P/D/I tree as jQuery plugin.

[wmoore]

Would be nice to separate out the variables from the jsTree, so that the containers.html page becomes a little cleaner. Also try to decouple the jsTree from events that are fired on selection changes etc.

E.g. sample code:

var pid_data = "{% url load_data %}";
var select = "{% if init.initially_select %}"{{ init.initially_select }}"{% else %}"experimenter-0"{% endif %}";
var open = ["{% for p in init.initially_open %}"{{ p }}",{% endfor %} "experimenter-0"];
var pdiTree = $("#dataTree").pdiTree(pid_data, select, open);
pidTree.bind("select_node.jstree", function (e, data) {
   // update toolbar etc
};

When new pages are loaded into center or right-hand panels, they can also register for selection changes:

// called after page has loaded
$("#dataTree").bind("select_node.jstree", function (e, data) {
   // update thumbnail selection etc.
};

// called when user selects thumbnails etc
var branch = datatree._get_children('#'+$('#content_details').attr('rel'));
var selectee = $(branch[selIndex]);
datatree.select_node(selectee);

This should allow 3rd parties to extend webclient with their own pages and have them fully update with selection etc.