opensource/galaxy
3
0
Fork 0
mirror of https://github.com/galaxyproject/galaxy.git synced 2026-09-24 16:30:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

Enable Trackster visualizations to be added to Scratchbook via dynamic loading rather than iframes.

Browse Source
This commit is contained in:
Jeremy Goecks
2014-09-29 17:12:03 -04:00
parent a20a83eac4
commit 3258a3359f
15 changed files with 134 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/galaxy/scripts/galaxy.frame.js
+48
View File
@@ -118,6 +118,54 @@ var GalaxyFrame = Backbone.View.extend({
});
},
/**
* Add a trackster visualization to the frames.
*/
add_trackster_viz: function(viz_id) {
var self = this;
require(['viz/visualization', 'viz/trackster'], function(visualization, trackster) {
var viz = new visualization.Visualization({id: viz_id});
$.when( viz.fetch() ).then( function() {
var ui = new trackster.TracksterUI(galaxy_config.root);
// Construct frame config based on dataset's type.
var frame_config = {
title: viz.get('name'),
type: 'other',
content: function(parent_elt) {
// Create view config.
var view_config = {
container: parent_elt,
name: viz.get('title'),
id: viz.id,
// FIXME: this will not work with custom builds b/c the dbkey needed to be encoded.
dbkey: viz.get('dbkey'),
stand_alone: false
},
latest_revision = viz.get('latest_revision'),
drawables = latest_revision.config.view.drawables;
// Set up datasets in drawables.
_.each(drawables, function(d) {
d.dataset = {
hda_ldda: d.hda_ldda,
id: d.dataset_id
};
});
view = ui.create_visualization(view_config,
latest_revision.config.viewport,
latest_revision.config.view.drawables,
latest_revision.config.bookmarks,
false);
}
};
self.add(frame_config);
});
});
},
/**
* Add and display a new frame/window based on options.
client/galaxy/scripts/mvc/dataset/dataset-li.js
+1 -1
View File
@@ -160,7 +160,7 @@ var DatasetListItemView = _super.extend(
// add frame manager option onclick event
var self = this;
displayBtnData.onclick = function( ev ){
if( Galaxy.frame && Galaxy.frame.active ){
if (Galaxy.frame && Galaxy.frame.active) {
// Add dataset to frames.
Galaxy.frame.add_dataset(self.model.get('id'));
ev.preventDefault();
client/galaxy/scripts/mvc/ui/ui-frames.js
+1 -1
View File
@@ -148,7 +148,7 @@ var View = Backbone.View.extend({
content: null,
target: '',
type: null
}
};
// read in defaults
if (options) {
client/galaxy/scripts/viz/trackster/tracks.js
+8
View File
@@ -832,6 +832,7 @@ var TracksterView = Backbone.View.extend({
this.chrom = null;
this.vis_id = obj_dict.vis_id;
this.dbkey = obj_dict.dbkey;
this.stand_alone = (obj_dict.stand_alone !== undefined ? obj_dict.stand_alone : true);
this.label_tracks = [];
this.tracks_to_be_redrawn = [];
this.max_low = 0;
@@ -885,9 +886,16 @@ var TracksterView = Backbone.View.extend({
});
});
});
// Navigation at top
this.nav_container = $("<div/>").addClass("trackster-nav-container").prependTo(this.top_container);
this.nav = $("<div/>").addClass("trackster-nav").appendTo(this.nav_container);
if (this.stand_alone) {
this.nav_container.addClass("stand-alone");
this.nav.addClass("stand-alone");
}
// Overview (scrollbar and overview plot) at bottom
this.overview = $("<div/>").addClass("overview").appendTo(this.bottom_container);
this.overview_viewport = $("<div/>").addClass("overview-viewport").appendTo(this.overview);
client/galaxy/scripts/viz/visualization.js
+1 -2
View File
@@ -958,8 +958,7 @@ var Visualization = Backbone.Model.extend({
type: ''
},
// No API to create/save visualization yet, so use this path:
url: galaxy_config.root + "visualization/save",
urlRoot: galaxy_config.root + "api/visualizations",
/**
* POSTs visualization's JSON to its URL using the parameter 'vis_json'
static/scripts/galaxy.frame.js
+48
View File
@@ -118,6 +118,54 @@ var GalaxyFrame = Backbone.View.extend({
});
},
/**
* Add a trackster visualization to the frames.
*/
add_trackster_viz: function(viz_id) {
var self = this;
require(['viz/visualization', 'viz/trackster'], function(visualization, trackster) {
var viz = new visualization.Visualization({id: viz_id});
$.when( viz.fetch() ).then( function() {
var ui = new trackster.TracksterUI(galaxy_config.root);
// Construct frame config based on dataset's type.
var frame_config = {
title: viz.get('name'),
type: 'other',
content: function(parent_elt) {
// Create view config.
var view_config = {
container: parent_elt,
name: viz.get('title'),
id: viz.id,
// FIXME: this will not work with custom builds b/c the dbkey needed to be encoded.
dbkey: viz.get('dbkey'),
stand_alone: false
},
latest_revision = viz.get('latest_revision'),
drawables = latest_revision.config.view.drawables;
// Set up datasets in drawables.
_.each(drawables, function(d) {
d.dataset = {
hda_ldda: d.hda_ldda,
id: d.dataset_id
};
});
view = ui.create_visualization(view_config,
latest_revision.config.viewport,
latest_revision.config.view.drawables,
latest_revision.config.bookmarks,
false);
}
};
self.add(frame_config);
});
});
},
/**
* Add and display a new frame/window based on options.
static/scripts/mvc/dataset/dataset-li.js
+1 -1
View File
@@ -160,7 +160,7 @@ var DatasetListItemView = _super.extend(
// add frame manager option onclick event
var self = this;
displayBtnData.onclick = function( ev ){
if( Galaxy.frame && Galaxy.frame.active ){
if (Galaxy.frame && Galaxy.frame.active) {
// Add dataset to frames.
Galaxy.frame.add_dataset(self.model.get('id'));
ev.preventDefault();
static/scripts/mvc/ui/ui-frames.js
+1 -1
View File
@@ -148,7 +148,7 @@ var View = Backbone.View.extend({
content: null,
target: '',
type: null
}
};
// read in defaults
if (options) {
static/scripts/packed/galaxy.frame.js
+1 -1
View File
@@ -1 +1 @@
define(["galaxy.masthead","mvc/ui/ui-frames"],function(b,c){var a=Backbone.View.extend({el_main:"body",active:false,button_active:null,button_load:null,initialize:function(e){var d=this;this.frames=new c.View({visible:false,});this.button_active=new b.GalaxyMastheadIcon({icon:"fa-th",tooltip:"Enable/Disable Scratchbook",onclick:function(){d._activate()},onunload:function(){if(d.frames.length()>0){return"You opened "+d.frames.length()+" frame(s) which will be lost."}}});Galaxy.masthead.append(this.button_active);this.button_load=new b.GalaxyMastheadIcon({icon:"fa-eye",tooltip:"Show/Hide Scratchbook",onclick:function(f){if(d.frames.visible){d.frames.hide()}else{d.frames.show()}},with_number:true});Galaxy.masthead.append(this.button_load);this.setElement(this.frames.$el);$(this.el_main).append(this.$el);this.frames.setOnChange(function(){d._refresh()});this._refresh()},add_dataset:function(d){var e=this;require(["mvc/data"],function(f){var g=new f.Dataset({id:d});$.when(g.fetch()).then(function(){var h={title:g.get("name")},j=_.find(["tabular","interval"],function(k){return g.get("data_type").indexOf(k)!==-1});if(j){var i=new f.TabularDataset(g.toJSON());_.extend(h,{type:"other",content:function(k){f.createTabularDatasetChunkedView({model:i,parent_elt:k,embedded:true,height:"100%"})}})}else{_.extend(h,{type:"url",content:galaxy_config.root+"datasets/"+g.id+"/display/?preview=True"})}e.add(h)})})},add:function(e){if(e.target=="_blank"){window.open(e.content);return}if(e.target=="_top"||e.target=="_parent"||e.target=="_self"){window.location=e.content;return}if(!this.active){var f=$(window.parent.document).find("#galaxy_main");if(e.target=="galaxy_main"||e.target=="center"){if(f.length===0){var d=e.content;if(d.indexOf("?")==-1){d+="?"}else{d+="&"}d+="use_panels=True";window.location=d}else{f.attr("src",e.content)}}else{window.location=e.content}return}this.frames.add(e)},_activate:function(){if(this.active){this.active=false;this.button_active.untoggle();this.frames.hide()}else{this.active=true;this.button_active.toggle()}},_refresh:function(){this.button_load.number(this.frames.length());if(this.frames.length()===0){this.button_load.hide()}else{this.button_load.show()}if(this.frames.visible){this.button_load.toggle()}else{this.button_load.untoggle()}}});return{GalaxyFrame:a}});
define(["galaxy.masthead","mvc/ui/ui-frames"],function(b,c){var a=Backbone.View.extend({el_main:"body",active:false,button_active:null,button_load:null,initialize:function(e){var d=this;this.frames=new c.View({visible:false,});this.button_active=new b.GalaxyMastheadIcon({icon:"fa-th",tooltip:"Enable/Disable Scratchbook",onclick:function(){d._activate()},onunload:function(){if(d.frames.length()>0){return"You opened "+d.frames.length()+" frame(s) which will be lost."}}});Galaxy.masthead.append(this.button_active);this.button_load=new b.GalaxyMastheadIcon({icon:"fa-eye",tooltip:"Show/Hide Scratchbook",onclick:function(f){if(d.frames.visible){d.frames.hide()}else{d.frames.show()}},with_number:true});Galaxy.masthead.append(this.button_load);this.setElement(this.frames.$el);$(this.el_main).append(this.$el);this.frames.setOnChange(function(){d._refresh()});this._refresh()},add_dataset:function(d){var e=this;require(["mvc/data"],function(f){var g=new f.Dataset({id:d});$.when(g.fetch()).then(function(){var h={title:g.get("name")},j=_.find(["tabular","interval"],function(k){return g.get("data_type").indexOf(k)!==-1});if(j){var i=new f.TabularDataset(g.toJSON());_.extend(h,{type:"other",content:function(k){f.createTabularDatasetChunkedView({model:i,parent_elt:k,embedded:true,height:"100%"})}})}else{_.extend(h,{type:"url",content:galaxy_config.root+"datasets/"+g.id+"/display/?preview=True"})}e.add(h)})})},add_trackster_viz:function(e){var d=this;require(["viz/visualization","viz/trackster"],function(g,h){var f=new g.Visualization({id:e});$.when(f.fetch()).then(function(){var j=new h.TracksterUI(galaxy_config.root);var i={title:f.get("name"),type:"other",content:function(l){var n={container:l,name:f.get("title"),id:f.id,dbkey:f.get("dbkey"),stand_alone:false},m=f.get("latest_revision"),k=m.config.view.drawables;_.each(k,function(o){o.dataset={hda_ldda:o.hda_ldda,id:o.dataset_id}});view=j.create_visualization(n,m.config.viewport,m.config.view.drawables,m.config.bookmarks,false)}};d.add(i)})})},add:function(e){if(e.target=="_blank"){window.open(e.content);return}if(e.target=="_top"||e.target=="_parent"||e.target=="_self"){window.location=e.content;return}if(!this.active){var f=$(window.parent.document).find("#galaxy_main");if(e.target=="galaxy_main"||e.target=="center"){if(f.length===0){var d=e.content;if(d.indexOf("?")==-1){d+="?"}else{d+="&"}d+="use_panels=True";window.location=d}else{f.attr("src",e.content)}}else{window.location=e.content}return}this.frames.add(e)},_activate:function(){if(this.active){this.active=false;this.button_active.untoggle();this.frames.hide()}else{this.active=true;this.button_active.toggle()}},_refresh:function(){this.button_load.number(this.frames.length());if(this.frames.length()===0){this.button_load.hide()}else{this.button_load.show()}if(this.frames.visible){this.button_load.toggle()}else{this.button_load.untoggle()}}});return{GalaxyFrame:a}});
static/scripts/packed/viz/trackster/tracks.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/packed/viz/visualization.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/viz/trackster/tracks.js
+8
View File
@@ -832,6 +832,7 @@ var TracksterView = Backbone.View.extend({
this.chrom = null;
this.vis_id = obj_dict.vis_id;
this.dbkey = obj_dict.dbkey;
this.stand_alone = (obj_dict.stand_alone !== undefined ? obj_dict.stand_alone : true);
this.label_tracks = [];
this.tracks_to_be_redrawn = [];
this.max_low = 0;
@@ -885,9 +886,16 @@ var TracksterView = Backbone.View.extend({
});
});
});
// Navigation at top
this.nav_container = $("<div/>").addClass("trackster-nav-container").prependTo(this.top_container);
this.nav = $("<div/>").addClass("trackster-nav").appendTo(this.nav_container);
if (this.stand_alone) {
this.nav_container.addClass("stand-alone");
this.nav.addClass("stand-alone");
}
// Overview (scrollbar and overview plot) at bottom
this.overview = $("<div/>").addClass("overview").appendTo(this.bottom_container);
this.overview_viewport = $("<div/>").addClass("overview-viewport").appendTo(this.overview);
static/scripts/viz/visualization.js
+1 -2
View File
@@ -958,8 +958,7 @@ var Visualization = Backbone.Model.extend({
type: ''
},
// No API to create/save visualization yet, so use this path:
url: galaxy_config.root + "visualization/save",
urlRoot: galaxy_config.root + "api/visualizations",
/**
* POSTs visualization's JSON to its URL using the parameter 'vis_json'
static/style/blue/trackster.css
+2 -2
View File
@@ -1,6 +1,6 @@
.viewport-container{overflow-x:hidden;overflow-y:auto;background:white}
.trackster-nav-container{width:100%;height:0;text-align:center}
.trackster-nav{padding:0 0;color:#333;font-weight:bold;background:#cccccc;position:relative;display:inline-block;top:-2em;background:transparent;border:none}
.trackster-nav-container{width:100%;text-align:center}.trackster-nav-container.stand-alone{height:0}
.trackster-nav{padding:0 0;color:#333;font-weight:bold;background:#cccccc;display:inline-block;top:-2em;background:transparent;border:none}.trackster-nav.stand-alone{position:relative}
.chrom-nav{width:15em}
.content{font:10px verdana;position:relative}
.nav-controls{text-align:center;padding:1px 0}.nav-controls input{margin:0 5px}
static/style/src/less/trackster.less
+11 -4
View File
@@ -13,8 +13,12 @@
.trackster-nav-container {
width: 100%;
/* Used to push nav into title bar: */
height: 0;
&.stand-alone {
/* Used to push nav into title bar: */
height: 0;
}
text-align: center;
}
@@ -23,12 +27,15 @@
color:#333;
font-weight:bold;
background:#cccccc;
/* Push nav up into title bar */
position: relative;
display: inline-block;
top: -2em;
background: transparent;
border: none;
&.stand-alone {
/* Push nav up into title bar */
position: relative;
}
}
.chrom-nav {