// Generic Function to prepare the view. Any ExtJS loading stuff can go here, I think.
function prepareGeneralView() {
    tabs.add(productPricingTab);
    //loadAddonData();
}


/*
 * Start preparing the fields
*/
billingCyclePanelsBorder = false;
billingRowTopText = new Ext.Panel({
    layout: "absolute",
    name: "billingRowTopText",
    anchor: "100%",
    height: 15,
    border: billingCyclePanelsBorder,
    items: [
    {
        xtype: "label",
        name: "lblmonthlybilling",
        width: 80,
        x: 105,
        y: 1,
        text: "Price",
        style : "font-weight:bold"

    },
    {
        xtype: "label",
        name: "lblckallowmonthlybillinginsignup",
        width: 125,
        x: 173,
        y: 1,
        text: "Setup",
        style : "font-weight:bold"
    }]
});

// Monthly
txtBillingCyclesMonthlyAmount = new Ext.form.NumberField({
    xtype: "textfield",
    id: "priceMonthly",
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

txtBillingCyclesMonthlySetup = new Ext.form.NumberField({
    xtype: "textfield",
    id: "setupMonthly",
    width: 60,
    x: 153,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesMonthlyAmountAllowInSignup = new Ext.form.Checkbox({
    xtype: "checkbox",
    id: "priceMonthly_checked",
    width: 40,
    fieldLabel: "Allow in signup",
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowMonthlySignup = new Ext.Panel({
    layout: "absolute",
    name: "billingRowMonthlySignup",
    anchor: "100%",
    height: 35,
    border: billingCyclePanelsBorder,
    items: [
    {
        xtype: "label",
        name: "lblmonthlybilling",
        width: 80,
        x: 2,
        y: 6,
        text: "Monthly",
        style : "font-weight:bold"

    },
    txtBillingCyclesMonthlyAmount,
    txtBillingCyclesMonthlySetup,
    ckBillingCyclesMonthlyAmountAllowInSignup,
    {
        xtype: "label",
        name: "lblckallowmonthlybillinginsignup",
        width: 129,
        x: 238,
        y: 6,
        text: "Allow in signup",
        style : "font-weight:bold"
    }]
});

// Quarterly
txtBillingCyclesQuarterlyAmount = new Ext.form.NumberField({
    xtype: "textfield",
    id: "priceQuarterly",
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

txtBillingCyclesQuarterlySetup = new Ext.form.NumberField({
    xtype: "textfield",
    id: "setupQuarterly",
    width: 60,
    x: 153,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesQuarterlyAmountAllowInSignup = new Ext.form.Checkbox({
    id:'priceQuarterly_checked',
    xtype: "checkbox",
    width: 40,
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowQuarterlySignup = new Ext.Panel({

    layout: "absolute",
    name: "billingRowMonthlySignup",
    anchor: "100%",
    height:35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name: "lblquarterlybilling",
            width: 80,
            x: 2,
            y: 6,
            text: "Quarterly",
            style : "font-weight:bold"
         },
         txtBillingCyclesQuarterlyAmount,
         txtBillingCyclesQuarterlySetup,
         ckBillingCyclesQuarterlyAmountAllowInSignup,
        {
            xtype: "label",
            name: "lblckallowquarterlybillinginsignup",
            width: 129,
            x: 238,
            y: 6,
            text: "Allow in signup",
            style : "font-weight:bold"
         }
    ]

});

// Semi Annual
txtBillingCyclesSemiAnnualAmount = new Ext.form.NumberField({
    id:'priceSemiannual',
    xtype: "textfield",
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

txtBillingCyclesSemiAnnualSetup = new Ext.form.NumberField({
    xtype: "textfield",
    id: "setupSemiannual",
    width: 60,
    x: 153,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesSemiAnnualAmountAllowInSignup = new Ext.form.Checkbox({
    id:'priceSemiannual_checked',
    xtype: "checkbox",
    width: 40,
    fieldLabel: "Allow in signup",
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowSemiAnnualSignup = new Ext.Panel({

    layout: "absolute",
    name: "billingRowSemiAnnualSignup",
    anchor: "100%",
    height:35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name: "lblsemiannualbilling",
            width: 80,
            x: 2,
            y: 6,
            text: "Semi-Annual",
            style : "font-weight:bold"

         },
          txtBillingCyclesSemiAnnualAmount,
          txtBillingCyclesSemiAnnualSetup,
          ckBillingCyclesSemiAnnualAmountAllowInSignup,
        {
            xtype: "label",
            name: "lblckallowsemiannualbillinginsignup",
            width: 129,
            x: 238,
            y: 6,
            text: "Allow in signup",
            style : "font-weight:bold"

         }
    ]

});

// Annual
txtBillingCyclesAnnualAmount = new Ext.form.NumberField({
    id:'priceYearly',
    xtype: "textfield",
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

txtBillingCyclesAnnualSetup = new Ext.form.NumberField({
    xtype: "textfield",
    id: "setupAnnual",
    width: 60,
    x: 153,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesAnnualAmountAllowInSignup = new Ext.form.Checkbox({
    id:'priceYearly_checked',
    xtype: "checkbox",
    width: 40,
    fieldLabel: "Allow in signup",
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowAnnualSignup = new Ext.Panel({

    layout: "absolute",
    name: "billingRowAnnualSignup",
    anchor: "100%",
    height:35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name: "lblannualbilling",
            width: 80,
            x: 2,
            y: 6,
            text: "Annual",
            style : "font-weight:bold"

         },
          txtBillingCyclesAnnualAmount,
          txtBillingCyclesAnnualSetup,
          ckBillingCyclesAnnualAmountAllowInSignup,
        {
            xtype: "label",
            name: "lblckallowannualbillinginsignup",
            width: 129,
            x: 238,
            y: 6,
            text: "Allow in signup",
            style : "font-weight:bold"

         }
    ]

});

// Biennial
txtBillingCyclesBiennialAmount = new Ext.form.NumberField({
    id:'price2Years',
    xtype: "textfield",
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

txtBillingCyclesBiennialSetup = new Ext.form.NumberField({
    xtype: "textfield",
    id: "setupBiennial",
    width: 60,
    x: 153,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesBiennialAmountAllowInSignup = new Ext.form.Checkbox({
    id:'price2Years_checked',
    xtype: "checkbox",
    width: 40,
    fieldLabel: "Allow in signup",
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowBiennialSignup = new Ext.Panel({
    layout: "absolute",
    name: "billingRowBiAnnualSignup",
    anchor: "100%",
    height:35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            width: 80,
            x: 2,
            y: 6,
            text: "Two Years",
            style : "font-weight:bold"
         },
          txtBillingCyclesBiennialAmount,
          txtBillingCyclesBiennialSetup,
          ckBillingCyclesBiennialAmountAllowInSignup,
        {
            xtype: "label",
            width: 129,
            x: 238,
            y: 6,
            text: "Allow in signup",
            style : "font-weight:bold"
         }
    ]
});

// One-Time
txtBillingCyclesOneTimePrice = new Ext.form.NumberField({
    id:'onetime',
    width: 60,
    x: 85,
    y: 2,
    value:"0.00",
    validationEvent: false,
    allowBlank: false
});

ckBillingCyclesOneTimeAllowInSignup = new Ext.form.Checkbox({
    id:'priceOneTime_checked',
    xtype: "checkbox",
    width: 40,
    fieldLabel: "Allow in signup",
    x: 219,
    y: 2,
    checked: false
});

billingCyclesRowOneTimePrice = new Ext.Panel({
    layout: "absolute",
    name: "billingRowOneTimePrice",
    anchor: "100%",
    height:35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name: "lblonetimeprice",
            width: 80,
            x: 2,
            y: 6,
            text: "One-Time",
            style : "font-weight:bold"
         },
         txtBillingCyclesOneTimePrice,
         ckBillingCyclesOneTimeAllowInSignup,
        {
            xtype: "label",
            width: 129,
            x: 238,
            y: 6,
            text: "Allow in signup",
            style : "font-weight:bold"
         }
    ]
});

ckBillingCyclesPackageIsTaxable = new Ext.form.Checkbox({
    id:'taxable',
    width: 10,
    x: 2,
    y: 2
});

billingCyclesRowPackageIsTaxable = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 35,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblallowinsignup",
            width: 150,
            x: 27,
            y: 6,
            text: "Product is Taxable?",
            style : "font-weight:bold"
         },
         ckBillingCyclesPackageIsTaxable
    ]
});

// Re-purpose these for the pricing clicked option
ckBillingCyclesForceUpdate = new Ext.form.NumberField({
    id:'pricingClicked',
    width: 10,
    value:'1',
    x: 7,
    y: 4
});

billingCyclesRowForceUpdate = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    hidden:true,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblforceupdate",
            width: 190,
            x: 27,
            y: 7,
            html:"<span style='text-decoration: underline; top: 0px;' class='tip-target' qtip='Select this option to push the updated pricing information for this product to any existing orders.<br><b>Any existing clients will be billed using the new pricing on their next due date.</b>'>" + lang("Update existing orders?") + "</span>",
            style : "font-weight:bold"
         },
         ckBillingCyclesForceUpdate
    ]
});


// Stock control field
txtStockAmount = new Ext.form.NumberField({
    id:'stockAmount',
    xtype: "textfield",
    width: 60,
    //y: 13,
    x:100,
    value:"0",
    validationEvent: false,
    allowBlank: false,
    allowDecimals:false,
    disabled:true
});

stockAmountRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [txtStockAmount,
          {
            xtype: "label",
            name:  "lblstockcontrol",
            width: 100,
            y: 7,
            html:"<span style='text-decoration: underline; top: 0px;' class='tip-target' qtip='Enter the quantity of available stock for this product.<br><br><b>Note:</b> When a product is sold, the available stock quantity is automatically reduced. Stock is NOT automatically adjusted for cancelled orders.'>" + lang("Available Stock") + "</span>",
            style : "font-weight:bold"
         }
    ]
});

// stock control sold out
ckStockControlSoldOut = new Ext.form.Checkbox({
    id:'stockSoldOut',
    width: 10,
    disabled:true,
    x: 7,
    y: 4
});

stockControlSoldOutRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblforceupdate",
            width: 190,
            x: 27,
            y: 7,
            html:"<span style='text-decoration: underline; top: 0px;' class='tip-target' qtip='Select this option show this product as being Sold Out on the order form and hide product pricing when the available stock level has been reached. <br><br><b>Note:</b> If you have enabled the Accept sold out orders option the product pricing will still be displayed.</b>'>" + lang("Set as 'Sold Out'?") + "</span>",
            style : "font-weight:bold"
         },
         ckStockControlSoldOut
    ]
});


// stock control accept orders
ckStockControlAcceptOrders = new Ext.form.Checkbox({
    id:'stockAcceptOrders',
    width: 10,
    disabled:true,
    x: 7,
    y: 4
});

stockControlAcceptOrdersRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblacceptorders",
            width: 190,
            x: 27,
            y: 7,
            html:"<span style='text-decoration: underline; top: 0px;' class='tip-target' qtip='Select this option if you wish for customers to be able to place an order for a product that has no available stock.</b>'>" + lang("Accept Sold Out Orders?") + "</span>",
            style : "font-weight:bold"
         },
         ckStockControlAcceptOrders
    ]
});

// enable stock control
ckEnableStockControl = new Ext.form.Checkbox({
    id:'stockEnable',
    width: 10,
    x: 7,
    y: 4
});

ckEnableStockControl.on('check',function(){
    if (ckEnableStockControl.checked){
        // enable controls
        ckShowStockLevel.enable();
        ckStockControlAcceptOrders.enable();
        ckStockControlSoldOut.enable();
        txtStockAmount.enable();
    } else {
        // Disable controls
        ckShowStockLevel.disable();
        ckStockControlAcceptOrders.disable();
        ckStockControlSoldOut.disable();
        txtStockAmount.disable();

    }
 });

enableStockControlRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblacceptorders",
            width: 190,
            x: 27,
            y: 7,
            text:"Enable stock control options?",
            style : "font-weight:bold"
         },
         ckEnableStockControl
    ]
});


