[pve-devel] r5763 - in pve-manager/pve2/www/new: . window

svn-commits at proxmox.com svn-commits at proxmox.com
Tue Mar 29 13:14:19 CEST 2011


Author: dietmar
Date: 2011-03-29 13:14:18 +0200 (Tue, 29 Mar 2011)
New Revision: 5763

Added:
   pve-manager/pve2/www/new/PVEUtils.js
   pve-manager/pve2/www/new/Workspace.js
   pve-manager/pve2/www/new/window/
   pve-manager/pve2/www/new/window/LoginWindow.js
Modified:
   pve-manager/pve2/www/new/Makefile.am
   pve-manager/pve2/www/new/test.js
Log:
more tests


Modified: pve-manager/pve2/www/new/Makefile.am
===================================================================
--- pve-manager/pve2/www/new/Makefile.am	2011-03-29 06:51:05 UTC (rev 5762)
+++ pve-manager/pve2/www/new/Makefile.am	2011-03-29 11:14:18 UTC (rev 5763)
@@ -1,7 +1,9 @@
 include $(top_builddir)/common.mk
 
 JSSRC= 				                 	\
-	test.js
+	window/LoginWindow.js				\
+	PVEUtils.js					\
+	Workspace.js
 
 pvemanagerlib.js: ${JSSRC}
 	cat ${JSSRC} >$@

Added: pve-manager/pve2/www/new/PVEUtils.js
===================================================================
--- pve-manager/pve2/www/new/PVEUtils.js	                        (rev 0)
+++ pve-manager/pve2/www/new/PVEUtils.js	2011-03-29 11:14:18 UTC (rev 5763)
@@ -0,0 +1,68 @@
+// avoid errors when running without development tools
+if (typeof console == "undefined") {
+   var console = { 
+       dir: function() {}, 
+       log: function() {} 
+   };
+}
+
+Ext.Ajax.defaultHeaders = {
+    'Accept': 'application/json'
+};
+
+Ext.Ajax.on('beforerequest', function(conn, options) {
+    if (PVECSRFPreventionToken) {
+	if (!options.headers) 
+	    options.headers = {};
+	options.headers['CSRFPreventionToken'] = PVECSRFPreventionToken;
+    }
+});
+
+PVE.Utils = function() {
+
+    var log_severity_hash = {
+	0: "panic",
+	1: "alert",
+	2: "critical",
+	3: "error",
+	4: "warning",
+	5: "notice",
+	6: "info",
+	7: "debug"
+    };
+
+
+    var utils = {
+
+	authOK: function() {
+	    return Ext.util.Cookies.get('PVEAuthCookie');
+	},
+
+	authClear: function() {
+	    Ext.util.Cookies.clear("PVEAuthCookie");
+	},
+
+	render_serverity: function (value) {
+
+	    return log_severity_hash[value] || value;
+	},
+
+	render_upid: function(value, metaData, record) { 
+	    var type = record.data.type;
+	    var id = record.data.id;
+
+	    if (type == 'vncproxy') {
+		return "VNC connection to VM " + id;
+	    }
+	    if (type == 'vncshell') {
+		return "VNC shell";
+	    }
+
+	    return value;
+	}			  
+    };
+
+    return utils;
+
+}();
+

