/*
 * Ext JS Library 3.0 RC2
 * Copyright(c) 2006-2009, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.apply(Ext.form.VTypes, {
    availname : function(val, field) {
        var res = true;
        if (field.lastValidationValue 
            && field.lastValidationValue != val
        ) {
            field.isRevalidate = true;
        }
        return field.lastValidationValue && !field.isRevalidate ? field.isLastSuccess : true;
    },
    password : function(val, field) {
        if (field.initialPassField) {
            var pwd = Ext.getCmp(field.initialPassField);
            return (val == pwd.getValue());
        }
        return true;
    },
    passwordText : 'Passwords do not match'
});

Ext.onReady(function(){
    var win;
    var button = Ext.get('tour');

    button.on('click', function(){
        // create the window on the first click and reuse on subsequent clicks
        if(!win){
            var formPanel = new Ext.FormPanel({
                  id: 'request_form',
                  labelWidth: 180,
                  frame: true,
                  title: 'Request A Demo',
                  bodyStyle:'padding:5px 5px 0',
                  width: 350,
                  monitorValid: true,
                  defaults: {
                    width: 175,
                    inputType: 'text'
                  },
                  defaultType: 'textfield',
                  items: [{
                    fieldLabel: 'http://[username].estore.si/',
                    id: 'username',
                    name: 'username',
                    msgTarget: 'under',
                    vtype: 'availname',
                    allowBlank: false,
                    minLength: 3
                  },{
                    fieldLabel: 'Email',
                    name: 'email',
                    msgTarget: 'under',
                    vtype:'email',
                    id: 'email'
                  },{
                    fieldLabel: 'Password',
                    name: 'pass',
                    inputType: 'password',
                    msgTarget: 'under',
                    allowBlank: false,
                    minLength: 7,
                    id: 'pass'
                  },{
                    fieldLabel: 'Confirm Password',
                    name: 'pass-cfrm',
                    msgTarget: 'under',
                    inputType: 'password',
                    vtype: 'password',
                    initialPassField: 'pass' // id of the initial password field
                  }],
                  buttons: [{
                    text:'Submit',
                    formBind: true,
                    handler: function(){
                        formPanel.getForm().submit({
                            url: 'request_demo/create_demo.php',
                            params: {
                                'username': Ext.getCmp('username').getValue(),
                                'email': Ext.getCmp('email').getValue(),
                                'pass': Ext.getCmp('pass').getValue(),
                            }
                        });
                        win.hide();
                        Ext.MessageBox.alert('Success', 'Your request submitted. You will reaceive access by email.');
                    }
                  },{
                    text: 'Close',
                    handler: function(){
                        win.hide();
                    }
                  }]
                });

            win = new Ext.Window({
                el:'request-win',
                layout:'fit',
                width:500,
                height:300,
                closeAction:'hide',
                plain: true,
                
                items: formPanel,
                
            });
        }
        win.show(this);
        formPanel.on('clientvalidation', function (form, valid) {
            var invalid = false
            if (valid && (!Ext.getCmp('username').lastValidationValue || Ext.getCmp('username').isRevalidate)) {
                Ext.getCmp('request_form').stopMonitoring();
                formPanel.getForm().load({
                    url: 'request_demo/check_username.php',
                    params: {
                        'username': Ext.getCmp('username').getValue()
                    },
                    failure: function (form, action) {
                        if (action.result.success == false) {
                            form.markInvalid([{id: 'username', msg: 'This username is reserved'}]);
                            Ext.getCmp('username').lastValidationValue = Ext.getCmp('username').getValue();
                            Ext.getCmp('username').isLastSuccess = false;
                            Ext.getCmp('username').isRevalidate = false;
                            Ext.getCmp('request_form').startMonitoring();
                        } else {
                            Ext.getCmp('username').lastValidationValue = Ext.getCmp('username').getValue();
                            Ext.getCmp('username').isLastSuccess = true;
                            Ext.getCmp('username').isRevalidate = false;
                            form.clearInvalid();
                            Ext.getCmp('request_form').startMonitoring();
                        }
                    },
                    waitMsg: 'Checking username availability...'
                });
            }
            return true;
        });
    });
});


