var conn = new Ext.data.Connection();
Ext.BLANK_IMAGE_URL = '../adowf/processstepper/static/ext-2.2/resources/images/default/s.gif';
var addUserloadingMask = new Ext.LoadMask(Ext.getBody(), {
	msg : "Adding user - Please wait..."
});
var deleteUserMask = new Ext.LoadMask(Ext.getBody(), {
	msg : "Deleting user - Please wait..."
});
var changePassMask = new Ext.LoadMask(Ext.getBody(), {
	msg : "Changing password - Please wait..."
});
var updateUserMask = new Ext.LoadMask(Ext.getBody(), {
	msg : "Updating user - Please wait..."
});

var userField = new Ext.form.TextField({
	fieldLabel : 'User name',
	name : 'user',
	allowBlank : false,
	disabled : true
});

var userIdField = new Ext.form.TextField({
	fieldLabel : 'User ID',
	name : 'userId',
	allowBlank : false,
	disabled : true
});

var usergroupField = new Ext.form.TextField({
	fieldLabel : 'Usergroup name',
	name : 'usergroup',
	allowBlank : false,
	disabled : true
});

var usergroupIdField = new Ext.form.TextField({
	fieldLabel : 'Usergroup ID',
	name : 'usergroupId',
	allowBlank : false,
	disabled : true
});

Ext.apply(Ext.form.VTypes, {
	existingUser : function(val, field) {
		if (usersPanel.getNodeById(val)) {
			return false
		}
		return true;

	},
	existingUserText : 'The login name is not unique!',

	password : function(val, field) {
		if (field.initialPassField) {
			var pwd = Ext.getCmp(field.initialPassField);
			return (val == pwd.getValue());
		}
		return true;
	},
	passwordText : 'Passwords do not match!'
});

// update for ext-js 2.2
Ext.override(Ext.Container, {
	render : function() {
		Ext.Container.superclass.render.apply(this, arguments);
		if (this.layout) {
			if (typeof this.layout == 'string') {
				this.layout = new Ext.Container.LAYOUTS[this.layout.toLowerCase()](this.layoutConfig);
			}
			this.setLayout(this.layout);
			if (this.activeItem !== undefined) {
				var item = this.activeItem;
				delete this.activeItem;
				this.layout.setActiveItem(item);
				// return;
			}
		}
		if (!this.ownerCt) {
			this.doLayout();
		}
		if (this.monitorResize === true) {
			Ext.EventManager.onWindowResize(this.doLayout, this, [false]);
		}
	}
});
Ext.override(Ext.layout.Accordion, {
	setActiveItem : function(c) {
		c = this.container.getComponent(c);
		if (this.activeItem != c) {
			if (c.rendered && c.collapsed) {
				c.expand();
			} else {
				this.activeItem = c;
			}
		}
	},
	renderItem : function(c) {
		if (this.animate === false) {
			c.animCollapse = false;
		}
		c.collapsible = true;
		if (this.autoWidth) {
			c.autoWidth = true;
		}
		if (this.titleCollapse) {
			c.titleCollapse = true;
		}
		if (this.hideCollapseTool) {
			c.hideCollapseTool = true;
		}
		if (this.collapseFirst !== undefined) {
			c.collapseFirst = this.collapseFirst;
		}
		if (!this.activeItem && !c.collapsed) {
			this.activeItem = c;
		} else if (this.activeItem) {
			c.collapsed = this.activeItem != c;
		}
		Ext.layout.Accordion.superclass.renderItem.apply(this, arguments);
		c.header.addClass('x-accordion-hd');
		c.on('beforeexpand', this.beforeExpand, this);
	}
});
/**
 * @author wutz
 */
