Ext.ns('com.wilsonalvarez.com');

//the blank image
Ext.BLANK_IMAGE_URL = '../ext-2.3.0/resources/images/default/s.gif';

 var clientename='none';
 var codUser=0;
 var codUserActive=0;
 var codUserType=0;
 var id_note=0;
Ext.onReady(function(){
    
   	var init=false;
	
    var button = Ext.get('show-btn');

	var div = Ext.get('hola');
	
	 var tabs = new Ext.Panel({
            region: 'center',
             split: true,
            width: 585,
			height:568,
			bodyStyle:'background-image:url(http://www.wilsonalvarez.com/img/note.jpg); background-repeat:no-repeat',
            margins:'3 0 3 3',
            cmargins:'3 3 3 3',
			tbar:{
				xtype:'toolbar',
				height:31,
            items: [
				{//Ext.Msg.alert('Entry error','You must fill out the required fields');
                    xtype: 'button',
                    text: 'Save Note',
					iconCls: 'icon-submit',
                    width: 90,
					height:26,
					handler:function(){
					
						if(codUserType!=1)
						Ext.getCmp('envio').getForm().submit({params: {codUser: codUser,id_noteUpdate:id_note},
															  success: function(form,action){
																  Ext.Msg.alert('Message',action.result.message);
																  Treenote.getLoader().load(Treenote.getRootNode());
																  Treenote.getRootNode().expand(this);
																
																  },
															  failure: function(form,action){
																   Ext.Msg.alert('Entry error',action.result.message);
																  }
															 
						});
						else
						Ext.getCmp('envio').getForm().submit({params: {codUser: codUserActive,id_noteUpdate:id_note},
															  success: function(form,action){
																  Ext.Msg.alert('Message',action.result.message);
																  Treenote.getLoader().load(Treenote.getRootNode());
																  Treenote.getRootNode().expand(this);
																  
																  },
															  failure: function(form,action){
																   Ext.Msg.alert('Entry error',action.result.message);
																  }
															 
						});
						
						}
                },
				{//Ext.Msg.alert('Entry error','You must fill out the required fields');
                    xtype: 'button',
                    text: 'add User',
					iconCls: 'pm-icon',
					id:'btnUser',
                    width: 90,
					height:26,
				menu: {
						
						xtype: 'menu',
						id:'menuAddClient',
                		plain: true,		
                		items: {
							
							 xtype: 'buttongroup',
							title: 'Data Client',
							columns: 2,
							items: [	{xtype:'panel',
										 
										 border:false,
										 layout:'absolute',
										 width:245,
										 height:274,
										items:[
										{	xtype:'form',//form
											id:'formclie',
											url:'addclient.php',
											width:235,
											height:275,
											border:false,
											x:5,
											y:5,
											items:[{
													xtype: 'textfield',
													fieldLabel: 'First Name',
													allowBlank:false,
													name:'names',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'Last Name',
												
													name:'surnames',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'User Name',
													allowBlank:false,
													name:'username',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'Password',
													allowBlank:false,
													name:'userpass',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'State',
													
													name:'state',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'City',
												
													name:'district',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'Address',
												
													name:'address',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'Zip Code',
													name:'pobox',
													anchor: '100%'
													},
													{
													xtype: 'textfield',
													fieldLabel: 'E-Mail',
													name:'email',
													anchor: '100%'
													}
											]
										},//fin form
										{	xtype: 'button',
											text: 'Save Client',
											x:178,
											y:242,
											handler:function(){
												
											Ext.getCmp('formclie').getForm().submit({
												success: function(form,action){
																  try{
																	  Ext.Msg.alert('Message',action.result.message);}
																  catch(exception){};
																  Treenote.getLoader().load(Treenote.getRootNode());
																  Treenote.getRootNode().expand(this);
																  },
												failure: function(form,action){
																	try{
																   Ext.Msg.alert('Entry error',action.result.message);}
																   catch(exception){
																	  Ext.getCmp('menuAddClient').hide();
																	    Ext.Msg.alert('Entry error','Must enter the required fields');
																	   };
																  }});
											}
										}// fin btn
										]}
									]

							},//fin menu
							
							
					}
                },
				{
                    xtype: 'button',
                    text: 'Delete Note',
					iconCls:'icon-delete',
					id:'btndelete',
                    width: 90,
					height:26,
					handler:function(){
						Ext.getCmp('envio').getForm().submit({params: {type:'delete',id_note:id_note},
															  success: function(form,action){
																  Ext.Msg.alert('Message',action.result.message);
																  Treenote.getLoader().load(Treenote.getRootNode());
																  Treenote.getRootNode().expand(this);
																  Ext.getCmp('envio').getForm().reset();
																  },
															  failure: function(form,action){
																   Ext.Msg.alert('Entry error',action.result.messag);
																  }
															 
						});
						
						}
                },
                {
                    xtype: 'tbspacer',
					id:'sapace',
                    width: 65
                },
                {
                    xtype: 'tbtext',
                    text: 'Hi User Name',
					id:'usermane'
                },
                {
                    xtype: 'tbspacer',
                    width: 8
                },
				{
					xtype: 'button',
					iconCls:'icon-out',
					handler:function(){
					var mask = new Ext.LoadMask(Ext.get('page1'), {msg:'Logout please wait...'});
							mask.show();
						location.reload();
					
						}
				}
				
            ]
				},
			items: [
					{
					xtype:'form',
					layout:'absolute',
					url:'savenote.php',
					id:'envio',
					width: 473,
					height:465,
					border:false,
					bodyStyle:'background:transparent',
					items:[{
							xtype: 'textarea',
							width: 330,
							height:358,
							border:false,
							name:'note',
							style:'background:transparent;line-height:17px;;overflow:hidden;border:none;font-size:11px',
							x:120,
							y:65
						},
						{
                xtype: 'textfield',
                x: 161,
				width: 200,
				name:'title',
				id:'title',
				style:'background:transparent;border:none;border:none;border-bottom:dashed; border-bottom-width:2px',
                y: 41
            },
            {
                xtype: 'displayfield',
                value: 'Title:',
				style:'background:transparent;border:none',
                x: 121,
                y: 41
            },
			{
                xtype: 'checkbox',
                boxLabel: 'Revised',
				name:'state',
				id:'state',
				cheked:false,
				style:'background:transparent;border:none',
                x: 393,
                y: 430
            },
			{	xtype:'panel',
					border:false,
					layout:'absolute',
					bodyStyle:'background:transparent',
					x:374,
					y:12,
					width: 70,
					height:56,
					items: [//image ini
                    {
                        xtype: 'box',
						id:'btnothers',
						html:'<img src="http://www.wilsonalvarez.com/img/erase.png" style="cursor:pointer;">',
						listeners: {
        render: function(p) {
						p.getEl().on('click',function(){
								Ext.getCmp('envio').getForm().reset();
								id_note=0;
													  });
							}}}]//image fin
						
						
						}]
					}
            
        ]
        });

        // Panel for the west
        var nav = new Ext.Panel({
           // title: 'Navigation',
            region: 'west',
            split: true,
            width: 180,
			height:568,
            collapsible: false,
            margins:'3 0 3 3',
            cmargins:'3 3 3 3',
			tbar:{
				xtype:'toolbar',
				buttonAlign: 'center',
				height:31,
            items: [
					{
					xtype: 'button',
					iconCls:'ampliance',
					height:26,
					text: 'GoTo DocumentYourSystem',
					handler:function(){
					var maskexito = new Ext.LoadMask(Ext.get('page1'), {msg:clientename +'. Transferring to site...'});
				//sessionStorage.codUser=codUser;
				//sessionStorage.names=clientename;
				//sessionStorage.Usertype=codUserType;
				window.location ='http://www.wilsonalvarez.com/documentyoursystem/portal.php';
				maskexito.show();
					
						}
					}
					
					]},
			items:[Treenote]
        });

        var win = new Ext.Window({
            title: 'Yellow Pad',
            closable:true,
            width: 700,
			height:545,
            tools: [{
					id:'close',
			   		handler : function(){ 
					init=true;
					exit(); } //handler
			}],
            plain:true,
            layout: 'border',

            items: [nav, tabs]
        });
		
		win.on('beforeshow',function(){
			if(screen.height<700){
				win.setPosition(50,50);	
			
			}
							
							});
		win.on('move',function(){
			
			
			if(win.getPosition(true)[1]<=0){
				win.setPosition(win.getPosition(true)[0],50);	
				}
							
							});
	
	var form = new Ext.form.FormPanel({
			url: 'acces.php',
			border:false,
			labelWidth: 80,
			height: 116,
			layout: 'absolute',
			bodyStyle: 'padding: 5px; background-color: #DFE8F6',
			
			
			
			items: [ //ini iten4
                            
							{
                                xtype: 'panel',
                                layout: 'form',
                                labelWidth: 60,
                                bodyStyle: 'padding: 5px; background-color: #DFE8F6',
                                border: false,
                                width: 218,
                                id: 'pane4',
								x: 5,
								y: 25,
                                items: [//ini iten5
                                    {
                                        xtype: 'textfield',
                                        fieldLabel: 'User',
                                        anchor: '100%',
                                        name: 'txtuser',
                                        id: 'txtuser',
										allowBlank:false,
										labelStyle: 'color: #457ACB',
										emptyText: 'Enter you user name'
                                    }
                                ]//fin iten 5
                            },
                            {
                                xtype: 'panel',
                                layout: 'form',
                                labelWidth: 60,
                                bodyStyle: 'padding: 8px; background-color: #DFE8F6',
                                border: false,
                                width: 220,
                                id: 'pane5',
								x: 2,
								y: 57,
                                items: [//ini iten 6
                                    {
                                        xtype: 'textfield',
                                        fieldLabel: 'Password',
                                        anchor: '100%',
										inputType: 'password',
										allowBlank:false,
                                        name: 'txtpass',
                                        id: 'txtpass',
										labelStyle: 'color: #457ACB'
										
                                    } ]//fin iten6
                            }]
		});					 
	
	var win2 = new Ext.Window({
           title:" Login",
			width: 382,
			height: 280,
			layout: 'fit',
			draggable: false,
			resizable: false,
			//modal: true,
			border: false,
			//ctCls: 'vice-icon',
			iconCls: 'login-icon',
			tools: [{
					id:'close',
			   		handler : function(){ exit2(); } //handler
			}],
			id: 'wpadre',
			bodyStyle: 'padding: 5px; background-color: #DFE8F6',
			buttons:[{text:'Login',handler:sendData,scope:this},{text:'Abort',handler:exit,scope:this}],
			keys: [
					{ key: [Ext.EventObject.ENTER], handler: function() {
	                    sendData();}
	            	}
			],
			items : [//ini item1
            {
                xtype: 'panel',
                layout: 'table',
                bodyStyle: 'padding: 8px; background-color: #DFE8F6',
				height: 60,
                id: 'pane1',
                layoutConfig: {
                    columns: 2
                },
                
				items: [ //ini iten2
                    {
                        xtype: 'panel',
                        colspan: 2,
                        height: 42,
                        bodyStyle: 'background-color: #DFE8F6',
                        border: false,
                        layout: 'absolute',
                        id: 'pane2',
                        items: [ //ini iten3
                            {
                                xtype: 'label',
                                text: 'Welcome to Yellow Pad Notes',
                                width: 290,
                                x: 10,
                                y: 0,
                                style: 'font-size: 14px; color: #457ACB;'
                            },
                            {
                                xtype: 'label',
                                text: 'Sign in to access',
                                width: 290,
                                x: 10,
                                y: 20,
                                style: 'font-size: 12px; color: #457ACB;'
                            }
                        ]//fin inten3
                    },
                    {
                        xtype: 'panel',
                        bodyStyle: 'padding: 8px; background-color: #DFE8F6',
                        height: 250,
                        width: 119,
                        html: '<img src="http://www.wilsonalvarez.com/img/candado.png" alt="" width="103" height="135"/>',
                        border: false,
                        id: 'pane3'
                    },
                    {
                        //xtype: 'form',
						xtype: 'panel',
                        height: 250,
                        width: 400,
                        border: false,
                        bodyStyle: 'padding: 8px; background-color: #DFE8F6',
                        formId: 'formulario',
                        id: 'panel9',
						items:[form]
                       
                    }
                ]
            }
        ]
			});

	
	function sendData(){
		var mask = new Ext.LoadMask(Ext.get('page1'), {msg:'verifying your credentials. Please wait...'});
		mask.show();
		form.getForm().submit({
			method: 'post',
			success: function(form,action){
				mask.hide();
				var maskexito = new Ext.LoadMask(Ext.get('page1'), {
					msg:action.result.msg +' successful verification. Loading site...'});
					codUser=action.result.codUser;
					clientename=action.result.msg;
					codUserType=action.result.type;
					win2.hide();
					mask.hide();
					win.show();
			
			},
			failure: function(form,action){
				mask.hide();
				switch (action.failureType) {
					  case Ext.form.Action.CLIENT_INVALID:
						 Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
						 break;
					  case Ext.form.Action.CONNECT_FAILURE:
						 Ext.Msg.alert('Failure', 'Ajax communication failed');
						 break;
					  case Ext.form.Action.SERVER_INVALID:
						Ext.Msg.alert('Failure', action.result.msg);
						break;
					  default:
						Ext.Msg.alert('Failure',action.result.msg);
				  			}}

					});
			};//fin function
			
			function exit(){
				
				win.hide();
				}
			function exit2(){
				
				win2.hide();
				}
	
	div.on('click', function(){
	
	if(init==true){
		win.show(this)
		}
	else
	win2.show(this);
	 });
	
try{
	if(document.getElementById('show-btn').name=='autoload'){
		
		if(init==true){
		win.show(this)
		}
	else
	win2.show(this);
		}
}catch(e){};
	
	Ext.getCmp('state').on('check',function(){Ext.getCmp('title').focus();});
	Ext.getCmp('state').on('change',function(){
		var mask = new Ext.LoadMask(Ext.get('page1'), {msg:'Update State. Please wait...'});
		mask.show();			 				
								Ext.getCmp('envio').getForm().submit({params: {type:'update',id_note:id_note},
															  success: function(form,action){
																  Treenote.getLoader().load(Treenote.getRootNode());
																  Treenote.getRootNode().expand(this);
																  mask.hide();
																  Ext.Msg.alert('Message',action.result.message);
																  },
															  failure: function(form,action){
																 	 mask.hide();
																   Ext.Msg.alert('Entry error',action.result.message);
																   
																  }
															 
						});
													 });
	
});



function viewnote(id_not){
		Ext.getCmp('envio').getForm().load({params:{codUser:codUser,view:id_not}}); 
		}