// -------------------------------------------------------------------------------------------------
// PAGE SPECIFIC FUNCTIONS
// -------------------------------------------------------------------------------------------------


/* ************** SHOP FUNCTIONS ************** */
var image_id = 0;
var interval_id;

//
// next image
//
function nextImage(){
	
	// todo: max number should be supplied by database
	// once shop images are powered by CMS
	if(++image_id >= 7) image_id = 0;
	
	$("img.shop_image.current").fadeOut(2000, function() { $(this).removeClass('current'); });
	$("img.shop_image[image_id=" + image_id + "]").fadeIn(2000).addClass("current");
	
	$("div.shop_img_dots div.current").removeClass("current");
	$("div.shop_img_dots div[image_id=" + image_id + "]").addClass("current");
}

//
// reset slideshow
//
function resetSlideshow(){
	if(interval_id) clearInterval(interval_id);
	interval_id = setInterval("nextImage()", 5000);
}




/* ************** NEWS FUNCTIONS ************** */
	
//
// ajax save comment
//
function saveComment(post_id) {
	
	$.ajax({
		url: "fn_saveComment.php",
		data: {
			post_id: post_id,
			author: $("div[post_id='" + post_id + "'] input#comment_author").val(),
			text: $("div[post_id='" + post_id + "'] textarea#comment_text").val()
		},
		beforeSend: function(){
			// no double submissions!
			$("div.post[post_id='" + post_id + "'] div.commentDiv div.sending_comment").show();
		},
		success: function(response){
			response = $.parseJSON(response);
			if(response.success=="true"){
				// add comment to html
				var comment = "<div class='comment medium'><div class='commentAuthor bold'>" + response.author + " said:<\/div><div class='commentText'>" + response.text + "<\/div><div class='commentDate'><\/div><\/div>" ;
				$("div.post[post_id='" + post_id + "'] div.commentDiv").prepend(comment);
				
				// clear input
				$("div.post[post_id='" + post_id + "'] input#comment_author").val("");
				$("div.post[post_id='" + post_id + "'] textarea#comment_text").val("");
				
				// comment count
				$("div.post[post_id='" + post_id + "'] span.comment_count").html(parseInt($("span.comment_count").html()) + 1);
				
				// put back the form
				$("div.post[post_id='" + post_id + "'] div.commentDiv div.sending_comment").hide();
			}
		},
		error: function (XMLHttpRequest, textStatus, errorThrown) {
			alert('error');
		}
	});
}

// 
// ajax share post
//
function sharePost(post_id) {
	
	var subject = $("div[post_id='" + post_id + "'] input#share_from_name").val() + " has recommended a post on kendallwilkinson.com";
	var body = "<p>" + $("div[post_id='" + post_id + "'] #share_from_name").val() + " has recommended the post <strong>" + $("div[post_id='" + post_id + "'] #share_title").val() + "</strong>.\n" +
			   "<p>To visit this post please use the following url:</p>\n" +
			   "<p>http://www.knackdesign.com/projects/kwd_website_v4/news/post" + $("div[post_id='" + post_id + "'] #share_id").val() + "</p>\n" +
			   "<p style='padding-top:40px;'>Best Wishes,</p>\n" +
			   "<p>Kendall Wilkinson</p>";
	
	$.ajax({
		
		url: "fn_sendEmail.php",
		type: "POST",
		data: {
			from: "Kendall Wilkinson",
			reply_to: "info@knackdesign.com",
			to_email: $("div[post_id='" + post_id + "'] input#share_to_email").val(),
			subject: subject,
			body: body
		},
		beforeSend: function(){
			// no double submissions!
			$("div.post[post_id='" + post_id + "'] div.share_post div.sending_post").show();
		},
		success: function(response){
			//alert(response);
			$("div[post_id='" + post_id + "'] #share_from_name").val("");
			$("div[post_id='" + post_id + "'] #share_to_email").val("");
			$("div.post[post_id='" + post_id + "'] div.share_post div.sending_post").hide();
		}

	});
}