Added: pve-manager/pve2/www/new/Workspace.js
===================================================================
--- pve-manager/pve2/www/new/Workspace.js	                        (rev 0)
+++ pve-manager/pve2/www/new/Workspace.js	2011-03-29 11:14:18 UTC (rev 5763)
@@ -0,0 +1,141 @@
+Ext.require([
+    'PVE.window.LoginWindow',
+    'PVE.Utils'
+]);
+
+Ext.define('PVE.Workspace', {
+    extend: 'Ext.container.Viewport',
+
+    // private
+    defaultView: {
+	title: 'Nothing selected',
+	border: false,
+	region:'center'
+    },
+
+    setView: function(comp) {
+	var self = this;
+	
+	if (!comp) 
+	    comp = self.defaultView;
+
+	var cont = self.child('#content');
+	cont.removeAll(true);
+	cont.add(comp);
+	cont.doLayout();
+    },
+
+    showLogin: function() {
+	var self = this;
+
+	PVE.Utils.authClear();
+
+	if (!self.login) {
+	    self.login = Ext.create('PVE.window.LoginWindow', {
+		handler: function() {
+		    self.login = null;
+		}
+	    });
+	}
+        self.login.show();
+    },
+
+    initComponent : function() {
+	var self = this;
+
+	// fixme: what about other errors
+	Ext.Ajax.on('requestexception', function(conn, response, options) {
+	    if (response.status == 401) {
+		self.showLogin();
+	    }
+	});
+
+	Ext.tip.QuickTips.init();
+
+	Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider', 
+						 { secure: true }));
+
+	Ext.apply(self, {
+ 	    layout: 'border',
+	    border: false,
+
+	    items: [
+		{
+		    region: 'north',
+		    height: 30,
+		    layout: { 
+			type: 'hbox',
+			align : 'stretch'
+		    },
+		    baseCls: 'x-plain',		
+		    defaults: {
+			baseCls: 'x-plain'			
+		    },
+		    border: false,
+		    items: [
+			{
+			    margins: '0 0 0 2',
+			    html: '<a target=_blank href="http://www.proxmox.com">' +
+				'<img height=30 width=209 src="/images/proxmox_logo.png"/></a>'
+			},
+			{
+			    flex: 1,
+			    html: '<span class="x-panel-header-text">Proxmox Virtual Environment</span><br>Version 2.0',
+			},
+			{
+			    pack: 'end',
+			    width: 80,
+			    margins: '3 5 0 0',
+			    xtype: 'button',
+			    baseCls: 'x-btn',
+			    text: "Logout",
+			    handler: function() { self.showLogin(); self.setView(); }
+			}
+		    ],
+		    margins: '2 0 5 0'
+		},
+		{
+		    region: 'center',
+		    id: 'content',
+		    margins:'0 5 0 0',
+		    items: self.defaultView
+		},
+		{
+		    //xtype: 'pveResourceTree',
+		    html: 'tree',
+		    width: 200,
+		    region: 'west',
+		    margins: '0 0 0 5',
+		    //  collapsible: true
+		    split: true
+		},
+		{
+		    //xtype: 'pveStatusPanel',
+		    xtype: 'tabpanel',
+		    title: "Realtime logfile viewer",
+		    tabPosition: 'bottom',
+		    region:'south',
+		    margins:'0 5 5 5',
+	    	    height: 200,       
+		    collapsible: true,
+		    split:true,
+		    items: [
+			{
+			    title: 'tab1'
+			},
+			{
+			    title: 'tab2'
+			}
+		    ]
+		}
+	    ]
+	});
+
+	PVE.Workspace.superclass.initComponent.call(self);
+
+        if (!PVE.Utils.authOK())
+	    self.showLogin();
+ 
+    }
+});
+

