From 89fb5b02d741f1bef8327ec47eda62e462c4d03d Mon Sep 17 00:00:00 2001 From: Damien Churchill Date: Mon, 3 May 2010 01:54:25 +0100 Subject: [PATCH] move the InstallPluginWindow class out of the PluginsPage file convert the plugins grid over to a listview --- .../preferences/InstallPluginWindow.js | 101 ++++++++++++ .../js/deluge-all/preferences/PluginsPage.js | 149 ++++-------------- 2 files changed, 136 insertions(+), 114 deletions(-) create mode 100644 deluge/ui/web/js/deluge-all/preferences/InstallPluginWindow.js diff --git a/deluge/ui/web/js/deluge-all/preferences/InstallPluginWindow.js b/deluge/ui/web/js/deluge-all/preferences/InstallPluginWindow.js new file mode 100644 index 000000000..7c1b8fe4d --- /dev/null +++ b/deluge/ui/web/js/deluge-all/preferences/InstallPluginWindow.js @@ -0,0 +1,101 @@ +/*! + * Deluge.preferences.InstallPluginWindow.js + * + * Copyright (c) Damien Churchill 2009-2010 + * + * This program is free software; you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation; either version 3, or (at your option) + * any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, write to: + * The Free Software Foundation, Inc., + * 51 Franklin Street, Fifth Floor + * Boston, MA 02110-1301, USA. + * + * In addition, as a special exception, the copyright holders give + * permission to link the code of portions of this program with the OpenSSL + * library. + * You must obey the GNU General Public License in all respects for all of + * the code used other than OpenSSL. If you modify file(s) with this + * exception, you may extend this exception to your version of the file(s), + * but you are not obligated to do so. If you do not wish to do so, delete + * 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.namespace('Deluge.preferences'); + +/** + * @class Deluge.preferences.InstallPluginWindow + * @extends Ext.Window + */ +Deluge.preferences.InstallPluginWindow = Ext.extend(Ext.Window, { + + title: _('Install Plugin'), + layout: 'fit', + height: 115, + width: 350, + + bodyStyle: 'padding: 10px 5px;', + buttonAlign: 'center', + closeAction: 'hide', + iconCls: 'x-deluge-install-plugin', + modal: true, + plain: true, + + initComponent: function() { + Deluge.add.FileWindow.superclass.initComponent.call(this); + this.addButton(_('Install'), this.onInstall, this); + + this.form = this.add({ + xtype: 'form', + baseCls: 'x-plain', + labelWidth: 70, + autoHeight: true, + fileUpload: true, + items: [{ + xtype: 'fileuploadfield', + id: 'pluginEgg', + emptyText: _('Select an egg'), + fieldLabel: _('Plugin Egg'), + name: 'file', + buttonCfg: { + text: _('Browse') + '...' + } + }] + }); + }, + + onInstall: function(field, e) { + this.form.getForm().submit({ + url: '/upload', + waitMsg: _('Uploading your plugin...'), + success: this.onUploadSuccess, + scope: this + }); + }, + + onUploadPlugin: function(info, obj, response, request) { + this.fireEvent('pluginadded'); + }, + + onUploadSuccess: function(fp, upload) { + this.hide(); + if (upload.result.success) { + var filename = this.form.getForm().findField('pluginEgg').value; + var path = upload.result.files[0] + this.form.getForm().findField('pluginEgg').setValue(''); + deluge.client.web.upload_plugin(filename, path, { + success: this.onUploadPlugin, + scope: this, + filename: filename + }); + } + } +}); diff --git a/deluge/ui/web/js/deluge-all/preferences/PluginsPage.js b/deluge/ui/web/js/deluge-all/preferences/PluginsPage.js index fbd04edc8..fa44c5885 100644 --- a/deluge/ui/web/js/deluge-all/preferences/PluginsPage.js +++ b/deluge/ui/web/js/deluge-all/preferences/PluginsPage.js @@ -31,97 +31,17 @@ */ Ext.namespace('Deluge.preferences'); -/** - * @class Deluge.preferences.InstallPluginWindow - * @extends Ext.Window - */ -Deluge.preferences.InstallPluginWindow = Ext.extend(Ext.Window, { - - height: 115, - width: 350, - - bodyStyle: 'padding: 10px 5px;', - - buttonAlign: 'center', - - closeAction: 'hide', - - iconCls: 'x-deluge-install-plugin', - - layout: 'fit', - - modal: true, - - plain: true, - - title: _('Install Plugin'), - - initComponent: function() { - Deluge.add.FileWindow.superclass.initComponent.call(this); - this.addButton(_('Install'), this.onInstall, this); - - this.form = this.add({ - xtype: 'form', - baseCls: 'x-plain', - labelWidth: 70, - autoHeight: true, - fileUpload: true, - items: [{ - xtype: 'fileuploadfield', - id: 'pluginEgg', - emptyText: _('Select an egg'), - fieldLabel: _('Plugin Egg'), - name: 'file', - buttonCfg: { - text: _('Browse') + '...' - } - }] - }); - }, - - onInstall: function(field, e) { - this.form.getForm().submit({ - url: '/upload', - waitMsg: _('Uploading your plugin...'), - success: this.onUploadSuccess, - scope: this - }); - }, - - onUploadPlugin: function(info, obj, response, request) { - this.fireEvent('pluginadded'); - }, - - onUploadSuccess: function(fp, upload) { - this.hide(); - if (upload.result.success) { - var filename = this.form.getForm().findField('pluginEgg').value; - var path = upload.result.files[0] - this.form.getForm().findField('pluginEgg').setValue(''); - deluge.client.web.upload_plugin(filename, path, { - success: this.onUploadPlugin, - scope: this, - filename: filename - }); - } - } -}); - /** * @class Deluge.preferences.Plugins * @extends Ext.Panel */ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { - constructor: function(config) { - config = Ext.apply({ - border: false, - title: _('Plugins'), - layout: 'border', - height: 400, - cls: 'x-deluge-plugins' - }, config); - Deluge.preferences.Plugins.superclass.constructor.call(this, config); - }, + + layout: 'border', + title: _('Plugins'), + border: false, + height: 400, + cls: 'x-deluge-plugins', pluginTemplate: new Ext.Template( '
' + @@ -147,11 +67,10 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { p.css += ' x-grid3-check-col-td'; return '
'; } - - this.grid = this.add({ - xtype: 'grid', - region: 'center', - store: new Ext.data.SimpleStore({ + + this.list = this.add({ + xtype: 'listview', + store: new Ext.data.ArrayStore({ fields: [ {name: 'enabled', mapping: 0}, {name: 'plugin', mapping: 1} @@ -160,30 +79,30 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { columns: [{ id: 'enabled', header: _('Enabled'), - width: 50, + width: .2, sortable: true, - renderer: checkboxRenderer, + tpl: new Ext.XTemplate('{enabled:this.getCheckbox}', { + getCheckbox: function(v) { + return '
'; + } + }), dataIndex: 'enabled' }, { id: 'plugin', header: _('Plugin'), + width: .8, sortable: true, dataIndex: 'plugin' - }], - stripeRows: true, - selModel: new Ext.grid.RowSelectionModel({ - singleSelect: true, - listeners: { - 'rowselect': { - fn: this.onPluginSelect, - scope: this - } - } - }), - autoExpandColumn: 'plugin', - deferredRender: false, + }], + singleSelect: true, + autoExpandColumn: 'plugin' + }); + + this.panel = this.add({ + region: 'center', autoScroll: true, margins: '5 5 5 5', + items: [this.list], bbar: new Ext.Toolbar({ items: [{ cls: 'x-btn-text-icon', @@ -200,7 +119,7 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { }] }) }); - + var pp = this.pluginInfo = this.add({ xtype: 'panel', border: true, @@ -225,7 +144,7 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { }); this.pluginInfo.on('render', this.onPluginInfoRender, this); - this.grid.on('cellclick', this.onCellClick, this); + this.list.on('click', this.onNodeClick, this); deluge.preferences.on('show', this.onPreferencesShow, this); deluge.events.on('PluginDisabledEvent', this.onPluginDisabled, this); deluge.events.on('PluginEnabledEvent', this.onPluginEnabled, this); @@ -261,12 +180,14 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { plugins.push([false, plugin]); } }, this); - this.grid.getStore().loadData(plugins); + this.list.getStore().loadData(plugins); }, - onCellClick: function(grid, rowIndex, colIndex, e) { - if (colIndex != 0) return; - var r = grid.getStore().getAt(rowIndex); + onNodeClick: function(dv, index, node, e) { + var el = new Ext.Element(e.target); + if (el.getAttribute('rel') != 'chkbox') return; + + var r = dv.getStore().getAt(index); r.set('enabled', !r.get('enabled')); r.commit(); if (r.get('enabled')) { @@ -316,9 +237,9 @@ Deluge.preferences.Plugins = Ext.extend(Ext.Panel, { }, onPluginDisabled: function(pluginName) { - var index = this.grid.getStore().find('plugin', pluginName); + var index = this.list.getStore().find('plugin', pluginName); if (index == -1) return; - var plugin = this.grid.getStore().getAt(index); + var plugin = this.list.getStore().getAt(index); plugin.set('enabled', false); plugin.commit(); },