var leadUrl = "";
var xmlFile = "";
var linkPrefix = "";

/*  Banner  */
var triggerCRM = new Image(); triggerCRM.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_CRM.png";
var triggerWeb = new Image(); triggerWeb.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_Web.png";
var triggerSoftware = new Image(); triggerSoftware.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_Software.png";
var triggerMarketing = new Image(); triggerMarketing.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_Marketing.png";
var triggerCreative = new Image(); triggerCreative.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_Creative.png";

var headerCRM = new Image(); headerCRM.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/CRMHeader.jpg";
var headerWeb = new Image(); headerWeb.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/WebHeader.jpg";
var headerSoftware = new Image(); headerSoftware.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/SoftwareHeader.jpg";
var headerMarketing = new Image(); headerMarketing.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/MarketingHeader.jpg";
var headerCreative = new Image(); headerCreative.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/CreativeHeader.jpg";

var itemCRM = new Image(); itemCRM.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/CRM.jpg";
var itemWeb = new Image(); itemWeb.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/Web.jpg";
var itemSoftware = new Image(); itemSoftware.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/Software.jpg";
var itemMarketing = new Image(); itemMarketing.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/Marketing.jpg";
var itemCreative = new Image(); itemCreative.src = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/Creative.jpg";


var timeout; var interval = 3500; var current = 0; var timerIsOn = false;
function setupAnimation() {
    if (typeof $telerik != "undefined") {
        $telerik.$(document).ready(function () {
            //Setup Triggers onmouseover and onmouseout
            $telerik.$("div.HomeBannerContainer div.Triggers span").hover(function (args) { clearTimeout(timeout); timerIsOn = false; changeItem($telerik.$(args)[0].target); }, function () { if (current != 4) { current++; } else { current = 0; } timerIsOn = true; timeout = setTimeout(animateBanner, interval); });

            //Pause transitions on text mouseover
            $telerik.$("div.HomeBannerContainer div.ItemText").hover(function () { clearTimeout(timeout); timerIsOn = false; }, function () { timerIsOn = true; timeout = setTimeout(animateBanner, interval); });

            //Start animation on ready
            timeout = setTimeout(animateBanner, interval + 2500);
            timerIsOn = true;
        });
    }
    else { setTimeout(setupAnimation, 1500); }
}
setupAnimation();

function changeItem(item) {
    //fadeOut(), change items, fadeIn()
    $telerik.$("div.HomeBannerContainer div.ItemImage, div.HomeBannerContainer div.ItemText").fadeOut(250, function () {
        var bkgdUrl = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/HomeBannerButtons_" + $telerik.$(item).attr("class") + ".png";
        $telerik.$("div.HomeBannerContainer div.Triggers").css("backgroundImage", "url('" + bkgdUrl + "')");

        var imgUrl = "/PicsHotel/ReserveGroup2011/SkinImages/HomeBannerImages/" + $telerik.$(item).attr("class") + ".jpg";
        var html = "<span class='" + $telerik.$(item).attr("class") + "'></span>";

        switch ($telerik.$(item).attr("class")) {
            case "CRM": html += "<span class='BannerText'>Transforming the way you manage your customers, suppliers and staff. évoSuite CRM system is a leading-edge CRM system – operated right within your Outlook and as such includes many intelligent features, taking it beyond the realm of others CRM systems. </span><a href='" + leadUrl + "/CRM-Solutions'><span class='LearnMore'></span></a>"; break;
            case "Web": html += "<span class='BannerText'>100% content manageable websites, with everything from announcements, stunning galleries, powerful search engines, downloadable documents, member’s lists to live chat, Skype and social media features, and much more. Everything integrated seamlessly into your website.</span><a href='" + leadUrl + "/Web-Solutions'><span class='LearnMore'></span></a>"; break;
            case "Software": html += "<span class='BannerText'>évoSuite Enterprise&trade; is a simple yet very sophisticated suite of software and tools. Together they provide a complete solution that will improve your company’s marketing and communication, increase your sales and evolve as your company evolves.</span><a href='" + leadUrl + "/Software-Solutions'><span class='LearnMore'></span></a>"; break;
            case "Marketing": html += "<span class='BannerText'>Marketing is absolutely vital to the success and growth of any business. Whether you are looking for an honest review of where you are currently sitting, or you need an in-depth 12 month marketing plan, our team’s specialist marketing knowledge, creative ideas and support can bring your business real results.</span><a href='" + leadUrl + "/Marketing-Solutions'><span class='LearnMore'></span></a>"; break;
            case "Creative": html += "<span class='BannerText'>RéserveGroup has its own dedicated and talented creative team - including Graphic Designers, in-house video and interactive team, Art Director and Copywriters. We can help you bring your brand to life and manage it across-the-board, with ongoing creative, design and marketing services.</span><a href='" + leadUrl + "/Creative-Solutions'><span class='LearnMore'></span></a>"; break;
        }

        $telerik.$("div.HomeBannerContainer div.ItemImage").css("backgroundImage", "url('" + imgUrl + "')");
        $telerik.$("div.HomeBannerContainer div.ItemText").html(html);
        $telerik.$("div.HomeBannerContainer div.ItemImage, div.HomeBannerContainer div.ItemText").fadeIn(250);
    });

    if (!timerIsOn) {
        switch ($telerik.$(item).attr("class")) {
            case "CRM": current = 0; break;
            case "Web": current = 1; break;
            case "Software": current = 2; break;
            case "Marketing": current = 3; break;
            case "Creative": current = 4; break;
        }
    }
}