// show stock level in window
ckShowStockLevel = new Ext.form.Checkbox({
    id:'stockShowLevel',
    width: 10,
    disabled:true,
    x: 7,
    y: 4
});

showStockLevelRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [
          {
            xtype: "label",
            name:  "lblshowstocklevel",
            width: 190,
            x: 27,
            y: 7,
            html:"<span style='text-decoration: underline; top: 0px;' class='tip-target' qtip='Select this option if you wish to display the current stock level of this product in the order form.</b>'>" + lang("Show stock level in order form?") + "</span>",
            style : "font-weight:bold"
         },
         ckShowStockLevel
    ]
});

// Coupon Name
txtCouponName = new Ext.form.TextField({
    id:'automaticCoupon',
    xtype: "textfield",
    width: 200,
    //y: 13,
    x:5,
    validationEvent: false,
    allowBlank: true
});

couponNameRow = new Ext.Panel({
    layout: "absolute",
    anchor: "100%",
    height: 35,
    y: 210,
    border: billingCyclePanelsBorder,
    items: [txtCouponName]
});

billingCyclesPanel = new Ext.form.FieldSet({
    layout: "absolute",
    id: 'billingCyclesPanel',
    border:false,
    width: 257,
    height: 450,
    anchor: "100%",
    x: 0,
    style: 'padding:0px;background-color:#F5F5F5 ',
    items: [
        {
            layout: 'column',
            border: false,
            items:  [
                {
                    columnWidth:  0.61,
                    layout:'form',
                    bodyStyle:'padding:0 5px 0 5px',
                    border:       false,
                    items:[{
                            xtype:        'fieldset',
                            id:           'addonsNotice',
                            name:         'addonsNotice',
                            title:        lang('Pricing'),
                            autoHeight:   true,
                            labelAlign:   'top',
                            anchor:'98%',
                            items :[
                                billingRowTopText,
                                billingCyclesRowMonthlySignup,
                                billingCyclesRowQuarterlySignup,
                                billingCyclesRowSemiAnnualSignup,
                                billingCyclesRowAnnualSignup,
                                billingCyclesRowBiennialSignup,
                                billingCyclesRowOneTimePrice,
                                billingCyclesRowPackageIsTaxable,
                                billingCyclesRowForceUpdate,
                                {
                                    xtype:  "label",
                                    y: 25,
                                    text:   "Addon prices for billing cycles not used in this product will not be available to the customer, unless you select the force show option in the addon setup screen.",
                                    style:  "font-weight:bold"
                                }
                            ]
                        }
                    ]
                },
                {
                    columnWidth:  0.39,
                    layout:       'form',
                    border:       false,
                    items:[{
                            xtype:        'fieldset',
                            id:           'stockControl',
                            name:         'stockControl',
                            title:        lang('Stock Control'),
                            autoHeight:   true,
                            anchor:'98%',
                            labelAlign:   'top',
                            items :       [
                                enableStockControlRow,
                                stockAmountRow,
                                //stockControlSoldOutRow,
                                stockControlAcceptOrdersRow,
                                showStockLevelRow
                            ]
                        },{
                            xtype:        'fieldset',
                            id:           'automaticCoupon',
                            name:         'automaticCoupon',
                            title:        lang('Automatic Coupon'),
                            autoHeight:   true,
                            anchor:'98%',
                            labelAlign:   'top',
                            items :       [
                                couponNameRow,{
                                    xtype:  "label",
                                    y: 25,
                                    text:   "Enter an existing Coupon Code in the box above to have the coupon automatically applied during checkout. ",
                                    style:  "font-weight:bold"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
});

/*
 * Make the tab to load
 */
productPricingTab = {
    title:'Pricing & Stock Control',
    id:'productPricingTab',
    items:[billingCyclesPanel]
}