/*
youtube動画は読み込む前は「now loadgin」読み込んだらfadeinさせたい
キャプチャの切り替えと表示、拡大させたい、根本的に書き直したい
ハッシュつまりIDが指定されてたらonloadで映画のタイトルを光らせる
*/

//名前空間
ff9 = {};

//外部リンクは別ウィンドウで開く
ff9.externalLink = function(){
	$("a[rel='external']").click(function(){
		window.open($(this).attr("href"));
		return false;
	});
}

//キャプチャの切り替え
ff9.captureSwitch = function(){

	var captureTab = {};

	//キャプチャーの要素を取得
	var captures = $("#content div.capture");

	//各キャプチャーの要素に対し
	for(i=0;i<captures.length;i++){

		//キャプチャー要素の中に最初からあるimg要素をvisibility:hiddenに
		captures.eq(i).find("img").css("visibility","hidden");

		//キャプチャー要素の中のa要素を取得
		captureTab[i] = captures.eq(i).find("ul a");

		//この各a要素に対し
		for(j=0;j<captureTab[i].length;j++){

			var imageSrc = captureTab[i].eq(j).attr("href"); //イメージ要素のsrcを定義
			var imageAlt = captureTab[i].eq(j).attr("title");//イメージ要素のaltを定義
			var imageId  = "capture-" + i + "-" + j;         //イメージ要素のid を定義


			//イメージ要素（非表示）を生成
			captures.eq(i).append("<img id='" + imageId + "' class='createdImage' style='display:none; position:absolute; z-index:1; left:0px; top:0px; cursor:pointer;' src='" + imageSrc + "' alt='" + imageAlt + "' width='200' height='150' />");

			//a要素のrel属性に生成したイメージ要素のidを付与して関連付ける
			captureTab[i].eq(j).attr("rel","#" + imageId);

			//一つ目のa要素にclass="captureActive"、生成したイメージ要素を表示させる
			if(j==0){
				captureTab[i].eq(j).addClass("captureActive");
				$("#" + imageId).css("display","block");
			}

		}

		//a要素にクリックイベント
		captureTab[i].click(function(){

			//a要素のクラスにcaptureActiveがなければ
			//このifのところが怪しい
			if($(this).attr("class")==""){

				//a要素たちのクラス属性からcaptureActiveを消して、表示されてるイメージ要素のz-indexを1にしてフェードアウト
				$(this).parent().parent().find("li a.captureActive").removeClass("captureActive");
				$(this).parent().parent().parent().children("img.createdImage:visible").css("zIndex","1").fadeOut();

				//クリックしたa要素にクラスcaptureActiveを付けて、relで指定してるidのイメージ要素のz-indexを2にしてフェードイン
				$(this).addClass("captureActive");
				var displayImageId = $(this).attr("rel");
				$(this).parent().parent().parent().children(displayImageId).css("zIndex","2").fadeIn();

			}

			return false;

		});

		//生成したimg要素にクリックで切り替わるイベント
		if(captures.eq(i).children("img.createdImage").length > 1){
			captures.eq(i).children("img.createdImage").click(function(){

				//次に切り替えるイメージとidの取得
				//ifのところあやしい
				var nextImage = $(this).next("img.createdImage");
				if(!nextImage.attr("id")){
					nextImage = $(this).siblings("img.createdImage").eq(0);
				}
				var nextImageId = nextImage.attr("id");

				//このキャプチャーのタブのa要素たちを取得
				var thisCaptureTab = $(this).siblings("ul").find("li a");

				
				thisCaptureTab.filter(".captureActive").removeClass("captureActive");
				$(this).css("zIndex","1").fadeOut();

				thisCaptureTab.filter("[rel='#" + nextImageId + "']").addClass("captureActive");
				nextImage.css("zIndex","2").fadeIn();

			});
		}else{
			captures.eq(i).children("img.createdImage").css("cursor","default");
			captureTab[i].css("cursor","default");
		}

	}

}

ff9.playYoutube = function(){

	//オーバーレイを作成
	$("body").append("<div id='movieOverlay'></div>");
	$("#movieOverlay").css({
		display:"none",
		position:"absolute",
		left:"0px",
		top:"0px",
		zIndex:"10",
		backgroundColor:"#000",
		opacity:"0.9"
	});

	$("#content div.film p.movie a").click(function(){

		var youtubeId = $(this).attr("href").substring(("http://www.youtube.com/watch?v=").length);
		$("body").append("<div id='movieContent' style='display:none;'><object width='500' height='405'><param name='movie' value='http://www.youtube.com/v/" + youtubeId + "&hl=ja&fs=1&autoplay=1&rel=0&color1=0x3a3a3a&color2=0x999999'></param><param name='allowFullScreen' value='true'></param><param name='allowscriptaccess' value='always'></param><embed src='http://www.youtube.com/v/" + youtubeId + "&hl=ja&fs=1&autoplay=1&rel=0&color1=0x3a3a3a&color2=0x999999' type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true' width='425' height='344'></embed></object></div>")
		
		//オーバーレイのサイズを取得してフェードイン
		$("#movieOverlay").css({
			width:ff9.documentSize().dw + "px",
			height:ff9.documentSize().dh + "px"
		}).fadeIn(
			function(){
				$("#movieContent").css({
					display:"block",
					position:"absolute",
					left:ff9.scrollPostion().x + ff9.documentSize().ww/2 - 250 + "px",
					top:ff9.scrollPostion().y + ff9.documentSize().wh/2 - 200 + "px",
					zIndex:"11",
					width:"425px",
					height:"344px"
				});
			}
		).click(function(){
			$("#movieContent").remove();
			$(this).fadeOut();
		});

		//ウィンドウのサイズが変わると
		$(window).resize(function(){
			$("#movieOverlay").css({
				width:ff9.documentSize().dw + "px",
				height:ff9.documentSize().dh + "px"
			});
			$("#movieContent").css({
				left:ff9.scrollPostion().x + ff9.documentSize().ww/2 - 250 + "px",
				top:ff9.scrollPostion().y + ff9.documentSize().wh/2 - 200 + "px"
			});
		});
		
		return false;

	});
}

//ドキュメントの横縦幅とかを取得
ff9.documentSize = function() {
	this.ww = $(window).width();
	this.wh = $(window).height();
	this.pw = document.documentElement.scrollWidth || document.body.scrollWidth;
	this.ph = document.documentElement.scrollHeight || document.body.scrollHeight;
	this.dw = (this.ww>this.pw)? this.ww : this.pw;
	this.dh = (this.wh>this.ph)? this.wh : this.ph;
	return this;
}

//スクロールの位置を取得
ff9.scrollPostion = function() {
	this.x = document.documentElement.scrollLeft || document.body.scrollLeft;
	this.y = document.documentElement.scrollTop || document.body.scrollTop;
	return this;
}