function animateBanner() {
    if (timerIsOn) {
        var section = "";
        switch (current) {
            case 0: section = "CRM"; current++; break;
            case 1: section = "Web"; current++; break;
            case 2: section = "Software"; current++; break;
            case 3: section = "Marketing"; current++; break;
            case 4: section = "Creative"; current = 0; break;
        }
        changeItem($telerik.$("div.HomeBannerContainer div.Triggers span." + section));
        timeout = setTimeout(animateBanner, interval);
    }
}


/* XML Spiral */
function loadSpiralXML() {
    if (typeof $telerik != "undefined") {
        $telerik.$(document).ready(function () {
            $telerik.$.ajax({
                type: "GET",
                url: leadUrl + xmlFile,
                dataType: "xml",
                success: function (xml) {

                    var html = "";
                    var section = $telerik.$(xml).find('GALLERIES');
                    var sectionIconUrl = $telerik.$(section).attr('ICON');
                    var sectionTitle = $telerik.$(section).attr('TITLE');
                    var sectionDesc = $telerik.$(section).attr('DESCRIPTION');

                    $telerik.$("div.XmlSpiralContainer div.Section div.Icon").html('<img src="' + sectionIconUrl + '" />');
                    $telerik.$("div.XmlSpiralContainer div.Section div.Title").text(sectionTitle);
                    $telerik.$("div.XmlSpiralContainer div.Section div.Description").text(sectionDesc);


                    var itemCount = $telerik.$(xml).find('IMG').length;
                    var positionOffset = (itemCount - 2) * 462;
                    $telerik.$("div.XmlSpiralContainer").css({ backgroundPosition: "-" + positionOffset + "px 0px" });
                    $telerik.$("div.XmlSpiralContainer div.Details div.Header").css("opacity", ".99");
                    $telerik.$("div.XmlSpiralContainer div.Details div.Description").css("opacity", ".99");

                    $telerik.$(xml).find('IMG').each(function (i) {
                        var iconUrl = $telerik.$(this).attr('ICON');
                        var title = $telerik.$(this).attr('TITLE');
                        var desc = $telerik.$(this).attr('SHORTDESC');
                        var url = leadUrl + linkPrefix + $telerik.$(this).attr('LINKURL');

                        switch (i) {
                            case 0:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 1:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 2:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 3:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 4:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 5:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 6:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                            case 7:
                                html += "<div class='Items ItemCount" + itemCount + " Item" + i + "' title='" + title + "' desc='" + desc + "' iconUrl='" + iconUrl + "'><a href='" + url + "'><img class='Icon' src='" + iconUrl + "' border='0' /></a></div>"; break;
                        }
                    });

                    $telerik.$("div.XmlSpiralContainer").append(html);
                },
                error: function (err) {
                    //Error occured getting XML
                    $telerik.$("div.XmlSpiralContainer").hide();
                },
                complete: function () {

                    $telerik.$("div.XmlSpiralContainer div.Items").hover(function () {
                        showDetails($telerik.$(this).attr("title"), $telerik.$(this).attr("desc"), $telerik.$(this).attr("iconUrl"));
                    }, function () { });

                    $telerik.$("div.XmlSpiralContainer").hover(function () { }, function () {
                        hideDetails();
                    });
                }
            });

        });

    } else { setTimeout(loadSpiralXML, 1000); }

}

function showDetails(header, desc, iconUrl) {
    $telerik.$("div.XmlSpiralContainer div.Details div.Icon").html("<img src='" + iconUrl + "' />");
    $telerik.$("div.XmlSpiralContainer div.Details div.Header").text(header);
    $telerik.$("div.XmlSpiralContainer div.Details div.Description").text(desc);
    $telerik.$("div.XmlSpiralContainer table.Section").hide();
    $telerik.$("div.XmlSpiralContainer table.Details").show();
}

function hideDetails() {
    $telerik.$("div.XmlSpiralContainer table.Details").hide();
    $telerik.$("div.XmlSpiralContainer table.Section").show();
}


/* XML Feature Boxes */
function loadFeaturesXML() {
    if (typeof $telerik != "undefined") {
        $telerik.$(document).ready(function () {
            $telerik.$.ajax({
                type: "GET",
                url: leadUrl + xmlFile,
                dataType: "xml",
                success: function (xml) {
                    var html = "";
                    $telerik.$(xml).find('IMG').each(function (i) {
                        var iconUrl = $telerik.$(this).attr('ICON');
                        var title = $telerik.$(this).attr('TITLE');
                        var desc = $telerik.$(this).attr('SHORTDESC');
                        var url = leadUrl + linkPrefix + $telerik.$(this).attr('LINKURL');


                        var item = "<div class='Item'><div class='ItemLink'>";
                        var icon = "<div class='ItemIcon'><a href='" + leadUrl + url + "'><img src='" + iconUrl + "' height='54' border='0' /></a></div>";
                        var header = "<table class='ItemHeader' cellpadding='0' cellspacing='0'><tr><td valign='middle'><a href='" + leadUrl + url + "'>" + title + "</a></td></tr></table>";
                        var text = "<div class='ItemText'>" + desc + "</div>";

                        item += icon;
                        item += header;
                        item += "</div>";
                        item += text;
                        item += "<div class='ItemBottomCurve'></div></div>";

                        html += item;

                        if (i % 2 == 1) { html += "<div style='clear: both;'></div>"; }

                    });
                    html += "<div style='clear: both;'></div>";
                    $telerik.$("div.XmlFeaturesContainer div.Body").append(html);


                },
                error: function (err) { $telerik.$("div.XmlFeaturesContainer").hide(); },
                complete: function () { }
            });

        });

    } else { setTimeout(loadFeaturesXML, 1000); }
}