Modified: pve-manager/pve2/www/new/test.js
===================================================================
--- pve-manager/pve2/www/new/test.js	2011-03-29 06:51:05 UTC (rev 5762)
+++ pve-manager/pve2/www/new/test.js	2011-03-29 11:14:18 UTC (rev 5763)
@@ -36,16 +36,15 @@
 		    items: [
 			{
 			    margins: '0 0 0 2',
-			    html: '<img height=30 width=209 src="/images/proxmox_logo.png"/>'
+			    html: '<a target=_blank href="http://www.proxmox.com"><img height=30 width=209 src="/images/proxmox_logo.png"/></a>'
 			},
 			{
 			    flex: 1,
-			    //html: '<span style="white-space: nowrap;"><b>Proxmox Virtual Environment</b><br>Version 2.0</span>',
-			    html: '<b class="x-panel-header-text">Proxmox Virtual Environment</b><br>Version 2.0</span>',
+			    html: '<span class="x-panel-header-text">Proxmox Virtual Environment</span><br>Version 2.0',
 			},
 			{
 			    pack: 'end',
-			    width: 100,
+			    width: 80,
 			    margins: '3 5 0 0',
 			    xtype: 'button',
 			    baseCls: 'x-btn',
@@ -56,7 +55,7 @@
 		},
 		{
 		    region: 'center',
-		    margins:'0 0 0 0',
+		    margins:'0 5 0 0',
 		    items: self.defaultView
 		},
 		{
@@ -64,7 +63,7 @@
 		    html: 'tree',
 		    width: 200,
 		    region: 'west',
-		    margins: '0 0 0 0',
+		    margins: '0 0 0 5',
 		    //  collapsible: true
 		    split: true
 		},
@@ -74,7 +73,7 @@
 		    title: "Realtime logfile viewer",
 		    tabPosition: 'bottom',
 		    region:'south',
-		    margins:'0 0 0 0',
+		    margins:'0 5 5 5',
 	    	    height: 200,       
 		    collapsible: true,
 		    split:true,

Added: pve-manager/pve2/www/new/window/LoginWindow.js
===================================================================
--- pve-manager/pve2/www/new/window/LoginWindow.js	                        (rev 0)
+++ pve-manager/pve2/www/new/window/LoginWindow.js	2011-03-29 11:14:18 UTC (rev 5763)
@@ -0,0 +1,184 @@
+Ext.define('PVE.window.LoginWindow', {
+    extend: 'Ext.window.Window',
+    requires: ['Ext.data.Store', 'Ext.form.ComboBox'],
+
+    onLogon: function() {
+	var self = this;
+
+	var form = self.getComponent(0).getForm();
+
+	if(form.isValid()){
+            self.el.mask('Please wait...', 'x-mask-loading');
+
+	    form.submit({
+		failure: function(f, resp){
+		    self.el.unmask();
+		    Ext.MessageBox.alert('Failure', "Login failed. Please try again", function() {
+			var uf = form.findField('username');
+			uf.focus(true);
+		    });
+		},
+		success: function(f, resp){
+		    self.el.unmask();
+
+		    if (resp.result && resp.result.data)
+			PVECSRFPreventionToken = resp.result.data.CSRFPreventionToken;
+
+		    var handler = self.handler || Ext.emptyFn;
+		    handler.call(self);
+		    self.close();
+		}
+	    });
+	}
+    },
+
+    initComponent: function() {
+	var self = this;
+
+	Ext.regModel('PVERealm', {
+	    fields: [ 'realm', 'comment', 'default' ],
+	    idProperty: 'realm',
+	    proxy: {
+		type: 'rest',
+		url: "/api2/json/access/domains",
+
+		pageParam : null,
+		startParam: null,
+		limitParam: null,
+		groupParam: null,
+		sortParam: null,
+		filterParam: null,
+		noCache : false,
+
+		reader: {
+		    type: 'json',
+		    root: 'data'
+		}
+	    }
+	});
+ 
+	var realmstore = Ext.create('Ext.data.Store', {
+	    model: 'PVERealm',
+	    autoDestory: true
+	});
+
+	var combo = Ext.create('Ext.form.ComboBox', {
+	    fieldLabel: 'Realm',
+	    name: 'realm',
+	    store: realmstore,
+	    queryMode: 'local',
+	    allowBlank: false,
+	    forceSelection: true,
+	    autoSelect: false,
+	    triggerAction: 'all',
+	    valueField: 'realm',
+	    displayField: 'comment',
+	    getState: function() {
+		return { value: this.getValue() };
+	    },
+	    applyState : function(state) {
+		if (state && state.value) {
+		    this.setValue(state.value);
+		}
+	    },
+	    stateEvents: [ 'select' ],
+	    stateful: true,
+	    stateId: 'pveloginrealm'        
+	});
+
+	realmstore.load({
+	    callback: function(r, o, success) {
+		if (success) {
+		    var def = combo.getValue();
+		    if (!def) {
+			if (r[0] && r[0].data)
+			    def = r[0].data.realm;
+			Ext.each(r, function(record) {
+			    if (record.data && record.data["default"]) 
+				def = record.data.realm;
+			});
+		    }
+		    if (def)
+			combo.setValue(def)
+		}
+	    }
+	});
+
+	Ext.apply(self, {
+            width: 400,
+            height: 160,
+            modal: true,
+	    border: false,
+            draggable: true,
+	    closable: false,
+	    resizable: false,
+	    layout: 'fit',
+            title: 'PVE Manager Login',
+
+	    items: [{
+		xtype: 'form',
+		frame: true,
+		url: '/api2/extjs/access/ticket',
+
+		labelWidth: 70,
+		labelAlign  : 'right',
+
+		defaults: {
+		    anchor: '-5',
+		    allowBlank: false
+		},
+
+		items: [
+		    { 
+			xtype: 'textfield', 
+			fieldLabel: 'User name', 
+			name: 'username',
+			blankText: "Enter your user name",
+			listeners: {
+			    render: function(f) {
+				f.focus(true, 500);
+			    },
+			    specialkey: function(f, e) {
+				var form = f.findParentByType("form").getForm();
+				if (e.getKey() === e.ENTER) {
+				    var pf = form.findField('password');
+				    if (pf.getValue()) {
+					self.onLogon();
+				    } else {
+					pf.focus(false);
+				    }
+				}
+			    }
+			}
+		    },
+		    { 
+			xtype: 'textfield', 
+			inputType: 'password',
+			fieldLabel: 'Password', 
+			name: 'password',
+			blankText:"Enter your password",
+			listeners: {
+			    specialkey: function(field, e) {
+				if (e.getKey() === e.ENTER) {
+				    self.onLogon();
+				}
+			    }
+			}
+		    },
+		    combo
+		],
+		buttons: [
+		    {
+			text: 'Login',
+			handler: function(){
+			    self.onLogon();
+			}
+		    }
+		]
+	    }]
+	});
+
+	PVE.window.LoginWindow.superclass.initComponent.call(self);
+    }
+
+});



More information about the pve-devel mailing list