//
// toggle comment drawer
//
function toggleComments(post_id){
	$("div.post[post_id='" + post_id + "'] div.commentDiv").animate({"height": "toggle"}, { duration: 600 });
}


// 
// toggle share drawer
//
function toggleShare(post_id) {
	$("div.post[post_id='" + post_id + "'] div.share_post").animate({"height": "toggle"}, { duration: 600 });
}






/* ************** CMS FUNCTIONS ************** */

//
// save post
//
function savePost(){
	$("#action").val("save");
	$('#cms_form').submit()
//	alert('saving post');
}


//
// remove post
//
function removePost(){
	// todo: put a popup here to confirm removal of post?
	// and warning that removal of a post cannot be undone.
	$("#action").val("remove");
	$('#cms_form').submit();
}


/* NEWS CMS */
//
// add new category
//
function addNewCategory() {
	$.ajax({
		url: "fn_addCategory.php",
		data: {
			category: $("#new_category").val()
		},
		success: function(response){
			response = $.parseJSON(response);
			if(response.success=="true"){
				
				// build html
				var html = "<li class='category medium template' category_id='" + response.category_id + "'>" +
								"<input type='hidden' name='category_id[]' id='category_id' value='" + response.category_id + "'/>" +
								"<div class='checkbox on' category_id='" + response.category_id + "'>" +
									"<input type='hidden' name='category_selected[]' id='category_selected[]' value='1'/>" +
									"<div class='toggle'>" +
										"<div class='check'></div>" +
										"<div class='label'>" + response.label + "</div>" +
									"</div>" +
								"</div>" +
							"</li>" ;
				
				// add html to list
				$("ul.categories").append(html);
				
				// clear input
				$("#new_category").val('');
			}
		},
		error: function (XMLHttpRequest, textStatus, errorThrown) {
			alert('error');
		}
	});
}

function addNewPressImageField() {
	var html = "<li class='image form_subsection'>" +
					"<input type='hidden' id='order' name='image_id[]' value=''/>" +
					"<input type='text' id='order' name='order[]' style='width:50px;' value='" + $('.cms_press #order').length + "'/>" +
					"<div class='clear'></div>" +
					"<div class='thumb'>" +
						"<p class='medium'>Thumbnail Image. 60px x 60px.</p>" +
						"<div class='clear'></div>" +
						"<input type='file' name='thumb[]' id='thumb' style='background-color:#efeeeb;'/>" +
					"</div>" +
					"<div class='medium'>" +
						"<p class='medium'>Large Image. 360 pixels wide.</p>" +
						"<div class='clear'></div>" +
						"<input type='file' name='medium[]' id='medium' style='background-color:#efeeeb;'/>" +
					"</div>" +
					"<div class='clear'></div>" +
					"<div class='remove_image_btn medium'>Remove</div>" +
					"<div class='clear'></div>" +
				"</li>" ;
	$(".cms_press .images").append(html);
	$(".cms_press .no_images").hide();
}

function addNewPortfolioImageField() {
	var html = "<li class='image form_subsection'>" +
					"<input type='hidden' id='order' name='image_id[]' value=''/>" +
					"<input type='text' id='order' name='order[]' style='width:50px;' value='" + $('.cms_portfolio #order').length + "'/>" +
					"<div class='clear'></div>" +
					"<div class='thumb'>" +
						"<p class='medium'>Thumbnail Image. 60px x 60px.</p>" +
						"<div class='clear'></div>" +
						"<input type='file' name='thumb[]' id='thumb' style='background-color:#efeeeb;'/>" +
					"</div>" +
					"<div class='medium'>" +
						"<p class='medium'>Large Image. 360 pixels wide.</p>" +
						"<div class='clear'></div>" +
						"<input type='file' name='medium[]' id='medium' style='background-color:#efeeeb;'/>" +
					"</div>" +
					"<div class='medium'>" +
						"<p class='medium'>Popup Image. 620px high (portrait), or 620px wide (landscape).</p>" +
						"<div class='clear'></div>" +
						"<input type='file' name='large[]' id='medium' style='background-color:#efeeeb;'/>" +
					"</div>" +
					"<div class='clear'></div>" +
					"<div class='remove_image_btn medium'>Remove</div>" +
					"<div class='clear'></div>" +
				"</li>" ;
	$(".cms_portfolio .images").append(html);
	$(".cms_portfolio .no_images").hide();
}




