implement the webui so commands can be modified

deluge/plugins/execute/execute/data/execute.js

@@ -30,6 +30,112 @@ Copyright:
     this exception statement from your version. If you delete this exception
     statement from all source files in the program, then also delete it here.
 */
+Ext.ns('Deluge.ux');
+Deluge.ux.ExecuteWindowBase = Ext.extend(Ext.Window, {
+	
+	layout: 'fit',
+	width: 400,
+	height: 130,
+	closeAction: 'hide',
+
+	initComponent: function() {
+		Deluge.ux.ExecuteWindowBase.superclass.initComponent.call(this);
+		this.addButton(_('Cancel'), this.onCancelClick, this);
+
+		this.form = this.add({
+			xtype: 'form',
+			baseCls: 'x-plain',
+			bodyStyle: 'padding: 5px',
+			items: [{
+				xtype: 'combo',
+				width: 270,
+				fieldLabel: _('Event'),
+				store: new Ext.data.ArrayStore({
+					fields: ['id', 'text'],
+					data: [
+						['complete', _('Torrent Complete')],
+						['added', _('Torrent Added')]
+					]
+				}),
+				name: 'event',
+				mode: 'local',
+				editable: false,
+				triggerAction: 'all',
+				valueField:    'id',
+				displayField:  'text'
+			}, {
+				xtype: 'textfield',
+				fieldLabel: _('Command'),
+				name: 'command',
+				width: 270
+			}]
+		});
+	},
+
+	onCancelClick: function() {
+		this.hide();
+	}
+});
+
+Deluge.ux.EditExecuteCommandWindow = Ext.extend(Deluge.ux.ExecuteWindowBase, {
+
+	title: _('Edit Command'),
+
+	initComponent: function() {
+		Deluge.ux.EditExecuteCommandWindow.superclass.initComponent.call(this);
+		this.addButton(_('Save'), this.onSaveClick, this);
+		this.addEvents({
+			'commandedit': true
+		});
+	},
+
+	show: function(command) {
+		Deluge.ux.EditExecuteCommandWindow.superclass.show.call(this);
+		this.command = command;
+		this.form.getForm().setValues({
+			event: command.get('event'),
+			command: command.get('name')
+		});
+	},
+
+	onSaveClick: function() {
+		var values = this.form.getForm().getValues();
+		deluge.client.execute.save_command(this.command.id, values.event, values.command, {
+			success: function() {
+				this.fireEvent('commandedit', this, values.event, values.command);
+			},
+			scope: this
+		});
+		this.hide();
+	}
+
+});
+
+Deluge.ux.AddExecuteCommandWindow = Ext.extend(Deluge.ux.ExecuteWindowBase, {
+
+	title: _('Add Command'),
+
+	initComponent: function() {
+		Deluge.ux.AddExecuteCommandWindow.superclass.initComponent.call(this);
+		this.addButton(_('Add'), this.onAddClick, this);
+		this.addEvents({
+			'commandadd': true
+		});
+	},
+
+	onAddClick: function() {
+		var values = this.form.getForm().getValues();
+		deluge.client.execute.add_command(values.event, values.command, {
+			success: function() {
+				this.fireEvent('commandadd', this, values.event, values.command);
+			},
+			scope: this
+		});
+		this.hide();
+	}
+
+});
+
 Ext.ns('Deluge.ux.preferences');
 
 /**
@@ -78,19 +184,78 @@ Deluge.ux.preferences.ExecutePage = Ext.extend(Ext.Panel, {
 		});
 
 		this.panel = this.add({
-			items: [this.list]
+			items: [this.list],
+			bbar: {
+				items: [{
+					text: _('Add'),
+					iconCls: 'icon-add',
+					handler: this.onAddClick,
+					scope: this
+				}, {
+					text: _('Edit'),
+					iconCls: 'icon-edit',
+					handler: this.onEditClick,
+					scope: this
+				}, '->', {
+					text: _('Remove'),
+					iconCls: 'icon-remove',
+					handler: this.onRemoveClick,
+					scope: this
+				}]
+			}
 		});
 		
 		deluge.preferences.on('show', this.onPreferencesShow, this);
 	},
 
-	onPreferencesShow: function() {
+	updateCommands: function() {
 	    deluge.client.execute.get_commands({
 			success: function(commands) {
 				this.list.getStore().loadData(commands);
 			},
 			scope: this
 		});
+	},
+
+	onAddClick: function() {
+		if (!this.addWin) {
+			this.addWin = new Deluge.ux.AddExecuteCommandWindow();
+			this.addWin.on('commandadd', function() {
+				this.updateCommands();
+			}, this);
+		}
+		this.addWin.show();
+	},
+
+	onCommandAdded: function(win, evt, cmd) {
+		var record = new this.list.getStore().recordType({
+			event: evt,
+			command: cmd
+		});
+	},
+
+	onEditClick: function() {
+		if (!this.editWin) {
+			this.editWin = new Deluge.ux.EditExecuteCommandWindow();
+			this.editWin.on('commandedit', function() {
+				this.updateCommands();
+			}, this);
+		}
+		this.editWin.show(this.list.getSelectedRecords()[0]);
+	},
+
+	onPreferencesShow: function() {
+		this.updateCommands();
+	},
+
+	onRemoveClick: function() {
+		var record = this.list.getSelectedRecords()[0];
+		deluge.client.execute.remove_command(record.id, {
+			success: function() {
+				this.updateCommands();
+			},
+			scope: this
+		});
 	}
 });