//**********************************************************************************************************************
/**
* DOCUMENT: /zlcms/includes/main.js
* DEVELOPED BY: Ryan Stemkoski
* COMPANY: Zipline Interactive
* EMAIL: ryan@gozipline.com
* PHONE: 509-321-2849
* DATE: 4/28/2010
* DESCRIPTION: This document contains programming required for the CMS login.  Requires the jQuery library.
*/
//***********************************************************************************************************************


//***********************************************************************************************************************
//ON DOCUMENT READY FUNCTIONS
//***********************************************************************************************************************
$(function() {

	//*******************************************************************************************************************
	//AUTOMATICALLY TURN ANY ITEM WITH CLASS ROLLOVER INTO ROLLOVER LINK (NOTE IMAGES MUST END IN _off.png _on.png 
	//*******************************************************************************************************************
	$('.rollover').mouseover(function() {
		var image = $(this).attr("src");
		image = image.replace("_off.png","_on.png");
		$(this).attr("src",image);
	}).mouseout(function() {
		var image = $(this).attr("src");
		image = image.replace("_on.png","_off.png");
		$(this).attr("src",image);
	});
	
	//ANY TIME YOU HIT A TRIGER SHOW THE WINDOW
	$('.zl_window_trigger').click(function() {
		var id = $(this).attr("id");
		zl_window(id);
	});
	
	
	//*******************************************************************************************************************
	//THIS FUNCTION WILL SHOW THE ZL DIALOG WINDOW
	//*******************************************************************************************************************
	function zl_window(item) {
	
		//OFFSET TO RAISE THE HEIGHT OF THE WINDOW 
		var offset = 40;
	
		//LETS HIDE AND ANO OTHER ZL WINDOW INSTANCES JUST TO BE SAFE
		hide_zl_window();
		
		//LETS GET THE ITEM OBJECT
		var zl_window = $(".zl_window").filter("div[title='" + item + "']");

		//CALCULATE THE PROPER INITIAL POSITION OF THE WINDOW AND ADJUST ACCORDINGLY
		zl_position(zl_window);
		
		//SHOW THE WINDOW
		show_zl_window(zl_window);
		
		//CREATE EVENT TO HIDE WINDOW ON HIT OF ESC
		$(window).bind('keydown', function(e) {	 if (e == null) {  keycode = event.keyCode; } else { keycode = e.which; } if(keycode == 27){ hide_zl_window(); } });
		
		//IF SOMEONE CLICKS OFF THE ELEMENT THEN CLOSE IT
		$(document).bind('click', function(e) { var clicked = $(e.target); if (!(clicked.is("zl_window div[title='" + item + "']") || clicked.parents().is("div[title='" + item + "']") || clicked.is('.zl_window_trigger') || clicked.parents().is('.zl_window_trigger')) ) {  hide_zl_window(); } });
		
		//IF THE WINDOW GETS RESIZED WHEN THE DIALOUG IS UP
		$(window).bind('resize', function (e) { zl_position(zl_window); });
		
		//CREATE A CLOSE BUTTON
		$('.products_window_right').bind('click', hide_zl_window);
			
		//HIDE THE WINDOW UPON REQUEST
		function hide_zl_window() {
			$('.zl_window').fadeOut('fast');
			$(window).unbind('keydown');
			$(document).unbind('click');
			$(window).unbind('resize');
			$('.products_window_right').unbind('click');
			
			//THIS SCRIPT ONLY
			$('.products_window_error').html("").hide();
			
		}
		
		//ADJUSTS THE POSITION
		function zl_position(zl_window) {
			var height = zl_window.height();
			var width = zl_window.width();
			var browser_height = $(window).height();
			var browser_width = $(window).width();
			var zl_top = ((browser_height - height) / 2) - offset;
			var zl_left = (browser_width - width) / 2;
			zl_window.css({ top: + zl_top, left: + zl_left });
		}
		
		//SHOWS THE WINDOW
		function show_zl_window(zl_window) {
			zl_window.fadeIn('normal');
		}
		
	}
	
	
	//*******************************************************************************************************************
	//HANDLE SUBMISSION OF THE EMAIL FORM
	//*******************************************************************************************************************
	$('.products_window_button_email').click(function() {
	
		var your_name = $('#p_your_name').val();
		var your_email = $('#p_your_email').val();
		var their_name = $('#p_friends_name').val();
		var their_email = $('#p_friends_email').val();
		var the_url = $(location).attr('href');
				
		if(your_name != "" && your_email != "" && their_name != "" && their_email != "") {
			$.post("index.php", { action: "email_to_friend", y_name: your_name, y_email: your_email, t_name: their_name, t_email: their_email, url: the_url },
					function(data){
						if(data == "success") {
							$('.zl_window').fadeOut("fast");
						} else {
							$('.products_window_error').html("There was an error sending your email please try again.").fadeIn("normal");
						}
					}
				);
		} else {
			$('.products_window_error').html("You must complete all fields to continue").fadeIn("normal");
		}
	});
	
	
	//*******************************************************************************************************************
	//HANDLE SUBMISSION OF THE EMAIL FORM
	//*******************************************************************************************************************
	$('.products_window_button_review').click(function() {
	
		var r_name = $('#review_name').val();
		var r_email = $('#review_email').val();
		var r_stars = $('#review_stars').val();
		var r_recommend = $('#review_recommend').val();
		var r_message = $('#review_message').val();
		var r_item = $('#review_item').val();
		var the_url = $(location).attr('href');
				
		if(r_name != "" && r_email != "" && r_message != "") {
			$.post("index.php", { action: "submit_review", name: r_name, email: r_email, stars: r_stars, recommend: r_recommend, message: r_message, id: r_item },
					function(data){
				
						if(data == "success") {
							window.location.reload();
						} else {
							$('.products_window_error').html("There was an error saving your review please try again.").fadeIn("normal");
						}
					}
				);
		} else {
			$('.products_window_error').html("You must complete all fields to continue.").fadeIn("normal");
		}
	});
	
	//*******************************************************************************************************************
	//HANDLE ITEM TABS
	//*******************************************************************************************************************
	$('.tab').click(function() {
		var index = $('.tab').index(this);
		$('.products_item_tabs_content').hide();
		$('.products_item_tabs_content').eq(index).show();
	});
	
	//IF SOMEONE CLICKS THE SEE ALL REVIEWS BUTTON
	$('#products_see_all_reviews').click(function() {
		$('.tab').eq(1).click();
	});
	
	//MAKE THE FIRST TAB CLICKED
	$('.tab').eq(0).click();
	$('#enlarge').loupe({
 	 	width: 180, // width of magnifier
  		height: 130, // height of magnifier
  		loupe: 'loupe' // css class for magnifier
	});
	
	//*******************************************************************************************************************
	//BUILD MODEL MENU
	//*******************************************************************************************************************
	$('.model').superfish(); 

});


	//*******************************************************************************************************************
	//FUNCTION THAT SWITCH IMAGES ON THE PRODUCTS FOOTER
	//*******************************************************************************************************************
	var src = "";
	
	$(document).ready(function() {
	
		$('.footerNav').hover(function(){
		
			src = $(this).attr('src');
			var new_src = src.replace('off','on');
			$(this).attr('src',new_src);
		
		},function(){
		
			$(this).attr('src',src);
		
		});
	
	});

