/************ YOUSOFT VARIABLES ***********/
//var infoVisJson;

var ysNodeHeight = 80, ysNodeWidth = 120;

/************ YOUSOFT VARIABLES END ***********/

var labelType, useGradients, nativeTextSupport, animate;
var INFOVIS_SELECTED_IDS = [];

(function () {
    var ua = navigator.userAgent;
    var iStuff = ua.match(/iPhone/i) || ua.match(/iPad/i);
    var typeOfCanvas = typeof HTMLCanvasElement;
    var nativeCanvasSupport = (typeOfCanvas == 'object' || typeOfCanvas == 'function');
    var textSupport = nativeCanvasSupport && (typeof document.createElement('canvas').getContext('2d').fillText == 'function');

    labelType = (!nativeCanvasSupport || (textSupport && !iStuff)) ? 'Native' : 'HTML';
    nativeTextSupport = labelType == 'Native';
    useGradients = nativeCanvasSupport;
    animate = !(iStuff || !nativeCanvasSupport);
})();

$(function () { Sys.WebForms.PageRequestManager.getInstance().add_endRequest(InfoVisUpdateSelectedNodes); });

function initInfoVis(infoVisJson) {

    var st = new $jit.ST({
        injectInto: 'infovis',
        duration: 400,
        transition: $jit.Trans.Quart.easeInOut,
        levelDistance: 50,
        Navigation: {
            enable: true,
            panning: true,
            zooming: 100
        },
        Node: {
            height: ysNodeHeight,
            width: ysNodeWidth,
            overridable: true,
            color: '#fff'//,
        },
        Orientation: "north",
        Edge: {
            type: 'bezier',
            overridable: true
        },
        onCreateLabel: function (label, n) {
            var scale = st.canvas.scaleOffsetX;
            var top = ((scale - 1) * -(ysNodeHeight / 2)) + 'px';
            var left = ((scale - 1) * -(ysNodeWidth / 2)) + 'px';

            $('#infovisDelegate').html(n.name);
            $('#infovisDelegate').children('div').css({ 'width': (ysNodeWidth * scale) + 'px', 'height': (ysNodeHeight * scale) + 'px', 'font-size': (11 * scale) + 'px' });

            label.id = n.id;
            label.innerHTML = $('#infovisDelegate').html();
            label.onclick = function () { };

            InfoVisSetupNode(label, n);

            //set label styles
            var style = label.style;
            style.cursor = 'pointer';
            style.color = '#fff';
        },
        onBeforePlotNode: function (n) {
            InfoVisSetupNode('#' + n.id, n);
        },
        onAfterPlotNode: function (n) {
            InfoVisUpdateSelectedNodes();
        },
        onBeforePlotLine: function (adj) {
            if (adj.nodeFrom.selected && adj.nodeTo.selected) {
                adj.data.$color = "#000";
                adj.data.$lineWidth = 3;
            }
            else {
                delete adj.data.$color;
                delete adj.data.$lineWidth;
            }
        }
    });
    st.canvas.getCtx().scale(1, 1);
    if (infoVisJson === undefined) {
        var infoVisJson = GetDummyAjax();
        st.loadJSON(infoVisJson);
    } else {
        //infoVisJson = GetDummyAjax(); 
        st.loadJSON(infoVisJson);
    }
    st.canvas.opt.orientation = "top";
    st.compute();
    st.geom.translate(new $jit.Complex(-200, 0), "current");
    st.onClick(st.root);

    $('#infovis')
        .css({ 'cursor': 'url(/images/icons/pan.cur), -moz-grab' })
        .mousedown(function () { $(this).css({ 'cursor': 'url(/images/icons/pandrag.cur), -moz-grabbing' }); })
        .mouseup(function () { $(this).css({ 'cursor': 'url(/images/icons/pan.cur), -moz-grab' }); });


    function InfoVisSetupNode(obj, n) {
        var scale = st.canvas.scaleOffsetX;
        var top = ((scale - 1) * -(ysNodeHeight / 2)) + 'px';
        var left = ((scale - 1) * -(ysNodeWidth / 2)) + 'px';

        $(obj)
            .children('.infoVisNodeContent').css({ 'left': left, 'top': top, 'width': (ysNodeWidth * scale) + 'px', 'height': (ysNodeHeight * scale) + 'px', 'font-size': (11 * scale) + 'px' })
            .unbind('click')
            .click(function () {
                ViewNode(n);
            })
            .find('td,th').css({ 'font-size': (11 * scale) + 'px' })
            .children('img').css({ 'width': (50 * scale) + 'px' })
            .parent().parent().children('td,th')
            .children('div').css({ 'width': (6 * scale) + 'px', 'height': (11 * scale) + 'px', 'border-width': (1 * scale) + 'px' })
            .parent().parent().children('td,th')
            .children('.checkbox').css({ 'width': (8 * scale) + 'px', 'height': (8 * scale) + 'px', 'border-width': (2 * scale) + 'px' })
            .unbind('click')
            .click(function (e) {
                SelectOrDeselectNode(n.id);
                e.stopPropagation();
            });
    }

    function ViewNode(n) {
        st.onClick(n.id);
        $('.infoVisNodeContent').removeClass('viewing');
        $('#' + n.id).children('.infoVisNodeContent').addClass('viewing');
        $('.uxCurrentlySelected').slideUp(function () {
            $('.uxInfoVisSalutation').html(n.data.Salutation);
            $('.uxInfoVisDepartment').html(n.data.DepartmentTitle);
            $('.uxInfoVisManager').html(n.data.Manager);
            $('.uxInfoVisThumb').attr('src', n.data.ThumbSrc);
            $(this).slideDown();
        });

        SetupAddThisButton(n);
        SetupAddImmediateSubsButton(n);
        SetupAddAllSubsButton(n);
        SetupAddAllInDeptButton(n);
    }
    function SetupAddAllInDeptButton(n) {
        var missingSubs = [];
        var text = "Remove all in department";
        var descendants = GetChildren(st.json.id, st.json, true, true);
        var sameDept = [];


        $('#uxAddDept').show();
        for (var i = 0; i < descendants.length; i++) {
            if (n.data.DepartmentTitle == descendants[i].data.DepartmentTitle) {
                sameDept.push(descendants[i].id);
                if (INFOVIS_SELECTED_IDS.indexOf(descendants[i].id) == -1) {
                    missingSubs.push(descendants[i].id);
                }
            }
        }

        if (missingSubs.length > 0) { text = "Add all in department"; }

        $('#uxAddDept').unbind('click').click(function () {
            if (missingSubs.length > 0) {
                for (var i = 0; i < missingSubs.length; i++) {
                    SelectNode(missingSubs[i]);
                }
            } else {
                for (var i = 0; i < sameDept.length; i++) {
                    DeselectNode(sameDept[i]);
                }
            }
            SetupAddAllInDeptButton(n);
        }).html(text + " (" + descendants.length + ")");
    }
    function SetupAddAllSubsButton(n) {
        var missingSubs = [];
        var text = "Remove all subordinates";
        var descendants = GetChildren(n.id, st.json, true, false);

        /****************/
        if (descendants.length == 0) { $('#uxAddAllSubs').hide(); return; }
        /****************/

        $('#uxAddAllSubs').show();
        for (var i = 0; i < descendants.length; i++) {
            if (INFOVIS_SELECTED_IDS.indexOf(descendants[i]) == -1) { missingSubs.push(descendants[i]); }
        }

        if (missingSubs.length > 0) { text = "Add all subordinates"; }

        $('#uxAddAllSubs').unbind('click').click(function () {
            if (missingSubs.length > 0) {
                for (var i = 0; i < missingSubs.length; i++) {
                    SelectNode(missingSubs[i]);
                }
            } else {
                for (var i = 0; i < descendants.length; i++) {
                    DeselectNode(descendants[i]);
                }
            }
            SetupAddAllSubsButton(n);
        }).html(text + " (" + descendants.length + ")");
    }
    function SetupAddImmediateSubsButton(n) {
        var missingSubs = [];
        var text = "Remove immediate subordinates";
        var children = GetChildren(n.id, st.json, false, false);

        /****************/
        if (children.length == 0) { $('#uxAddImmediateSubs').hide(); return; }
        /****************/

        $('#uxAddImmediateSubs').show();
        for (var i = 0; i < children.length; i++) {
            if (INFOVIS_SELECTED_IDS.indexOf(children[i]) == -1) { missingSubs.push(children[i]); }
        }

        if (missingSubs.length > 0) { text = "Add immediate subordinates"; }

        $('#uxAddImmediateSubs').unbind('click').click(function () {
            if (missingSubs.length > 0) {
                for (var i = 0; i < missingSubs.length; i++) {
                    SelectNode(missingSubs[i]);
                }
            } else {
                for (var i = 0; i < children.length; i++) {
                    DeselectNode(children[i]);
                }
            }
            SetupAddImmediateSubsButton(n);
        }).html(text + " (" + children.length + ")");
    }
    function GetChildren(parentNodeID, jsonItem, includeDescendants, full) {
        var children = [];

        if (jsonItem.id == parentNodeID) {
            for (var i = 0; i < jsonItem.children.length; i++) {
                if (full) {
                    children.push(jsonItem.children[i]);
                } else {
                    children.push(jsonItem.children[i].id);
                }
                if (includeDescendants) {
                    var descendents = GetChildren(jsonItem.children[i].id, jsonItem.children[i], includeDescendants, full);
                    for (var x = 0; x < descendents.length; x++) {
                        if (full) {
                            children.push(descendents[x]);
                        } else {
                            children.push(descendents[x].id);
                        }
                    }
                }
            }
            return children;
        } else if (jsonItem.children.length > 0) {
            for (var i = 0; i < jsonItem.children.length; i++) {
                children = GetChildren(parentNodeID, jsonItem.children[i], includeDescendants, full);
                if (children.length > 0) {
                    return children;
                }
            }
        }
        return children;
    }
    function SetupAddThisButton(n) {
        if (n.id == 0) { $('#uxAddThis').hide(); return; }
        /****************/
        $('#uxAddThis').show();
        var addThisText = "Add '";
        if (INFOVIS_SELECTED_IDS.indexOf(n.id) > -1) {
            addThisText = "Remove '";
        }
        addThisText += n.data.Salutation + "'";
        $('#uxAddThis').unbind('click').click(function () {
            SelectOrDeselectNode(n.id);
            SetupAddThisButton(n);
        }).text(addThisText);
    }
}

