///START OF SCRIPTS FOR DROPDOWN WEB FORMS
//ID-1
//These hide the contact forms (will show if JS is disabled on the  user's computer) 
$("#CreateTicket").hide(); 
$("#RequestQuote").hide();
//Adds a click event to the Create a Ticket link, this opens up the web form for it
$(".CreateTicketLink").click(function () {
    $(".FormsOuterWrapper").show();
    $(".FormsOuterWrapper").animate({
        marginTop: "0"
    }, 1000, function () {
        $("#RequestQuote").hide();
        $("#CreateTicket").fadeIn();
    });
});
//Adds a click event to the Request a Quote link, this opens up the web form for it
$(".RequestQuoteLink").click(function () {
    $(".FormsOuterWrapper").show();
    $(".FormsOuterWrapper").animate({
        marginTop: "0"
    }, 1000, function () {
        $("#CreateTicket").hide();
        $("#RequestQuote").fadeIn();
    });
});
//Displays the Validation Summary Control for the Create a Ticket web form
$(".CreateTicketButton").click(function () {
           $(".RSGroup").slideDown("slow");
});
//Displays the Validation Summary Control for the Request a Quote web from
$(".RequestQuoteButton").click(function () {
    $(".RQGroup").slideDown("slow");
});

$(".myButtonGetStarted").click(function () {
    $(".RQGroup").slideDown("slow");
});

//Closes the web form container out of view by resetting it's margin to 0px, 
$(".CloseButton").click(function () {
    $(".FormsOuterWrapper").animate({
        marginTop: "-599"
    }, 1000, function () {
        $("body").css("overflow", "visible");
        $("#CreateTicket").hide();
        $("#RequestQuote").hide();
    });
});
///END OF SCRIPTS FOR DROPDOWN WEB FORMS
//Script for the tab container on the homepage. This is by Flowplayer.org
//ID-2
if($("#flowtabs").is(":visible")){
$("#flowpanes").scrollable({ circular: true, mousewheel: false}).navigator({
    // select #flowtabs to be used as navigator
    navi: "#flowtabs",
    // select A tags inside the navigator to work as items (not direct children)
    naviItem: 'a',
    // assign "current" class name for the active A tag inside navigator
    activeClass: 'current',
    // make browser's back button work
    history: false
});
}
else{
}
//Rollover script, for images to be rollovers
//All HTML elements must have the class "RollOver" added to them
$(function () {
    $(".RollOver").hover(function () {
        var src = $(this).attr("src").replace(".png", "-Over.png"); //Replaces all instances of PNG (if they have the RollOver Class) with -Over.png
        $(this).attr("src", src);
    }, function () {
        var src = $(this).attr("src").replace("-Over.png", ".png"); //Replaces all instances of -Over.png with .png
        $(this).attr("src", src);
    });
    //Team.aspx page script 
    //ID-6
    if ($(".TeamContainer").is(":visible")) { //Checks to see if .TeamContainer is visible, if so then the script will commence!
        $("#Steven").bubbletip($("#Bubble1"), { delayHide: .2, delayShow: .2, offsetLeft: 70, offsetTop: 20 }); //Adds a bubbletip to each team member graphic on the team.aspx page
        $("#Bret").bubbletip($("#Bubble3"), { delayHide: .2, delayShow: .2, offsetLeft: 55, offsetTop: 20 });
        $("#Ryan").bubbletip($("#Bubble2"), { delayHide: .2, delayShow: .2, offsetLeft: 50, offsetTop: 20 });
        $("#Terry").bubbletip($("#Bubble4"), { delayHide: .2, delayShow: .2, offsetLeft: 40, offsetTop: 20 });
        $("#Bradd").bubbletip($("#Bubble5"), { delayHide: .2, delayShow: .2, offsetLeft: 60, offsetTop: 20 });
        $("#Keith").bubbletip($("#Bubble6"), { delayHide: .2, delayShow: .2, offsetLeft: 40, offsetTop: 20 });
        $("#Jon").bubbletip($("#Bubble7"), { delayHide: .2, delayShow: .2, offsetLeft: 70, offsetTop: 20 });
        }
    $("#Intro").animate({ //Animates the Intro container into view
        marginLeft: '3230px'
    }, 500);
    $(".TeamBio").hide(); //Hides the .TeamBio containers on page load
    $(".TeamContainer img").click(function () { //When a silhouette is clicked, a class is created based off the images ID 
        //(the class is used later)
        var objID = $(this).attr("id");
        var className = '.' + objID;
        if ($(className).is(":visible")) {
            return;
        }
        if ($(".TeamBio").is(":visible")) { //Checks to see if .TeamBio is visible if so then it fades itself out and shows the next container 
            $(".TeamBio").fadeOut(100, function () { }).animate({
                marginLeft: '-3015px'
            }, 500);
            $(className).show().animate({ //As you can see it took the ID of the image and formed a class 
                //Thus sliding in the right container with that class...
                //I kow it's not rocket science but still pretty cool eh?
                marginLeft: '3015px'
            }, 500);
        }
        else {
            $("#Intro").fadeOut(100, function () { });
            $(className).show().animate({
                marginLeft: '3015px'
            }, 500);
        }
    });
    $(".TeamCloseButton").click(function () { //Makes .Btn3s a close button
        $(".TeamBio").fadeOut(50, function () { }).animate({
            marginLeft: '-3015px'
        }, 500, function () {
            $("#Intro").fadeIn(100, function () { });
        });
    });
    //Initializes Google Maps Application 
    if ($("#MapCanvas").is(":visible")) {
        initializeMap();
    }
    else {}
});
//Start of dropdown menu for the main navigation

