﻿// #REPLACE (function() { // function wrapper for local scope

Ext.namespace('HRH');

var NS = HRH;
NS.Registration = (function() {

    var labelStyle = 'text-align: right; width: 160px;';
    var USA_CITIZEN = 'USA Citizen';
    var PAYPAL = 'Paypal (+$4)';

    var impl = function() { };
    Ext.extend(impl, Ext.util.Observable, {
        init: function(config) {
            this.intPrice = parseInt(config.intPrice);
            this.usPrice = parseInt(config.usPrice);            

            this.createRegistrationForm();
            this.createContestForm();
            this.createTotalsForm();
        },

        createRegistrationForm: function() {
            this.registrationForm = new Ext.Panel({
                id: 'registrationForm',
                cls: 'registrationForm',
                unstyled: true,
                layout: 'form',
                renderTo: 'registration-ct',
                items: [{
                    xtype: 'textfield',
                    id: 'firstName',
                    allowBlank: false,
                    fieldLabel: 'First Name',
                    maskRe: /^[A-Za-z\- .,]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'lastName',
                    allowBlank: false,
                    fieldLabel: 'Last Name',
                    maskRe: /^[A-Za-z\- .,]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'email',
                    allowBlank: false,
                    fieldLabel: 'Email',
                    vtype: 'email',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'cell',
                    allowBlank: false,
                    fieldLabel: 'Cell Phone',
                    labelStyle: labelStyle,
                    maskRe: /^[0-9- ()]+$/,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'streetAddress',
                    allowBlank: false,
                    fieldLabel: 'Street Address',
                    maskRe: /^[A-Za-z0-9\- .,#]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'streetAddress2',
                    allowBlank: true,
                    fieldLabel: '',
                    maskRe: /^[A-Za-z0-9\- .,#]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'city',
                    allowBlank: false,
                    fieldLabel: 'City',
                    vType: 'alpha',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'state',
                    allowBlank: false,
                    fieldLabel: 'State',
                    vType: 'alpha',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'zip',
                    allowBlank: false,
                    fieldLabel: 'Postal code',
                    maskRe: /^[0-9\-]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'country',
                    allowBlank: false,
                    fieldLabel: 'Country',
                    vType: 'alpha',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    validationEvent: false
                }, {
                    xtype: 'combo',
                    id: 'danceType',
                    allowBlank: false,
                    editable: false,
                    mode: 'local',
                    fieldLabel: 'Dance type',
                    store: ['Lead', 'Follow'],
                    ctCls: 'combo',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    validationEvent: false
                }, {
                    xtype: 'combo',
                    id: 'balSkill',
                    allowBlank: false,
                    editable: false,
                    mode: 'local',
                    fieldLabel: 'Balboa skill level',
                    store: ['Beginner', 'Intermediate', 'Advanced', 'Professional'],
                    ctCls: 'combo',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    validationEvent: false
                }, {
                    xtype: 'combo',
                    id: 'shagSkill',
                    allowBlank: false,
                    editable: false,
                    mode: 'local',
                    fieldLabel: 'Collegiate Shag skill level',
                    store: ['Beginner', 'Intermediate', 'Advanced', 'Professional'],
                    ctCls: 'combo',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    validationEvent: false
                }, {
//                    xtype: 'combo',
//                    id: 'foodPreference',
//                    allowBlank: false,
//                    editable: false,
//                    mode: 'local',
//                    fieldLabel: 'Food preference',
//                    store: ['Vegan', 'Vegetarian', 'No Preference'],
//                    ctCls: 'combo',
//                    labelStyle: labelStyle,
//                    msgTarget: 'side',
//                    triggerAction: 'all',
//                    validationEvent: false
//                }, {
                    xtype: 'combo',
                    id: 'housing',
                    allowBlank: false,
                    editable: false,
                    mode: 'local',
                    fieldLabel: 'Housing',
                    store: ['Seek Housing', 'Provide Housing', 'Not Interested'],
                    ctCls: 'combo',
                    labelStyle: labelStyle,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    validationEvent: false
                }, {
                    xtype: 'textfield',
                    id: 'referred',
                    emptyText: '(optional)',
                    fieldLabel: 'How did you hear about us',
                    maskRe: /^[A-Za-z\- .,]+$/,
                    labelStyle: labelStyle,
                    msgTarget: 'side'
                }
                ]
            });
        },

        createContestForm: function() {
            this.contestForm = new Ext.Panel({
                id: 'contestForm',
                cls: 'registrationForm',
                unstyled: true,
                layout: 'form',
                renderTo: 'contest-ct',
                items: [
                    {
                        xtype: 'checkbox',
                        fieldLabel: 'Balboa Jack and Jill (+$5)',
                        id: 'balboaJnJ',
                        labelStyle: labelStyle,
                        listeners: {
                            'check': this.calculateTotal,
                            scope: this
                        }
                    }, {
                        xtype: 'checkbox',
                        fieldLabel: 'Balboa Strictly (+$15)',
                        id: 'balboaStrictly',
                        labelStyle: labelStyle,
                        listeners: {
                            'check': this.calculateTotal,
                            scope: this
                        }
                    }, {
                        xtype: 'checkbox',
                        fieldLabel: 'Shag Jack and Jill (+$5)',
                        id: 'shagJnJ',
                        labelStyle: labelStyle,
                        listeners: {
                            'check': this.calculateTotal,
                            scope: this
                        }
                    }, {
                        xtype: 'checkbox',
                        fieldLabel: 'Shag Strictly (+$15)',
                        id: 'shagStrictly',
                        labelStyle: labelStyle,
                        listeners: {
                            'check': this.calculateTotal,
                            scope: this
                        }
                    }
                ]
            });
        },

        createTotalsForm: function() {
            this.totalsForm = new Ext.Panel({
                id: 'totalsForm',
                cls: 'registrationForm',
                unstyled: true,
                layout: 'form',
                renderTo: 'totals-ct',
                items: [
                    this.residence = {
                        xtype: 'combo',
                        id: 'residence',
                        allowBlank: false,
                        editable: false,
                        mode: 'local',
                        fieldLabel: 'Residence',
                        store: [USA_CITIZEN, 'International Citizen'],
                        ctCls: 'combo',
                        labelStyle: labelStyle,
                        listeners: {
                            'select': this.calculateTotal,
                            scope: this
                        },
                        msgTarget: 'side',
                        triggerAction: 'all',
                        validationEvent: false
                    }, {
                        xtype: 'combo',
                        id: 'paymentType',
                        allowBlank: false,
                        editable: false,
                        mode: 'local',
                        fieldLabel: 'Payment type',
                        store: [PAYPAL], /*'Snail Mail'*/
                        ctCls: 'combo',
                        labelStyle: labelStyle,
                        listeners: {
                            'select': this.calculateTotal,
                            scope: this
                        },
                        msgTarget: 'side',
                        triggerAction: 'all',
                        validationEvent: false
                    }, {
                        xtype: 'label',
                        id: 'currentPrice',
                        fieldLabel: 'Current Price',
                        labelStyle: labelStyle
                    }, {
                        xtype: 'button',
                        id: 'proofButton',
                        text: 'Register',
                        handler: this.proofClick.createDelegate(this)
                    }
                ]
            });
        },

        calculateTotal: function(one, two, three, noAnimation) {
            var total = Ext.fly('residence').getValue() == ''
                      ? 0
                      : Ext.fly('residence').getValue() != USA_CITIZEN
                      ? this.intPrice : this.usPrice;

            if (Ext.fly('paymentType').getValue() == PAYPAL) total += 4;

            if (Ext.getCmp('balboaJnJ').getValue() === true) total += 5;
            if (Ext.getCmp('shagJnJ').getValue() === true) total += 5;
            if (Ext.getCmp('balboaStrictly').getValue() === true) total += 15;
            if (Ext.getCmp('shagStrictly').getValue() === true) total += 15;

            var result = String.format("${0}.00", total);

            var currentPrice = Ext.getCmp('currentPrice');
            currentPrice.setText(result);

            if (!noAnimation)
                currentPrice.el.frame('#345292');

            return result
        },

        proofClick: function() {
            var valid = true;
            Ext.each(Ext.select('input').elements, function(el) {
                var cmp = Ext.getCmp(el.id);
                if (cmp && !cmp.validate()) {
                    valid = false;
                }
            });

            if (!valid) {
                Ext.Msg.show({
                    title: 'Validation Error',
                    msg: 'An item is invalid.  Please review your answers on the form and try again.',
                    icon: Ext.MessageBox.WARNING,
                    animEl: 'proofButton',
                    buttons: Ext.Msg.OK
                });
                return;
            }

            var labelStyle2 = 'text-align: right;';
            var containerStyle = 'alignLeft';
            var contentStyle = 'margin-left: 20px;';

            var proof = new Ext.Window({
                width: 400,
                id: 'confirmationScreen',
                layout: 'form',
                title: 'Confirmation Screen',
                closable: false,
                items: [{
                    xtype: 'label',
                    fieldLabel: 'Name',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: String.format("{0} {1}",
                                 Ext.fly('firstName').getValue(),
                                 Ext.fly('lastName').getValue())
                }, {
                    xtype: 'label',
                    fieldLabel: 'Email',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('email').getValue()
                }, {
                    xtype: 'label',
                    fieldLabel: 'Cell Phone',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('cell').getValue()
                }, {
                    xtype: 'panel',
                    fieldLabel: 'Address',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    unstyled: true,
                    html: String.format("{0} {1}<br/>{2} {3}, {4} {5}<br/>",
                                 Ext.fly('streetAddress').getValue(),
                                 Ext.fly('streetAddress2').getValue(),
                                 Ext.fly('city').getValue(),
                                 Ext.fly('state').getValue(),
                                 Ext.fly('zip').getValue(),
                                 Ext.fly('country').getValue())
                }, {
                    xtype: 'label',
                    fieldLabel: 'Dance Style',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('danceType').getValue()
                }, {
                    xtype: 'label',
                    fieldLabel: 'Balboa Skill',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('balSkill').getValue()
                }, {
                    xtype: 'label',
                    fieldLabel: 'Shag Skill',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('shagSkill').getValue()
                }, {
//                    xtype: 'label',
//                    fieldLabel: 'Food Preference',
//                    labelStyle: labelStyle2,
//                    ctCls: containerStyle,
//                    style: contentStyle,
//                    text: Ext.fly('foodPreference').getValue()
//                }, {
                    xtype: 'label',
                    fieldLabel: 'Housing',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('housing').getValue()
                }, {
                    xtype: 'panel',
                    unstyled: true,
                    fieldLabel: 'Contests',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    html: String.format('{0}{1}{2}{3}',
                                 Ext.getCmp('balboaJnJ').getValue() === true ? 'Balboa Jack and Jill (+$5)<br/>' : '',
                                 Ext.getCmp('balboaStrictly').getValue() === true ? 'Balboa Strictly (+$15)<br/>' : '',
                                 Ext.getCmp('shagJnJ').getValue() === true ? 'Collegiate Shag Jack and Jill (+$5)<br/>' : '',
                                 Ext.getCmp('shagStrictly').getValue() === true ? 'Collegiate Shag Strictly (+$15)' : '')
                }, {
                    xtype: 'label',
                    fieldLabel: 'Residence',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('residence').getValue()
                }, {
                    xtype: 'label',
                    fieldLabel: 'Payment type',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('paymentType').getValue()
                }, {
                    xtype: 'label',
                    fieldLabel: 'Total',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: this.calculateTotal(null, null, null, true)
                }, {
                    xtype: 'label',
                    fieldLabel: 'Referred by',
                    labelStyle: labelStyle2,
                    ctCls: containerStyle,
                    style: contentStyle,
                    text: Ext.fly('referred').getValue() == '(optional)' ? '' : Ext.fly('referred').getValue()
}],
                    buttons: [{
                        text: 'Confirm',
                        scope: this,
                        handler: function() {
                            var conn = new Ext.data.Connection();
                            conn.request({
                                url: 'adminHandler.ashx',
                                params: {
                                    action: 'insert',
                                    firstName: Ext.fly('firstName').getValue(),
                                    lastName: Ext.fly('lastName').getValue(),
                                    email: Ext.fly('email').getValue(),
                                    cell: Ext.fly('cell').getValue(),
                                    street1: Ext.fly('streetAddress').getValue(),
                                    street2: Ext.fly('streetAddress2').getValue(),
                                    city: Ext.fly('city').getValue(),
                                    state: Ext.fly('state').getValue(),
                                    zip: Ext.fly('zip').getValue(),
                                    country: Ext.fly('country').getValue(),
                                    danceType: Ext.fly('danceType').getValue(),
                                    balSkill: Ext.fly('balSkill').getValue(),
                                    shagSkill: Ext.fly('shagSkill').getValue(),
//                                    foodPreference: Ext.fly('foodPreference').getValue(),
                                    housing: Ext.fly('housing').getValue(),
                                    balboaJJ: Ext.getCmp('balboaJnJ').getValue(),
                                    balboaStrictly: Ext.getCmp('balboaStrictly').getValue(),
                                    shagJJ: Ext.getCmp('shagJnJ').getValue(),
                                    shagStrictly: Ext.getCmp('shagStrictly').getValue(),
                                    residence: Ext.fly('residence').getValue(),
                                    paymentType: Ext.fly('paymentType').getValue(),
                                    price: this.calculateTotal(null, null, null, true),
                                    reference: Ext.fly('referred').getValue() == '(optional)' ? '' : Ext.fly('referred').getValue()
                                },
                                success: function(resp, opt) {
                                    var response = Ext.decode(resp.responseText);
                                    if (typeof (response) != "object")
                                        this.showError();

                                    if (!!response.duplicate) {
                                        Ext.Msg.show({
                                            icon: Ext.MessageBox.Error,
                                            title: 'Duplicate Found',
                                            msg: 'Someone has already registered with your name and email address. If you have not already registered, please contact our support.',
                                            buttons: Ext.MessageBox.OKCANCEL
                                        });
                                    }
                                    else if (!response.added)
                                        this.showError();
                                    /*now we submit to paypal if that is what they selected*/
                                    else if (Ext.fly('paymentType').getValue() == PAYPAL) {
                                        //goto paypal
                                        var payPalForm = new Ext.FormPanel({
                                            hidden: true,
                                            renderTo: document.body,
                                            url: "https://www.paypal.com/cgi-bin/webscr", //"https://www.sandbox.paypal.com/cgi-bin/webscr",
                                            standardSubmit: true,
                                            items: [
                                                { xtype: 'hidden', name: 'item_name_1', value: 'General Registration' },
                                                { xtype: 'hidden', name: 'amount_1', value: String.format("{0}.00", Ext.getCmp('residence').getValue() != USA_CITIZEN ? this.intPrice : this.usPrice) },

                                                { xtype: 'hidden', name: 'item_name_2', value: 'Balboa Jack and Jill' },
                                                { xtype: 'hidden', name: 'amount_2', value: String.format("{0}.00", Ext.getCmp('balboaJnJ').getValue() === true ? 5 : 0) },

                                                { xtype: 'hidden', name: 'item_name_3', value: 'Balboa Strictly' },
                                                { xtype: 'hidden', name: 'amount_3', value: String.format("{0}.00", Ext.getCmp('balboaStrictly').getValue() === true ? 15 : 0) },

                                                { xtype: 'hidden', name: 'item_name_4', value: 'Shag Jack and Jill' },
                                                { xtype: 'hidden', name: 'amount_4', value: String.format("{0}.00", Ext.getCmp('shagJnJ').getValue() === true ? 5 : 0) },

                                                { xtype: 'hidden', name: 'item_name_5', value: 'Shag Strictly' },
                                                { xtype: 'hidden', name: 'amount_5', value: String.format("{0}.00", Ext.getCmp('shagStrictly').getValue() === true ? 15 : 0) },

                                                { xtype: 'hidden', name: 'item_name_6', value: 'Paypal Transfer Fee' },
                                                { xtype: 'hidden', name: 'amount_6', value: '4.00' },

                                                { xtype: 'hidden', name: 'cmd', value: '_cart' },
                                                { xtype: 'hidden', name: 'upload', value: 1 },
                                                { xtype: 'hidden', name: 'business', value: 'matt@fouronthefloor.com' }, //'johnny_1267297355_biz@onarres.com' },
                                                {xtype: 'hidden', name: 'return', value: 'http://www.HotRhythmHoliday.com/ThankYou.aspx' },
                                                { xtype: 'hidden', name: 'cbt', value: 'Continue HRH Registration' }
                                            ]
                                        });

                                        payPalForm.doLayout();
                                        payPalForm.ParamsAdded = true;
                                        payPalForm.getForm().submit();
                                    }
                                    else {
                                        location.href = 'ThankYou.aspx';
                                    }
                                },
                                failure: this.showError,
                                scope: this
                            });
                        }
                    }, {
                        text: 'Cancel',
                        handler: function() { proof.close(); }
}]
                    });

                    proof.show('proofButton', null, this);
                },

                showError: function() {
                    Ext.Msg.show({
                        icon: Ext.MessageBox.Error,
                        title: 'Error',
                        msg: 'An error occured.  Please try again later or contact support.',
                        buttons: Ext.MessageBox.OKCANCEL
                    });
                },

                __dummy: null
            });

            return new impl();
        })();

// #REPLACE })(); // END function wrapper for local scope

