/*------------------------------------------------------------------
Navigation OPEN / CLOSE
------------------------------------------------------------------*/

//各要素のパス
var navigationAreaPath = "#naviarea";
var navigationPath     = "#naviarea div ul li.open";
var contentsPath       = "#navi2 div.open";
var closeBtnPath       = "p#close";
var closeHeight        = 0

var fnavigationPath    = "#footerNavi ul li.open";
var fcontentsPath      = "#footerContents";

//表示エリアが閉じているか
var headNaviClose      = true;
var footContentsClose  = true;

//現在アクティブな要素 初期値
var headActiveElement  = 99;
var footActiveElement  = 99;


/*------------------------------------------------------------------
main
------------------------------------------------------------------*/
j$(document).ready(function(){
   //head
   closeHeight = j$(closeBtnPath).height() + 30;
   j$(navigationPath).click(function(){
      var index = j$(navigationPath).index(this);
      var same  = sameElement(index);
      
      if(headNaviClose){
         //表示エリア=>閉
         naviOpen(index);
      }else if(!headNaviClose && !same){
         //表示エリア=>開、選択要素=>違う
         naviCloseAndOpen(index);
      }else{
         //表示エリア=>開、選択要素=>同じ
         naviClose();
      }
   });
   j$(closeBtnPath).click(naviClose);
   
   //foot
   j$(fnavigationPath).click(function(){
      var index = j$(fnavigationPath).index(this);
      var same  = footSameElement(index)
      
      if(footContentsClose){
         //表示エリア=>閉
         footNaviOpen(index);
      }else if(!footContentsClose && !same){
         //表示エリア=>開、選択要素=>違う
         footNaviCloseAndOpen(index);
      }else{
         //表示エリア=>開、選択要素=>同じ
         footNaviClose();
      }
   });
   
});

/*------------------------------------------------------------------
check
------------------------------------------------------------------*/
function sameElement(idx){
   var returnValue;
   if(headActiveElement == idx){
      returnValue = true;
   }else{
      returnValue = false;
      headActiveElement = idx;
   }
   return returnValue;
}
function footSameElement(idx){
   var returnValue;
   if(footActiveElement == idx){
      returnValue = true;
   }else{
      returnValue = false;
      footActiveElement = idx;
   }
   return returnValue;
}


/*------------------------------------------------------------------
navi operation
------------------------------------------------------------------*/
//head
function naviOpen(idx){
   var target = contentsPath+":eq("+idx+")";
   j$(target).css("display", "block");
   j$(navigationAreaPath).animate(
      {height: j$(target).height()+closeHeight},
      {duration: 400, easing: "swing"}
   );
   headNaviClose = !headNaviClose;
}

function naviClose(){
   j$(navigationAreaPath).animate(
      {height: "42px"},
      {duration: 400, easing: "swing", complete:function(){j$(contentsPath).css("display", "none");}}
   );
   headNaviClose = !headNaviClose;
}

function naviCloseAndOpen(idx){
   j$(navigationAreaPath).animate(
      {height: "42px"},
      {
         duration: 400,
         easing: "swing",
         complete:function(){
            j$(contentsPath).css("display", "none");
            naviOpen(idx);
         }
      }
   );
   headNaviClose = !headNaviClose;
}

//foot
function footNaviOpen(idx){
   var target = fcontentsPath+" div:eq("+idx+")";
   j$(target).css("display", "block");
   j$(fcontentsPath).animate(
      {height: j$(target).css("height"), "top":"-"+j$(target).height()+"px"},
      {duration: 400, easing: "swing"}
   );
   
   footContentsClose = !footContentsClose;
}

function footNaviClose(){
   
   j$(fcontentsPath).animate(
      {height: "0px", "top": "0"},
      {duration: 400, easing: "swing", complete:function(){j$(fcontentsPath+" div").css("display", "none");}}
   );
   footContentsClose = !footContentsClose;
}

function footNaviCloseAndOpen(idx){
   
   j$(fcontentsPath).animate(
      {height: "0px", "top": "0"},
      {
         duration: 400,
         easing: "swing",
         complete:function(){
            j$(fcontentsPath+" div").css("display", "none");
            footNaviOpen(idx);
         }
      }
   );
   footContentsClose = !footContentsClose;
}