﻿var xmlOfficeSrc = "/Files/HTML/Stibozone/offices_v2.xml";
var officeSrc, staff, bgSpeed, empSpeed;
var scrollDirection = "left";

//var imagePositionsArray;

function getRandom(length) {
    return Math.floor(Math.random() * length);
}

function getDirectionIndex() {
    return scrollDirection == "left" ? -1 : 1;
}

function getOfficesXml() {
    var xhttp;
    if (window.XMLHttpRequest) {
        xhttp = new XMLHttpRequest();
    }
    else {/// <reference path="../home_v2.htm" />

        xhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET", xmlOfficeSrc, false);
    xhttp.send();
    return xhttp.responseXML;
}

function parseOfficesXml() {

    //get office randomly
    var xmlDoc = getOfficesXml();

    var currentOffice = xmlDoc.documentElement.getElementsByTagName("office")[0];

    bgSpeed = currentOffice.getAttribute("bgSpeed") * 1;

    // 48 - employees speed correction index regarding to background speed 
    empSpeed = 49 / (currentOffice.getAttribute("empSpeed") * 1);

    officeSrc = currentOffice.getAttribute("src");

    //get all emploees arrey
    var employees = currentOffice.getElementsByTagName("employee");

    staff = new Array();

    for (var i = 0; i < employees.length; i++) {

        //get randomly one employee photo and other data
        var emploee = employees[i];
        var empName = emploee.getAttribute("name");
        var empTitle = emploee.getAttribute("title");
        var empEmail = emploee.getAttribute("email");
        var empPhone = emploee.getAttribute("phone");
        var empVcard = emploee.getAttribute("vcard");
        var empSrc = emploee.getAttribute("src");
        var empOrder = empSrc.replace(/^.*(\\|\/|\:)/, '').split("-")[0] * 1;
        var empInfo = { empOrder: empOrder, src: empSrc, name: empName, title: empTitle, email: empEmail, phone: empPhone, vcard: empVcard };
        staff.push(empInfo);
    }

    staff = staff.sort(function(a, b) { return parseFloat(a.empOrder) - parseFloat(b.empOrder) });
    lastEmpInArr = staff.pop();
    staff.unshift(lastEmpInArr);
}


function getStaffWidth() {
    var bgWidth = 0;

    $(".parallaxOffice .parallaxStaff img").each(
            function() {
                bgWidth += this.offsetWidth;
            });

    return bgWidth;
}

function getLeftOffset() {
    return $(".parallaxOffice .parallaxStaff img")[0].offsetWidth * (-1);
}

function correctStaffPosition(leftVal) {
    //$(".parallaxOffice .parallaxStaff img:first").css("margin-left", leftVal);

    if (getDirectionIndex() == 1) {
        $(".parallaxOffice .parallaxStaff img:first").css("margin-left", leftVal);
   }
    else {
      $(".parallaxOffice .parallaxStaff img:last").css("margin-left", leftVal);
   }
}

function correctStaffWidth(bgWidth) {
    $(".parallaxOffice .parallaxStaff").css("width", bgWidth - getLeftOffset());
}

function animateStaff() {

    var firstChild = $(".parallaxOffice .parallaxStaff img").first();
    var lastChild = $(".parallaxOffice .parallaxStaff img").last();
    var firstChildLeftShift = firstChild.css("margin-left");

    var leftInt = firstChildLeftShift.replace("px", "") * 1;
    firstChild.css("margin-left", leftInt + getDirectionIndex());

//    if (leftInt >= 0) {
//        lastChild.insertBefore(firstChild);
//        correctStaffPosition(getLeftOffset());
//    }

    if (Math.abs(leftInt) > firstChild[0].offsetWidth && getDirectionIndex() == -1) {
        firstChild.insertAfter(lastChild);
        correctStaffPosition(0);
    }

//    if (leftInt >= 0 && getDirectionIndex() == 1) {
//        lastChild.insertBefore(firstChild);
//        correctStaffPosition(getLeftOffset());
//    }

}

function initStaffAnimation(speed) {

    var staffWidth = getStaffWidth();
    correctStaffWidth(staffWidth);

    var leftShift = 0;

    //correctStaffPosition(getLeftOffset());

    var staffAnimationInterval = setInterval(animateStaff, speed);

    $(".parallaxOffice").hover(
            function() { clearInterval(staffAnimationInterval); },
            function() { staffAnimationInterval = setInterval(animateStaff, speed); }
            );
}


// set contact information to contactInfo div
function setContactInfo(name, title, email, phone, vcard) {
    $(".parallaxOffice .contactInfo #conInfName").html(name);
    $(".parallaxOffice .contactInfo #conInfTitle").html(title);
    $(".parallaxOffice .contactInfo #conInfEmail").html('<a href="mailto:' + email + '">' + email + '</a>');
    $(".parallaxOffice .contactInfo #conInfPhone").html(phone);

    if (!!vcard != false)
        $(".parallaxOffice .contactInfo #conInfVcard").html("<a alt='V-Card' href='" + vcard + "' >" + vcard + "</a>");
    else
        $(".parallaxOffice .contactInfo #conInfVcard").html(" --- ");
}

function initContactInfo() {
    $(".parallaxOffice img").mouseenter(
                function() {

                    var hoveredEmployee = this.id;

                    $(staff).each(function() {
                        if (hoveredEmployee == this.name) {
                            setContactInfo(this.name, this.title, this.email, this.phone, this.vcard);
                        }
                    });

                    var infoBoxWidth = $(".parallaxOffice .contactInfo").width();
                    var infoBoxLeft = $(this).position().left + (this.offsetWidth - infoBoxWidth) / 2;
                    $(".parallaxOffice .contactInfo").css("left", infoBoxLeft);
                    $(".parallaxOffice .contactInfo").show();

                }
            );

}

function initOfficeAnimation() {

    $(".parallaxOffice").css('background-image', "url(" + officeSrc + ")");
    jQuery('.parallaxOffice').pan({ fps: 20, speed: bgSpeed, dir: scrollDirection });

    $(".parallaxOffice").hover(
                function() {
                    jQuery('.parallaxOffice').spStop();
                    // $(".parallaxOffice").destroy();

                },
                function() {
                    //jQuery('.parallaxOffice').pan({ fps: 20, speed: bgSpeed, dir: scrollDirection });
                    jQuery('.parallaxOffice').spStart();
                    jQuery('.parallaxOffice .contactInfo').hide();

                }
            );
}

function initAnimation() {
    initOfficeAnimation();
    initContactInfo();
    initStaffAnimation(empSpeed);
}

function AddStaffImages() {
    for (var i = 0; i < staff.length; i++) {
        var image = document.createElement("img");
        image.src = staff[i].src;
        image.id = staff[i].name;
        image.alt = staff[i].title;
        //image.style.padding = "0 " + getRandom(100) + "px 0 " + getRandom(100) + "px";
        $(".parallaxStaff").append(image);
    }

    var ensureImageRender = setInterval(
                function() {
                    var uploaded = true;
                    $(".parallaxStaff img").each(
                    function() {
                        if ($(this).width() == 0) {
                            uploaded = false;
                        }
                    });
                    if (uploaded) {
                        clearInterval(ensureImageRender);
                        initAnimation();
                    }
                },
                 50);
}

$(document).ready(
            function() {
                //inicialize global variables on base of xml
                parseOfficesXml();

                //add employees photos
                AddStaffImages();
            }
    );
