7a6949d256eb4329de0a6cc7e0c2ae0da35b6bf0 braney Fri Oct 20 14:05:15 2017 -0700 add + and - icons in front of tracks to make it easier to copy them into a collection or delete them from a collection diff --git src/hg/js/hgCollection.js src/hg/js/hgCollection.js index 0498161..aafb290 100644 --- src/hg/js/hgCollection.js +++ src/hg/js/hgCollection.js @@ -133,43 +133,45 @@ var ourTreeName = getUniqueName("tree"); var newName = "A New Collection"; var newDescription = "Description of New Collection"; var attributes = "shortLabel='" + newName + "' "; attributes += "longLabel='" + newDescription + "' "; attributes += "color='" + "#0" + "' "; attributes += "viewType='" + "track" + "' "; attributes += "visibility='" + "full" + "' "; attributes += "name='" + ourCollectionName + "' "; attributes += "class='" + "folder" + "' "; $('#collectionList').append("
  • A New Collection
  • "); $('#currentCollection').append("
    "); var newTree = $('#currentCollection div:last'); trees[ourCollectionName] = newTree; - $(newTree).jstree({ + newTree.jstree({ "core" : { "check_callback" : checkCallback }, 'plugins' : ['dnd', 'conditionalselect', 'contextmenu'], 'check_callback' : checkCallback, 'contextmenu': { "items" : currentCollectionItems}, 'dnd': {check_while_dragging: true} }); - $(newTree).on("select_node.jstree", selectTreeNode); - $(newTree).on("copy_node.jstree", function (evt, data) { + newTree.on("select_node.jstree", selectTreeNode); + newTree.on("copy_node.jstree", function (evt, data) { $(evt.target).jstree("open_node", data.parent); + $(evt.target).jstree("set_icon", data.node, 'fa fa-minus'); }); + newTree.on('click', '.jstree-themeicon ', minusHit); var lastElement = $("#collectionList li").last(); //lastElement.addClass("folder"); selectElements($("#collectionList"), lastElement) ; rebuildLabel(); } function hideAllTrees() { // hide all the trees in the Collected Tracks window for(var key in trees) trees[key].hide(); } function selectCollection(event, ui ) { // called with a collection is selected var id = ui.selected.id; @@ -268,30 +270,53 @@ top: event.pageY + "px", left: event.pageX + "px" }); return false; } function recordNames(tree) { // keep an accounting of track names that have been used var v = $(tree).jstree(true).get_json('#', {'flat': true}); for (i = 0; i < v.length; i++) { var z = v[i]; names[z.li_attr.name] = 1; } } + function plusHit(event, data) { + // called with the plus icon is hit + var treeObject = $(event.currentTarget).parent().parent(); + var id = treeObject.attr('id'); + var node = treeObject.jstree("get_node", id); + if (node.children.length === 0) { + var parentId = $(selectedTree).jstree("get_node", "ul > li:first").id; + isDirty = true; + $(selectedTree).jstree("copy_node", node, parentId,'last'); + } + } + + function minusHit (event, data) { + // called with the minus icon is hit + var treeObject = $(event.currentTarget).parent().parent(); + var id = treeObject.attr('id'); + var node = treeObject.jstree("get_node", id); + if (node.children.length === 0) { + isDirty = true; + $(selectedTree).jstree( "delete_node", node); + } + } + function init() { $body = $("body"); $(document).on({ ajaxStart: function() { $body.addClass("loading"); }, ajaxStop: function() { $body.removeClass("loading"); } }); $('.gbButtonGoContainer').click(submitForm); window.addEventListener("beforeunload", function (e) { if (!isDirty) return undefined; var confirmationMessage = 'Do you want to leave this page without saving?'; @@ -354,49 +379,52 @@ $("#currentCollection div").each(function(index) { var newTree = this; $(newTree).jstree({ 'plugins' : ['dnd', 'conditionalselect', 'contextmenu'], 'contextmenu': { "items" : currentCollectionItems}, 'dnd': { "check_callback" : checkCallback, } }); recordNames(newTree); trees[this.id] = $(newTree); $(newTree).on("select_node.jstree", selectTreeNode); $(newTree).on("copy_node.jstree", function (evt, data) { $(evt.target).jstree("open_node", data.parent); + $(evt.target).jstree("set_icon", data.node, 'fa fa-minus'); }); + $(newTree).on('click', '.jstree-themeicon ', minusHit); }); treeDiv=$('#tracks'); treeDiv.jstree({ 'plugins' : ['dnd', 'conditionalselect', 'contextmenu'], 'contextmenu': { "items" : currentTrackItems}, 'dnd': { "check_callback" : checkCallback, 'always_copy' : true, is_draggable: isDraggable, }, 'core' : { "check_callback" : checkCallback } }); - $(treeDiv).on("select_node.jstree", function (evt, data) { + treeDiv.on("select_node.jstree", function (evt, data) { $(evt.target).jstree("toggle_node", data.node); }); + treeDiv.on('click', '.jstree-themeicon ', plusHit); var firstElement = $("#collectionList li").first(); selectElements($("#collectionList"), firstElement) ; } function submitForm() { // Submit the form (from GO button -- as in hgGateway.js) // Show a spinner -- sometimes it takes a while for hgTracks to start displaying. $('.gbIconGo').removeClass('fa-play').addClass('fa-spinner fa-spin'); saveCollections(trees); } function updatePage(responseJson) { // called after AJAX call isDirty = false;