[pve-devel] r5793 - in pve-manager/pve2/www/new: . form tree
svn-commits at proxmox.com
svn-commits at proxmox.com
Thu Apr 7 08:02:47 CEST 2011
Author: dietmar
Date: 2011-04-07 08:02:47 +0200 (Thu, 07 Apr 2011)
New Revision: 5793
Added:
pve-manager/pve2/www/new/StateProvider.js
Modified:
pve-manager/pve2/www/new/Makefile.am
pve-manager/pve2/www/new/Workspace.js
pve-manager/pve2/www/new/form/ViewSelector.js
pve-manager/pve2/www/new/index.pl
pve-manager/pve2/www/new/tree/ResourceTree.js
Log:
impl. local storage state provides, simple history management
Modified: pve-manager/pve2/www/new/Makefile.am
===================================================================
--- pve-manager/pve2/www/new/Makefile.am 2011-04-07 04:27:01 UTC (rev 5792)
+++ pve-manager/pve2/www/new/Makefile.am 2011-04-07 06:02:47 UTC (rev 5793)
@@ -2,6 +2,7 @@
JSSRC= \
PVEUtils.js \
+ StateProvider.js \
data/PVEProxy.js \
data/UpdateQueue.js \
data/UpdateStore.js \
Added: pve-manager/pve2/www/new/StateProvider.js
===================================================================
--- pve-manager/pve2/www/new/StateProvider.js (rev 0)
+++ pve-manager/pve2/www/new/StateProvider.js 2011-04-07 06:02:47 UTC (rev 5793)
@@ -0,0 +1,85 @@
+Ext.define('PVE.StateProvider', {
+ extend: 'Ext.state.Provider',
+
+ constructor: function(config){
+ var self = this;
+
+ self.callParent([config]);
+
+ self.UIState = {};
+
+ // order is important for notifications
+ var list = [
+ 'view',
+ 'rid'
+ ];
+
+ var urlstate = Ext.urlDecode(Ext.History.getToken());
+
+ Ext.Array.each(list, function(name) {
+ if (typeof urlstate[name] != "undefined") {
+ console.log("LOAD URLSTATE " + name);
+ var value = { value: urlstate[name] };
+ window.localStorage.setItem(name, Ext.encode(value));
+ }
+ var text = window.localStorage.getItem(name);
+ var value = Ext.decode(text);
+ self.UIState[name] = value ? value.value : null;
+ });
+ console.dir(self.UIState);
+
+ Ext.History.on('change', function(token) {
+ if (!token) {
+ alert("no more history entries");
+ return;
+ }
+ var newstate = Ext.urlDecode(token);
+ Ext.Array.each(list, function(name) {
+ if (typeof newstate[name] == "undefined")
+ return;
+
+ var newvalue = { value: newstate[name] };
+ var newtext = Ext.encode(newvalue);
+ var oldtext = window.localStorage.getItem(name);
+ if (newtext != oldtext) {
+ window.localStorage.setItem(name, newtext);
+ self.UIState[name] = newstate[name];
+ self.fireEvent("statechange", self, name, newvalue);
+ }
+ });
+ });
+ },
+
+ get: function(name, defaultValue){
+ var self = this;
+ var text = window.localStorage.getItem(name);
+ //console.log("GET " + name + " " + text + " " + Ext.decode(text));
+ if (typeof text == "undefined")
+ return defaultValue;
+
+ var value = Ext.decode(text);
+
+ return value;
+ },
+
+ clear: function(name){
+ var self = this;
+
+ window.localStorage.removeItem(name);
+ self.fireEvent("statechange", self, name, null);
+ },
+
+ set: function(name, value){
+ var self = this;
+
+ if (typeof self.UIState[name] != "undefined") {
+ var cstate = Ext.clone(self.UIState);
+ cstate[name] = value ? value.value : null;
+ var htext = Ext.urlEncode(cstate);
+ Ext.History.add(htext);
+ } else {
+ window.localStorage.setItem(name, Ext.encode(value));
+ self.fireEvent("statechange", self, name, value);
+ }
+ }
+});
\ No newline at end of file
Modified: pve-manager/pve2/www/new/Workspace.js
===================================================================
--- pve-manager/pve2/www/new/Workspace.js 2011-04-07 04:27:01 UTC (rev 5792)
+++ pve-manager/pve2/www/new/Workspace.js 2011-04-07 06:02:47 UTC (rev 5793)
@@ -1,6 +1,8 @@
Ext.define('PVE.Workspace', {
extend: 'Ext.container.Viewport',
- requires: ['PVE.window.LoginWindow', 'PVE.Utils', 'PVE.tree.ResourceTree'],
+ requires: ['PVE.window.LoginWindow',
+ 'PVE.Utils',
+ 'PVE.tree.ResourceTree'],
// private
defaultView: {
@@ -66,11 +68,6 @@
}
});
- Ext.tip.QuickTips.init();
-
- Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider',
- { secure: true }));
-
Ext.apply(self, {
layout: 'border',
border: false,
@@ -139,7 +136,6 @@
title: "NODE ID " + n.data.id,
pveSelNode: n
};
-
self.setView(comp);
}
}
@@ -168,7 +164,7 @@
});
PVE.Workspace.superclass.initComponent.call(self);
-
+
if (!PVE.Utils.authOK())
self.showLogin();
else
Modified: pve-manager/pve2/www/new/form/ViewSelector.js
===================================================================
--- pve-manager/pve2/www/new/form/ViewSelector.js 2011-04-07 04:27:01 UTC (rev 5792)
+++ pve-manager/pve2/www/new/form/ViewSelector.js 2011-04-07 06:02:47 UTC (rev 5793)
@@ -50,23 +50,44 @@
displayField: 'value',
getViewSettings: function() {
- var view = this.getValue();
- return Ext.clone(default_views[view] || default_views.server);
+ var view = self.getValue();
+ return Ext.apply({ id: view }, default_views[view] || default_views.server);
},
getState: function() {
- return { value: this.getValue() };
+ return { value: self.getValue() };
},
- applyState : function(state) {
- if (state && state.value) {
- this.setValue(state.value);
+
+ applyState : function(state, doSelect) {
+ var view = self.getValue();
+ if (state && state.value && (view != state.value)) {
+ var record = store.findRecord('key', state.value);
+ if (record) {
+ self.setValue(state.value, true);
+ if (doSelect) {
+ self.fireEvent('select', self, [record]);
+ }
+ }
}
},
stateEvents: [ 'select' ],
stateful: true,
- stateId: 'pveviewselection'
+ stateId: 'view'
});
- PVE.form.ViewSelector.superclass.initComponent.call(self);
+ self.callParent([]);
+
+ var statechange = function(sp, key, value) {
+ if (key === self.stateId) {
+ self.applyState(value, true);
+ }
+ };
+
+ var sp = Ext.state.Manager.getProvider();
+
+ sp.on('statechange', statechange);
+ self.on('destroy', function() {
+ sp.un('statechange', statechange);
+ });
}
});
\ No newline at end of file
Modified: pve-manager/pve2/www/new/index.pl
===================================================================
--- pve-manager/pve2/www/new/index.pl 2011-04-07 04:27:01 UTC (rev 5792)
+++ pve-manager/pve2/www/new/index.pl 2011-04-07 06:02:47 UTC (rev 5793)
@@ -57,8 +57,19 @@
PVE.UserName = '$username';
PVE.CSRFPreventionToken = '$token';
-Ext.require(['*']);
+Ext.require([
+ '*',
+ 'Ext.state.*',
+ 'PVE.StateProvider',
+ 'PVE.Workspace']);
+
+Ext.History.fieldid = 'x-history-field';
+Ext.History.iframeId = 'x-history-frame';
+
Ext.onReady(function() {
+ Ext.History.init();
+ Ext.tip.QuickTips.init();
+ Ext.state.Manager.setProvider(Ext.create('PVE.StateProvider'));
Ext.create('PVE.Workspace');
});
_EOJS
Modified: pve-manager/pve2/www/new/tree/ResourceTree.js
===================================================================
--- pve-manager/pve2/www/new/tree/ResourceTree.js 2011-04-07 04:27:01 UTC (rev 5792)
+++ pve-manager/pve2/www/new/tree/ResourceTree.js 2011-04-07 06:02:47 UTC (rev 5793)
@@ -1,6 +1,8 @@
Ext.define('PVE.tree.ResourceTree', {
extend: 'Ext.tree.TreePanel',
- requires: ['Ext.tree.*', 'PVE.Utils',
+ requires: ['Ext.tree.*',
+ 'Ext.state.Manager',
+ 'PVE.Utils',
'PVE.form.ViewSelector',
'PVE.data.ResourceStore'],
alias: ['widget.pveResourceTree'],
@@ -163,6 +165,7 @@
var self = this;
var rstore = PVE.data.ResourceStore;
+ var sp = Ext.state.Manager.getProvider();
var pdata = {
view: {},
@@ -246,6 +249,7 @@
if (!pdata.updateCount) {
rootnode.collapse();
rootnode.expand();
+ self.applyState(sp.get(self.stateId));
}
pdata.updateCount++;
@@ -264,6 +268,15 @@
pdata.view = selview.getViewSettings();
+ var statechange = function(sp, key, value) {
+ if (key === self.stateId) {
+ self.applyState(value);
+ }
+ };
+
+
+ sp.on('statechange', statechange);
+
Ext.apply(self, {
store: store,
//useArrows: true,
@@ -275,22 +288,48 @@
rstore.un("load", updateTree)
}
},
+
+ getViewID: function() {
+ return pdata.view.id;
+ },
setView: function(view) {
- var self = this;
-
pdata.view = view;
+ pdata.updateCount = 0;
var rootnode = self.store.node;
rootnode.collapse();
rootnode.removeAll(true);
pdata.dataIndex = {};
updateTree();
- rootnode.expand();
- }
+ },
+ applyState : function(state) {
+ if (state && state.value) {
+ var rootnode = self.store.node;
+ var node = rootnode.findChild('id', state.value, true);
+ if (node) {
+ var sm = self.getSelectionModel();
+ if (!sm.isSelected(node)) {
+ sm.select(node);
+ var cn = node;
+ while ((cn = cn.parentNode)) {
+ if (!cn.isExpanded())
+ cn.expand();
+ }
+ }
+ }
+ }
+ },
+ stateful: false, // we impl. our own state load/save
+ stateId: 'rid'
});
self.callParent();
+ var sm = self.getSelectionModel();
+ sm.on('select', function(sm, n) {
+ sp.set(self.stateId, { value: n.data.id});
+ });
+
rstore.on("load", updateTree);
rstore.startUpdate();
//rstore.stopUpdate();
More information about the pve-devel
mailing list