/* Aux */
function ChangeTextAndUpdate(newVal) {
    $('.txtEmployeeIds').val(newVal).focus().blur().trigger("change");
}
function GetDummyAjax() {
    return {
        id: "0",
        name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
        children: [{
            id: "1",
            name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
            children: [{
                id: "2",
                name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                children: []
            }, {
                id: "3",
                name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                children: []
            }, {
                id: "4",
                name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                children: []
            }, {
                id: "5",
                name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                children: [{
                    id: "6",
                    name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                    children: []
                },
                {
                    id: "7",
                    name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                    children: []
                },
                {
                    id: "8",
                    name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                    children: [
                    {
                        id: "9",
                        name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                        children: []
                    },
                    {
                        id: "10",
                        name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                        children: []
                    },
                    {
                        id: "11",
                        name: "TEST DATA</th></tr><tr><td><img src='http://www.vista-style-icons.com/libs/med-v/boss-icon.gif' style='width:50px;'></td><td>Include: <div class='checkbox'></div><br /></td></tr></tbody></table></div>",
                        children: []
                    }]
                }]
            }]
        }]
    };
}
function InfoVisUpdateSelectedNodes() {
    if ($('#infovis').length > 0) {
        INFOVIS_SELECTED_IDS = [];
        $('.infoVisNodeContent').removeClass('selected');
        var ids = $('.txtEmployeeIds').val().split(',');
        for (var i = 0; i < ids.length; i++) {
            $('#' + ids[i]).children('.infoVisNodeContent').addClass('selected');
            INFOVIS_SELECTED_IDS.push(ids[i]);
        }
    }
}

function SelectOrDeselectNode(id) {
    if (INFOVIS_SELECTED_IDS.indexOf(id) > -1) { INFOVIS_SELECTED_IDS.splice(INFOVIS_SELECTED_IDS.indexOf(id), 1); } else { INFOVIS_SELECTED_IDS.push(id); }
    UpdateTextboxWithValues();
}
function SelectNode(id) {
    if (INFOVIS_SELECTED_IDS.indexOf(id) == -1) { INFOVIS_SELECTED_IDS.push(id); }
    UpdateTextboxWithValues();
}
function DeselectNode(id) {
    if (INFOVIS_SELECTED_IDS.indexOf(id) > -1) { INFOVIS_SELECTED_IDS.splice(INFOVIS_SELECTED_IDS.indexOf(id), 1); }
    UpdateTextboxWithValues();
}
function UpdateTextboxWithValues() {
    var str = '';
    for (var i = 0; i < INFOVIS_SELECTED_IDS.length; i++) { str += INFOVIS_SELECTED_IDS[i] + ','; }
    if (str.length > 0) { str = str.substr(0, str.length - 1); }
    $('.txtEmployeeIds').val(str).focus().blur().trigger("change");
    InfoVisUpdateSelectedNodes();
}