/**
 * jqSlider
 * 
 * A jQuery horizontal image slider which uses a preview bar of image pieces upon hover and
 * a transition between actual and new image.
 * 
 * @author Marco Lehmann <m99@gmx.li>
 * @copyright Marco Lehmann <m99@gmx.li>
 * @version 0.3 (2010-03-24)
 * 
 * 
 * Published under the MIT licence (http://www.opensource.org/licenses/mit-license.php).
 * 
 * Copyright (c) 2010 Marco Lehmann
 * 
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 * 
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 * 
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 * 
 */

(function($) {
 
	$.fn.jqSlider = function(settings) {
	
		$(".slide-view-back img").attr("src","");
 
 		// VARIABLES ==========================================================
		
 		// set default configuration  	
		var config = {
			debug: 				false,		// enable debugging
			barSize: 			25,			// size of preview bar per item
			speedTransition:	300,		// speed of position transition
			speedOpacity:		300,		// speed of opacity transition
			transitionAnimated:	true,		// animate position transition
			opacityAnimated:	true		// animate opacity transition
		};
		
		// merge with settings
 		if (settings) $.extend(config, settings);

		var slideWrapperId = $(this).attr("id");
		var debugPrefix = "[jqSlider 0.3 - #" + slideWrapperId + "] ";
		

 		// DIMENSIONS & SETTINGS ==============================================
		
		// get list dimension
		var slideWrapperWidth = parseInt($(this).css("width"));
		var slideWrapperHeight = parseInt($(this).css("height"));
		if (config["debug"]) {
			console.log(debugPrefix + "list dimensions: " + slideWrapperWidth + " x " + slideWrapperHeight);
		}
		
		// set slide control position and width
		$("#"+ slideWrapperId + " .slide-controls")
			//.css("left", $("#"+ slideWrapperId + " .slide-controls li").length * config["barSize"])
			.css("opacity", 1)
			.css("margin-left", slideWrapperWidth - ((($("#"+ slideWrapperId + " .slide-controls li").length) - 1) * config["barSize"]) - 1 * (($("#"+ slideWrapperId + " .slide-controls li").length) - 1));
		if (config["debug"]) {
			console.log(debugPrefix + $("#" + slideWrapperId + " .slide-controls li").length + " images found");
			console.log(debugPrefix + "control bar width: " + (($("#"+ slideWrapperId + " .slide-controls li").length) * config["barSize"]) + "px");
		}
			
		// set slide view front src and title of slide view back	
		slidebackImg = $("#"+ slideWrapperId + " .slide-controls .slide-previews:first img").attr("src");
		$("#"+ slideWrapperId + " .slide-view-back .slide-title").attr("src", slidebackImg);
		$("#"+ slideWrapperId + " .slide-view-front img").attr("src", slidebackImg);
		
		slidebackTitle = $("#"+ slideWrapperId + " .slide-controls .slide-previews:first img").attr("title");
		$("#"+ slideWrapperId + " .slide-view-back .slide-title").html(slidebackTitle);
		$("#"+ slideWrapperId + " .slide-view-front .slide-title").html(slidebackTitle);
		
		// set slide view back position	
		$("#"+ slideWrapperId + " .slide-view-back").css("width", slideWrapperWidth).css("left", slideWrapperWidth);
		$("#"+ slideWrapperId + " .slide-view-front").css("width", slideWrapperWidth);
		if (config["debug"]) {
			console.log(debugPrefix + "slide view positions and sizes set");
		}
		
		$("#" + slideWrapperId + " .slide-previews li:first").css("display", "none");
		
		// set slide preview width, cursor and bind click event
		$("#"+ slideWrapperId + " .slide-previews li")
			.css("width", config["barSize"])
			.css("cursor", "pointer")
			.click(function() {

			$(this).parent().children().css("display","block");			

			var imageTitle = $(this).find("img").attr("title");
			var imageSrc = $(this).find("img").attr("src");
			
			if (config["debug"]) {
				console.log(debugPrefix + imageTitle + " (" + imageSrc + ") clicked");
			}
			
			
			if ($("#" + slideWrapperId + " .slide-view-front").attr("src") == $("#" + slideWrapperId + " .slide-previews img li").attr("src")) {
				$(this).css("display", "none");
			}
			
			// reposition front and back image
			$("#" + slideWrapperId + " .slide-view-back").css("left", slideWrapperWidth);
			$("#" + slideWrapperId + " .slide-view-front").css("left", 0);
			
			// update back image
			$("#" + slideWrapperId + " .slide-view-back img")
				.attr("title", imageTitle)
				.attr("src", imageSrc);
				
			// update back title
			$("#" + slideWrapperId + " .slide-view-back .slide-title").text(imageTitle);
			
			// animate transition
			if (config["transitionAnimated"]) {
				$("#" + slideWrapperId + " .slide-view-back").animate({
					left: "0"
				}, config["speedTransition"], function(){
					$("#" + slideWrapperId + " .slide-view-front img").attr("title", imageTitle).attr("src", imageSrc);
					$("#" + slideWrapperId + " .slide-view-front .slide-title").text(imageTitle);
				});
				$("#" + slideWrapperId + " .slide-view-front").animate({
					left: -slideWrapperWidth
				}, config["speedTransition"], function(){
				});
			} else {
				$("#" + slideWrapperId + " .slide-view-back").css("left", 0);
				$("#" + slideWrapperId + " .slide-view-front").css("left", -slideWrapperWidth);
				$("#" + slideWrapperId + " .slide-view-front img").attr("title", imageTitle).attr("src", imageSrc);
				$("#" + slideWrapperId + " .slide-view-front .slide-title").text(imageTitle);
			}
			
		});
		
		
		
		// attach hover on slide view
		/*$("#"+ slideWrapperId + " .slide-view").hover(function() {
			if (config["transitionAnimated"]) {
				$("#" + slideWrapperId + " .slide-controls").animate({
					opacity: 1
				}, config["speedOpacity"], function(){
				});
			} else {
				$("#" + slideWrapperId + " .slide-controls").css("left", 0);
			}
		});*/

		// attach hover on slide controls
		/*$("#"+ slideWrapperId + " .slide-controls").hover(function() {
			if (config["opacityAnimated"]) {
				$("#" + slideWrapperId + " .slide-controls").animate({
					opacity: 1
				}, config["speedOpacity"], function(){
				});
			} else {
				$("#" + slideWrapperId + " .slide-controls").css("opacity", 1);
			}
		}, function() {
			if (config["opacityAnimated"]) {
				$("#" + slideWrapperId + " .slide-controls").animate({
					opacity: 0
				}, config["speedOpacity"], function(){
				});
			} else {
				$("#" + slideWrapperId + " .slide-controls").css("opacity", 0);
			}
		});*/

		return this;
	};
 
})(jQuery);