Commands return immediately and signalr is used to control the UI

This commit is contained in:
Mark McDowall 2013-08-30 20:08:19 -07:00
parent 772ab3c921
commit c96ba5efd3
55 changed files with 439 additions and 238 deletions

View file

@ -1,15 +1,30 @@
'use strict';
define(['Commands/CommandController', 'Shared/Messenger'],
function(CommandController, Messenger) {
return {
define(
[
'Commands/CommandController',
'Commands/CommandCollection',
'Shared/Messenger'],
function(CommandController, CommandCollection, Messenger) {
var actioneer = Marionette.AppRouter.extend({
initialize: function () {
this.trackedCommands = [];
CommandCollection.fetch();
this.listenTo(CommandCollection, 'sync', this._handleCommands);
},
ExecuteCommand: function (options) {
options.iconClass = this._getIconClass(options.element);
this._showStartMessage(options);
if (options.button) {
options.button.addClass('disable');
}
this._setSpinnerOnElement(options);
var promise = CommandController.Execute(options.command, options.properties);
this._handlePromise(promise, options);
this._showStartMessage(options, promise);
},
SaveModel: function (options) {
@ -24,15 +39,7 @@ define(['Commands/CommandController', 'Shared/Messenger'],
_handlePromise: function (promise, options) {
promise.done(function () {
if (options.successMessage) {
Messenger.show({
message: options.successMessage
});
}
if (options.onSuccess) {
options.onSuccess.call(options.context);
}
self._onSuccess(options);
});
promise.fail(function (ajaxOptions) {
@ -40,31 +47,41 @@ define(['Commands/CommandController', 'Shared/Messenger'],
return;
}
if (options.failMessage) {
Messenger.show({
message: options.failMessage,
type : 'error'
});
}
if (options.onError) {
options.onError.call(options.context);
}
self._onError(options);
});
promise.always(function () {
self._onComplete(options);
});
},
if (options.leaveIcon) {
options.element.removeClass('icon-spin');
_handleCommands: function () {
var self = this;
_.each(this.trackedCommands, function (trackedCommand){
if (trackedCommand.completed === true) {
return;
}
else {
options.element.addClass(options.iconClass);
options.element.removeClass('icon-nd-spinner');
var options = trackedCommand.options;
var command = CommandCollection.find({ 'id': trackedCommand.id });
if (!command) {
return;
}
if (options.always) {
options.always.call(options.context);
if (command.get('state') === 'completed') {
trackedCommand.completed = true;
self._onSuccess(options, command.get('id'));
self._onComplete(options);
}
if (command.get('state') === 'failed') {
trackedCommand.completed = true;
self._onError(options, command.get('id'));
self._onComplete(options);
}
});
},
@ -74,6 +91,10 @@ define(['Commands/CommandController', 'Shared/Messenger'],
},
_setSpinnerOnElement: function (options) {
if (!options.element) {
return;
}
if (options.leaveIcon) {
options.element.addClass('icon-spin');
}
@ -84,12 +105,79 @@ define(['Commands/CommandController', 'Shared/Messenger'],
}
},
_showStartMessage: function (options) {
if (options.startMessage) {
_onSuccess: function (options, id) {
if (options.successMessage) {
Messenger.show({
message: options.startMessage
id : id,
message: options.successMessage,
type : 'success'
});
}
if (options.onSuccess) {
options.onSuccess.call(options.context);
}
},
_onError: function (options, id) {
if (options.errorMessage) {
Messenger.show({
id : id,
message: options.errorMessage,
type : 'error'
});
}
if (options.onError) {
options.onError.call(options.context);
}
},
_onComplete: function (options) {
if (options.button) {
options.button.removeClass('disable');
}
if (options.leaveIcon) {
options.element.removeClass('icon-spin');
}
else {
options.element.addClass(options.iconClass);
options.element.removeClass('icon-nd-spinner');
options.element.removeClass('icon-spin');
}
if (options.always) {
options.always.call(options.context);
}
},
_showStartMessage: function (options, promise) {
var self = this;
if (!promise) {
if (options.startMessage) {
Messenger.show({
message: options.startMessage
});
}
return;
}
promise.done(function (data) {
self.trackedCommands.push({ id: data.id, options: options });
if (options.startMessage) {
Messenger.show({
id : data.id,
message: options.startMessage
});
}
});
}
}
});
return new actioneer();
});

View file

@ -13,6 +13,10 @@ define(function () {
options.hideAfter = 5;
break;
case 'success':
options.hideAfter = 5;
break;
default :
options.hideAfter = 0;
}
@ -22,11 +26,11 @@ define(function () {
message : options.message,
type : options.type,
showCloseButton: true,
hideAfter : options.hideAfter
hideAfter : options.hideAfter,
id : options.id
});
},
monitor: function (options) {
if (!options.promise) {

View file

@ -3,9 +3,9 @@ define(
[
'app',
'marionette',
'Commands/CommandController',
'Shared/Actioneer',
'Shared/Messenger'
], function (App, Marionette, CommandController, Messenger) {
], function (App, Marionette, Actioneer, Messenger) {
return Marionette.ItemView.extend({
template : 'Shared/Toolbar/ButtonTemplate',
@ -19,7 +19,6 @@ define(
icon: '.x-icon'
},
initialize: function () {
this.storageKey = this.model.get('menuKey') + ':' + this.model.get('key');
this.idle = true;
@ -45,68 +44,19 @@ define(
},
invokeCommand: function () {
//TODO: Use Actioneer to handle icon swapping
var command = this.model.get('command');
if (command) {
this.idle = false;
this.$el.addClass('disabled');
this.ui.icon.addClass('icon-spinner icon-spin');
var self = this;
var commandPromise = CommandController.Execute(command);
commandPromise.done(function () {
if (self.model.get('successMessage')) {
Messenger.show({
message: self.model.get('successMessage')
});
}
if (self.model.get('onSuccess')) {
if (!self.model.ownerContext) {
throw 'ownerContext must be set.';
}
self.model.get('onSuccess').call(self.model.ownerContext);
}
Actioneer.ExecuteCommand({
command : command,
button : this.$el,
element : this.ui.icon,
errorMessage : this.model.get('errorMessage'),
successMessage: this.model.get('successMessage'),
always : this._commandAlways,
context : this
});
commandPromise.fail(function (options) {
if (options.readyState === 0 || options.status === 0) {
return;
}
if (self.model.get('errorMessage')) {
Messenger.show({
message: self.model.get('errorMessage'),
type : 'error'
});
}
if (self.model.get('onError')) {
if (!self.model.ownerContext) {
throw 'ownerContext must be set.';
}
self.model.get('onError').call(self.model.ownerContext);
}
});
commandPromise.always(function () {
if (!self.isClosed) {
self.$el.removeClass('disabled');
self.ui.icon.removeClass('icon-spinner icon-spin');
self.idle = true;
}
});
if (self.model.get('always')) {
if (!self.model.ownerContext) {
throw 'ownerContext must be set.';
}
self.model.get('always').call(self.model.ownerContext);
}
}
},
@ -133,8 +83,13 @@ define(
if (callback) {
callback.call(this.model.ownerContext);
}
}
},
_commandAlways: function () {
if (!this.isClosed) {
this.idle = true;
}
}
});
});

View file

@ -30,10 +30,8 @@ define(
this.left = options.left;
this.right = options.right;
this.toolbarContext = options.context;
},
onShow: function () {
if (this.left) {
_.each(this.left, this._showToolbarLeft, this);
@ -51,7 +49,6 @@ define(
this._showToolbar(element, index, 'right');
},
_showToolbar: function (buttonGroup, index, position) {
var groupCollection = new ButtonCollection();