/**
 * loupe - an image magnifier for jQuery
 * http://github.com/jdbartlett/loupe
 */
(function($) {
	$.fn.loupe = function(options) {
		if (!this.length) return this;
		options = $.extend({loupe:'loupe', width:200, height:150}, options || {});

		this.each(function() {
			var $this = $(this), loupe = null, big = null, small = null, time = null,
			hide = function() {loupe.hide()},
			move = function(e) {
				var os = small.offset(), sW = small.width(), sH = small.height(), oW = options.width/2, oH = options.height/2;
				if (e.pageX > sW + os.left + 10 || e.pageX < os.left - 10 ||
					e.pageY > sH + os.top + 10 || e.pageY < os.top - 10) return hide();
				if (time && clearTimeout(time)) time = null;
				loupe.css({left:e.pageX - oW, top:e.pageY - oH});
				big.css({
					left:-(((e.pageX - os.left) / sW) * big.width() - oW)|0,
					top:-(((e.pageY - os.top) / sH) * big.height() - oH)|0
				});
			};

			$this.mouseenter(function(e) {
				if (!small) small = $this.is('img') ? $this : $this.find('img:first');
				loupe = (loupe || (loupe = $('<div></div>').addClass(options.loupe)
					.css({
						width:options.width, height:options.height,
						position:'absolute', overflow:'hidden'
					})
					.append(big = $('<div style="background-color: #000000;"><img src="' + $this.attr($this.is('img') ? 'src' : 'href') + '" /></div>').css({position:'absolute'}))
					.mousemove(move).appendTo('body')
				)).show(); move(e);
			}).mouseout(function() {time = setTimeout(hide, 10)});
		});

		return this;
	}
})(jQuery);