$(function(){


/////////////////////////////////////////////////////
//　初期設定
/////////////////////////////////////////////////////

//　スライドコンテンツのリンク設定　/////////////////
//　slidOpen(a,b,c)
//　a : スライドコンテンツの幅（含むマージンデフォルトでの設定はマージン50px）
//　b : アクション大将のID（リンク先を読み込み先と関連づける為）
//　c : 左からスライドインするか？右からするかの設定
$("#content02").click(function(){id=$(this).attr("id"); slidOpen(500,"#"+id,"right");return false;});
$("#content03").click(function(){var winW = $(window).width(); id=$(this).attr("id"); slidOpen(winW,"#"+id,"right");return false;});
$("#content04").click(function(){id=$(this).attr("id"); slidOpen(440,"#"+id,"left");return false;});
$("#content05").click(function(){id=$(this).attr("id"); slidOpen(460,"#"+id,"left");return false;});
$("#content06").click(function(){id=$(this).attr("id"); slidOpen(350,"#"+id,"right");return false;});
$("#content07").click(function(){id=$(this).attr("id"); slidOpen(440,"#"+id,"right");return false;});
$("#content08").click(function(){var winW = $(window).width(); id=$(this).attr("id"); slidOpen(winW,"#"+id,"right");return false;});
$("H2 a").click(function(){id=$(this).attr("id"); slidOpen(740,"#"+id,"right");return false;});


//　スライドの早さ設定　/////////////////////////////
slideSpeed = 50; //100px単位の移動時間（ 1000=1sec ）

//　初期アクション設定　/////////////////////////////
winW = $(window).width();
winH = $(window).height();
$("body").wrapInner("<div id='slideWrap'></div>");
$("html").css({width:winW,"overflow-x":"hidden"});
$("#slideWrap").css("width",winW);
$("#slideReset").live("click", function(){ slideClose(); });
$("#close").live("click", function(){ slideClose(); });

//　window.resize　//////////////////////////////////
$(window).resize(function(){
winW = $(window).width();
winH = $(window).height();
$("html").css({width:winW});
$("#how2").css({width:winW,height:winH});
$("#slideWrap").css({width:winW});
$("#slideReset").css({width:winW,height:winH});
$("#slideContent").css({height:winH});
$("#slideContentBox").css({height:winH-100});
var flg = $("#slideContentBox").attr("class");
if ( flg == "full"){
$("#slideContent").css({width:winW,height:winH});
$("#slideContentBox").css({width:winW-100,height:winH-100});
}
else if ( flg == "photo"){
var instaNameH = $(".instaName").height();
$(".scroll-pane").css({height:winH-100-instaNameH}).jScrollPane();
}
else {
$(".scroll-pane").css({height:winH-100}).jScrollPane();
}
});

//　ESC KEY SETTEING　///////////////////////////////
$(document).keyup(function(event){
if (event.keyCode == 27){slideClose();}
});

});




/////////////////////////////////////////////////////
//　スライド処理 FUNCTION
/////////////////////////////////////////////////////
function slidOpen(slideWidth,id,posi){
//　変数代入
var url = $(id).attr("href");
var slideSec = slideWidth / 100 * slideSpeed;
//　要素追加
$("body").prepend("<div id='slideContent'>");
//　分岐→スライド部追加
if (posi == "left"){
$("#slideContent").prepend("<div id='slideContentBox'>").append("<div id='close'>X close</div>").css({width:slideWidth,height:winH,left:-slideWidth,top:0+"px"}).animate({left:0},slideSec,"easeInCubic").addClass(posi);
$("#slideWrap").animate({left:slideWidth},slideSec,"easeInCubic");
if( $("#slideContent").width() == winW ){ $("#slideContentBox").addClass("full"); }
}
if (posi == "right"){
$("#slideContent").prepend("<div id='slideContentBox'>").append("<div id='close'>X close</div>").css({width:slideWidth,height:winH,right:-slideWidth,top:0+"px"}).animate({right:0},slideSec,"easeInCubic").addClass(posi);
$("#slideWrap").animate({left:-slideWidth},slideSec,"easeInCubic");
if( $("#slideContent").width() == winW ){ $("#slideContentBox").addClass("full"); }
}
//　リンク先URL読み込み
$("#slideContentBox").css({width:slideWidth-100,height:winH-100}).load(url);
//　コンテンツクローズ用要素の追加
$("body").prepend("<div id='slideReset'>");
$("#slideReset").css({width:winW,height:winH,opacity:0});
}


/////////////////////////////////////////////////////
//　スライドクローズ処理 FUNCTION
/////////////////////////////////////////////////////
function slideClose(){
//　変数代入
var posi = $("#slideContent").attr("class");
var slideWidth = $("#slideContent").width();
var slideSec = slideWidth / 100 * slideSpeed;
//　分岐→スライドクローズ処理
if (posi == "left"){
$("#slideContent").animate({left:-slideWidth+"px"},slideSec,"easeInCubic",function(){$("#slideContent").remove();});
$("#slideWrap").animate({left:0+"px"},slideSec,"easeInCubic",function(){$("#slideReset").remove();});
}
if (posi == "right"){
$("#slideContent").animate({right:-slideWidth+"px"},slideSec,"easeInCubic",function(){$("#slideContent").remove();});
$("#slideWrap").animate({left:0+"px"},slideSec,"easeInCubic",function(){$("#slideReset").remove();});
}
}