$("ul.SubNav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.SubNav*)
$("ul.SubNav").hoverIntent(function () {
    $(this).parent().find("span").addClass("SubHover");
}, function () {
    $(this).parent().find("span").removeClass("SubHover");
    $("ul.SubNav").hide();
});
$("ul.NavList li").hoverIntent(function () {
    $(this).find("span").addClass("SubHover");
    $(this).add("span").find("ul.SubNav").slideDown(200).show();
    $(this).add("span").hover(function () {
    }, function () {
        $(this).add("span").find("ul.SubNav").hide();
    });
}, function () {
    $(this).find("span").removeClass("SubHover");
});
$("ul.NavList li span").hover(function () {
    //Following events are applied to the SubNav itself (moving SubNav up and down)
    $(this).parent().find("ul.SubNav").slideDown(200).show(); //Drop down the SubNav on click
    $(this).parent().hover(function () {
    }, function () {
        $(this).parent().find("ul.SubNav").hide(); //When the mouse hovers out of the SubNav, move it back up
    });
    //Following events are applied to the trigger (Hover events for the trigger)
}).hoverIntent(function () {
    $(this).addClass("SubHover"); //On hover over, add class "SubHover"
});
//End of dropdown menu for the main navigation
//Start script for the services page
if ($(".AccordionWrapper").is(":visible")) {
    $(".SubCat").each(function (index) {
        $(this).attr("href", "#ul" + index);
        $(this).parent().find("ul").attr("id", "ul" + index);
    });
//ID-3
   $("#Accordion").tabs("#Accordion div.pane", { tabs: 'h2', effect: 'slide', initialIndex: 10});
   //Makes ULs Collapsible & Expandable
    //ID-5
        $(".Collapsible > li > a").prepend("<span>&nbsp;</span>");
        $(".Current").css("backgroundPosition", "0 5px").parent().find("ul").hide().removeClass("Current");
        $(".Collapsible > li > a").click(function () {
            $(".Current > span").css("backgroundPosition", "0 5px");
            $("a.Current").parent().find("ul").hide();
            $(this).find("span").css("backgroundPosition", "0 -19px").parent().addClass("Current");
            $(this).parent().find("ul").show();
        },
        function () {
            $(".Collapsible > li > a > span").css("backgroundPosition", "0 5px");
            $(this).parent().find("ul").hide().removeClass("Current");
        });
    }
    else {

    } 
//End script for the services page 
//Google Maps script - Sets marker position and info window
var map; 
var geocoder = null;
function initializeMap() {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("MapCanvas"));
        map.addControl(new GSmallMapControl());
        map.setCenter(new GLatLng(27.921662, -82.337922), 10);
        var redIcon = new GIcon(G_DEFAULT_ICON);
        redIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/micons/red-dot.png";
        redIcon.iconSize = new GSize(40, 34);
        markerOptions = { icon: redIcon };
        var point = new GLatLng(27.921662, -82.337922);
        map.addOverlay(new GMarker(point, markerOptions));
        //map.openInfoWindow(map.getCenter(), document.innerHTML = "Jon, html can go inside of here or we can remove this feature altogether");
        var mask = new MTrickOverlay();
        map.addOverlay(mask);
    }
}
//Overlays the image mask to give our map that feathered look
//Script can be found here:
//code.google.com/p/gmaps-utility-library-dev/issues/attachmentText?id=152&aid=-7906510704042564293&name=mtrickoverlay.js&token=c29bfa7acfdae8d0edd48e076a11b890
//ID-7
function MTrickOverlay(MOptions) {
    MOptions = MOptions ? MOptions : {};
}

