var homing;
    var login; 
    var detailEl;
    
	 
//alert(DISABLE);

    var doSubmit = function(){
         login.getForm().submit({
             waitMsg: 'weryfikacja... ',
	     reset: true,
             success: function(form,action){
                 window.location.replace("index.php");
             },
             failure: function(form,action){
             	obj = Ext.util.JSON.decode(action.response.responseText);
             	Ext.Msg.alert("Niepoprawne logowanie ",obj.errors.kom)
             }
         });
     };

    var doNewlogin = function(){
         newlogin.getForm().submit({
            waitMsg: 'wysyłanie danych... ',
	     		reset: false,
            success: function(form,action){
					Ext.Msg.show({
						title: 'Rejestracja ',
						msg: 'Rejestracja zakończona pomyślnie ',
						width: 300,
						buttons: Ext.MessageBox.OK,
						icon: Ext.MessageBox.INFO
					}); 
	   			Ext.getCmp('content-panel').layout.setActiveItem('login-panel');
					if(!detailEl){
						var bd = Ext.getCmp('details-panel').body;
						bd.update('').setStyle('background','#fff');
						detailEl = bd.createChild(); //create default empty div
					}
    				detailEl.hide().update(Ext.getDom('login-details').innerHTML).slideIn('l', {stopFx:true,duration:.2});
            },
            failure: function(form,action){
            	obj = Ext.util.JSON.decode(action.response.responseText);
            	Ext.Msg.alert("Niepowodzenie przy zakładaniu konta ",obj.errors.kom)
            }
         });
    };

Ext.apply(Ext.form.VTypes, {
    password : function(val, field) {
        if (field.initialPassField) {
            var pwd = Ext.getCmp(field.initialPassField);
            return (val == pwd.getValue());
        }
        return true;
    },
    passwordText : 'Niezgodność haseł '
});

