mirror of
https://github.com/silverstripe/silverstripe-framework
synced 2024-08-27 04:56:02 +02:00
180 lines
4.2 KiB
JavaScript
180 lines
4.2 KiB
JavaScript
/**
|
|
* File: ModelAdmin.History.js
|
|
*/
|
|
(function($) {
|
|
$.entwine('ss', function($){
|
|
/**
|
|
* Class: .ModelAdmin
|
|
*
|
|
* A simple ajax browser history implementation tailored towards
|
|
* navigating through search results and different forms loaded into
|
|
* the ModelAdmin right panels. The logic listens to search and form loading
|
|
* events, keeps track of the loaded URLs, and will display graphical back/forward
|
|
* buttons where appropriate. A search action will cause the history to be reset.
|
|
*
|
|
* Note: The logic does not replay save operations or hook into any form actions.
|
|
*
|
|
* Available Events:
|
|
* - historyAdd
|
|
* - historyStart
|
|
* - historyGoFoward
|
|
* - historyGoBack
|
|
*
|
|
* Todo:
|
|
* Switch tab state when re-displaying search forms
|
|
* Reload search parameters into forms
|
|
*/
|
|
$('.ModelAdmin').entwine({
|
|
|
|
/**
|
|
* Variable: History
|
|
*/
|
|
History: [],
|
|
|
|
/**
|
|
* Variable: Future
|
|
*/
|
|
Future: [],
|
|
|
|
onmatch: function() {
|
|
var self = this;
|
|
|
|
this._super();
|
|
|
|
// generate markup
|
|
this.find('#right').prepend(
|
|
'<div class="historyNav">'
|
|
+ '<a href="#" class="back">< ' + ss.i18n._t('ModelAdmin.HISTORYBACK', 'back') + '</a>'
|
|
+ '<a href="#" class="forward">' + ss.i18n._t('ModelAdmin.HISTORYFORWARD', 'forward') + ' ></a>'
|
|
+ '</div>'
|
|
).find('.back,.forward').hide();
|
|
|
|
this.find('.historyNav .back').live('click', function() {
|
|
self.goBack();
|
|
return false;
|
|
});
|
|
|
|
this.find('.historyNav .forward').live('click', function() {
|
|
self.goForward();
|
|
return false;
|
|
});
|
|
},
|
|
|
|
/**
|
|
* Function: redraw
|
|
*/
|
|
redraw: function() {
|
|
this.find('.historyNav .forward').toggle(Boolean(this.getFuture().length > 0));
|
|
this.find('.historyNav .back').toggle(Boolean(this.getHistory().length > 1));
|
|
|
|
this._super();
|
|
},
|
|
|
|
/**
|
|
* Function: startHistory
|
|
*
|
|
* Parameters:
|
|
* (String) url - ...
|
|
* (Object) data - ...
|
|
*/
|
|
startHistory: function(url, data) {
|
|
this.trigger('historyStart', {url: url, data: data});
|
|
|
|
this.setHistory([]);
|
|
this.addHistory(url, data);
|
|
},
|
|
|
|
/**
|
|
* Add an item to the history, to be accessed by goBack and goForward
|
|
*/
|
|
addHistory: function(url, data) {
|
|
this.trigger('historyAdd', {url: url, data: data});
|
|
|
|
// Combine data into URL
|
|
if(data) {
|
|
if(url.indexOf('?') == -1) url += '?' + $.param(data);
|
|
else url += '&' + $.param(data);
|
|
}
|
|
// Add to history
|
|
this.getHistory().push(url);
|
|
// Reset future
|
|
this.setFuture([]);
|
|
|
|
this.redraw();
|
|
},
|
|
|
|
/**
|
|
* Function: goBack
|
|
*/
|
|
goBack: function() {
|
|
if(this.getHistory() && this.getHistory().length) {
|
|
if(this.getFuture() == null) this.setFuture([]);
|
|
|
|
var currentPage = this.getHistory().pop();
|
|
var previousPage = this.getHistory()[this.getHistory().length-1];
|
|
|
|
this.getFuture().push(currentPage);
|
|
|
|
this.trigger('historyGoBack', {url:previousPage});
|
|
|
|
// load new location
|
|
$('.cms-content').loadForm(previousPage);
|
|
|
|
this.redraw();
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Function: goForward
|
|
*/
|
|
goForward: function() {
|
|
if(this.getFuture() && this.getFuture().length) {
|
|
if(this.getFuture() == null) this.setFuture([]);
|
|
|
|
var nextPage = this.getFuture().pop();
|
|
|
|
this.getHistory().push(nextPage);
|
|
|
|
this.trigger('historyGoForward', {url:nextPage});
|
|
|
|
// load new location
|
|
$('.cms-content').loadForm(nextPage);
|
|
|
|
this.redraw();
|
|
}
|
|
}
|
|
});
|
|
|
|
/**
|
|
* Class: #SearchForm_holder form
|
|
*
|
|
* A search action will cause the history to be reset.
|
|
*/
|
|
$('#SearchForm_holder form').entwine({
|
|
onmatch: function() {
|
|
var self = this;
|
|
this.bind('beforeSubmit', function(e) {
|
|
$('.ModelAdmin').startHistory(
|
|
self.attr('action'),
|
|
self.serializeArray()
|
|
);
|
|
});
|
|
|
|
this._super();
|
|
}
|
|
});
|
|
|
|
/**
|
|
* Class: form[name=Form_ResultsForm] tbody td a
|
|
*
|
|
* We have to apply this to the result table buttons instead of the
|
|
* more generic form loading.
|
|
*/
|
|
$('form[name=Form_ResultsForm] tbody td a').entwine({
|
|
onclick: function(e) {
|
|
$('.ModelAdmin').addHistory(this.attr('href'));
|
|
}
|
|
});
|
|
|
|
});
|
|
})(jQuery); |