Warning: Can't synchronize with repository "(default)" (/home/git/ome.git does not appear to be a Git repository.). Look in the Trac log for more information.
Notice: In order to edit this ticket you need to be either: a Product Owner, The owner or the reporter of the ticket, or, in case of a Task not yet assigned, a team_member"

Task #7340 (closed)

Opened 12 years ago

Closed 12 years ago

P/D/I tree as jQuery plugin.

Reported by: wmoore Owned by: wmoore
Priority: major Milestone: Unscheduled
Component: Web Version: n.a.
Keywords: n.a. Cc: atarkowska, cxallan, saloynton
Resources: n.a. Referenced By: n.a.
References: n.a. Remaining Time: n.a.
Sprint: n.a.

Description (last modified by 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.

In the above example, icons would need to be specified in the tree itself. Currently the data_tree looks like:

<ul>
    <li id="experimenter-0" rel="experimenter"><a href="#">Will Moore</a>
        <ul>
            <li id='project-151' rel="project"><a href="#">big images <span id="counter-project-151">[3]</span></a>
                <ul>
                    <li id='dataset-151' rel="dataset" class="jstree-closed">
                        <a href="#">
                            Beta set
                            <span id="counter-dataset-151">[7
                                <span id="page-dataset-151"></span>]
                            </span>
                        </a>
                    </li>
...etc              

This might need to include more 'dynamic' attributes of each node, E.g:

<li icon="{{ STATIC_WEBCLIENT_PREFIX }}image/folder_image_locked16.png}}" 
    delete_node = "{% if eContext.isLeader %}true{% else %}false{% endif %}" >

Change History (2)

comment:1 Changed 12 years ago by wmoore

  • Description modified (diff)

comment:2 Changed 12 years ago by wmoore

  • Resolution set to fixed
  • Status changed from new to closed

Much of this work has been done (E.g. tree selection listeners), but making the jsTree easier to customise requires more thought.

Especially since it is under development with Groups and Experimenters being added soon.

Closing this ticket now

Note: See TracTickets for help on using tickets. You may also have a look at Agilo extensions to the ticket.

1.3.13-PRO © 2008-2011 Agilo Software all rights reserved (this page was served in: 0.68580 sec.)

We're Hiring!