MTrickOverlay.prototype.initialize = function(map) {
    this.map = map;
    this.img = document.createElement('IMG');
    this.img.style.position = 'absolute';
    this.img.src = 'App_Themes/RTS1/Imgs/MapCanvasMask.png';
    this.map.getPane(G_MAP_OVERLAY_LAYER_PANE).appendChild(this.img);
    this.center = this.map.getCenter();
    this.zoom = this.map.getZoom();
    this.shiftX = 0;
    this.shiftY = 0;
    return this.img;
}
MTrickOverlay.prototype.redraw = function(force) {
    var z = this.map.getZoom();
    if (this.zoom != z) {
        this.center = this.map.getCenter();
        this.zoom = this.map.getZoom();
        this.shiftX = this.deltaX;
        this.shiftY = this.deltaY;
        return;
    }
    var proj = this.map.getCurrentMapType().getProjection();
    var center = this.map.getCenter();
    var px = proj.fromLatLngToPixel(center, z);
    var cPx = proj.fromLatLngToPixel(this.center, z);
    this.deltaX = px.x - cPx.x + this.shiftX;
    this.deltaY = px.y - cPx.y + this.shiftY;
    this.img.style.left = this.deltaX + 'px';
    this.img.style.top = this.deltaY + 'px';
}
MTrickOverlay.prototype.remove = function() {
    this.img.parentNode.removeChild(this.img);
}
MTrickOverlay.prototype.copy = function() {
    return new MTrickOverlay();
}

//$(".SocialPopupLink").bubbletip($("#SocialPopup"), { delayHide: .2, delayShow: .2, offsetLeft: 0, offsetTop: 0 });


$("ul.cloudtabs").tabs("div.panes > div");

//Slides Out the web forms on the cloud services page...
$(".FormCloud").hoverIntent(function () {
    $(this).animate({
        left: "-30"
    }, 500, function () { $(this).css("cursor", "pointer") });
}, function () {
    $(this).animate({
       left: "-250"
    }, 500, function () { $(this).css("cursor", "hand") });

});

//$(".CloudParagraphs h2 a").click(function () {
//    $("div.CloudInfo*").toggle("fast");
//    return false;

//});


var showText = '+';

var hideText = '-';


// initialise the visibility check

var is_visible = false;


// append show/hide links to the element directly preceding the element with a class of "toggle"

$('.toggle').prev().prepend(' [<a href="#" class="toggleLink">' + showText + '</a>]');


// hide all of the elements with a class of 'toggle'

$('.toggle').hide();


// capture clicks on the toggle links
$('a.toggleLink, a.cloudtoggle').click(function () {

    // switch visibility
    is_visible = !is_visible;

    // change the link depending on whether the element is shown or hidden
    if ($(this).attr("class") == "cloudtoggle") {
        $('.toggleLink').html((!is_visible) ? showText : hideText);
    }
    else {
        $(this).html((!is_visible) ? showText : hideText);
    }
    // toggle the display - uncomment the next line for a basic "accordion" style
    //$('.toggle').hide();$('a.toggleLink').html(showText);
    $(this).parent().next('.toggle').toggle('slow');

    // return false so any link destination is not followed
    return false;

});