/**********************************************

mySlideShow.jp：スライドショーっぽいことする。
時間がきたらいろいろ切り替わります。
クリックすると表示を切り替えるサムネとかもついでにつくれます。

使い方：とりあえずこのjsを読み込むことから始まる。
で、どこかで↓みたいな感じで実行してね。
var slideshowObject = new mySlideShow(argument);
slideshowObject.startSlideShow();

argument：せってい
{target:[{id:string,type:string,(animate:boolean),(selected:string)},...],timer:integer}
id：HTML上のid名。文字列。
type："view" or "thumb"。viewだと切り替わりの対象になる。thumbだと、クリックするとviewを切り替えるやつになる。
animate：（typeがviewのやつのみ）切り替わるときに、フェードインアニメーション付けるか否か。今のとこアニメーションはフェードインのみ。
selected：（typeがthumbのやつのみ）今表示されてるやつに対応するボタンなりサムネなりにかかるスタイル名。
timer：スライドショー切り替え時間（msec）

html･css上の注意
idで指定したdivの、子のdivが出たり消えたりサムネになったりする対象になります。
スライドショーの枚数は、targetで最初に指定したidの、子のdivの数となります。基本全部で数は合わせてください。
スライドショーの出たり消えたりは、displayを none ←→ block と切り替えてるので、なんか設定してるとだめになると思います。

いじょ。
**********************************************/

var mySlideShow = function(argument){
	this.argObject = argument.target;
	this.timer = argument.timer;
	this.startSlideShow = function(){
		var len;
		var currentIndex;
		var objs = [];
		var thumb_objs = [];
		var timerID;
		
		var init = function(arg,timer){
			//get Objects >> objs
			objs = arg;
			for(var i = 0;i < objs.length;i++){
				objs[i].jqobj = $("#" + objs[i].id);
			}
			
			//get item number.
			len = objs[0].jqobj.children("div").length;
			
			//set view display none
			for(var i = 0;i < objs.length;i++){
				if(objs[i].type === "view"){
					var divObjs = objs[i].jqobj.children("div");
					for(var j = 0;j < divObjs.length;j++){
						$(divObjs[j]).css("display","none");
					}
				}
			}
			
			//set thumb function
			for(var i = 0;i < objs.length;i++){
				if(objs[i].type === "thumb"){
					thumb_objs.push(objs[i]);
					var childDivItems = $("#" + objs[i].id + " > div");
					childDivItems.css("cursor","pointer");
					childDivItems.live("click",function(e){
						var target = $(e.currentTarget);
						clearInterval(timerID);
						var index = target.index()
						if(currentIndex !== index){
							showSlideItem(index);
							setSelectedCss(index);
							currentIndex = index;
						};
					});
				}
			}
			
			//set currentIndex
			currentIndex = 0;
			showSlideItem(currentIndex);
			setSelectedCss(currentIndex);
			
			//start animation
			if(len > 1){
				timerID = setInterval(function(){slideShow()},timer);
			}
		};
		
		var slideShow = function(){
			var argIndex = (currentIndex === len - 1) ? 0 : currentIndex + 1;
			showSlideItem(argIndex);
			setSelectedCss(argIndex);
			if(currentIndex === len - 1){
				currentIndex = 0;
			}else{
				currentIndex += 1;
			}
		};
		
		var showSlideItem = function(argIndex){
			var len = objs.length;
			for(var i = 0;i < len;i++){
				if(objs[i].type === "view"){
					$(objs[i].jqobj.children("div")[currentIndex]).css("display","none");
					if(!isEmpty($(objs[i].jqobj.children("div")[argIndex]))){
						objs[i].jqobj.css("display","block");
						$(objs[i].jqobj.children("div")[argIndex]).css("display","block");
						if(objs[i].animate){
							$(objs[i].jqobj.children("div")[argIndex]).css("opacity","0");
							$(objs[i].jqobj.children("div")[argIndex]).animate({opacity:"1"},500);
						}
					}else{
						objs[i].jqobj.css("display","none");
						$(objs[i].jqobj.children("div")[argIndex]).css("display","none");
					}
				}
			}
		};
		
		var setSelectedCss = function(argIndex){
			var thumb_len = thumb_objs.length;
			for(var i = 0;i < thumb_len;i++){
				var cssName = thumb_objs[i].selected;
				$(thumb_objs[i].jqobj.children("div")).removeClass(cssName);
				$(thumb_objs[i].jqobj.children("div")[argIndex]).addClass(cssName);
			}
		};
		
		var isEmpty = function($arg){
			if($arg.children().length === 0){
				if($arg.text() === ""){
					return true;
				}else{
					return false;
				}
			}else{
				return false;
			}
		}
		
		init(this.argObject,this.timer);
	};
};