//
// Extend the XmlTreeLoader to set some custom TreeNode attributes specific to
// our application:
//
Ext.app.UsersTreeLoader = Ext.extend(Ext.ux.XmlTreeLoader, {
	processAttributes : function(attr) {
		if (attr.userId && attr.userId != null) {
			attr.href = attr.modelid;
			attr.text = attr.firstname + ' ' + attr.lastname + ' [' + attr.login + ']';
			attr.leaf = true;
			attr.loaded = true;
			attr.allowDrag = true;
			attr.allowDrop = false;
			attr.iconCls = attr.idclass;
			attr.userId = attr.userId;
			attr.id = attr.login;
		}
	}
});
//
// Extend the XmlTreeLoader to set some custom TreeNode attributes specific to
// our application:
//
Ext.app.UserGroupsTreeLoader = Ext.extend(Ext.ux.XmlTreeLoader, {
	processAttributes : function(attr) {
		if (attr.idclass == 'UserGroup') {
			attr.href = attr.modelid;
			attr.text = attr.name;
			attr.iconCls = attr.idclass;
			attr.leaf = false;
			attr.loaded = true;
			attr.allowDrag = false;
			attr.allowDrop = true;
			attr.groupId = attr.id;
		} else if (attr.idclass == 'User') {
			attr.text = attr.firstname + ' ' + attr.lastname + ' [' + attr.login + ']';
			attr.leaf = true;
			attr.loaded = true;
			attr.iconCls = attr.idclass;
			attr.allowDrag = true;
			attr.allowDrop = false;
			attr.userId = attr.userId;

		}
	}
});

UsersPanel = function() {
	UsersPanel.superclass.constructor.call(this, {
		id : 'usersPanel-tree',
		title : 'Users',
		region : 'south',
		split : true,
		cmargins : '0 0 0 0',
		rootVisible : false,
		lines : false,
		autoScroll : true,
		height : 300,
		margins : '0 0 0 0',
		bodyBorder : false,
		border : false,
		animate : true,
		collapsible : false,
		enableDD : true,
		useArrows : true,
		preloadChildren : true,
		ddAppendOnly : true,
		loader : new Ext.app.UsersTreeLoader({
			dataUrl : '../adowf/processstepper/getAllUsers.do?userId=' + currentUserId
		}),
		root : new Ext.tree.AsyncTreeNode({
			text : 'Models',
			id : 'root',
			expanded : true,
			loaded : false,
			allowDrag : false,
			allowDrop : false
		})
	});
	this.getSelectionModel().on('selectionchange', function(sm, node) {
		// alert (node.isLeaf());
		if (node && node.isLeaf()) {
			updateUser.form.reset();
			center.getLayout().setActiveItem('user-update');
			userField.setValue(node.attributes.text);
			userIdField.setValue(node.attributes.userId);
			Ext.getCmp('newfirstname').setValue(node.attributes.firstname);
			Ext.getCmp('newlastname').setValue(node.attributes.lastname);
			Ext.getCmp('login').setValue(node.attributes.login);
			if (node.attributes.login == 'poweradmin') {
				Ext.getCmp('delete-user').disable();
			} else {
				Ext.getCmp('delete-user').enable();
			}

			Ext.getCmp('newemail').setValue(node.attributes.email);
		}
	});
};

Ext.extend(UsersPanel, Ext.tree.TreePanel, { // additional methods if needed
});

