var rootURL="https://www.calltheone.com/en";//namespace all of this?????
//how to do SPA best practices??
if (rootURL == undefined) var rootURL = 'https://www.calltheone.com';

var theones = [];
var i = -1;

theones = document.getElementsByClassName("theone");
if (theones != undefined && theones.length > 0) {
    to_theone_render(theones);
    console.log("loading directly ");
} else {
    window.onload = function(){
        console.log("loading on window");
    	theones = document.getElementsByClassName("theone");
        to_theone_render(theones);
    }
    console.log("");
}

function to_theone_loadUserInsideContent(user,content,size,plugin = null) {
        content.innerHTML="<div style='text-align:center;'><img style='margin:auto;width:32px;height:32px;' src='data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ibGRzLWJsb2NrcyIgd2lkdGg9IjIwMHB4IiAgaGVpZ2h0PSIyMDBweCIgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCIgc3R5bGU9ImJhY2tncm91bmQ6IG5vbmU7Ij48cmVjdCB4PSIxOSIgeT0iMTkiIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iIzMzMyI+ICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsIiB2YWx1ZXM9IiNEQkMwQzM7IzMzMzsjMzMzIiBrZXlUaW1lcz0iMDswLjEyNTsxIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjBzIiBjYWxjTW9kZT0iZGlzY3JldGUiPjwvYW5pbWF0ZT48L3JlY3Q+PHJlY3QgeD0iNDAiIHk9IjE5IiB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IiMzMzMiPiAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbCIgdmFsdWVzPSIjREJDMEMzOyMzMzM7IzMzMyIga2V5VGltZXM9IjA7MC4xMjU7MSIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjEyNXMiIGNhbGNNb2RlPSJkaXNjcmV0ZSI+PC9hbmltYXRlPjwvcmVjdD48cmVjdCB4PSI2MSIgeT0iMTkiIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iIzMzMyI+ICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsIiB2YWx1ZXM9IiNEQkMwQzM7IzMzMzsjMzMzIiBrZXlUaW1lcz0iMDswLjEyNTsxIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAuMjVzIiBjYWxjTW9kZT0iZGlzY3JldGUiPjwvYW5pbWF0ZT48L3JlY3Q+PHJlY3QgeD0iMTkiIHk9IjQwIiB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IiMzMzMiPiAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbCIgdmFsdWVzPSIjREJDMEMzOyMzMzM7IzMzMyIga2V5VGltZXM9IjA7MC4xMjU7MSIgZHVyPSIxcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIGJlZ2luPSIwLjg3NXMiIGNhbGNNb2RlPSJkaXNjcmV0ZSI+PC9hbmltYXRlPjwvcmVjdD48cmVjdCB4PSI2MSIgeT0iNDAiIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iIzMzMyI+ICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsIiB2YWx1ZXM9IiNEQkMwQzM7IzMzMzsjMzMzIiBrZXlUaW1lcz0iMDswLjEyNTsxIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAuMzc1cyIgY2FsY01vZGU9ImRpc2NyZXRlIj48L2FuaW1hdGU+PC9yZWN0PjxyZWN0IHg9IjE5IiB5PSI2MSIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiBmaWxsPSIjMzMzIj4gIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwiIHZhbHVlcz0iI0RCQzBDMzsjMzMzOyMzMzMiIGtleVRpbWVzPSIwOzAuMTI1OzEiIGR1cj0iMXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC43NXMiIGNhbGNNb2RlPSJkaXNjcmV0ZSI+PC9hbmltYXRlPjwvcmVjdD48cmVjdCB4PSI0MCIgeT0iNjEiIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iIzMzMyI+ICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsIiB2YWx1ZXM9IiNEQkMwQzM7IzMzMzsjMzMzIiBrZXlUaW1lcz0iMDswLjEyNTsxIiBkdXI9IjFzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgYmVnaW49IjAuNjI1cyIgY2FsY01vZGU9ImRpc2NyZXRlIj48L2FuaW1hdGU+PC9yZWN0PjxyZWN0IHg9IjYxIiB5PSI2MSIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiBmaWxsPSIjMzMzIj4gIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwiIHZhbHVlcz0iI0RCQzBDMzsjMzMzOyMzMzMiIGtleVRpbWVzPSIwOzAuMTI1OzEiIGR1cj0iMXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiBiZWdpbj0iMC41cyIgY2FsY01vZGU9ImRpc2NyZXRlIj48L2FuaW1hdGU+PC9yZWN0Pjwvc3ZnPg==' /></div>";
        if(XMLHttpRequest) var x = new XMLHttpRequest();
        else var x = new ActiveXObject("Microsoft.XMLHTTP");
        x.open("GET", rootURL + "/"+user+"/framed/?embed=true&plugin=" + plugin + "&size=" + size, true);
        x.send();
        x.onreadystatechange = function(){
            if(x.readyState == 4){
                if(x.status == 200) {
                    content.innerHTML = x.responseText;
                } else { 
                    content.innerHTML = "Error loading document";
                }
            }
        }
}

function to_theone_render(theones) {
    for (i = 0; i < theones.length; i++) {
        var theone = theones[i];
        var index = i;
        var plugin = theone.getAttribute("data-plugin") ? theone.getAttribute("data-plugin") : '';

        var user = theone.getAttribute("data-user");
        var size = theone.getAttribute("data-size") ? theone.getAttribute("data-size") : 'full';

        to_theone_loadUserInsideContent(user,theone,size,plugin);
    }
}


function to_loadHandler(e) {
    $(this).unbind('mouseover',loadHandler);

    var menuUrl = rootURL + "/ajax/menu?menu_id=" + $(this).closest('[data-menu-id]').data('menu-id') + "&menu_item_id=" + $(this).data('id');

    var element = $(this);
    $.get( menuUrl, function( data ) {
        var html = $.parseHTML(data.trim());
        var toAppend = $(html).find('> li > ul');
        element.append(toAppend);
    });
}
$('li.experts > ul > li[data-id]').on('mouseover',to_loadHandler);
