Ext.define("Portfolio.menu.form.App", {

    xtype: "portfolio-menu-form-app",

    extend: "Ext.form.Panel",

    layout: "fit",

    config: {
        tabPanel: null,
        content: null,
        rolePanel: null
    },

    trackResetOnLoad: true,

    requires: [
        "Portfolio.ux.navigation.controller.UserRole",
        "Portfolio.ux.navigation.view.UserRolePanel",
        "Portfolio.ux.form.field.BindingField"
    ],

    initComponent: function() {

        var i_self = this;
        
        i_self.callParent(arguments);

        i_self.add(i_self.createLayout());

        i_self.loadRecord(i_self.record);

    },

    createLayout: function() {

        var i_self = this;

        var i_tabpanel = Ext.widget("tabpanel", {
            layout: "fit",
            defaults: {
				iconAlign: "right"
			},
            items: [
                i_self.createContent(),
                i_self.createRoles()
            ]
        });

        i_self.setTabPanel(i_tabpanel);

        return i_tabpanel;
    },

    createContent: function() {

        var i_self = this;

        var i_panel = Ext.widget("panel", {
            title: ip2.i18n({
                da: "Indhold",
                en: "Content"
            }),
            layout: "anchor",
            autoScroll: true,
            bodyPadding: 10,
            defaults: {
                anchor: "100%",
                maxWidth: 800
            }
        });

        var a_items = [
            {
                xtype: "i18ntextfield",
                name: "title",
                allowBlank: false,
                fieldLabel: ip2.i18n({
                    da: "Titel",
                    en: "Titel"
                })
            },
            {
                xtype: "ux.form.field.iconpicker",
                name: "icon",
                fieldLabel: ip2.i18n({
                    da: "Ikon",
                    en: "Icon"
                })
            },
            {
                xtype: "textfield",
                name: "appName",
                allowBlank: false,
                regex: new RegExp("^\\w+(?:\\.\\w+)*$"),
                fieldLabel: ip2.i18n({
                    da: "App navn",
                    en: "App name"
                })
            },
            {
                xtype: "textfield",
                name: "appFolder",
                regex: new RegExp("^\\/\\w+.(?:\\w+|[\\/-])*(?:\\w+|\\/)$"),
                allowBlank: false,
                fieldLabel: ip2.i18n({
                    da: "App folder",
                    en: "App folder"
                })
            },
            {
                xtype: "textfield",
                name: "main",
                allowBlank: false,
                regex: new RegExp("^\\w+(?:\\.\\w+)*$"),
                fieldLabel: ip2.i18n({
                    da: "App Main",
                    en: "App Main"
                })
            },
            {
                xtype: "checkbox",
                name: "advance",
                fieldLabel: ip2.i18n({
                    da: "Advanceret",
                    en: "Advanced"
                }),
                listeners: {
                    change: {
                        fn: function(i_field, b_checked) {

                            var i_packages = i_self.getForm().findField("packages");
                            var i_requires = i_self.getForm().findField("requires");
                            var i_requiredScripts = i_self.getForm().findField("requiredScripts");
                            var i_appConfig = i_self.getForm().findField("appConfig");

                            if (i_packages) {
                                i_packages[b_checked ? "show": "hide"]();
                            }

                            if (i_requires) {
                                i_requires[b_checked ? "show": "hide"]();
                            }

                            if (i_requiredScripts) {
                                i_requiredScripts[b_checked ? "show": "hide"]();
                            }

                            if (i_appConfig) {
                                i_appConfig[b_checked ? "show": "hide"]();
                            }
                        }
                    }
                }
            },
            {
                xtype: "acetextareafield",
                name: "requires",
                asArray: true,
                hidden: true,
                fieldLabel: ip2.i18n({
                    da: "Nødvendige filer",
                    en: "Required files"
                })
            },
            {
                xtype: "acetextareafield",
                name: "requiredScripts",
                asArray: true,
                hidden: true,
                fieldLabel: ip2.i18n({
                    da: "Nødvendige scripts",
                    en: "Required scripts"
                })
            },
            {
                xtype: "acetextareafield",
                name: "packages",
                hidden: true,
                mode: "json",
                asJson: true,
                value: {},
                fieldLabel: ip2.i18n({
                    da: "Pakker",
                    en: "Packages"
                })
            },
            {
                xtype: "acetextareafield",
                name: "appConfig",
                hidden: true,
                mode: "json",
                asJson: true,
                value: {},
                fieldLabel: ip2.i18n({
                    da: "Config",
                    en: "Config"
                })
            }
        ];

        var i_fieldSet = Ext.widget("fieldset", {
            title: "Info",
            items: a_items,
            layout: "anchor",
            collapsible: true,
            collapsed: false,
            defaults: {
                anchor: "100%",
                maxWidth: 800
            }
        });

        i_panel.add([
            i_fieldSet,
            {
                xtype: "portfolio-bindigfield",
                name: "binding",
                fieldLabel:  ip2.i18n({
                    da: "Genvejstast",
                    en: "Shortcut"
                })
            }
        ]);

        i_self.setContent(i_panel);

        return i_panel;
    },

    createRoles: function() {

        var i_self = this;

        var i_userpanel = Ext.widget("userrolepanel", {
            title: ip2.i18n({
                da: "Roller",
                en: "Roles"
            }),
            record: i_self.record,
            entity: "NAVMNUET00"
        });

        i_self.setRolePanel(i_userpanel);

        return i_userpanel;
    },

    isDirty: function() {

        var i_self = this;
        var b_dirty = i_self.callOverridden(arguments);

        if (!b_dirty) {

            var i_tabpanel = i_self.getTabPanel();
            var a_tabs = i_tabpanel.items.getRange();

            Ext.Array.each(a_tabs, function(i_panel) {

                var f_isDirty = i_panel.isDirty || Ext.emptyFn;

                if (i_panel.rendered && f_isDirty != Ext.emptyFn) {
                    b_dirty = f_isDirty();

                    if (b_dirty) {
                        return false;
                    }
                }
            });
        }
        
        return b_dirty;
    },

    doSave: function() {

        var i_self = this;

        var i_promise = new Ext.Promise(function(resolve, reject) {

            var i_tabpanel = i_self.getTabPanel();
            var a_items = i_tabpanel.items.getRange();
            var n_count = 0;

            var i_content = i_self.getContent();

            var o_values = {};

            var a_fields = i_self.getForm().getFields().getRange();

            Ext.Array.each(a_fields, function(i_field) {

                if (i_content.contains(i_field, true)) {
                    o_values[i_field.name] = i_field.getValue();
                }
            });
            
            Ext.Array.each(a_items, function(i_panel) {
                
                var i_controller = i_panel.getController();
                if (i_controller) {
                    if (i_controller.doSave) {
                        n_count++;
                        i_controller.doSave(function() {
                            n_count--;
                            if (n_count === 0) {
                                resolve(o_values);
                            }
                        });
                    }
                }
                else {
                    if (i_panel.doSave) {
                        n_count++;
                        i_panel.doSave(function() {
                            n_count--;
                            if (n_count === 0) {
                                resolve(o_values);
                            }
                        });
                    }
                }
            });

        });

        return i_promise;

    },

    updateNewRecord: function(i_record) {

        var i_self = this;

        var i_userpanel = i_self.getRolePanel();
        i_userpanel.record = i_record;

    }
    
});