UserGroupsPanel = function() {
	UserGroupsPanel.superclass.constructor.call(this, {
		id : 'usergroupsPanel-tree',
		region : 'center',
		title : 'User Groups',
		split : true,
		cmargins : '0 0 0 0',
		rootVisible : false,
		lines : false,
		height : 300,
		autoScroll : true,
		margins : '0 0 0 0',
		bodyBorder : false,
		border : false,
		animate : true,
		collapsible : false,
		enableDD : true,
		useArrows : true,
		preloadChildren : true,
		ddAppendOnly : true,
		loader : new Ext.app.UserGroupsTreeLoader({
			dataUrl : '../adowf/processstepper/getAllUserGroups.do?userId=' + currentUserId
		}),
		root : new Ext.tree.AsyncTreeNode({
			text : 'Models',
			id : 'root',
			expanded : true,
			loaded : false,
			allowDrag : false,
			allowDrop : false
		})
	});
	this.getSelectionModel().on('selectionchange', function(sm, node) {
		// alert (node.isLeaf());
		if (node && node.isLeaf()) {
			updateUser.form.reset();
			center.getLayout().setActiveItem('user-update');
			userField.setValue(node.attributes.text);
			userIdField.setValue(node.attributes.userId);
			Ext.getCmp('newfirstname').setValue(node.attributes.firstname);
			Ext.getCmp('newlastname').setValue(node.attributes.lastname);
			Ext.getCmp('login').setValue(node.attributes.login);
			Ext.getCmp('newemail').setValue(node.attributes.email);
			if (node.attributes.login == 'poweradmin') {
				Ext.getCmp('delete-user').disable();
			} else {
				Ext.getCmp('delete-user').enable();
			}
		}
		if (node && !node.isLeaf() && node.attributes.name != 'Uncategorized' && node.attributes.name != 'Trash') {
			center.getLayout().setActiveItem('usergroup-update');
			updateUserGroup.form.reset();
			usergroupField.setValue(node.attributes.text);
			usergroupIdField.setValue(node.attributes.groupId);
		}
		// return node.isLeaf();
	});
	this.on('beforenodedrop', function(dropEvent) {
		var dropUserGroup = userGroupsPanel.getNodeById(dropEvent.target.id);
		if (!dropUserGroup.findChild('userId', dropEvent.dropNode.attributes.userId)) {
			var n = dropEvent.dropNode;
			var copy = new Ext.tree.TreeNode(Ext.apply({}, n.attributes));
			dropEvent.dropNode = copy;
			conn.request({
				url : '../adowf/processstepper/attachUser.do',
				method : 'GET',
				params : {
					'userId' : currentUserId,
					'userGroupId' : dropEvent.target.id,
					'newUserId' : dropEvent.dropNode.attributes.userId
				},
				success : function(responseObject) {

					// userGroupsPanel.getLoader().load(userGroupsPanel.getRootNode());
				},
				failure : function() {
					dropEvent.cancel = false;
					// Undo move!
					Ext.Msg.alert('Status', 'Unable to update category tree in data directory - the update is only shown on the user interface and will be lost after refresh!');
				}
			});
		} else {
			dropEvent.cancel = true;
		}
	});

};

Ext.extend(UserGroupsPanel, Ext.tree.TreePanel, { // additional methods if
													// needed
});

var addUser = new Ext.FormPanel({
	bodyBorder : false,
	border : false,
	labelWidth : 130, // label settings here cascade unless overridden
	url : '../adowf/processstepper/addUser.do',
	frame : false,
	title : 'Add user',
	bodyStyle : 'padding:5px 5px 0;',
	width : 350,
	defaults : {
		width : 230
	},
	defaultType : 'textfield',

	items : [{
		xtype : 'label',
		fieldLabel : 'foo',
		name : 'foo',
		html : 'Specify the user credentials according to the form provided below. The user is created without an assignment to a usergroup(s) and can be moved to the correct usergroup(s).<br><br>'
	}, {
		fieldLabel : 'First name',
		name : 'firstname',
		allowBlank : false,
	}, {
		fieldLabel : 'Last name',
		name : 'lastname',
		allowBlank : false,
	}, {
		fieldLabel : 'Login name',
		name : 'login',
		vtype : 'existingUser',
		id : 'loginname',
		allowBlank : false,
	}, {
		xtype : 'hidden',
		name : 'userId',
		value : currentUserId
	}, {
		xtype : 'hidden',
		name : 'firstlogin',
		value : false
	}, {
		xtype : 'hidden',
		name : 'properties',
		value : ''
	}, {
		fieldLabel : 'Email',
		name : 'email',
		vtype : 'email',
		id : 'email',
		allowBlank : false,
	}, {
		fieldLabel : 'Password',
		name : 'password',
		minLength : 6,
		minLengthText : 'The password is not long enough! (min. 6 alphanumerical characters)',
		inputType : 'password',
		id : 'password',
		allowBlank : false,
	}, {
		fieldLabel : 'Confirm Password',
		name : 'pass-cfrm',
		inputType : 'password',
		vtype : 'password',
		initialPassField : 'password' // id of the initial password field
	}],

	buttons : [
			{
				text : 'Add user and send notification',
				handler : function() {

					addUserloadingMask.show();
					addUser.form.submit({

						success : function(form, action) {
							addUserloadingMask.hide();
							usersPanel.getLoader().load(usersPanel.getRootNode());
							window.open('mailto:' + Ext.getCmp('email').getValue() + '?subject=' + encodeURIComponent('AWA Registration notification') + '&body='
									+ encodeURIComponent('You have been registered a user. Please find your user details below: \n\nLogin: ' + Ext.getCmp('loginname').getValue() + '\nLogin: ' + Ext.getCmp('password').getValue()));
							addUser.form.reset();
						},
						failure : function(form, action) {
							addUserloadingMask.hide();
							Ext.MessageBox.show({
								title : 'Adding user',
								msg : 'Adding user error - try again!',
								buttons : Ext.Msg.OK,
								fn : function() {
									addUser.form.reset();
								},
								icon : Ext.MessageBox.ERROR
							});
						}

					});
				}
			}, {
				text : 'Clear',
				handler : function() {
					addUser.form.reset();
				}
			}]
});

