/// <reference path="vswd-ext_2.2.js" />

Ext.onReady(function() {
    init();
});

var wFindCredentials;

function UsernameFinded() {
    wFindCredentials.hide();
    Ext.MessageBox.alert('Nom d\'utilisateur trouvé', 'Votre nom d\'utilisateur a été envoyé à votre adresse email', null, null);
}

function PasswordChanged() {
    wFindCredentials.hide();
    Ext.MessageBox.alert('Mot de passe envoyé', 'Un nouveau mot de passe vous a été envoyé à votre adresse email', null, null);
}

function ShowFindCredentials(elem) {
    if (!wFindCredentials) {

        var fFindCredentials;

        var iFindCredentialsLostDesc = new Ext.form.Label({ text: 'Vous ne vous souvenez plus de votre nom d\'utilisateur ?' });
        var iFindCredentialsLostField = new Ext.form.TextField({ itemCls: 'picdo-form-item', fieldLabel: 'Adresse email', name: 'iEmail', anchor: '-20' });
        var bFindCredentialsLostValid = new Ext.Button({ style: 'margin-bottom:10px;margin-left:362px;', text: 'Valider', iconCls: 'button-valid', handler: function() {
            fFindCredentials.getForm().submit({
                url: '/Register.ashx',
                success: UsernameFinded,
                params: { cmd: 'findusername' },
                waitMsg: 'Identification...'
            });
        }
        });

        var iFindCredentialsChangeDesc = new Ext.form.Label({ text: 'Vous ne vous souvenez plus de votre mot de passe ?' });
        var iFindCredentialsChangeField = new Ext.form.TextField({ itemCls: 'picdo-form-item', fieldLabel: 'Nom d\'utilisateur', name: 'iUsername', anchor: '-20' });
        var bFindCredentialsChangeValid = new Ext.Button({ style: 'margin-left:362px;', text: 'Valider', iconCls: 'button-valid', handler: function() {
            fFindCredentials.getForm().submit({
                url: '/Register.ashx',
                success: PasswordChanged,
                params: { cmd: 'changepassword' },
                waitMsg: 'Identification...'
            });
        }
        });

        fFindCredentials = new Ext.form.FormPanel({
            id: 'fFindCredentialsChange',
            labelWidth: 100,
            bodyStyle: 'padding:5px 15px 5px 15px;',
            items: [iFindCredentialsLostDesc, iFindCredentialsLostField, bFindCredentialsLostValid, iFindCredentialsChangeDesc, iFindCredentialsChangeField, bFindCredentialsChangeValid]
        });

        wFindCredentials = new Ext.Window({
            id: 'wFindCredentials',
            layout: 'fit',
            width: 500,
            height: 215,
            closeAction: 'hide',
            plain: true,
            modal: true,
            resizable: false,
            iconCls: 'window-findcredential',
            title: 'Trouver mes identifiants',
            items: [fFindCredentials]
        });
    }
    wFindCredentials.show(elem);
}

var wRegisterSteps;
var wRegister;
var wRegistered;
var wActivation;

var hRegisterCountryCode;
var iRegisterCountry;

