treeview

[hongsudt]

Prototype a tree-view app that dynamically get terms, term path (Part_Of), and additional metadata about the terms from ermrest and render it in a treeview presentation.

We will use gudmap data for this prototype..

• Terms: Anatomy table
• Path: Anatomy.Part_Of. T

The current code for treeview can be found in rbk-project/treeview. The code should be moved to this repo.

Existing examples:

• The current static treeview can be found at www.gudmap.org/treeview
• The legacy treeview can be found at
  http://legacy.gudmap.org/gudmap/pages/ish_submission.html?id=GUDMAP%3A9140

[hongsudt]

Here is the current tree:
https://dev.rebuildingakidney.org/~dhanashri/deriva-webapps/treeview/jstree/treelist.html

What I would like to have done next are:

• When I search a term, the search doesn't auto-scroll to where the first occurrence of the term.
• For the tree without annotation, add a white space margin (maybe 5-10 pixels)
• For the one with annotation, I would like to use the same styling as recordset for the separator. We have a white area (with <-> to indicate that it is movable), not just the blueline.
• Add another url parameter e.g. refresh=1 that indicates whether to read from json file or go directly to the server to fetch the tree info.. Then we can either render the tree from a cache (json) or dynamically
• There is still a minor problem of --- ---- on the leaf nodes.. E.g. the lines are not connected.

[dhanashritidke]

Following are the tasks in Queue -

1. Remove the big loading icon that is displayed before the treeview is displayed.
2. Resolve the Firefox issue where clicking on + icon causes the view to be scrolled to top.
3. Time Range functionality -
   i) Design a mock up for this new feature request.
   ii) Get the data from table "Common_Developmental_Stage" for Mouse and render the tree dynamically.
4. Optimisation of the dynamically generated treeview.

[dhanashritidke]

Folllowing are the ermrest calls to get data for Theiler Stage Drop-down and corresponding tree data:

1. Drop down data : 'https://dev.rebuildingakidney.org/ermrest/catalog/2/attribute/M:=Vocabulary:Developmental_Stage/Stage_Type=gudmap-rbk-local%3A14-62FM/Ordinal:=M:Ordinal,TS:=M:Equivalent_Theiler_Stage@sort(Ordinal)'
2. Tree data:
   'https://dev.rebuildingakidney.org/ermrest/catalog/2/attribute/M:=Vocabulary:Anatomy_Part_Of_Relationship/F1:=left(Subject)=(Vocabulary:Anatomy:id)/Subject_Starts_at_Ordinal:=left(Starts_At)=(Vocabulary:Developmental_Stage:name)/Ordinal::leq::'+TS_val+'/$F1/Subject_Ends_At_Ordinal:=left(Ends_At)=(Vocabulary:Developmental_Stage:name)/Ordinal::geq::'+TS_val+'/$M/F2:=left(Object)=(Vocabulary:Anatomy:id)/Object_Starts_at_Ordinal:=left(Starts_At)=(Vocabulary:Developmental_Stage:name)/Ordinal::leq::'+TS_val+'/$F2/Object_Ends_At_Ordinal:=left(Ends_At)=(Vocabulary:Developmental_Stage:name)/Ordinal::geq::'+TS_val+'/$M/subject_dbxref:=M:Subject,object_dbxref:=M:Object,subject:=F1:name,object:=F2:name'

[dhanashritidke]

As per last discussion, following changes have been done:

1. Drop-down should not float on the div on scroll.
2. Remove comments in code to include logic for "specimen_rid" in url.
3. Change description to name attribute in drop down.
4. Change style of drop down to make it inline with the input and other buttons.

[dhanashritidke]

As per last discussion, following changes have been done:

1. Style of input and action group items modified.
2. Disable stage and display data for the stage corresponding to "specimen_rid" in url.
3. In case of "specimen_rid", focus on the term with annotation on load of tree.
4. Error handling in case there is no stage associated with the specimen_rid.
5. Double scroll bar issue fixed.
6. Scroll bar shift to right issue fixed.
7. Scroll to top button styling fixed.

[jrchudy]

An update on the state of treeview and what tasks are on the list for future development:

• terms are properly annotated including Density_Magnitude and Strength_Modifier
• Annotated terms and their ancestors are highlighted when Specimen_RID is specified
  • auto scroll to that content
  • collapsing ancestors keeps the row highlighting on the ancestors
• legend sections are collapsible
• tooltips for notes show when clicked (and hover)

Functionality to implement:

• more error handling
  • if mouse but no stage
    • show All TS
    • show soft warning
  • no annotated terms with Specimen_RID present
    • show appropriate TS
    • show soft warning
• EMAPA id next to terms
• UX changes:
  • experiment age next to TSXX value (Approximate_Equivalent_Age?)
  • fixed width for left panel?
  • whitespace between search and tree
  • expand/collapse buttons should be moved to next line if content is "skinny"
• incorporate image icon to show thumbnails
  --RELEASE--
• more details hover pop-up in treeview before navigating to record app
  • what content should be in here (look at legacy)
• configurable and generic (what should be configuration and what should be url query param)
• cacheing of treeview when RT is collapsed in record app
  • discussion from standup pending...
• performance of loading treeview (either fetching data and/or loading the html and app)
• cacheing of JSON data

[jrchudy]

Reassigning this issue to @hongsudt so it can be moved to the appropriate pipeline for the rest of the bullet points.

[jrchudy]

Opened issue #107 to take care of the tasks not completed from the comment above.