var updateUser = new Ext.FormPanel({
	id : 'user-update',
	bodyBorder : false,
	border : false,
	labelWidth : 130, // label settings here cascade unless overridden
	url : '../adowf/processstepper/editUser.do',
	frame : false,
	title : 'Update user',
	bodyStyle : 'padding:5px 5px 0;',
	width : 350,
	defaults : {
		width : 230
	},
	defaultType : 'textfield',

	items : [
			userField,
			userIdField,
			{
				xtype : 'label',
				fieldLabel : 'foo',
				name : 'foo',
				html : '<br><br><hr noshade style="color:#99BBE8;" size="1">Change password<br><br>'
			},
			{
				fieldLabel : 'Old password',
				name : 'oldpassword',
				id : 'oldpassword',
				minLength : 6,
				minLengthText : 'The password is not long enough! (min. 6 alphanumerical characters)',
				inputType : 'password',
				allowBlank : false,
			},
			{
				fieldLabel : 'New password',
				name : 'newpassword',
				id : 'newpassword',
				minLength : 6,
				minLengthText : 'The password is not long enough! (min. 6 alphanumerical characters)',
				inputType : 'password',
				allowBlank : false,
			},
			{
				fieldLabel : 'Confirm new password',
				name : 'newpass-cfrm',
				id : 'newpass-cfrm',
				inputType : 'password',
				vtype : 'password',
				initialPassField : 'newpassword' // id of the initial
													// password field
			},
			{
				xtype : 'button',
				fieldLabel : 'foo',
				name : 'foo',
				text : 'Change password',
				handler : function() {
					changePassMask.show();
					conn.request({
						url : '../adowf/processstepper/changePassword.do',
						params : 'userId=' + currentUserId + '&updateUserId=' + userIdField.value + '&oldPassword=' + Ext.getCmp('oldpassword').getValue() + '&newPassword=' + Ext.getCmp('newpassword').getValue() + '&newPasswordConfig=' + Ext.getCmp('newpass-cfrm').getValue(),
						success : function(responseObject) {
							changePassMask.hide();
							if (responseObject.responseText != 'OK') {
								Ext.MessageBox.show({
									title : 'Changing password',
									msg : 'Changing password error - try again!',
									buttons : Ext.Msg.OK,
									fn : function() {
									},
									icon : Ext.MessageBox.ERROR
								});
							} else {
								Ext.getCmp('oldpassword').reset();
								Ext.getCmp('newpassword').reset();
								Ext.getCmp('newpass-cfrm').reset();
							}
						},
						failure : function(form, action) {
							changePassMask.hide();
							Ext.MessageBox.show({
								title : 'Changing password',
								msg : 'Changing password error - try again!',
								buttons : Ext.Msg.OK,
								fn : function() {
								},
								icon : Ext.MessageBox.ERROR
							});
						}

					});
				}
			},
			{
				xtype : 'label',
				fieldLabel : 'foo',
				name : 'foo',
				html : '<br><br><hr noshade style="color:#99BBE8;" size="1"><br>Update user details<br><br>'
			},
			{
				fieldLabel : 'First name',
				name : 'firstname',
				id : 'newfirstname',
				allowBlank : false,
			},
			{
				fieldLabel : 'Last name',
				name : 'lastname',
				id : 'newlastname',
				allowBlank : false,
			},
			{
				fieldLabel : 'Login name',
				name : 'login',
				id : 'login',
				disabled : true,
				vtype : 'existingUser',
				allowBlank : false,
			},
			{
				xtype : 'hidden',
				name : 'userId',
				value : currentUserId
			},
			{
				xtype : 'hidden',
				name : 'firstlogin',
				value : false
			},
			{
				xtype : 'hidden',
				name : 'properties',
				value : ''
			},
			{
				fieldLabel : 'Email',
				name : 'email',
				id : 'newemail',
				vtype : 'email',
				allowBlank : false,
			},
			{
				xtype : 'button',
				fieldLabel : 'foo',
				name : 'foo',
				text : 'Update user information',
				handler : function() {
					updateUserMask.show();
					conn.request({
						url : '../adowf/processstepper/editUserData.do',
						params : 'userId=' + currentUserId + '&updateUserId=' + userIdField.value + '&firstname=' + Ext.getCmp('newfirstname').getValue() + '&lastname=' + Ext.getCmp('newlastname').getValue() + '&email=' + Ext.getCmp('newemail').getValue() + '&login='
								+ Ext.getCmp('login').getValue() + '&firstlogin=false&properties=',
						success : function(responseObject) {
							updateUserMask.hide();
							if (responseObject.responseText != 'true') {
								Ext.MessageBox.show({
									title : 'Updating user',
									msg : 'Updating user error - try again!',
									buttons : Ext.Msg.OK,
									fn : function() {
									},
									icon : Ext.MessageBox.ERROR
								});
							} else {
								usersPanel.getLoader().load(usersPanel.getRootNode());
								userGroupsPanel.getLoader().load(userGroupsPanel.getRootNode());
							}
						},
						failure : function(form, action) {
							updateUserMask.hide();
							Ext.MessageBox.show({
								title : 'Updating user',
								msg : 'Updating user error - try again!',
								buttons : Ext.Msg.OK,
								fn : function() {
								},
								icon : Ext.MessageBox.ERROR
							});
						}

					});
				}
			}, {
				xtype : 'label',
				fieldLabel : 'foo',
				name : 'foo',
				html : '<br><br><hr noshade style="color:#99BBE8;" size="1"><br>By clicking on \'Delete user\' the user will be removed from the system. All usergroup assignments are updated accordingly.<br><br>'
			}, {
				xtype : 'button',
				fieldLabel : 'foo',
				name : 'foo',
				id : 'delete-user',
				text : 'Delete user',
				handler : function() {
					deleteUserMask.show();
					conn.request({
						url : '../adowf/processstepper/deleteUser.do',
						params : 'userId=' + currentUserId + '&deleteUserId=' + userIdField.value,
						success : function(form, action) {
							usersPanel.getLoader().load(usersPanel.getRootNode());
							userGroupsPanel.getLoader().load(userGroupsPanel.getRootNode());
							updateUser.form.reset();
							deleteUserMask.hide();
						},
						failure : function(form, action) {
							deleteUserMask.hide();
							Ext.MessageBox.show({
								title : 'Deleting user',
								msg : 'Deleting user error - try again!',
								buttons : Ext.Msg.OK,
								fn : function() {
									updateUser.form.reset();
								},
								icon : Ext.MessageBox.ERROR
							});
						}

					});
				}
			}],

});

