//run the effect

$(function() {
	$("#btn-m1").toggle(
		function() {
			$("#kite-mod-1").animate({backgroundColor: '#aa0000', color: '#fff', width: 320, height: 500}, 1000);
		},
		function() {
			$("#kite-mod-1").animate({backgroundColor: '#fff', color: '#000', width: 120, height: 100}, 1000);
		}
	);
});

function openKiteMod1()
{   
    $("#mod-1-pic").hide("slow");
    $("#mod-2-pic").show("slow");
    $("#mod-3-pic").show("slow");
    
    $("#kite-mod-3-content").hide();
    $("#kite-mod-2-content").hide();
    $("#kite-mod-1-content").show("slow");
    
    $("#kite-mod-3").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-2").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-1").animate({backgroundColor: '#000000', width: 860}, 1000);
}

function openKiteMod2()
{   
    $("#mod-1-pic").show("slow");
    $("#mod-2-pic").hide("slow");
    $("#mod-3-pic").show("slow");
    
    $("#kite-mod-3-content").hide();
    $("#kite-mod-1-content").hide();
    $("#kite-mod-2-content").show("slow");
    
    $("#kite-mod-3").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-1").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-2").animate({backgroundColor: '#000000', width: 860}, 1000);
}

function openKiteMod3()
{   
    $("#mod-1-pic").show("slow");
    $("#mod-2-pic").show("slow");
    $("#mod-3-pic").hide("slow");
    
    $("#kite-mod-2-content").hide();
    $("#kite-mod-1-content").hide();
    $("#kite-mod-3-content").show("slow");
    
    $("#kite-mod-1").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-2").animate({backgroundColor: '#0972a5', width: 50}, 1000);
    $("#kite-mod-3").animate({backgroundColor: '#000000', width: 860}, 1000);
}

function mod1FeatClick(){
      $("#kite-1-tech").hide(); 
      $("#kite-1-features").show();
      $("#kite-1-features-top").html("Features"); 
}

function mod1TechClick(){
      $("#kite-1-features").hide();
      $("#kite-1-tech").show();
      $("#kite-1-features-top").html("Technology");  
}

function mod2FeatClick(){
      $("#kite-2-tech").hide(); 
      $("#kite-2-features").show();
      $("#kite-2-features-top").html("Features"); 
}

function mod2TechClick(){
      $("#kite-2-features").hide();
      $("#kite-2-tech").show();
      $("#kite-2-features-top").html("Technology");  
}

function mod3FeatClick(){
      $("#kite-3-tech").hide(); 
      $("#kite-3-features").show();
      $("#kite-3-features-top").html("Features"); 
}

function mod3TechClick(){
      $("#kite-3-features").hide();
      $("#kite-3-tech").show();
      $("#kite-3-features-top").html("Technology");  
}



//all hover and click logic for buttons
$(function(){		
		$(".fg-button:not(.ui-state-disabled)")
		.hover(
			function(){ 
				$(this).addClass("ui-state-hover"); 
			},
			function(){ 
				$(this).removeClass("ui-state-hover"); 
			}
		)
		.mousedown(function(){
				$(this).parents('.fg-buttonset-single:first').find(".fg-button.ui-state-active").removeClass("ui-state-active");
				if( $(this).is('.ui-state-active.fg-button-toggleable, .fg-buttonset-multi .ui-state-active') ){ $(this).removeClass("ui-state-active"); }
				else { $(this).addClass("ui-state-active"); }	
		})
		.mouseup(function(){
			if(! $(this).is('.fg-button-toggleable, .fg-buttonset-single .fg-button,  .fg-buttonset-multi .fg-button') ){
				$(this).removeClass("ui-state-active");
			}
		});
	});
	
	
function showDealersContent(){
    $("#dealer_iframe").attr("src","index.html");
}











(function($) {
    $.fn.thumbPopup = function(options) {
        //Combine the passed in options with the default settings
        settings = jQuery.extend({
            popupId: "thumbPopup",
            popupCSS: { 'border': '1px solid #000000', 'background': '#FFFFFF', 'z-index': '1000' },
            imgSmallFlag: "_t",
            imgLargeFlag: "_l",
            cursorTopOffset: 15,
            cursorLeftOffset: 15,
            loadingHtml: "<span style='padding: 5px; color:black;'>Loading</span>"
        }, options);

        //Create our popup element
        popup =
		$("<div />")
		.css(settings.popupCSS)
		.attr("id", settings.popupId)
		.css("position", "absolute")
		.appendTo("body").hide();

        //Attach hover events that manage the popup
        $(this)
		.hover(setPopup)
		.mousemove(updatePopupPosition)
		.mouseout(hidePopup);

        function setPopup(event) {
            var fullImgURL = $(this).attr("src").replace(settings.imgSmallFlag, settings.imgLargeFlag);

            $(this).data("hovered", true);

            //Load full image in popup
            $("<img />")
			.bind("load", { thumbImage: this }, function(event) {
			    //Only display the larger image if the thumbnail is still being hovered
			    if ($(event.data.thumbImage).data("hovered") == true) {
			        $(popup).empty().append(this);
			        updatePopupPosition(event);
			        $(popup).show();
			    }
			    $(event.data.thumbImage).data("cached", true);
			})
			.attr("src", fullImgURL);

            //If no image has been loaded yet then place a loading message
            if ($(this).data("cached") != true) {
                $(popup).append($(settings.loadingHtml));
                $(popup).show();
            }

            updatePopupPosition(event);
        }

        function updatePopupPosition(event) {
            var windowSize = getWindowSize();
            var popupSize = getPopupSize();
            if (windowSize.width + windowSize.scrollLeft < event.pageX + popupSize.width + settings.cursorLeftOffset) {
                $(popup).css("left", event.pageX - popupSize.width - settings.cursorLeftOffset);
            } else {
                $(popup).css("left", event.pageX + settings.cursorLeftOffset);
            }
            if (windowSize.height + windowSize.scrollTop < event.pageY + popupSize.height + settings.cursorTopOffset) {
                $(popup).css("top", event.pageY - popupSize.height - settings.cursorTopOffset);
            } else {
                $(popup).css("top", event.pageY + settings.cursorTopOffset);
            }
        }

        function hidePopup(event) {
            $(this).data("hovered", false);
            $(popup).empty().hide();
        }

        function getWindowSize() {
            return {
                scrollLeft: $(window).scrollLeft(),
                scrollTop: $(window).scrollTop(),
                width: $(window).width(),
                height: $(window).height()
            };
        }

        function getPopupSize() {
            return {
                width: $(popup).width(),
                height: $(popup).height()
            };
        }

        //Return original selection for chaining
        return this;
    };
})(jQuery);