winPhoto = function(config){
    this.width = 630;
    this.height = 550;
    this.closable = true;
    this.title = "Administrator Login";
    Ext.apply(this, config);
    winPhoto.superclass.constructor.call(this);
}

var store = new Ext.data.JsonStore({data: {"images": [{"name":"","url":""}]},root: 'images',fields: ['name', 'url']}); 
var tpl = new Ext.XTemplate(
	'<tpl for=".">',
        '<div class="thumb-wrap" id="{name}">',
	    '<div class="thumb" style="margin-left:105px"><img src="{url}" title="{name}" width="200px"></div>',
    '</tpl>',
    '<div class="x-clear"></div>'
);

var images = new Ext.DataView({
    store: store,
    tpl: tpl,
    id: 'images',
    width: 150,
    autoHeight: true,
    multiSelect: false,
    overClass: 'x-view-over',
    itemSelector: 'div.thumb-wrap',
    emptyText: sf_form_no_immagine
});

var captchaUrlUpdate = "http://"+window.location.hostname+"/?c=general&m=captcha" + '&time=' + new Date().getTime();

function updateCaptchaPhoto(){
	Ext.get('activateCodeImg').dom.src =  "http://"+window.location.hostname+"/?c=general&m=captcha" + '&time=' + new Date().getTime();
}

