define(['../../../core/api/appfactory/appfactory2'],function (app) { 


function SideBar(){
    this._props_ = {};
    this._props_.primary = [];
    this._props_.secondary = [];

}
SideBar.prototype = {
    primary: function(obj){
        this._props_.primary.push(obj);
    },
    secondary: function(obj){
        this._props_.secondary.push(obj);
    }
};

function DashboardLifeCycleContext(){
    
    this.sidebar = new SideBar();
    this._events = [];


}
DashboardLifeCycleContext.prototype = {
    set: function(afsconfig){
        this.afsconfig = afsconfig;
        this._dashboard = afsconfig.configurations.settings[0].dashboard;
        
    },
    addStyleSheet: function(name){
        var link = document.createElement('link');
        link.rel = "stylesheet";
        link.type = "text/css";
        link.href = `services/${name}/styles/${name}.css`;
        document.head.appendChild(link);
    },
    openClose: function(){
        let arrow = document.querySelectorAll(".arrow");
        for (var i = 0; i < arrow.length; i++) {
            arrow[i].addEventListener("click", (e)=>{
                let arrowParent = e.target.parentElement.parentElement;//selecting main parent of arrow
                arrowParent.classList.toggle("showMenu");
            });
        }
        let sidebar = document.querySelector(".sidebar");
        let sidebarBtn = document.querySelector(".bx-menu");
        sidebarBtn.addEventListener("click", ()=>{
            sidebar.classList.toggle("close");
        }); 
    },
    contentEventListeners: function(){
        $('#dsb-domains-link').on('click', function(e){
            e.preventDefault();
            console.log(e);
        });
    },
    buildDashboard: function(dashboardApi){
        let self = this;
        self.afsapp = new app({});
        self.afsapi = dashboardApi;
        var sidebar_skin = self.afsapi.html.dashboard.sidebar_skin;
        sidebar_skin = self.sanitizeReplace(sidebar_skin,"brandlabel", self._dashboard['web_console_label'] );
        let parentFragment = document.createDocumentFragment();
        let sidebarSkin = self._createNode(sidebar_skin);
        parentFragment.appendChild(sidebarSkin);

        self.__dashboard(parentFragment);
        self.__extensions(parentFragment);

        // let node2 = self.afsapp.utils.convertStringToHTMLNode(self.afsapi.html.dashboard.main_content);
        // document.getElementById('inner-content').appendChild(node2);
        // self.contentEventListeners();

        // let primary = dashboard_context.sidebar.getPrimary();
        // self._runprimary(primary,parentFragment);

        self.__settings(parentFragment);
        self.addStyleSheet("dashboard");
        document.body.appendChild(parentFragment);
        setTimeout(() => {
            self.openClose();
            for(let i=0; i < self._events.length; i++){
                self._events[i]();
            }
        },500);

    },


    __extensions: function(parentFragment){
        // extensions
        let self = this;
        let fragment = document.createDocumentFragment();

        let extensions = [{
            label: "Exstensions",
            type: 2,
            views: [{
                label: "Events", 
                click: function(dash){
                    console.log("Events");
                }  
            },{
                label: "Sponsorships", 
                click: function(dash){
                    console.log("Sponsorships");
                }  
            },{
                label: "Forms", 
                click: function(dash){
                    console.log("Forms");
                }  
            },{
                label: "Listings", 
                click: function(dash){
                    console.log("Listings");
                }  
            },{
                label: "Transactions", 
                click: function(dash){
                    console.log("Transactions");
                }  
            }]
        }];

        for(let i=0; i < extensions[0].views.length; i++){
            let card1 = self.afsapi.html.dashboard.extension_card;
            cardStr = self.sanitizeReplace(card1,"brandlabel", "" );
            let card = self._createNode(cardStr);
            fragment.appendChild(card);
        }



        self._runprimary(extensions,parentFragment);
    },
    __dashboard: function(parentFragment){
        let self = this;
        let dashboard_primary = [{
            label: "Domains",
            type: 1,
            icon: "",
            click: function(dash){
                console.log(dash);
                $('#inner-content').empty();
                $('#inner-content').append(self.afsapi.html.dashboard.main_content);
            },
            views: [
                {
                    label: "Website", 
                    view: null,
                    id: "gfhgdfg556546", 
                    click: function(dash){
                        console.log("Website");
                    }  
                },
                {
                    label: "Email", 
                    id: "hgjhdfgfgry6546hfgh", 
                    view: null,
                    click: function(dash){
                        console.log("Email");
                    } 
                }
            ]
        }];

        self._runprimary(dashboard_primary,parentFragment);
    },
    __settings: function(parentFragment){
        let self = this;
        let secondary = [{
            label: "Settings",
            type: 1,
            icon: "",
            view:{
                    label: "Settings", 
                    click: function(dash){
                        // console.log("Settings");
                        // console.log(dash);
                    }  
                }
        }];
        self._runprimary(secondary,parentFragment);
    },

    _runsecondary: function(secondary,parentFragment){
        let self = this;
        let id1 = self.makeid(length);
        let id2 = self.makeid(length);
        let id3 = self.makeid(length);
        var template = self.afsapi.html.dashboard.sidebar_component1;
        template = self.sanitizeReplace(template,"sidebar_label", "Exstesions");
        template = self.sanitizeReplace(template,"sidebar_id1", id1); 
        template = self.sanitizeReplace(template,"sidebar_id2", id2); 
        template = self.sanitizeReplace(template,"sidebar_id3", id3); 
        let node = self._createNode(template);
        

        const i = 0;
        parentFragment.getElementById('sidebar-nav-links').appendChild(node);
        for(let n=0; n < secondary[i].views.length; n++){
            let myid = self.makeid(8);
            self._addListener(secondary[i].views[n].click, myid);
            let temp = self.afsapi.html.dashboard.sidebar_component_link;
            temp = self.sanitizeReplace(temp,"sidebar_label", secondary[i].views[n].label);
            temp = self.sanitizeReplace(temp,"sidebar_id", myid); 
            let node2 = self._createNode(temp);
            parentFragment.getElementById(id2).appendChild(node2);
        }

    },

    _runprimary: function(primary,parentFragment){
        let self = this;
        // console.log(self.afsapi.html.dashboard.sidebar_component1);
        for(let i=0 ; i < primary.length; i++){
            let length = 12;
            if(primary[i].views!=undefined){
                let id1 = self.makeid(length);
                let id2 = self.makeid(length);
                let id3 = self.makeid(length);
                var template = self.afsapi.html.dashboard.sidebar_component1;
                template = self.sanitizeReplace(template,"sidebar_label", primary[i].label);
                template = self.sanitizeReplace(template,"sidebar_id1", id1); 
                template = self.sanitizeReplace(template,"sidebar_id2", id2); 
                template = self.sanitizeReplace(template,"sidebar_id3", id3); 
                let node = self._createNode(template);
                self._addListener(primary[i].click, id1);

                parentFragment.getElementById('sidebar-nav-links').appendChild(node);
                for(let n=0; n < primary[i].views.length; n++){
                    let myid = self.makeid(8);
                    self._addListener(primary[i].views[n].click, myid);
                    let temp = self.afsapi.html.dashboard.sidebar_component_link;
                    temp = self.sanitizeReplace(temp,"sidebar_label", primary[i].views[n].label);
                    temp = self.sanitizeReplace(temp,"sidebar_id", myid); 
                    let node2 = self._createNode(temp);
                    parentFragment.getElementById(id2).appendChild(node2);
                }
            }else if(primary[i].view!=undefined){
                let id1 = self.makeid(length);
                let id2 = self.makeid(length);
                let id3 = self.makeid(length);
                self._addListener(primary[i].view.click, id1);
                self._addListener(primary[i].view.click, id3);

                var template = self.afsapi.html.dashboard.sidebar_component2;
                template = self.sanitizeReplace(template,"sidebar_id1", id1); 
                template = self.sanitizeReplace(template,"sidebar_id2", id2); 
                template = self.sanitizeReplace(template,"sidebar_id3", id3); 
                template = self.sanitizeReplace(template,"sidebar_label", primary[i].label); 
                let node = self._createNode(template);
                parentFragment.getElementById('sidebar-nav-links').appendChild(node);
            }
        }
    },

    sanitizeReplace: function(text, variable, replacement){
        return text.replaceAll("${"+variable+"}", replacement);
    },
    _addListener: function(click_func,id){
        let self = this;
        if(click_func!=undefined){
            self._events.push(function(){
                $('#'+id).on('click',function(){
                    if(click_func!=undefined){
                        click_func(self);
                    }
                });
            });
        }
    },
    _createNode(nodeString){
        return this.afsapp.utils.convertStringToHTMLNode(nodeString);
    },

    makeid:function(length) {
        let result = '';
        const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
        const charactersLength = characters.length;
        let counter = 0;
        while (counter < length) {
          result += characters.charAt(Math.floor(Math.random() * charactersLength));
          counter += 1;
        }
        return "id"+result;
    }
};

var dash = null;
return (function(){
    if(dash==null){
        dash = new DashboardLifeCycleContext();
    }
    return dash;
})();

});// end of define