var updateUserGroup = new Ext.FormPanel({
	id : 'usergroup-update',
	bodyBorder : false,
	border : false,
	labelWidth : 130, // label settings here cascade unless overridden
	url : '../adowf/processstepper/editUser.do',
	frame : false,
	title : 'Update usergroup',
	bodyStyle : 'padding:5px 5px 0;',
	width : 350,
	defaults : {
		width : 230
	},
	defaultType : 'textfield',

	items : [usergroupField, usergroupIdField, {
		xtype : 'label',
		fieldLabel : 'foo',
		name : 'foo',
		html : '<br><br><hr noshade style="color:#99BBE8;" size="1">Create new usergroup<br><br>'
	}, {
		fieldLabel : 'New user group name',
		name : 'newusergroupname',
		id : 'newusergroupname',
		allowBlank : false,
	}, {
		xtype : 'button',
		fieldLabel : 'foo',
		name : 'foo',
		text : 'Create user group',
		handler : function() {
			changePassMask.show();
			conn.request({
				url : '../adowf/processstepper/createUserGroup.do',
				params : 'userId=' + currentUserId + '&parentGroupId=' + usergroupIdField.value + '&newUserGroupName=' + Ext.getCmp('newusergroupname').getValue() + '&needsUniqueName=true',
				success : function(responseObject) {
					changePassMask.hide();
					userGroupsPanel.getLoader().load(userGroupsPanel.getRootNode());
				},
				failure : function(form, action) {
					changePassMask.hide();
					Ext.MessageBox.show({
						title : 'Creating usergroup',
						msg : 'Creating usergroup error - try again!',
						buttons : Ext.Msg.OK,
						fn : function() {
						},
						icon : Ext.MessageBox.ERROR
					});
				}

			});
		}
	}, {
		xtype : 'label',
		fieldLabel : 'foo',
		name : 'foo',
		html : '<br><br><hr noshade style="color:#99BBE8;" size="1"><br>By clicking on \'Delete usergroup\' the usergroup will be removed from the system. All user assignments are updated accordingly.<br><br>'
	}, {
		xtype : 'button',
		fieldLabel : 'foo',
		name : 'foo',
		text : 'Delete usergroup',
		handler : function() {
			deleteUserMask.show();
			conn.request({
				url : '../adowf/processstepper/deleteUserGroup.do',
				params : 'userId=' + currentUserId + '&userGroupId=' + usergroupIdField.value,
				success : function(form, action) {
					usersPanel.getLoader().load(usersPanel.getRootNode());
					userGroupsPanel.getLoader().load(userGroupsPanel.getRootNode());
					updateUser.form.reset();
					deleteUserMask.hide();
				},
				failure : function(form, action) {
					deleteUserMask.hide();
					Ext.MessageBox.show({
						title : 'Deleting user',
						msg : 'Deleting user error - try again!',
						buttons : Ext.Msg.OK,
						fn : function() {
							updateUser.form.reset();
						},
						icon : Ext.MessageBox.ERROR
					});
				}

			});
		}
	}],

});
var center = new Ext.Panel({
	title : 'Administration actions',
	bodyBorder : false,
	border : false,
	region : 'center',
	layout : 'accordion',
	renderHidden : true,
	collapseFirst : false,
	bodyStyle : 'border-left: solid #99BBE8 1px;',
	items : [addUser, updateUser, updateUserGroup]

});

var usersPanel = new UsersPanel();
var userGroupsPanel = new UserGroupsPanel();
var myBorderPanel = new Ext.Panel({
	bodyBorder : false,
	border : false,
	renderTo : document.getElementById('mainPanel'),
	layout : 'border',
	height : document.getElementById('mainPanel').offsetHeight,
	items : [center, {
		region : 'west',
		cmargins : '0 0 0 0',
		autoScroll : false,
		width : 400,
		containerScroll : false,
		bodyBorder : false,
		border : false,
		layout : 'border',
		items : [userGroupsPanel, usersPanel]
	}]
});