// PNG Fix (supersleight jQuery Plugin)
jQuery.fn.supersleight = function(settings) {
	settings = jQuery.extend({
		imgs: true,
		backgrounds: true,
		shim: 'images/transparent.gif',
		apply_positioning: true
	}, settings);
	
	return this.each(function(){
		if (jQuery.browser.msie && parseInt(jQuery.browser.version, 10) < 7 && parseInt(jQuery.browser.version, 10) > 4) {
			jQuery(this).find('*').andSelf().each(function(i,obj) {
				var self = jQuery(obj);
				// background pngs
				if (settings.backgrounds && self.css('background-image').match(/\.png/i) !== null) {
					var bg = self.css('background-image');
					var src = bg.substring(5,bg.length-2);
					var mode = (self.css('background-repeat') == 'no-repeat' ? 'crop' : 'scale');
					var styles = {
						'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + mode + "')",
						'background-image': 'url('+settings.shim+')'
					};
					self.css(styles);
				};
				// image elements
				if (settings.imgs && self.is('img[src$=png]')){
					var styles = {
						'width': self.width() + 'px',
						'height': self.height() + 'px',
						'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + self.attr('src') + "', sizingMethod='scale')"
					};
					self.css(styles).attr('src', settings.shim);
				};
				// apply position to 'active' elements
				if (settings.apply_positioning && self.is('a, input') && (self.css('position') === '' || self.css('position') == 'static')){
					self.css('position', 'relative');
				};
			});
		};
	});
};

// Preload images
(function($) {
  var cache = [];
  // Arguments are image paths relative to the current page.
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  }
})(jQuery)

// When page is ready, set defaults
$(document).ready(function() {
	
	// Anything referenced mroe than once we pull in here 
	// to optimize CSS selection speed
	var d_logo 		= $("#logo");
	var d_support 	= $("#support");
	var d_learnmore = $("#learnmore");
	var d_totop		= $("#totop");
	
	
	// Depending on browser version (namely, IE6) we'll handle logo sprite and positioning differently
	if (jQuery.browser.msie && $.browser.version.substr(0,1)<7 )
	{
		// CSS Fixes for IE6
		d_logo.css({"margin-left": "225px", "background-image": "url('images/logo_home.png')"});
		$("#bottom-wrapper").css("margin-top", "-120px");
		$("#header-image-slider").css({"top": "-461px"});
	} else {
		// Otherwise, use logo sprite for modern browsers
		d_logo.attr('class', "logo_home");	
	}
	
	// PNG Fix
	d_logo.supersleight();
	$("#content").supersleight();
	$("#questions").supersleight();
	
	// Initial opacity values
	d_support.css("opacity", "0.5");
	d_learnmore.css("opacity", "0.2");
	d_totop.css("opacity", "0.1");
	$('#hover-logo').css("opacity", "0.5");

	// Swap out IE-compatible PNG's (to fix IE6, 7 and 8
	if (jQuery.browser.msie) 
	{
		d_support.css({"background-image": "url('images/support.ie.png')",
				"cursor": "pointer"});
		d_learnmore.css({"background-image": "url('images/learnmore.ie.png')",
				"cursor": "pointer"});
		d_totop.css({"background-image": "url('images/totop.ie.png')",
				"cursor": "hand"});
		$(".menu-item").css({"cursor": "hand",
			"display": "block",
			"position": "relative"});
	}
	
	// Sliding content (sudoSlider jQuery Plugin)
	$("#slider").sudoSlider({
		autoheight: 	true,
		controlsAttr: 'id="controls"',
		speed: 1000,
		ease: "easeOutCubic"
	});
	
	// Preload images
	jQuery.preLoadImages(	"images/header_security.jpg", 
							"images/header_phone.jpg",
							"images/header_it.jpg",
							"images/header_home.jpg",
							"images/header_door.jpg"	
						);
});

// Support button - keep in position
// Set CSS via JavaScript to avoid the annoying visual
// glitches that happen on some browsers/OS's when scrolling
$(window).scroll(function() {
    $("#support").css("top", $(window).scrollTop() - 23 + "px");
});

// Support button, fade in/out and slide
$(function() {
		$('#support').hover(function() {
			$(this).stop().animate({"opacity": "1.0", "top": $(window).scrollTop() + "px"}, "slow");
		}, function() {
			$(this).stop().animate({"opacity": "0.5", "top": $(window).scrollTop() - 23 + "px"}, "slow");
		});
});

// Menu hover animation
$(function() {
		$('.menu-image').hover(function() {
			$(this).stop().animate({"opacity": "0.0"}, "slow");
		}, function() {
			$(this).stop().animate({"opacity": "1.0"}, "slow");
		});
});