Ext.extend(winPhoto, Ext.Window, {
    onActionComplete: function(f, a){
        if (a && a.result && a.result.success) {
            var path = window.location.pathname, path = path.substring(0, path.lastIndexOf('/') + 1);
            alert(a.result.msg);
            window.location = path; // Change this path to redirect to your path
            window.location.reload(false);
        }
    },
    onActionFailed: function(f, a){
        this.onCapthaChange();
        var form = this.loginPanel.getForm();
        alert(a.result.errors.msg);
        if (a.result.errors.id) {
            var f = form.findField(a.result.errors.id);
            if (f) {
                f.focus();
            }
        }
        //Do Action when Login Failed
    },
    onCapthaChange: function(){
        var captchaURL = this.captchaURL;
        var curr = Ext.get('activateCodeImg');
        curr.slideOut('b', {
            callback: function(){
                Ext.get('activateCodeImg').dom.src = captchaURL + '&time=' + new Date().getTime();
                curr.slideIn('t');
            }
        }, this);
    },
    initComponent: function(){
        this.submitUrl = "login.php";
        this.captchaURL = "http://"+window.location.hostname+"/?c=general&m=captcha";
        var boxCaptcha = new Ext.BoxComponent({
	        xtype: 'container',
			id: 'boxCaptcha',
			width: 150, //250
			height: 30,
			//style: 'left: 105px',
            autoEl: {
				cls: 'captcha_box',
				ctCls : 'captcha_box',
				layout: 'fit',
				margins: '0 0 0 0', 
				onClick: "updateCaptchaPhoto()",
                tag: 'img',
				width: 150,
				height: 30,
                id: 'activateCodeImg',
                title: sf_form_ricarica_codice, //sf_form_codice_sicurezza
				src: captchaUrlUpdate
                //src: this.captchaURL + '&time=' + new Date().getTime()
            },
            listeners: {
                'click': function(){
                    alert('test');
                }
            }
        });
		
        this.loginPanel = new Ext.form.FormPanel({
            xtype: 'form',
            region: 'center',
            method: 'POST',
            buttonAlign: 'center',
            name: 'photoForm',
            id: 'photoForm',
            fileUpload: true,
            labelWidth: 100,
            defaults: {
                width: 250 //250
            },
            frame: true,
            defaultType: 'textfield',
            items: [{
                fieldLabel: 'Nickname',
                id: 'nicknamephoto',
                name: 'nicknamephoto',
                allowBlank: false
            }, {
                fieldLabel: sf_form_email,
                id: 'emailphoto',
                name: 'emailphoto',
                vtype: 'email',
                allowBlank: false
            }, {
                fieldLabel: sf_form_oggetto,
                id: 'objectphoto',
                name: 'objectphoto',
                allowBlank: false
            }, {
                xtype: 'textarea',
                //enableSourceEdit: false,
                id: 'commentphoto',
                name: 'commentphoto',
                fieldLabel: sf_form_commento,
                height: 150,
                width: 480,
                allowBlank: true
            },{
                xtype: 'container',
				width: 20,
				height:20,
				autoEl: {
					cls: 'wiki',
					ctCls : 'wiki',
					layout: 'fit',
	                tag: 'img',
					src: '/icon/marker/wiki.png'
			   },				
            }, {
                vtype: 'url',
                id: 'wikipedia',
                name: 'wikipedia',
                fieldLabel: 'Link Wikipedia',
                allowBlank: true
            }, boxCaptcha, {
                fieldLabel: sf_form_codice_sicurezza,
                id: 'captcha',
                name: 'captcha',
				minLength: 8,
				maxLength: 8,
                allowBlank: false
            }, {
		        xtype: 'checkbox',
		        id: 'privacy',
		        name: 'privacy',
				boxLabel: sf_form_privacy,
		        fieldLabel: '',
				width: 350,
				labelSeparator: '',
				allowBlank: false
		    }, {
                id: 'hiddencity',
                fieldLabel: '',
                labelSeparator: '',
                name: 'hiddencity',
                hidden: true
            }, {
                id: 'hiddenphoto',
                fieldLabel: '',
                labelSeparator: '',
                name: 'hiddenphoto',
                hidden: true
            }, {
                id: 'hiddenposition',
                fieldLabel: '',
                labelSeparator: '',
                name: 'hiddenposition',
                hidden: true
            }],
            buttons: [{
                text: sf_form_invia,
                id: 'invia',
                iconCls: 'sendmail',
                scale: 'medium',
                disabled: true,
                handler: function(){
                    if (Ext.getCmp('photoForm').getForm().isValid() && Ext.getCmp('privacy').getValue()) {
                        Ext.Ajax.request({
                            url: '/general/addPoiPublicUser',
                            params: {
                                nicknamepoi: Ext.getCmp('nicknamephoto').getValue(),
                                emailpoi: Ext.getCmp('emailphoto').getValue(),
                                titlepoi: Ext.getCmp('objectphoto').getValue(),
                                commentpoi: Ext.getCmp('commentphoto').getValue(),
                                hiddencity: Ext.getCmp('hiddencity').getValue(),
                                hiddenphoto: Ext.getCmp('hiddenphoto').getValue(),
                                hiddenposition: Ext.getCmp('hiddenposition').getValue(),
								captchapoi: Ext.getCmp('captcha').getValue(),
								wikipedia: Ext.getCmp('wikipedia').getValue(),
								privacypoi: Ext.getCmp('privacy').getValue()
                            },
                            success: function(response, opts){

								var result = eval(response.responseText);
								switch (result) {
			                        case true:
										Ext.MessageBox.show({
		                                    title: sf_invio_titolo_finestra,
		                                    msg: sf_invio_alert,
		                                    buttons: Ext.MessageBox.OK,
		                                    animEl: 'animation',
		                                    icon: Ext.MessageBox.INFO
		                                });
		                                drawPublicUserPoi();
										winPhoto.hide();
										break;
			                        case false:
										Ext.MessageBox.show({
		                                    title: sf_invio_titolo_finestra,
		                                    msg: sf_invio_alert_errore,
		                                    buttons: Ext.MessageBox.OK,
		                                    animEl: 'animation',
		                                    icon: Ext.MessageBox.ERROR
		                                });
										break;
		                   		 }						

                            },
                            failure: function(){
                                Ext.Msg.alert(sf_invio_titolo_finestra, sf_invio_alert_ko);
                            }
                        })
                        
                    }
                }
            }],
            listeners: {
                'actioncomplete': {
                    fn: this.onActionComplete,
                    scope: this
                },
                'actionfailed': {
                    fn: this.onActionFailed,
                    scope: this
                }
            },
            url: this.submitUrl
        });
        var form = this.loginPanel.getForm();
        function onSubmit(){
            form.submit({
                reset: true
            });
        };
        
        this.layout = "border";
        this.items = [this.loginPanel];
        winPhoto.superclass.initComponent.call(this);
    }
});

var winPhoto = new winPhoto({
    title: sf_titolo_finestra,
    closeAction: 'hide',
    closable: true,
    width: 630,
    height: 480,
    plain: true,
    layout: 'border'
});

winPhoto.on("show",function(){
	Ext.getCmp('photoForm').getForm().reset();
	var captchaURL = "http://"+window.location.hostname+"/?c=general&m=captcha";
    Ext.get('activateCodeImg').dom.src = captchaURL + '&time=' + new Date().getTime();
    Ext.get('activateCodeImg').slideIn('t');
	var defaultMessage = getLatLngUV();
	Ext.getCmp('hiddencity').setValue(document.getElementById("city").value);
	Ext.getCmp('hiddenposition').setValue(defaultMessage);	
	photoName = document.getElementById("city").value+'_'+Math.random()+'.png';
	thisMovie('gmaps').savePic('/save.php', photoName);
	Ext.getCmp('hiddenphoto').setValue(photoName);	
});	

winPhoto.on("beforeshow",function(){
	photoForm.getForm().reset();
	Ext.getCmp('invia').disable(true);
	images.store.removeAll();
});