1 dojo.declare( 'JBrowse.View.TrackList.Simple', null, 2 3 /** @lends JBrowse.View.TrackList.Simple.prototype */ 4 { 5 6 /** 7 * Simple drag-and-drop track selector. 8 * @constructs 9 */ 10 constructor: function( args ) { 11 12 // make the track list DOM nodes and widgets 13 this.createTrackList( args.browser.container ); 14 15 // populate our track list (in the right order) 16 this.trackListWidget.insertNodes( 17 false, 18 args.trackConfigs 19 ); 20 21 // subscribe to drop events for tracks being DND'ed 22 dojo.subscribe( "/dnd/drop", 23 this, 24 function( source, nodes, copy, target ){ 25 if( target !== this.trackListWidget ) 26 return; 27 28 // get the configs from the tracks being dragged in 29 var confs = dojo.filter( 30 dojo.map( nodes, function(n) { 31 return n.track && n.track.config; 32 } 33 ), 34 function(c) {return c;} 35 ); 36 37 // return if no confs; whatever was 38 // dragged here probably wasn't a 39 // track 40 if( ! confs.length ) 41 return; 42 43 this.dndDrop = true; 44 dojo.publish( '/jbrowse/v1/v/tracks/hide', [confs] ); 45 this.dndDrop = false; 46 } 47 ); 48 49 // subscribe to commands coming from the the controller 50 dojo.subscribe( '/jbrowse/v1/c/tracks/show', 51 dojo.hitch( this, 'setTracksActive' )); 52 // subscribe to commands coming from the the controller 53 dojo.subscribe( '/jbrowse/v1/c/tracks/hide', 54 dojo.hitch( this, 'setTracksInactive' )); 55 }, 56 57 /** @private */ 58 createTrackList: function( renderTo ) { 59 var leftPane = dojo.create( 60 'div', 61 { id: 'trackPane', 62 style: { width: '10em' } 63 }, 64 renderTo 65 ); 66 67 //splitter on left side 68 var leftWidget = new dijit.layout.ContentPane({region: "left", splitter: true}, leftPane); 69 70 var trackListDiv = dojo.create( 71 'div', 72 { id: 'tracksAvail', 73 className: 'container handles', 74 style: { width: '100%', height: '100%', overflowX: 'hidden', overflowY: 'auto' }, 75 innerHTML: '<h2>Available Tracks</h2>' 76 }, 77 leftPane 78 ); 79 80 this.trackListWidget = new dojo.dnd.Source( 81 trackListDiv, 82 { 83 accept: ["track"], // accepts only tracks into left div 84 withHandles: false, 85 creator: function( trackConfig, hint ) { 86 var node = dojo.create( 87 'div', 88 { className: 'tracklist-label', 89 title: 'to turn on, drag into track area', 90 innerHTML: trackConfig.key 91 } 92 ); 93 //in the list, wrap the list item in a container for 94 //border drag-insertion-point monkeying 95 if ("avatar" != hint) { 96 var container = dojo.create( 'div', { className: 'tracklist-container' }); 97 container.appendChild(node); 98 node = container; 99 } 100 node.id = dojo.dnd.getUniqueId(); 101 return {node: node, data: trackConfig, type: ["track"]}; 102 } 103 } 104 ); 105 106 return trackListDiv; 107 }, 108 109 /** 110 * Given an array of track configs, update the track list to show 111 * that they are turned on. 112 */ 113 setTracksActive: function( /**Array[Object]*/ trackConfigs ) { 114 // remove any tracks in our track list that are being set as visible 115 dojo.forEach( trackConfigs || [], function( conf ) { 116 this.trackListWidget.forInItems(function(obj, id, map) { 117 if( conf.label === obj.data.label ) { 118 this.trackListWidget.delItem( id ); 119 var item = dojo.byId(id); 120 if( item && item.parentNode ) 121 item.parentNode.removeChild(item); 122 } 123 },this); 124 },this); 125 }, 126 127 /** 128 * Given an array of track configs, update the track list to show 129 * that they are turned off. 130 */ 131 setTracksInactive: function( /**Array[Object]*/ trackConfigs ) { 132 // remove any tracks in our track list that are being set as visible 133 if( ! this.dndDrop ) 134 this.trackListWidget.insertNodes( false, trackConfigs ); 135 }, 136 137 /** 138 * Make the track selector visible. 139 * This does nothing for the Simple track selector, since it is always visible. 140 */ 141 show: function() { 142 }, 143 144 /** 145 * Make the track selector invisible. 146 * This does nothing for the Simple track selector, since it is always visible. 147 */ 148 hide: function() { 149 }, 150 151 /** 152 * Toggle visibility of this track selector. 153 * This does nothing for the Simple track selector, since it is always visible. 154 */ 155 toggle: function() { 156 } 157 158 }); 159 160