var AccountButtons = Ext.extend ( Ext.Button, { 
	
		onRender : function(ct, position){
			if(!this.template){
				if(!Ext.Button.AccountButtonTemplate){
					
					Ext.Button.AccountButtonTemplate = new Ext.Template(
						'<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
						'<tr><td class="x-btn-tl"><i>&#160;</i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i>&#160;</i></td></tr>',
						'<tr><td class="x-btn-ml"><i>&#160;</i></td><td class="x-btn-mc stv-btn-account"><button type="{0}"></button></td><td class="x-btn-mr"><i>&#160;</i></td></tr>',
						'<tr><td class="x-btn-bl"><i>&#160;</i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i>&#160;</i></td></tr>',
						'</tbody></table>');
					Ext.Button.AccountButtonTemplate.compile();
				}
				this.template = Ext.Button.AccountButtonTemplate;
			}
	
			var btn, targs = this.getTemplateArgs();
	
			if(position){
				btn = this.template.insertBefore(position, targs, true);
			}else{
				btn = this.template.append(ct, targs, true);
			}
			
			this.btnEl = btn.child(this.buttonSelector);
			this.cell = btn.child( 'td.stv-btn-account' );
			this.mon(this.btnEl, {
				scope: this,
				focus: this.onFocus,
				blur: this.onBlur
			});
	
			this.initButtonEl(btn, this.btnEl);
	
			Ext.ButtonToggleMgr.register(this);
		},
		
		setIcon : function(icon){
			this.icon = icon;
			if(this.el){
				this.cell.setStyle('background-image', icon ? 'url( ' + STV.STATIC_ROOT+'images/app_defaults/'+ icon + ')' : '');
				this.setButtonClass();
			}
			return this;
		},
		
		setText : function(text){
			this.text = text;
			if(this.el){
				this.btnEl.update('<div class="stv-account-creation-title">'+this.text+'</div><div class="stv-account-creation-text">'+this.description+'</div>');
				this.setButtonClass();
			}
			this.doAutoWidth();
			return this;
		},
		
		setIconClass : Ext.emptyFn
	});
	Ext.reg('AccountButtons', AccountButtons); 
		
	
	var AccountTypeView = Ext.extend( Ext.Panel, {
		
		layout : {
			type : 'hbox',
			align: 'stretch'
		},
		
		defaultType : 'AccountButtons',
		
		initComponent : function() {
			
			this.items = this.actions = [<?php echo $menuRenderer->getActions( $comp['Action']['actions']['New_Account'] ); ?> ];
			
			this.children = new Ext.util.MixedCollection();
			
			AccountTypeView.superclass.initComponent.call(this);
		},
		
		onDestroy : function() {
			
			this.children.each(
				function(child) {
					child.destroy();
					this.children.remove(child);
				},
				this
			);
			
			AccountTypeView.superclass.onDestroy.call(this);
		}
	});
	
	var LoginForm = Ext.extend( Ext.form.FormPanel, {
					
		ref: 'form',
		
		baseCls: 'x-plain',
		
		bodyStyle: 'padding:5px;',
		
		border:false,
		
		labelWidth: 75,
		
		initComponent : function() {
			
			this.actions = [<?php echo $menuRenderer->getActions( $comp['Action']['actions']['Login_Tools'] ); ?> ];
			
			this.children = new Ext.util.MixedCollection();
		
			this.items = [{
				xtype:'fieldset',
				buttonAlign: 'center',
				autoHeight: true,
				keys : {
					key: 13, 
					fn: function(k,e){ this.actions[0].execute(null, e) },
					scope: this
				},
				defaults: {
					width: 250,
					allowBlank:false
				},
				defaultType: 'textfield',
				items: [{
					dataIndex: 'username',
					fieldLabel: 'Username',
					name: 'data[Account][username]',
					blankText: STV.FIELD_MESSAGE.account.login_username
				},{
					dataIndex: 'password',
					fieldLabel: 'Password',
					name: 'data[Account][password]',
					blankText: STV.FIELD_MESSAGE.account.login_password,
					inputType: 'password'
				}],
				buttons: this.actions
			}];
			
			LoginForm.superclass.initComponent.call(this);
			
		},
		
		createForm: function(){
			return new Ext.form.BasicForm(null, {
				method: 'POST',
				url: 'accounts/login',
				waitMsgTarget : this.id
			});
		},
		
		onDestroy : function() {
			
			this.children.each(
				function(child) {
					child.destroy();
					this.children.remove(child);
				},
				this
			);
			
			LoginForm.superclass.onDestroy.call(this);
		}
	});
	
	var comp = Ext.extend( STV.Abstract_Controller, {
			
		id : "<?php echo $comp['Menu']['id']; ?>",
		
		name : "<?php echo $comp['Menu']['name']; ?>",
		
		icon : "<?php echo $comp['Menu']['icon']; ?>",	
		
		desc : "<?php echo $comp['Menu']['description']; ?>",
	
		help : "<?php echo $comp['Menu']['help_id']; ?>",
		
		instructions : "<?php echo $comp['Menu']['instruction']; ?>",
		
		base_controller : 'accounts',
		
		configureDisplay : function() {
			
			TV.loadBillboard({
				url: null,
				forcefit: true,
				inst: this.instructions,
				duration: 60
			});
			
			this.display.setActiveView(
				this.children.add(
					'view', 
					this.display.addView({
						xtype : 'container',
						border: false,
						layout: 'border',
						items:[
							new AccountTypeView({
								region:'center',
								margins: {top: 5, bottom:5, left:5, right:0}
							}),
							new LoginForm({	   
								region:'east',
								width: 400
							})
						]
					})
				)
			);
			this.view = this.children.get('view');
		}
	});
	return comp;