function init() {
    Ext.QuickTips.init();

    Ext.form.Field.prototype.msgTarget = 'side';

    var iRegisterIntro = new Ext.form.Label({ anchor: '95%', name: 'iRegisterIntro', html: Ext.getDom('innerregister').innerHTML });

    var iRegisterUsername = new Ext.form.TextField({ tabIndex: 10, msgTarget: 'side', anchor: '90%', name: 'iRegisterUsername', fieldLabel: 'Nom d\'utilisateur' });

    var iRegisterEmail = new Ext.form.TextField({ tabIndex: 11, msgTarget: 'side', anchor: '90%', name: 'iRegisterEmail', fieldLabel: 'Adresse email' });
    var iRegisterPassword = new Ext.form.TextField({ tabIndex: 12, msgTarget: 'side', anchor: '90%', name: 'iRegisterPassword', fieldLabel: 'Mot de passe', inputType: 'password', minLength: 6, maxLength: 20, maxLengthText: 'Le mot de passe ne peut dépasser 20 caractères', minLengthText: 'Le mot de passe doit au moin faire 6 caractères' });
    var iRegisterPasswordConfirmation = new Ext.form.TextField({ tabIndex: 13, msgTarget: 'side', anchor: '90%', name: 'iRegisterPasswordConfirmation', fieldLabel: 'Confirmation du mot de passe', inputType: 'password', minLength: 6, maxLength: 20, maxLengthText: 'Le mot de passe ne peut dépasser 20 caractères', minLengthText: 'Le mot de passe doit au moin faire 6 caractères' });

    var iRegisterBirthday = new Ext.form.DateField({ tabIndex: 14, msgTarget: 'side', anchor: '90%', name: 'iRegisterBirthday', fieldLabel: 'Date de naissance (jj/mm/aa)' });
    iRegisterCountry = new Ext.ux.IconCombo({ tabIndex: 15, msgTarget: 'side', anchor: '90%', name: 'iRegisterCountry', fieldLabel: 'Pays', store: Countries, valueField: 'countryCode', displayField: 'countryName', iconClsField: 'countryFlag', triggerAction: 'all', mode: 'local' });

    var iRegisterCgu = new Ext.form.Checkbox({ tabIndex: 16, msgTarget: 'side', anchor: '95%', name: 'iRegisterCgu', fieldLabel: 'Conditions générales d\'utilisation (CGU)', boxLabel: 'Je déclare avoir lu et accepter les conditions générales d\'utilisation (CGU) du présent service (PICDO) fourni gratuitement par Zone-ViP Network' });

    hRegisterCountryCode = new Ext.form.Hidden({ name: 'hRegisterCountryCode' });

    wRegister = new Ext.FormPanel({
        labelAlign: 'top',
        frame: false,
        bodyStyle: 'padding:5px 5px 0;',
        title: 'Inscription',
        iconCls: 'window-register',

        items: [iRegisterIntro, hRegisterCountryCode, {
            layout: 'column',
            bodyStyle: 'margin-top:25px;',
            items: [
                            { columnWidth: .5, layout: 'form', items: [iRegisterUsername, iRegisterPassword] },
                            { columnWidth: .5, layout: 'form', items: [iRegisterEmail, iRegisterPasswordConfirmation] }
                         ]
        }, {
            layout: 'column', items: [
                          { columnWidth: .5, layout: 'form', items: [iRegisterBirthday] },
                          { columnWidth: .5, layout: 'form', items: [iRegisterCountry] }
                          ]
        },
                      iRegisterCgu

                ],
        buttons: [{ iconCls: 'button-valid', text: 'S\'inscrire', handler: PostRegister}]
    });

    wRegistered = new Ext.Panel({
        title: 'Inscription réussie',
        iconCls: 'window-registered',
        contentEl: 'innerregistered',
        bodyStyle: 'padding:5px 5px 0'
    });

    wActivation = new Ext.Panel({
        title: 'Activation',
        iconCls: 'window-activation',
        bodyStyle: 'padding:5px 5px 0',
        html: '<p>Votre compte est en cours d\'activaton, merci de patienter...<p>'
    })

    var Qs = Ext.urlDecode(location.search.substring(1, location.search.length));

    wRegisterSteps = new Ext.Panel({
        layout: 'card',
        activeItem: Qs.activation ? 2 : 0,
        width: '80%',
        region: 'center',
        items: [wRegister, wRegistered, wActivation]
    });

    if (Qs.activation) {
        Ext.Ajax.request({ url: 'Register.ashx', success: ActivateAccount, failure: ActivateAccount, params: { cmd: 'activate', code: Qs.activation} });
    }

    var iLoginDesc = new Ext.form.Label({ text: 'Vous possèdez déjà un compte PICDO ?' });
    var iLoginName = new Ext.form.TextField({ name: 'wLoginName', fieldLabel: 'Nom d\'utilisateur' });
    var iLoginPassword = new Ext.form.TextField({ name: 'wLoginPassword', fieldLabel: 'Mot de passe', inputType: 'password' });
    var fLogin = new Ext.FormPanel({
        labelAlign: 'top',
        items: [iLoginName, iLoginPassword],
        bodyStyle: 'margin:15px 0 0 25px;',
        buttons: [{ iconCls: 'button-valid', text: 'S\'identifier', handler: function() {
            fLogin.getForm().submit({
                url: '/Register.ashx',
                scope: fLogin,
                success: LoggedIn,
                params: { cmd: 'login' },
                waitMsg: 'Identification...'
            });
        } }]
        });

        var wLogin = new Ext.Panel({
            title: 'Déjà inscrit ?',
            iconCls: 'window-login',
            height: 222,
            bodyStyle: 'padding:5px 5px 0',
            items: [iLoginDesc, fLogin]
        });

        var iChangePasswordDesc = new Ext.form.Label({ html: 'Vous avez perdu votre nom d\'utilisateur et/ou mot de passe ?<br /><br />' });
        var iChangePasswordDesc2 = new Ext.form.Label({ html: 'Retrouvez-les en cliquant sur le bouton ci-dessous !<br /><br />' });
        var bChangePassword = new Ext.Button({ iconCls: 'button-go', style: 'margin-left:15px', text: 'Trouver mes identifiants', handler: ShowFindCredentials });

        var wChangePassword = new Ext.Panel({
            title: 'Mot de passe perdu ?',
            iconCls: 'window-lostpassword',
            height: 222,
            bodyStyle: 'padding:5px 5px 0',
            items: [iChangePasswordDesc, iChangePasswordDesc2, bChangePassword]
        });

        var wSide = new Ext.Panel({
            region: 'east',
            width: '20%',
            items: [wLogin, wChangePassword]
        });

        var border = new Ext.Panel({
            renderTo: 'all',
            layout: 'border',
            height: 444,
            iconCls: 'window-page',
            items: [
                wRegisterSteps,
                wSide
            ]
        });
    }

    function PostRegister() {
        hRegisterCountryCode.setValue(iRegisterCountry.getValue());
    
        wRegister.getForm().submit({
            url: '/Register.ashx',
            scope: wRegister,
            success: PostedRegister,
            params: { cmd: 'register' },
            waitMsg: 'Inscription...'
        });
    }

    function PostedRegister() {
        wRegisterSteps.getLayout().setActiveItem(1);
    }

    function LoggedIn() {
        window.location.href = '/MyFiles.aspx';
    }

    function ActivateAccount(Success, Request) {
        var icon;
        var text;

        if (Success.status == 200) {
            var State = Ext.util.JSON.decode(Success.responseText);

            if (State.success == true) {
                text = '<p>Félicitation ! Votre compte est maintenant activé. Vous pouvez, dès à présent, vous identifier et profiter des nombreuses fonctions offertes par PICDO.</p><p>Merci d\'avoir choisi PICDO !</p>';
                icon = 'tick';
            }
            else {
                text = 'Aucun compte ne correspond à ce code d\'activation. Réessayer de cliquer sur le lien qui vous a été envoyé par email. Réessayer de cliquer sur le lien qui vous a été envoyé par email. Si le problème persiste, vous pouvez contacter le support technique';
                icon = 'cross';
            }
        }
        else {
            text = 'Votre compte <strong>n\'a pas</strong> été activé suite à une erreur technique. Merci de contacter le support technique pour plus d\'informations';
            icon = 'exclamation';
        }

        var html = '<img src="/images/icons_16/' + icon + '.png" alt="Status" /> <span>' + text + '</span>';

        wActivation.body.update(html);
    }