homing = {
	id: 'homing-panel',
	title: 'Pomost - strona główna ',
	layout: 'fit',
	bodyStyle: 'padding:25px',
	contentEl: 'homing-div'
};


 login = new Ext.form.FormPanel({
	//xtype: 'form',
	disabled: TMP_DISABLE,
   labelWidth: 175,
	id: 'login-panel',
	url: 'login.php',
   title: 'Logowanie ',
   bodyStyle:'padding:15px',
	keys: {
			key: Ext.EventObject.ENTER,
			fn: doSubmit
	},
	//layout: 'anchor',
	//anchor: '100% 50%',
   width: 350,
	//height: '50%',
	labelPad: 20,
	layoutConfig: {
		labelSeparator: ''
	},
   defaults: {
		width: 230,
		msgTarget: 'side'
	},
   defaultType: 'textfield',
   items: [{
            fieldLabel: 'Nazwa użytkownika (login)',
            name: 'login',
	    //anchor: '50% 20',
            allowBlank:false
        },{
            fieldLabel: 'Hasło ',
            name: 'password',
	    //anchor: '50% 20',
            allowBlank:false,
            inputType: 'password'
		  },{
				xtype: 'label',
	 			html: '<br><br><hr>'
		  },{
				xtype: 'button',
	 			text: 'Zaloguj ',
	  			width: 130,
	  			handler: doSubmit
		  }
    	]
//    	buttons: [{
//    		text: 'Zaloguj',
//    		handler: doSubmit
//    	}]
});

 newlogin = new Ext.form.FormPanel({
	xtype: 'form', 
	disabled: TMP_DISABLE,
   labelWidth: 225,
	id: 'newlogin-panel',
	url: 'newlogin.php',
   title: 'Nowy użytkownik ',
   bodyStyle:'padding:15px',
   width: 350,
	labelPad: 20,
	layoutConfig: {
		labelSeparator: ''
	},
   defaults: {
		width: 230,
		msgTarget: 'side'
	},
   defaultType: 'textfield',
   items: [{
            fieldLabel: 'Imię ',
            name: 'imie',
            allowBlank:false
        },{
            fieldLabel: 'Nazwisko ',
            name: 'nazwisko',
            allowBlank:false
        },{
            fieldLabel: 'Nazwa użytkownika (login)',
            name: 'login',
            maxLength: 15,
            maxLengthText: 'Nie więcej niż 15 znaków ',
            allowBlank:false
	},{
            fieldLabel: 'Hasło ',
            name: 'password1',
            maxLength: 15,
            maxLengthText: 'Nie więcej niż 15 znaków ',
            id: 'password1',
            allowBlank:false,
            inputType: 'password'
	},{
            fieldLabel: 'Hasło (ponownie) ',
            name: 'password2',
            maxLength: 15,
            maxLengthText: 'Nie więcej niż 15 znaków ',
            allowBlank:false,
            vtype: 'password',
            inputType: 'password',
            initialPassField: 'password1' 
	},{
            fieldLabel: 'Adres e-mail ',
            name: 'email',
            allowBlank:false,
            vtype: 'email'
	},{
				xtype: 'label',
	  			html: '<br><br><hr>'
	},{
				xtype: 'label',
	  			html: '<br><br>W związku z ustawą o ochronie danych osobowych z dn. 29.08.1997 (Dz.U.Nr 133,poz.883) wyrażam zgodę na przetwarzanie moich danych osobowych przez Fundację na rzecz Nauki Polskiej dla celów związanych z rozstrzygnięciem, realizacją i archiwizacją konkursu, zgodnie z dokumentacją konkursową programu POMOST.<br><br>'
	},{
            xtype: 'checkbox',
            //fieldLabel: 'Wyrażam zgodę na przetwarzanie moich danych osobowych ',
            name: 'homing6_ochr',
            allowBlank:false
	},{
				xtype: 'label',
	  			html: '<br><br><hr>'
	},{
				xtype: 'button',
	 			text: 'Wyślij ',
  				width: 130,
				handler: doNewlogin
	}]
//    	buttons: [{
//    		text: 'Wyślij', 
//    		handler: doNewlogin
//    	}]
});


    var treePanel = new Ext.tree.TreePanel({
    	id: 'tree-panel',
    	title: 'Menu',
        region:'north',
        split: true,
        height: 300,
        minSize: 150,
        autoScroll: true,
        
        // tree-specific configs:
        rootVisible: false,
        lines: false,
        singleExpand: true,
        useArrows: true,
        
        loader: new Ext.tree.TreeLoader({
            dataUrl:'menu/login.json'
        }),
        
        root: new Ext.tree.AsyncTreeNode()
    });
    

    treePanel.on('click', function(n){
    	var sn = this.selModel.selNode || {}; 
    	if(n.leaf && n.id != sn.id){  
    		Ext.getCmp('content-panel').layout.setActiveItem(n.id + '-panel');
    		if(!detailEl){
    			var bd = Ext.getCmp('details-panel').body;
    			bd.update('').setStyle('background','#fff');
    			detailEl = bd.createChild(); 
    		}
    		detailEl.hide().update(Ext.getDom(n.id+'-details').innerHTML).slideIn('l', {stopFx:true,duration:.2});
    	}
    });


Ext.onReady(function(){
	

	Ext.QuickTips.init();



	var contentPanel = {
		id: 'content-panel',
		region: 'center',
		layout: 'card',
		//anchor: '100% 50%',
		margins: '2 5 5 0',
		activeItem: 0,
		border: false,
		items: [homing,login,newlogin]
	};


	var detailsPanel = {
		id: 'details-panel',
        	title: 'Szczegóły ',
        	region: 'center',
        	bodyStyle: 'padding-bottom:15px;background:#fff;',
		autoScroll: true,
		html: '<p class="details-info">Proszę wybrać \"Nowe konto\" z Menu powyżej aby utworzyć nowe konto. Jeżeli konto zostało utworzone proszę wybrać \"Logowanie\".</p>'
	};


    new Ext.Viewport({
		layout: 'border',
		title: 'Elektroniczny wniosek programu POMOST',
		items: [{
			xtype: 'box',
			region: 'north',
			applyTo: 'header',
			height: 30
		},{
			layout: 'border',
	    		id: 'layout-browser',
	        	region:'west',
	        	border: false,
	        	split:true,
			margins: '2 0 5 5',
	        	width: 275,
	        	minSize: 100,
	        	maxSize: 500,
			items: [treePanel,detailsPanel]
		},
			contentPanel
		],
        	renderTo: Ext.getBody()
	});

	var hideMask = function () {
		Ext.get('loading').remove();
		Ext.get('loading-mask').remove();
	}

	hideMask.defer(450);




});