/* 
 * スライドしてコンテンツを表示（汎用化はまだ）
 */

var SlideInContents = function(t,option,id){
	this.t = t;					// ポップアップで表示する内容
	this.t_old = null;
	
	// オプションの初期値
	this.opt = {
			create_fn:function(){},		// 作成されたら実行（表示・非表示関係なく）
			show_fn:function(){},		// 表示されたら実行
			close_fn:function(){}		// とじたら実行
	};
	
	// id
	this.id = id;
	
	// オプションを上書き
	$.extend(this.opt, option);
	
	// 処理実行
	this.init();
}

SlideInContents.prototype = {
	// 実行される処理
	init:function(){
		var id = this.id,
			_this = this;
		
		if(!$("body div").is("#"+id)) this.create();
		this.size();
		this.show();
		
		$(window).resize(function(){
			_this.size();
		});
		$(".sicButton_close").click(function(){
			$("#"+id).sic_close();
		});
		$('#glay_layer').click(function(){
			$("#"+id).sic_close();
		});
		
	},
	create:function(){
		// ページ内に一つだけ(モーダル、ローディングレイヤー)
		if(!$('body div').is('#glay_layer')){
			$('body').append('<div id="glay_layer"> </div><div id="loading"> </div>');
		}
		// モーダルとローディングを非表示
		$('#glay_layer').hide();	// モーダル用グレイレイヤー
		$('#loading').hide();		// ローディング表示
		
		$('body').append('<div id="'+this.id+'" class="sicPanel"><p class="sicClose"><span class="sicButton_close">閉じる</span></p><div class="sicContents"></div></div>');
	
		var opt = this.opt,
			t = this.t,
			p = $("#"+this.id),
			c = $("#"+this.id).find(".sicContents");
		
		c.html(t.show());
		opt.create_fn();
	},
	size:function(){
		var opt = this.opt,
			t = this.t,
			p = $("#"+this.id),
			c = $("#"+this.id).find(".sicContents"),
			inner = c.find(".sic_inner");
		
		p.height($(window).height());
		inner.height($(window).height()-86);
		
		if(508>$(window).width()){
			c.width($(window).width() - 24);
			if(p.width() > 0)this.show();
		}else{
			c.width($(window).width()/2);
			if(p.width() > 0)this.show();
		}
	},
	show:function(){
		var opt = this.opt,
			t = this.t,
			id = this.id,
			p = $("#"+this.id),
			c = $("#"+this.id).find(".sicContents"),
			h = $("#"+this.id).find(".sicClose"),
			m = $('#glay_layer'),
			pw = c.outerWidth();
		m.fadeTo("1000",0.5,function(){
			p.animate({width:pw + "px"});
			h.animate({width:pw + "px"});
		});
		
		/*$(".sicPanel").each(function(){
			if($(this).attr("id") != id) $(this).sic_close();
		})*/
		
		opt.show_fn();
	}
}

// プラグイン化する
$.fn.slideIC = function(option){
	
	var t = $(this),				// スライドインで表示する内容
		id = "slide_" + t.attr("id");	// 表示コンテンツの枠用のid
	
	// インスタンス化（jQselectable.jsを参考）
	if(t.length > 1){
		var _instances = [];
		t.each(function(i){
			_instances[i] = new SlideInContents(t,option,id);
		});
		return _instances;
	}else{
		return new SlideInContents(t,option,id);
	}
}

// 閉じる処理はどこからでも呼び出せるように別関数に分けてみた（第1引数に閉じるポップアップを指定）
$.fn.sic_close = function(){
	$(this).animate({width:"0"});
	$(this).find(".sicClose").animate({width:"0"});
	$('#glay_layer').fadeOut('fast');
	//close_fn();
}
