opensource/galaxy
3
0
Fork 0
mirror of https://github.com/galaxyproject/galaxy.git synced 2026-10-25 00:12:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add event handlers to navigate through history

Browse Source
This commit is contained in:
guerler
2016-05-25 11:37:47 -04:00
parent 64cb97cfc9
commit 617cd2de82
10 changed files with 91 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/galaxy/scripts/layout/scratchbook.js
+42 -44
View File
@@ -45,54 +45,52 @@ return Backbone.View.extend({
/** Add a dataset to the frames */
addDataset: function( dataset_id ) {
var self = this;
this.dataset_list = [];
Galaxy.currHistoryPanel.collection.find( function( model ) {
!model.get( 'deleted' ) && self.dataset_list.push( model.get( 'id' ) );
});
var _loadDatasetOffset = function( frame, offset ) {
var pos = self.dataset_list.indexOf( dataset_id );
if ( pos !== -1 && self.dataset_list[ pos + offset ] ) {
self._loadDataset( dataset_id = self.dataset_list[ pos + offset ], function( config ) {
frame.model.set( config );
});
}
}
this._loadDataset( dataset_id, function( config ) {
self.add( _.extend( { menu: [ { icon : 'fa fa-chevron-circle-left',
tooltip : 'Previous in History',
onclick : function( frame ) { _loadDatasetOffset( frame, -1 ) },
disabled : function() { return self.dataset_list.indexOf( dataset_id ) === 0 } },
{ icon : 'fa fa-chevron-circle-right',
tooltip : 'Next in History',
onclick : function( frame ) { _loadDatasetOffset( frame, 1 ) },
disabled : function() { return self.dataset_list.indexOf( dataset_id ) + 1 >= self.dataset_list.length } } ] }, config ) )
});
},
_loadDataset: function( dataset_id, callback ) {
var self = this;
require([ 'mvc/dataset/data' ], function( DATA ) {
var dataset = new DATA.Dataset( { id : dataset_id } );
$.when( dataset.fetch() ).then( function() {
// Construct frame config based on dataset's type.
var frame_config = {
title: dataset.get('name'),
menu: [ {
icon : 'fa fa-chevron-circle-left',
tooltip : 'Previous in History',
onclick : function() {
alert( 'previous' );
}
}, {
icon : 'fa fa-chevron-circle-right',
tooltip : 'Next in History',
onclick : function() {
alert( 'next' );
}
} ]
},
// HACK: For now, assume 'tabular' and 'interval' are the only
// modules that contain tabular files. This needs to be replaced
// will a is_datatype() function.
is_tabular = _.find( [ 'tabular', 'interval' ] , function( data_type ) {
return dataset.get( 'data_type' ).indexOf( data_type ) !== -1;
});
// Use tabular chunked display if dataset is tabular; otherwise load via URL.
if ( is_tabular ) {
var tabular_dataset = new DATA.TabularDataset( dataset.toJSON() );
_.extend( frame_config, {
content: function( parent_elt ) {
DATA.createTabularDatasetChunkedView({
model : tabular_dataset,
parent_elt : parent_elt,
embedded : true,
height : '100%'
});
}
});
}
else {
_.extend( frame_config, {
url: Galaxy.root + 'datasets/' + dataset.id + '/display/?preview=True'
});
}
self.add( frame_config );
var is_tabular = _.find( [ 'tabular', 'interval' ] , function( data_type ) {
return dataset.get( 'data_type' ).indexOf( data_type ) !== -1;
});
callback( is_tabular ? {
title : dataset.get( 'name' ),
url : null,
content : DATA.createTabularDatasetChunkedView({
model : new DATA.TabularDataset( dataset.toJSON() ),
embedded : true,
height : '100%'
}).$el
} : {
title : dataset.get( 'name' ),
url : Galaxy.root + 'datasets/' + dataset.id + '/display/?preview=True',
content : null
} );
});
});
},
client/galaxy/scripts/mvc/ui/ui-frames.js
+24 -11
View File
@@ -4,30 +4,43 @@ define([], function() {
var FrameView = Backbone.View.extend({
initialize: function( options ) {
var self = this;
this.model = options && options.model || new Backbone.Model( options );
this.setElement( $( '<div/>' ).addClass( 'corner frame' ) );
this.$el.append( $( '<div/>' ).addClass( 'f-header corner' )
.append( $( '<div/>' ).addClass( 'f-title' ).html( options.title || '' ) )
.append( $( '<div/>' ).addClass( 'f-title' ) )
.append( $( '<div/>' ).addClass( 'f-icon f-close fa fa-close' )
.tooltip( { title: 'Close', placement: 'bottom' } ) ) )
.append( $( '<div/>' ).addClass( 'f-content' ) )
.append( $( '<div/>' ).addClass( 'f-resize f-icon corner fa fa-expand' ).tooltip( { title: 'Resize' } ) )
.append( $( '<div/>' ).addClass( 'f-cover' ) );
this.$header = this.$( '.f-header' );
this.$title = this.$( '.f-title' );
this.$content = this.$( '.f-content' );
this.render();
this.listenTo( this.model, 'change', this.render, this );
},
render: function() {
var self = this;
var options = this.model.attributes;
this.$title.html( options.title || '' );
this.$header.find( '.f-icon-left' ).remove();
_.each( options.menu, function( option ) {
self.$header.append( $( '<div/>' ).addClass( 'f-icon-left' )
.addClass( option.icon )
.tooltip( { title: option.tooltip, placement: 'bottom' } )
.on( 'click', function() { option.onclick( self ) } ) );
var $option = $( '<div/>' ).addClass( 'f-icon-left' ).addClass( option.icon );
if ( _.isFunction( option.disabled ) && option.disabled() ) {
$option.attr( 'disabled', true );
} else {
$option.on( 'click', function() { option.onclick( self ) } )
.tooltip( { title: option.tooltip, placement: 'bottom' } );
}
self.$header.append( $option );
} );
if ( options.url ) {
this.$content.html(
$ ( '<iframe/>' ).addClass( 'f-iframe' )
.attr( 'scrolling', 'auto' )
.attr( 'src', options.url + ( options.url.indexOf( '?' ) === -1 ? '?' : '&' ) + 'widget=True' )
);
this.$content.html( $ ( '<iframe/>' ).addClass( 'f-iframe' )
.attr( 'scrolling', 'auto' )
.attr( 'src', options.url + ( options.url.indexOf( '?' ) === -1 ? '?' : '&' ) + 'widget=True' ) );
} else if ( options.content ) {
_.isFunction( options.content ) ? options.content( this.$content ) : $content.html( options.content );
_.isFunction( options.content ) ? options.content( self.$content ) : self.$content.html( options.content );
}
}
});
client/galaxy/style/less/frame.less
+3
View File
@@ -102,6 +102,9 @@
font-size : 15px;
margin-left : 3px;
float : left;
&[disabled] {
opacity : 0.25;
}
}
}