// Animate the logo fade when hovering over menu item
function logo_animate(to_image)
{
	var hl = $('#hover-logo');
	to_image = "hlogo_" + to_image + ".png";

	// First, set opacity to zero and set the image to appropriate one
	hl.css({"opacity": "0", "background-image": "url('images/" + to_image + "')"});
	
	// Then animate the fading in
	hl.stop().animate({"opacity": "1.0"}, "slow");
}

// Stop logo animation
function logo_animate_end() {
	$('#hover-logo').stop().animate({"opacity": "0"}, "slow");
}

// Activates the menu/content slider when an item is selected
function slideMenu(which_menu) {
	
		// Grab any objects that will be referenced more than once
		// This speeds things up a bit
		var his  = $("#header-image-slider");
		var hi   = $("#header-inner");
		var hl   = $('#hover-logo');			
		var cont = $("#content");
		var logo = $("#logo");
		var slide= $("#slider");
		
		// Browser is IE6?
		var isIE6 = false;
		if (jQuery.browser.msie &&	$.browser.version.substr(0,1)<7)
		{
			isIE6 = true;
		}
		
		// Depending on the menu, we'll slide to that content
		var nav_to = 0;
		switch (which_menu)
		{
			case "it":
				nav_to = (2);	
				break;
			case "door":
				nav_to = (3);	
				break;
			case "phone":
				nav_to = (4);	
				break;
			case "security":
				nav_to = (5);	
				break;
			case "support":
				which_menu = "home";	// For support use default color/header
				nav_to = (6);
				break;
			case "home":
			default:
				nav_to = (1);	
				break;
		}
		
		// Set img of header image slider
		his.css("background-image", "url('images/header_" + which_menu + ".jpg')");
		
		// If IE6, need to swap out a different logo than just changing the class
		// That specific logo is an 8-bit PNG with non-alpha transparency
		if (isIE6)
		{
			hl.stop().css({"opacity": "0", "background-image": "url('images/h" + which_menu + "_logo.png')"}, function(){			
							logo.supersleight();
						  });	
		}
		
		// Set image of logo depending on browser version
		if (isIE6)
		{
			logo.css("background-image", "url('images/logo_" + which_menu + ".png')");
			logo.supersleight();
		} else {
			logo.attr("class","logo_" + which_menu);
		}
		
		// Now, simultaneously slide in the header and the content				
		$(function() {
			// Animate the header image
			his.stop().css("opacity", "0");
			//logo.supersleight();

			his.animate({"top": "0px", "opacity": "1"}, "slow", "easeOutCubic", function() {
						hi.css("background-image", "url('images/header_" + which_menu + ".jpg')");				
						his.css({"opacity": "0", "top": "-461px"});
			});
			
			// Content slide
			slide.sudoSlider(nav_to);
		});

};

// Menu navigation, per each menu click activate slideMenu with appropriate parameter
$(function() {
	$('#menu-it').click( function() { slideMenu('it'); } );
});
$(function() {
	$('#menu-door').click( function() {slideMenu('door');} );
});
$(function() {
	$('#menu-phone').click( function() {slideMenu('phone');} );
});
$(function() {
	$('#menu-security').click( function() {slideMenu('security');} );
});
$(function() {
	$('#menu-home').click( function() {slideMenu('home');} );
});

// Slide to 'support' content page
function support()
{
	slideMenu('support');	
}

// Logo image animation effects on menu hover
$(function() {
		$('#menu-it').hover(function() {
			logo_animate("it");
		}, function() {
			logo_animate_end();
		});
});
$(function() {
		$('#menu-door').hover(function() {
			logo_animate("door");
		}, function() {
			logo_animate_end();
		});
});
$(function() {
		$('#menu-phone').hover(function() {
			logo_animate("phone");
		}, function() {
			logo_animate_end();
		});
});
$(function() {
		$('#menu-security').hover(function() {
			logo_animate("security");
		}, function() {
			logo_animate_end();
		});
});
$(function() {
		$('#menu-home').hover(function() {
			logo_animate("home");
		}, function() {
			logo_animate_end();
		});
});

// Learn more fade in/out
$(function() {
		$('#learnmore').hover(function() {
			$(this).stop().animate({"opacity": "0.5"}, "slow");
		}, function() {
			$(this).stop().animate({"opacity": "0.2"}, "slow");
		});
});

// To top fade in/out
$(function() {
		$('#totop').hover(function() {
			$(this).stop().animate({"opacity": "0.5"}, "slow");
		}, function() {
			$(this).stop().animate({"opacity": "0.1"}, "slow");
		});
});

// Learn more scroller
function scrollLearnMore(){
	$('html,body').animate({
	scrollTop: $("#mazteck-name-logo").offset().top + 35
	}, 2000, "easeOutCubic");
}

// ToTop scroller
function scrollToTop(){
	$('html,body').animate({
	scrollTop: 0
	}, 1500, "easeOutCubic");
}

