/**
 * The Payments class
 * @extends Ext.Panel
 */
KitchenSink.views.Payments = Ext.extend(Ext.Panel, {

    layout: 'fit',

    // This function is run when initializing the component
    initComponent: function() {

        var self = this; // We need a reference to this instance for use in callbacks

        this.items = [{
            id: 'payment-buttons',
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'top',
                title: 'Payments',
                items: {
                    xtype: 'button',
                    text: 'Back',
                    handler: function() {
                         Ext.dispatch({
                              controller: 'index',
                              action    : 'showList'
                          });
                    }
                }
            }],
            layout: 'vbox',
            items: [
                { xtype: 'spacer' },
                {
                    xtype: 'button',
                    text: 'New Payment',
                    style: 'margin-bottom: 10px;',

                    handler: self.newPaymentHandler,
                    scope: self
                },
                {
                    xtype: 'button',
                    text: 'Commit Transaction',
                    style: 'margin-bottom: 10px;',

                    handler: self.commitTransactionHandler,
                    scope: self
                },
                {
                    id: 'payment-status-button',
                    xtype: 'button',
                    text: 'Payment Status',
                    style: 'margin-bottom: 10px;',
                    disabled: true,

                    handler: self.paymentStatusHandler,
                    scope: self
                },
                {
                    id: 'payment-refund-button',
                    xtype: 'button',
                    text: 'Payment Refund',
                    style: 'margin-bottom: 10px;',
                    disabled: true,

                    handler: self.paymentRefundHandler,
                    scope: self
                },
                {
                    xtype: 'button',
                    text: 'New Subscription',
                    id: 'new-subscription-button',
                    style: 'margin-bottom: 10px;',

                    handler: self.newSubscriptionHandler,
                    scope: self
                },
                {
                    xtype: 'button',
                    text: 'Subscription Status',
                    id: 'subscription-status-button',
                    style: 'margin-bottom: 10px;',
                    disabled: true,

                    handler: self.subscriptionStatusHandler,
                    scope: self
                },
                {
                    xtype: 'button',
                    text: 'Subscription Details',
                    id: 'subscription-details-button',
                    style: 'margin-bottom: 10px;',
                    disabled: true,

                    handler: self.subscriptionDetailsHandler,
                    scope: self
                },
                { xtype: 'spacer' }
            ]
        }];

        KitchenSink.views.Payments.superclass.initComponent.apply(this, arguments);

    },

    newPaymentHandler: function() {

        var self = this;

        // Show a 'loading' overlay mask
        self.setLoading(true);

        // Server side request to process payment. Expects a 'result' object with
        // either an error or an 'authorize payment' URL
        Ext.Ajax.request({
            url: '/payments',
            method: 'POST',
            success: function(response){
                self.setLoading(false);

                // Open authorize payment screen
                KitchenSink.provider.authorizePayment(response, {
                    success: function(response) {
                        // On successful authorisation, proceed to the next page
                        self.setLoading(false);
                        KitchenSink.provider.removeIframe();
                        Ext.Msg.alert('Payment Success', JSON.stringify(response, null, '\t'));

                        Ext.getCmp('payment-status-button').enable();
                        Ext.getCmp('payment-refund-button').enable();
                    },
                    failure: function(error) {
                        self.setLoading(false);
                        KitchenSink.provider.removeIframe();
                        Ext.Msg.alert('Error', JSON.stringify(error));
                    }
                });
            }
        });
    },

    commitTransactionHandler: function() {
        var self = this;
        self.setLoading(true);

        Ext.Ajax.request({
            url: '/commit_transaction',
            method: 'POST',
            success: function(response){
                self.setLoading(false);
                Ext.Msg.alert('Commit Transaction', response.responseText);
            }
        });
    },

    paymentStatusHandler: function() {
        var self = this;
        self.setLoading(true);

        Ext.Ajax.request({
            url: '/payment_status',
            method: 'GET',
            success: function(response){
                self.setLoading(false);
                Ext.Msg.alert('Payment Status', response.responseText);
            }
        });
    },

    paymentRefundHandler: function() {
        var self = this;
        self.setLoading(true);

        Ext.Ajax.request({
            url: '/payment_refund',
            method: 'POST',
            success: function(response){
                self.setLoading(false);
                Ext.Msg.alert('Payment Refund', response.responseText);
            }
        });
    },

    newSubscriptionHandler: function() {

        var self = this;

        // Show a 'loading' overlay mask
        self.setLoading(true);

        // Server side request to process payment. Expects a 'result' object with
        // either an error or an 'authorize payment' URL
        Ext.Ajax.request({
            url: '/subscriptions',
            method: 'POST',
            success: function(response){
                self.setLoading(false);

                // Open authorize payment screen
                KitchenSink.provider.authorizePayment(response, {
                    success: function(response) {
                        // On successful authorisation, proceed to the next page
                        self.setLoading(false);
                        KitchenSink.provider.removeIframe();
                        Ext.Msg.alert('Subscription Success', JSON.stringify(response, null, '\t'));

                        Ext.getCmp('subscription-status-button').enable();
                    },
                    failure: function(error) {
                        self.setLoading(false);
                        KitchenSink.provider.removeIframe();
                        Ext.Msg.alert('Error', JSON.stringify(error));
                    }
                });
            }
        });
    },

    subscriptionStatusHandler: function() {
        var self = this;
        self.setLoading(true);

        Ext.Ajax.request({
            url: '/subscription_status',
            method: 'GET',
            success: function(response){
                self.setLoading(false);
                Ext.getCmp('subscription-details-button').enable();
                Ext.Msg.alert('Subscription Status', response.responseText);
            }
        });
    },

    subscriptionDetailsHandler: function() {
        var self = this;
        self.setLoading(true);

        Ext.Ajax.request({
            url: '/subscription_details',
            method: 'GET',
            success: function(response){
                self.setLoading(false);
                Ext.Msg.alert('Subscription Status', response.responseText);
            }
        });
    }

});

Ext.reg('attPayments', KitchenSink.views.Payments);