// JavaScript Document
(function($){
	$.fn.fixPNG = function() {
		return this.each(function () {
			var image = $(this).css('backgroundImage');
			if (image.match(/^url\(["']?(.*\.png)["']?\)$/i)) {
				image = RegExp.$1;
				$(this).css({
					'backgroundImage': 'none',
					'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=" + ($(this).css('backgroundRepeat') == 'no-repeat' ? 'crop' : 'scale') + ", src='" + image + "')"
				}).each(function () {
					var position = $(this).css('position');
					if (position != 'absolute' && position != 'relative')
						$(this).css('position', 'relative');
				});
			}
		});
	};
	$.fn.Navigator = function(options){
		var defOpt = {cellWidth:120,cellHeight:120,width:600,height:240};
		var options = $.extend(defOpt, options);

		return this.each(function(){
			var $p = $('<div class="navigator"><div class="prev"><span>&nbsp;</span></div><div class="next"><span>&nbsp;</span></div><div class="wrapper"></div></div>')
			var list = this;
			var $prev = $p.find('.prev');
			var $next = $p.find('.next');
			var $wrapper = $p.find('.wrapper');
			$p.insertBefore(list);
			if(navigator.appName.indexOf('Internet Explorer')!=-1){
				$prev.fixPNG();$next.fixPNG();
			}
			$(list).appendTo($wrapper);
			
			$prev.hover(function(){$prev.addClass('btn-hover');},function(){$prev.removeClass('btn-hover');});
			$next.hover(function(){$next.addClass('btn-hover');},function(){$next.removeClass('btn-hover');});
			
			var rows = Math.floor(options.height/options.cellHeight);
			var cols = Math.floor(options.width/options.cellWidth);
			var itemMax = rows*cols;
			var itemTotal = $(list).find('li').length;
			var pageTotal = Math.ceil(itemTotal/itemMax);
			var page = 1;
			$(list).find('li').each(function(idx,obj){
				$(obj).width(options.cellWidth);
				$(obj).height(options.cellHeight);
				var objIdx = idx;
				var pageIdx = Math.floor(objIdx/itemMax);
				var colIdx = objIdx%itemMax % cols;
				var rowIdx = Math.floor(objIdx%itemMax / cols);
				$(obj).css('left',pageIdx * options.cellWidth*cols + colIdx * options.cellWidth);
				$(obj).css('top',rowIdx * options.cellHeight);
				
			});
			var update = function(){
				$p.width(options.width);
				$p.height(options.height);
				$wrapper.width(options.width);
				$wrapper.height(options.height);
				$(list).width(options.cellWidth*cols*pageTotal);
				$(list).height(options.cellHeight*rows);
				page > 1 ? $prev.show() :$prev.hide();
				page <pageTotal ? $next.show() :$next.hide();
				$(list).animate({
					left:- (page-1)*options.cellWidth*cols
				},300);
			}
			$p.find('.prev').click(function(){
				if(page>1) page --;
				update();
			});
			$p.find('.next').click(function(){
				if(page<pageTotal) page ++;
				update();
			});
			
			update();
		});
	};
})(jQuery);