/**
 * Dynamic Forms that needs to be created according to the market id used in the application context
 * There is an array of forms that is parsed through a JSON file that looks for new elements at the Database
 * According to the marketId parameter passed at the url we look for any dynamic forms that needs to be implemented
 *
 * ATTENTION: In order to fully understand the structure of dynamicForms please, after setting the DynamicForms
 * write in firebug's console: console.log(DynamicForms.getDynamicForms()); to display the whose structure of this object
 *
 * @author ppolyzos
 */
var DynamicForms = function(){
    var dynamicForms; //Actual forms that contains all the necessary panels needed for the application
    /**
     * Convert JSON Form panel structure to an actual panel with all elements
     * that are described inside the JSON Form Panel
     * @param (Object) jsonFormPanelDescriptor that has the following elements:
     * 1)formPanelJSON.id : id to be used to identify it
     * 2)formPanelJSON.title: title to be used if something is needed to be displayed
     * 3)formPanelJSON.type: where it belongs (Products of BusinessCatalog)
     * 4)formPanelJSON.formItems: included description for each form item
     *
     * A form Item has the following properties
     * 1)formItem.name : name that is used in form.submit
     * 2)formItem.title: fieldLabel for the item
     * 3)formItem.type: type of the form item
     * 4)formItem.visible
     */
    var parseSingleFormPanel = function(formPanel, type){
        var singleFormPanel; //This panel may contain more than one panels
        var arrayOfItems = new Array();
        
        for (var i = 0; i < formPanel.formItems.length; i++) {
            arrayOfItems.push({
                xtype: formPanel.formItems[i].type,
                fieldLabel: i === 0 ? '<b>' + formPanel.title + '<b>' : '',
                hideLabel: i === 0 && formPanel.title.length !== 0 ? false : true,
                boxLabel: formPanel.formItems[i].title,
                name: formPanel.formItems[i].name
            });
        }
        
        //This object is used to create a column layout and display all components
        //in a column format like the above schema:
        // Field --- Field --- Field --- Field --- Field
        //This object is the used at the items property of singleFormPanel
        var columns = new Array();
        for (var i = 0; i < arrayOfItems.length; i++) {
            var column = new Object();
            column.layout = 'form';
            column.border = false;
            column.items = [arrayOfItems[i]];
            columns.push(column);
        }
        
        //Create a form panel for a specific category (Have in mind BusinessCatalog category chooser according to marketId)
        //Single form panel may contain different number of checkBoxes and all the inner checkBoxes are instantiated 
        //at the columns array of column object (Look above)
        singleFormPanel = new Ext.Panel({
            baseCls: 'x-plain',
            bodyStyle: 'padding: 5px; position: relative',
            autoScroll: true,
            labelAlign: 'left',
            id: type + '_' + formPanel.id,
            layout: 'form',
            items: [{
                layout: 'column',
                border: false,
                items: columns
            }]
        });
        
        return singleFormPanel;
    }
    
    /**
     * Create an array of all dynamic panels that are associated to the type
     * All included dynamic forms are hidden except the one that user requested to be visible
     * based on the displayElementId
     */
    var getArrayOfDynamicFormPanels = function(type){
        var arrayOfDynamicFormPanels = new Array();
        for (var i = 0; i < dynamicForms.size; i++) {
            arrayOfDynamicFormPanels.push(parseSingleFormPanel(dynamicForms.formPanels[i], type));
        }
        
        //Hide all contained panels except the one from the displayElementId
        return arrayOfDynamicFormPanels;
    }
    
    //---- PUBLIC METHODS ----//
    return {
        //Set the dynamicForms according to the JSON Object that is being wrapped when the 
        //application is instantiated
        setDynamicForms: function(dynamicFormsValue){
            dynamicForms = dynamicFormsValue;
        },
        /**
         * @return dynamicForms
         */
        getDynamicForms: function(){
            return dynamicForms;
        },
        /**
         * This method is used in order for other application's components to understand
         * what is the marketId and according to marketId value to hide or show dynamic form elements
         * @return marketId
         */
        getMarketId: function(){
            return dynamicForms.marketId;
        },
        /**
         * @return the number of form panels inside the dynamicForms
         */
        getSize: function(){
            return dynamicForms.size;
        },
        /**
         * Get dynamic form panel for the specific type
         * Type can be: businessCatalog or products
         * If for example the form panel for the businessCatalog is requested
         * The dynamic forms is being parsed in order to create the necessary panels for
         * the business catalog and build the actual form panel
         * The form panel will have some panels that not all should be visible at once and by
         * defining an id this single panel should be visible and all the others will be hidden
         */
        getArrayOfDynamicFormPanels: function(type){
            return getArrayOfDynamicFormPanels(type);
        },
        parseSingleFormPanel: function(formPanel, type){
            return parseSingleFormPanel(formPanel);
        }
    }
}
();