﻿/* ------------------------------------------------------------
   記事中の文章の開閉
------------------------------------------------------------ */
var boxObj = {

	// 隠し記事の横幅（普通なら、(本文width)-20以下）
	cWidth : 450,

	// 開閉状態
	isOpen : [], on : [],

	// エレメント
	bList : [], cList : [],

	attachEvent : function(){

		bList = $c("BoxButton"); cList = $c("BoxContent");

		// 外見
		for(var i=0, b, c; b = bList[i], c = cList[i]; i++){

			var bs = b.style, cs = c.style;

			bs.border = "1px solid #888"; bs.padding = "4px";
			bs.cursor = "pointer";
			addEvent(b, "selectstart", function(){event.returnValue=false;});
			addEvent(b, "mousedown", function(){event.returnValue=false;});
			b.unselectable = "on";
			bs.MozUserSelect = "none";

			var changeBGColorFunc = function(elm,col){return function(){elm.style.backgroundColor=col;};};
			addEvent(b, "mouseover", changeBGColorFunc(b, "#ddd"));
			addEvent(b, "mouseout", changeBGColorFunc(b, "transparent"));
			addEvent(b, "click", bo.openAndCloseFunc(i));

			var ic = c.appendChild(c.cloneNode(true)), ics = ic.style;
			ic.className = "";
			while(c.childNodes.length > 1) c.removeChild(c.firstChild);

			cs.margin = "10px 10px 0 10px"; cs.width = bo.cWidth + "px"; cs.overflow = "hidden"; cs.height = "0px";
			ics.border = "1px dashed #a88"; ics.padding = "5px"; ics.display = "none";

		}

	},

	// 開閉する関数
	openAndCloseFunc : function(i){

		return function(){

			// 実行中か
			if(bo.on[i]) return; bo.on[i] = true;

			// 要素への参照
			var b = bList[i], c = cList[i], ic = c.firstChild, bs = b.style, cs = c.style, ics = ic.style;

			// 高さの変化の関数
			var changeHeightFunc = function(h){
				return function(){
					cs.height = h + "px";
				};
			};

			// 開く
			if(!bo.isOpen[i]){

				// 高さの取得
				ics.display = "block"; cs.height = "auto"; var h = c.clientHeight;
				cs.height = "0px";

				// 高さの変化
				for(var j=1;j<=20;j++){
					setTimeout(changeHeightFunc(h/20*j), j*50);
				}
				setTimeout(function(){bo.isOpen[i]=true;bo.on[i]=false;cs.height="auto";}, j*50);
			}

			// 閉じる
			else {
				// 高さの取得
				var h = c.clientHeight;

				// 高さの変化
				for(var j=1;j<=20;j++){
					setTimeout(changeHeightFunc(h/20*(20-j)), j*50);
				}
				setTimeout(function(){bo.isOpen[i]=false;bo.on[i]=false;ics.display="none";}, j*50);
			}

		};

	}

};
var bo = boxObj;
