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

History panel: persist open state of search, tag, and annotation UIs

Browse Source
This commit is contained in:
Carl Eberhard
2013-12-12 17:10:30 -05:00
parent a4f44ea8ef
commit 46fb54ad96
2 changed files with 86 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/scripts/mvc/history/history-panel.js
+85 -31
View File
@@ -7,9 +7,32 @@ define([
// ============================================================================
/** session storage for individual history preferences
/** session storage for history panel preferences (and to maintain state)
*/
var HistoryPanelPrefs = SessionStorageModel.extend({
defaults : {
/** is the panel currently showing the search/filter controls? */
searching : false,
/** should the tags editor be shown or hidden initially? */
tagsEditorShown : false,
/** should the annotation editor be shown or hidden initially? */
annotationEditorShown : false
},
toString : function(){
return 'HistoryPanelPrefs(' + JSON.stringify( this.toJSON() ) + ')';
}
});
/** key string to store panel prefs (made accessible on class so you can access sessionStorage directly) */
HistoryPanelPrefs.storageKey = function storageKey(){
return ( 'history-panel' );
};
// ============================================================================
/** session storage for individual history preferences
*/
var HistoryPrefs = SessionStorageModel.extend({
defaults : {
//TODO:?? expandedHdas to array?
expandedHdas : {},
@@ -27,15 +50,15 @@ var HistoryPanelPrefs = SessionStorageModel.extend({
this.save( 'expandedHdas', _.omit( this.get( 'expandedHdas' ), id ) );
},
toString : function(){
return 'HistoryPanelPrefs(' + this.id + ')';
return 'HistoryPrefs(' + this.id + ')';
}
});
/** key string to store each histories settings under */
HistoryPanelPrefs.historyStorageKey = function historyStorageKey( historyId ){
HistoryPrefs.historyStorageKey = function historyStorageKey( historyId ){
// class lvl for access w/o instantiation
if( !historyId ){
throw new Error( 'HistoryPanelPrefs.historyStorageKey needs valid id: ' + historyId );
throw new Error( 'HistoryPrefs.historyStorageKey needs valid id: ' + historyId );
}
// single point of change
return ( 'history:' + historyId );
@@ -109,28 +132,30 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
this.log( this + '.initialize:', attributes );
// ---- set up instance vars
// control contents/behavior based on where (and in what context) the panel is being used
/** which backbone view class to use when displaying the hda list */
this.HDAViewClass = attributes.HDAViewClass || this.defaultHDAViewClass;
/** where should pages from links be displayed? (default to new tab/window) */
this.linkTarget = attributes.linkTarget || '_blank';
// ---- sub views and saved elements
/** map of hda model ids to hda views */
this.hdaViews = {};
/** loading indicator */
this.indicator = new LoadingIndicator( this.$el );
// ---- persistent state and preferences
/** maintain state / preferences over page loads */
this.preferences = new HistoryPanelPrefs( _.extend({
id : HistoryPanelPrefs.storageKey()
}, _.pick( attributes, _.keys( HistoryPanelPrefs.prototype.defaults ) )));
/** filters for displaying hdas */
this.filters = [];
//TODO: move to storage and persist
/** is the panel currently showing the search/filter controls? */
this.searching = attributes.searching || false;
// states/modes the panel can be in
/** is the panel currently showing the dataset selection controls? */
this.selecting = attributes.selecting || false;
/** should the tags editor be shown or hidden initially? */
this.tagsEditorShown = attributes.tagsShown || false;
/** should the tags editor be shown or hidden initially? */
this.annotationEditorShown = attributes.annotationEditorShown || false;
this._setUpListeners();
@@ -397,8 +422,8 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
*/
_setUpWebStorage : function( initiallyExpanded, show_deleted, show_hidden ){
//console.debug( '_setUpWebStorage', initiallyExpanded, show_deleted, show_hidden );
this.storage = new HistoryPanelPrefs({
id: HistoryPanelPrefs.historyStorageKey( this.model.get( 'id' ) )
this.storage = new HistoryPrefs({
id: HistoryPrefs.historyStorageKey( this.model.get( 'id' ) )
});
// expanded Hdas is a map of hda.ids -> a boolean repr'ing whether this hda's body is already expanded
@@ -436,7 +461,7 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
return ( this.storage )?( this.storage.get() ):( {} );
}
//TODO: make storage engine generic
var item = sessionStorage.getItem( HistoryPanelPrefs.historyStorageKey( historyId ) );
var item = sessionStorage.getItem( HistoryPrefs.historyStorageKey( historyId ) );
return ( item === null )?( {} ):( JSON.parse( item ) );
},
@@ -525,6 +550,7 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
panel.$el.empty();
if( $newRender ){
panel.$el.append( $newRender.children() );
panel.renderBasedOnPrefs();
}
next();
},
@@ -581,6 +607,12 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
return $newRender;
},
renderBasedOnPrefs : function(){
if( this.preferences.get( 'searching' ) ){
this.showSearchControls( 0 );
}
},
_renderTags : function( $where ){
var panel = this;
this.tagsEditor = new TagsEditor({
@@ -589,11 +621,11 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
onshowFirstTime : function(){ this.render(); },
// show hide hda view tag editors when this is shown/hidden
onshow : function(){
panel.tagsEditorShown = true;
panel.preferences.set( 'tagsEditorShown', true );
panel.toggleHDATagEditors( true, panel.fxSpeed );
},
onhide : function(){
panel.tagsEditorShown = false;
panel.preferences.set( 'tagsEditorShown', false );
panel.toggleHDATagEditors( false, panel.fxSpeed );
},
$activator : faIconButton({
@@ -602,6 +634,9 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
faIcon : 'fa-tags'
}).appendTo( $where.find( '.history-secondary-actions' ) )
});
if( this.preferences.get( 'tagsEditorShown' ) ){
this.tagsEditor.toggle( true );
}
},
_renderAnnotation : function( $where ){
var panel = this;
@@ -611,11 +646,11 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
onshowFirstTime : function(){ this.render(); },
// show hide hda view annotation editors when this is shown/hidden
onshow : function(){
panel.annotationEditorShown = true;
panel.preferences.set( 'annotationEditorShown', true );
panel.toggleHDAAnnotationEditors( true, panel.fxSpeed );
},
onhide : function(){
panel.annotationEditorShown = false;
panel.preferences.set( 'annotationEditorShown', false );
panel.toggleHDAAnnotationEditors( false, panel.fxSpeed );
},
$activator : faIconButton({
@@ -624,6 +659,9 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
faIcon : 'fa-comment'
}).appendTo( $where.find( '.history-secondary-actions' ) )
});
if( this.preferences.get( 'annotationEditorShown' ) ){
this.annotationEditor.toggle( true );
}
},
/** button for opening search */
_renderSearchButton : function( $where ){
@@ -759,8 +797,8 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
linkTarget : this.linkTarget,
expanded : expanded,
//draggable : true,
tagsEditorShown : this.tagsEditorShown,
annotationEditorShown : this.annotationEditorShown,
tagsEditorShown : this.preferences.get( 'tagsEditorShown' ),
annotationEditorShown : this.preferences.get( 'annotationEditorShown' ),
selectable : this.selecting,
hasUser : this.model.ownedByCurrUser(),
logger : this.logger
@@ -979,22 +1017,38 @@ var HistoryPanel = Backbone.View.extend( LoggableMixin ).extend(
onclear : onSearchClear
});
},
/** toggle showing/hiding the search controls (rendering first on the initial show) */
toggleSearchControls : function(){
var $searchControls = this.$el.find( '.history-search-controls' );
//TODO: to hidden/shown plugin
showSearchControls : function( speed ){
speed = ( speed === undefined )?( this.fxSpeed ):( speed );
var panel = this,
$searchControls = this.$el.find( '.history-search-controls' );
// if it hasn't been rendered - do it now
if( !$searchControls.children().size() ){
$searchControls = this.renderSearchControls( $searchControls ).hide();
}
$searchControls.slideToggle( this.fxSpeed, function(){
if( $( this ).is( ':visible' ) ){
this.searching = true;
$( this ).find( 'input' ).focus();
} else {
this.searching = false;
}
// then slide open, focusing on the input, and persisting the setting when it's done
$searchControls.show( speed, function(){
$( this ).find( 'input' ).focus();
panel.preferences.set( 'searching', true );
});
},
hideSearchControls : function(){
speed = ( speed === undefined )?( this.fxSpeed ):( speed );
var panel = this;
this.$el.find( '.history-search-controls' ).hide( speed, function(){
panel.preferences.set( 'searching', false );
});
},
/** toggle showing/hiding the search controls (rendering first on the initial show) */
toggleSearchControls : function( eventOrSpeed ){
speed = ( jQuery.type( eventOrSpeed ) === 'number' )?( eventOrSpeed ):( this.fxSpeed );
if( this.$el.find( '.history-search-controls' ).is( ':visible' ) ){
this.hideSearchControls( speed );
} else {
this.showSearchControls( speed );
}
},
// ........................................................................ multi-select of hdas
showSelectors : function( speed ){
static/scripts/packed/mvc/history/history-panel.js
+1 -1
View File
File diff suppressed because one or more lines are too long