﻿/**
 * @author tank
 * @date 2009/12/14
 * @desc 881903 news image box
 * @version 1.0
 */
(function($) {
	$.fn.imageShow = function(options){
		var defaults = {
			images:[],imageWidth:75,clearId:""
		};
		var opts = $.extend(defaults, options);
		return this.each(function(){
			var obj = $(this);
			var imageSize = opts.images.length;
			var imagePath,imagePath_b, imagePath_s;
			var patt = /(.+)\/(\d+_\d+-\d+)\.(\w+)$/;
			var imageWidth = opts.imageWidth;		
			var imageTitle;
			var index = 0;
			
			if(imageSize == 0){
				$("#"+opts.clearId).css("width","100%");
				return;
			}else{
				imagePath = opts.images[0].path;				
				var imagePathPatt = imagePath.match(patt);
				imagePath_b = imagePathPatt[1]+"/"+imagePathPatt[2]+"_b."+imagePathPatt[3];
				imageTitle = opts.images[0].title;
			}
			
			fillBigImgBox(obj, opts.images);
			fillMiddleImgBox(obj,imagePath,imagePath_b, imageTitle);	
			fillSmallImgBox(obj,opts.images,imageSize);
						
			function fillBigImgBox(obj, imageList){
			    obj.append("<div id='bigImageBox' style='width:1px;height:1px;overflow:hidden;'></div>");
			    $.each(imageList, function(i, item){
			        $("<a />").appendTo("#bigImageBox").attr({"href":item.path, "title":item.title, "class":"thickbox", "rel":"bigImageList"});
			    });
			}
			
			function fillMiddleImgBox(obj, imagePath, imagePath_b, title){
				obj.append("<div id='middleImageBox' class='middleImageBox'><table width='100%' height='100%' border='0' valign='middle' align='center' cellpadding='0' cellspacing='0'><tr><td><img src='"+imagePath_b+"' /></td></tr></table></div>");
				obj.append("<div id='imageTitle' class='imageTitle' style='font-size:12px;'>"+title+"</div>");
				$("#middleImageBox").click(function(){
					tb_init("#bigImageBox a", index);
				});	
			}
			
			function fillSmallImgBox(obj, imageList,imageSize){
				if(imageSize == 1){
					return;
				}
				obj.append("<div id='imageSpace01' class='imageSpace'/>");
				$("<div />").attr("id","smallImageBox").addClass("allSmallBox").insertAfter("#imageSpace01");
				if(imageSize >= 2){
					$("<ul/>").appendTo("#smallImageBox").attr("id","listImageBox").addClass("listImageBox").css("width", imageWidth*imageSize);
					$.each(imageList, function(i, item){
					    var imagePathPatt = item.path.match(patt);
				        var imagePath_b = imagePathPatt[1]+"/"+imagePathPatt[2]+"_b."+imagePathPatt[3];
				        var imagePath_s = imagePathPatt[1]+"/"+imagePathPatt[2]+"_s."+imagePathPatt[3];
						$("#listImageBox").append("<li id='smallImageBox"+i+"' class='smallImageBox itemImageBox'><table width='100%' height='100%' border='0' valign='middle' align='center' cellpadding='0' cellspacing='0'><tr><td><img src='"+imagePath_s+"' /></td></tr></table></li>");						
						$("#smallImageBox"+i).click(function(){
						    index = i;
							$("#middleImageBox img").attr("src", imagePath_b);
							$("#imageTitle").html(item.title).css("font-size","12px");
							$("#middleImageBox").unbind();
							$("#middleImageBox").click(function(){
								tb_init("#bigImageBox a", index);
								return false;
							});
						});
					});
					if (imageSize > 2) {
						obj.append("<div id='imageScrollBar' class='imageScrollBar'></div>");						
						var offsetVal = 0;
						$("<div />").appendTo("#imageScrollBar").addClass("leftScroll").click(function(){
							if (offsetVal == 0) {
								return;
							}
							offsetVal += imageWidth;
							$("#listImageBox").animate({
								left: offsetVal + "px"
							}, "slow");
						});		
						$("<div />").appendTo("#imageScrollBar").addClass("rightScroll").click(function(){
							var allOffsetVal = imageWidth * imageSize;
							if ((allOffsetVal + offsetVal) == imageWidth * 2) {
								return;
							}
							offsetVal -= imageWidth;
							$("#listImageBox").animate({
								left: offsetVal + "px"
							}, "slow");
						});						
					}				
				}
				obj.append("<div id='imageSpace02' class='imageSpace'/>");				
			}
		});
	}
})(jQuery);