// -------------------------------------------------------------------------------------------------
// DOM EVENT LISTENERS & MODIFIERS
// -------------------------------------------------------------------------------------------------
$(function(){

	/* ************** GLOBAL BEHAVIOUR ************** */
	
	// custom checkboxes
	$(".checkbox").each(function(){
			if($("input", this).val() == '1') {
				if($(this).hasClass("important")) {
					$(this).addClass("red") ;
				}
				else {
					$(this).addClass("on") ;
				}
			}
		});
		
	$(".checkbox .toggle").live("click", function(){
			var chk = $(this).parent(".checkbox");
			
			// red box
			if($(this).parent(".checkbox").hasClass("important")) {
				if(chk.hasClass("red")) {
					chk.removeClass("red") ;		
					$("input", chk).val("0");
				}
				else {
					chk.addClass("red") ;		
					$("input", chk).val("1");
				}
			}
			
			// normal box
			else {
				if(chk.hasClass("on")) {
					chk.removeClass("on") ;		
					$("input", chk).val("0");
				}
				else {
					chk.addClass("on") ;		
					$("input", chk).val("1");
				}
			}
		});
	
	$(".checkbox .remove").live("click", function(){
		var chk = $(this).parent(".checkbox");
		$.ajax({
			url: "fn_removeCategory.php",
			data: {
				category: chk.attr("category_id")
			},
			success: function(response){
				response = $.parseJSON(response);
				if(response.success == "true") {
					$(".category[category_id=" + response.category + "]").remove();
				}
			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
				alert('error');
			}
		});
	});
	
	
	$(".foot_logo").live("click", function(){
		$(".seo_about_text").animate({"height":"toggle"});
	});
	
	
	/* ************** PORTFOLIO ************** */
	
	//
	// Fade Effect for Gallery
	//
	$(".project_box").live("mouseover", function(){
		$(".caption", this).stop();
		$(".caption", this).fadeTo(300, 0.8);
	});
	
	$(".project_box").live("mouseout", function() {
		$(".caption", this).stop();
		$(".caption", this).fadeTo(600, 0.0);
	});
	
	$(".project_box").live("click", function() {
		location.href = "portfolio/" + $(this).attr("project_id")
	});
	
	
	
	
	/* ************** PROJECT & CLIP ************** */
	
	
	//
	// gallery
	//

	// thumb over
	$("div.gallery_thumbs li").live("mouseover", function(){
		if(!$(this).hasClass("current")) $(this).fadeTo(300, 1);
	});
	
	// thumb out
	$("div.gallery_thumbs li").live("mouseout", function(){
		if(!$(this).hasClass("current")) $(this).fadeTo(300, 0.3);
	});
	
	// thumb click
	$("div.gallery_thumbs li").live("click", function(){
		if(!$(this).hasClass('current')) {
			var id = $(this).attr("image_id");
		
			// old image
			$("div.gallery_image.current").fadeOut(600, function(){ $(this).removeClass('current'); });
		
			// new image
			$("div.gallery_image[image_id=" + id + "]").fadeIn(600).addClass("current");
		
			// thumbnail
			$("div.gallery_thumbs li.current").removeClass('current').fadeTo(300, 0.3);
			$(this).addClass('current');
		}
	});
	
	
	//
	// lightbox
	//
	
	var settings = {
		imageLoading: 'tpl/img/lightbox-ico-loading.gif',		// (string) Path and the name of the loading icon
		imageBtnPrev: 'tpl/img/lightbox-btn-prev.gif',			// (string) Path and the name of the prev button image
		imageBtnNext: 'tpl/img/lightbox-btn-next.gif',			// (string) Path and the name of the next button image
		imageBtnClose: 'tpl/img/lightbox-btn-close.gif',		// (string) Path and the name of the close btn
		imageBlank: 'tpl/img/lightbox-blank.gif'				// (string) Path and the name of a blank image (one pixel)
	};
	
	
	$("a.project_lightbox").lightBox(settings);
	$("a.project_btn_lightbox").lightBox(settings);
	$("a.feature_lightbox").lightBox(settings);
	
	
	
	/* ************** SHOP ************** */
	
	//
	// show image
	//

	$("div.shop_img_dots div").live("click", function(){
		image_id = $(this).attr("image_id");
		$("img.shop_image.current").fadeOut(600, function(){ $(this).removeClass('current'); });
		$("img.shop_image[image_id=" + image_id + "]").fadeIn(600).addClass("current");
		
		$("div.shop_img_dots div.current").removeClass("current");
		$(this).addClass("current");
		
		resetSlideshow();
	}); 
	
	resetSlideshow();
	
	
	
	/* ************** NEWS ************** */
	
	
	
	/* ************** ABOUT ************** */
	
	$(".about ul.tabs").tabs("div.panes > div"); 
	
	$(".inquiries_form .form_button_submit").live("click", function(){
		
		var body = "<p><strong>" + $("#firstname").val() + " " + $("#lastname").val() + "</strong> has submitted the following inquiry:</p>\n" +
				   
				   "<p><div>First Name: " + $("#firstname").val() + "</div>\n" +
				   "<div>Last Name: " + $("#lastname").val() + "</div>\n" +
				   "<div>Email Address: " + $("#email").val() + "</div>\n" +
				   "<div>Phone Number: " + $("#phone").val() + "</div>\n" +
				   "<div>Message: " + $("#message").val() + "</div></p>\n" +
				   
				   "<br/><p><strong>Project Address</strong>\n" +
				   "<div>Address: " + $("#project_address").val() + "</div>\n" +
				   "<div>City: " + $("#project_city").val() + "</div>\n" +
				   "<div>State: " + $("#project_state").val() + "</div>\n" +
				   "<div>Zip: " + $("#project_zip").val() + "</div></p>\n" +
				   
				   "<br/><p><strong>Mailing Address</strong>\n" +
				   "<div>Address: " + $("#mailing_address").val() + "</div>\n" +
				   "<div>City: " + $("#mailing_city").val() + "</div>\n" +
				   "<div>State: " + $("#mailing_state").val() + "</div>\n" +
				   "<div>Zip: " + $("#mailing_zip").val() + "</div></p>\n" +
				   
				   "<br/><p><strong>Project Type</strong>\n" +
				   "<div>Type: " + $("#project_type").val() + "</div>\n" +
				   "<div>Square Footage: " + $("#square_footage").val() + "</div>\n" +
				   "<div>Description: " + $("#description").val() + "</div>\n" +
				   "<div>Budget: " + $("#budget").val() + "</div>\n" +
				   "<div>Comments: " + $("#comments").val() + "</div></p>\n";
				   
		$.scrollTo(0, 300);
		$(".inquiries_form .form_form").fadeOut("300", function(){
			$("#firstname").val("");
			$("#lastname").val("");
			$("#email").val("");
			$("#phone").val("");
			$("#message").val("");
			$("#project_address").val("");
			$("#project_city").val("");
			$("#project_state").val("");
			$("#project_zip").val("");
			$("#mailing_address").val("");
			$("#mailing_city").val("");
			$("#mailing_state").val("");
			$("#mailing_zip").val("");
			$("#project_type").val("");
			$("#square_footage").val("");
			$("#description").val("");
			$("#budget").val("");
			$("#comments").val("");
		});
		$(".inquiries_form .form_sending").show();
		
		$.ajax({
			
			url: "fn_sendEmail.php",
			type: "POST",
			data: {
				from: "kendallwilkinson.com",
				reply_to: "",
				to_email: "info@kendallwilkinson.com",
				subject: "kendallwilkinson.com inquiry",
				body: body 
			},
			success: function(response){
				$(".inquiries_form .form_sending").hide();
				$(".inquiries_form .form_confirmation").show();
				setTimeout(function(){
					$(".inquiries_form .form_confirmation").hide();
					$(".inquiries_form .form_form").fadeIn('300');
				}, 3000);
			}

		});
		
	});
	
	
	
	/* ************** CMS LOGIN ************** */
	
	$(".form_button_login").live("click", function(){
		$("#login_form").submit();
	});
	
	
	
	
	/* ************** CMS ************** */
	
	// init dialog
	$(".remove_dialog").dialog({
		bgiframe: true,
		resizable: false,
		autoOpen: false,
		height:160,
		modal: true,
		overlay: {
			backgroundColor: '#000',
			opacity: 0.4
		},
		buttons: {
			"Yes, delete it.": function() { 
				removePost();
			},
			"No": function() {
				$(this).dialog("close"); 
			}
		}
	});
	
	// init date picker 
	$("#post_date, #clip_date").datepicker({
		duration:0,
		dateFormat: "yy/mm/dd"
	});
	
	// new entry clicked
	$(".cms_news .controls .new_entry").live("click", function(){ location.href = "cms/news"; });
	$(".cms_press .controls .new_entry").live("click", function(){ location.href = "cms/press"; });
	$(".cms_portfolio .controls .new_entry").live("click", function(){ location.href = "cms/portfolio"; });
	
	// save entry clicked
	$(".controls .save_entry").live("click", savePost);
	
	// remove entry clicked
	$(".controls .remove_entry").live("click", function(){
		$(".remove_dialog").dialog('open');
	});
	
	// new button clicked
	$(".cms_news .add_new .add_button").live("click", addNewCategory);
	$(".cms_press .add_button").live("click", addNewPressImageField);
	$(".cms_portfolio .add_button").live("click", addNewPortfolioImageField);
	
	// remove btn clicked
	$(".cms_press .remove_image_btn").live("click", function(){
		$(this).parentsUntil(".images").remove();
		if($(".cms_press .image").length == 0) $(".cms_press .no_images").show();
	});
	
	$(".cms_portfolio .remove_image_btn").live("click", function(){
		$(this).parentsUntil(".images").remove();
		if($(".cms_portfolio .image").length == 0) $(".cms_portfolio .no_images").show();
	});
	
	// clip sequence changes
	$(".cms_press input.sequence").change(function(){
		var sequence = [];
		$("ul.clip_list li").each(function(){
			sequence[$(this).attr("item_id")] = $("input.sequence", this).val();
		});
		
		$.ajax({
			url: "fn_orderPressClips.php",
			type: "POST",
			data: {
				sequence: sequence
			},
			success: function(response){
				response = $.parseJSON(response);
				if(response.success!="true"){
					alert("error");
				}
			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
				alert('error');
			}
		});
	});
	
	$(".cms_portfolio input.sequence").change(function(){
		var sequence = [];
		$("ul.project_list li").each(function(){
			sequence[$(this).attr("item_id")] = $("input.sequence", this).val();
		});
		
		$.ajax({
			url: "fn_orderProjects.php",
			type: "POST",
			data: {
				sequence: sequence
			},
			success: function(response){
				response = $.parseJSON(response);
				if(response.success!="true"){
					alert("error");
				}
			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
				alert('error');
			}
		});
	});
	
	// custom select item styling
	$("select").sSelect();
	
	
	
});