// 初期設定ここから
scFaceColor0   = "#E6E6E6"; // スクロールアロー、スクロールボックスの背景色（mouseup時）
scFaceColor1   = "#CCCCCC"; // スクロールアロー、スクロールボックスの背景色（mousedown時）
scTrackColor   = "#FFFFFF"; // スクロールバーのベース色
scLightColor0  = "#FFFFFF"; // スクロールアロー、スクロールボックスのハイライト色（mouseup時）
scShadowColor0 = "#FFFFFF"; // スクロールアロー、スクロールボックスのシャドウ色（mouseup時）
scLightColor1  = "#FFFFFF"; // スクロールアロー、スクロールボックスのハイライト色（mousedown時）
scShadowColor1 = "#FFFFFF"; // スクロールアロー、スクロールボックスのシャドウ色（mousedown時）
scArrowUpImg   = "../common_img/arow/arrowup.gif";   // スクロールアロー（上矢印）の画像（省略の場合は"none"）
scArrowDownImg = "../common_img/arow/arrowdown.gif"; // スクロールアロー（下矢印）の画像（省略の場合は"none"）
scSize         = 15; // スクロールバーの幅（px）
scPadding      = 5;  // 内容の余白（px）
scAmount1      = 15;  // 1フレーム毎のスクロール量（スクロールアロー、px）
scAmount2      = 30; // 1フレーム毎のスクロール量（スクロールバー、px）
scRate         = 50; // スクロールのフレームレート（1/1000秒単位）
scArrowMode    = 0;  // スクロールアローの動作モード（0:mousedown, 1:mouseover）
// 初期設定ここまで

scClearAll();
mac = (navigator.appVersion.indexOf("Mac")>-1) ? true : false;       // Mac判別用
safari = (navigator.appVersion.indexOf("Safari")>-1) ? true : false; // Safari判別用
ie = (document.all) ? true : false;                                  // IE判別用
if (document.getElementById) window.onload = scInit;

// 変数初期化
function scClearAll() {
	scBox = 0;         // スクロールボックスのmousedownフラグ
	scBar = 0;         // スクロールバーのmousedownフラグ
	scDir = 0;         // スクロール方向
	scTimer = null;    // タイマー
	scObj = null;      // スクロールするオブジェクト名
	scNum = null;      // スクロールするオブジェクト番号
	scArrowObj = null; // スクロールアローのオブジェクト名
	scBoxObj = null;   // スクロールボックスのオブジェクト名
}

// スクロールバーの全初期化
function scInit() {
	tag = (!safari) ? document.body.getElementsByTagName("*"):document.body.childNodes;
	c = new Array();
	n = 0;
	for (i=0; i<tag.length; i++) {
		// class名が"scrollbar"である要素にカスタムスクロールバーを挿入する
		if (tag[i].className) {
		if (tag[i].className.indexOf("scrollbar") > -1) {
			c[n] = tag[i];
			c[n].borW = (ie) ? c[n].currentStyle.borderWidth:c[n].offsetWidth;
			c[n].style.borderWidth = "0";
			c[n].W = c[n].offsetWidth;   // W: 領域の横幅
			c[n].H = c[n].offsetHeight;  // H: 領域の高さ
			if (!ie) c[n].borW = (c[n].borW-c[n].W)/2+"px";
			c[n].style.width = c[n].W+"px";
			c[n].style.height = c[n].H+"px";
			c[n].style.borderWidth = c[n].borW;
			c[n].style.padding = "0";
			c[n].style.position = "relative";
			c[n].style.overflow = "hidden";
			// ネスト構造にする
			c[n].innerHTML = "<div id=\"c_" + n + "\" style=\"position:relative; top:0px; left:0px; width:" + (c[n].W - scSize -(scPadding*2)) +"px; padding:" + scPadding + "px;\">"+ c[n].innerHTML +"<"+"/div>";
			if (document.getElementById("c_" + n).offsetHeight <= c[n].H) continue;
			document.getElementById("c_" + n).style.width = (c[n].W - scSize - (scPadding*2)) +"px";
			if (mac && ie) document.getElementById("c_" + n).style.position = "absolute";
			c[n].docH = document.getElementById("c_" + n).offsetHeight; // docH: 内容の高さ
			c[n].avlH = c[n].docH - c[n].H;                             // avlH: 内容のオーバーフロー領域の高さ
			c[n].barH = c[n].H - (scSize*2);                            // barH: barの高さ
			c[n].boxY = 0;                                              // boxY: スクロールボックスのY座標
			c[n].boxH = Math.round(c[n].barH*(c[n].H/c[n].docH));       // boxY: スクロールボックスの高さ
			// スクロールアロー（上矢印）を追加
			c[n].innerHTML += "<div id=\"ArrowUp_" + n + "\" onmousedown=\"mDown=1;scArrowMouseDown(event); return false\" onmouseover=\"scArrowMouseOver(event)\" onmouseout=\"scArrowMouseOut()\" style=\"position:absolute; overflow:hidden; background-repeat:no-repeat; background-position:top center; top:0px; left:" + (c[n].W-scSize) + "px; width:" + (scSize-2) + "px; height:" + (scSize-2) + "px; border:solid 1px; border-color:" +scLightColor0+" "+scShadowColor0+" "+scShadowColor0+" "+scLightColor0+"; background-color:" + scFaceColor0 + "; background-image:url(" + scArrowUpImg + ");\"> <"+"/div>\n";
			// スクロールアロー（下矢印）を追加
			c[n].innerHTML += "<div id=\"ArrowDown_" + n + "\" onmousedown=\"scArrowMouseDown(event); return false\" onmouseover=\"scArrowMouseOver(event)\" onmouseout=\"scArrowMouseOut()\" style=\"position:absolute; overflow:hidden; background-repeat:no-repeat; background-position:top center; top:" + (c[n].H-scSize) + "px; left:" + (c[n].W-scSize) + "px; width:" + (scSize-2) + "px; height:" + (scSize-2) + "px; border:solid 1px; border-color:" +scLightColor0+" "+scShadowColor0+" "+scShadowColor0+" "+scLightColor0+"; background-color:" + scFaceColor0 + "; background-image:url(" + scArrowDownImg + ")\"> <"+"/div>\n";
			// スクロールバーとスクロールボックスを追加
			c[n].innerHTML += "<div id=\"bar_"+n+"\" onmousedown=\"scBarMouseDown(event); return false\" style=\"position:absolute; overflow:hidden; top:" + scSize + "px; left:" + (c[n].W - scSize) + "px; width:" + scSize + "px; height:" + c[n].barH + "px; background-color:" + scTrackColor + "\"><div id=\"box_"+n+"\" onmousedown=\"scBoxMouseDown(event); return false\" style=\"position:absolute; overflow:hidden; width:" + (scSize-2) + "px; height:" + (c[n].boxH-2) + "px; border:solid 1px; border-color:" + scLightColor0+" "+scShadowColor0+" "+scShadowColor0+" "+scLightColor0 + "; background-color:" + scFaceColor0 +";\"> <"+"/div><"+"/div>\n";
			c[n].onselectstart = new Function("return false");
			n++;
		}
		}
	}
	document.body.onmousemove = scDocMouseMove;
	document.onmouseup = scDocMouseUp;
}

// イベントが発生したオブジェクトを得る
function getObj(e) {
	eObj = (ie) ? event.srcElement:e.target;
	while (!eObj.tagName) eObj = eObj.parentNode;
	scNum = eObj.id.split("_")[1];
	scObj = document.getElementById("c_"+scNum);
	scBoxObj = document.getElementById("box_"+scNum);
}

// スクロールアローのスタイル変更
function changeArrowStyle(v) {
	with (scArrowObj.style) {
		backgroundColor = eval("scFaceColor"+v);
		borderColor = eval("scLightColor"+v) + " " + eval("scShadowColor"+v) + " " + eval("scShadowColor"+v) + " " +eval("scLightColor"+v);
	}
}

// スクロールアローのmousedown時処理
function scArrowMouseDown(e) {
	if ( !scArrowObj && !scTimer ) {
		getObj(e);
		scArrowObj = eObj;
		// クリックされたスクロールアローのid名からスクロール方向を決定
		scDir = ((eObj.id.split("_")[0] == "ArrowUp")?-1:1)*scAmount1;
		// スクロールアローのスタイル変更
		changeArrowStyle(1);
		// スクロールのループ処理開始
		scTimer = setInterval("scScroll("+ scDir +")",scRate);
	}
}

// スクロールアローのmouseover時処理
function scArrowMouseOver(e) {
	getObj(e);
	if (eObj == scArrowObj) {
		//スクロールアローのスタイル変更
		changeArrowStyle(1);
		//スクロールのループ処理開始
		scTimer = setInterval("scScroll("+ (scAmount1*scDir) +")",scRate);
	}
	if (scArrowMode) scArrowMouseDown(e);
}

// スクロールアローのmouseout時処理
function scArrowMouseOut() {
	if (scTimer) {
		//スクロールアローのスタイル変更
		changeArrowStyle(0);
		//スクロールのループ処理停止
		clearInterval(scTimer);
		if (scArrowMode) scClearAll();
	}
}

// スクロールボックスのmousedown時処理
function scBoxMouseDown(e){
	getObj(e);
	scBox = 1;
	// ボックスをつかんだときの座標を保存
	saveMouseY = (ie) ? window.event.clientY : e.pageY;
	saveBoxY = scBoxObj.offsetTop;
	// イベントの伝播をストップ
	if (ie) event.cancelBubble = true;
	else e.stopPropagation();
}

// スクロールバーのmousedown時処理
function scBarMouseDown(e) {
	getObj(e);
	scBar = 1;
	// バーをクリックしたときの座標を保存
	saveMouseY = (ie) ? event.offsetY : e.layerY;
	saveBoxY = scBoxObj.offsetTop;
	// クリックしたときの座標によってスクロール方向を決定
	if (saveMouseY < saveBoxY) scDir = -scAmount2;
	else if (saveMouseY > saveBoxY+c[scNum].boxH ) scDir = scAmount2;
	else scDir = 0;
	// スクロールのループ処理開始
	scTimer = setInterval("scScroll("+ scDir +")",scRate);
}

// ドキュメントのmousemove時処理
function scDocMouseMove(e) {
	if (scBox) {
		nowMouseY = (ie) ? window.event.clientY : e.pageY;
		c[scNum].boxY =  Math.max(0,Math.min(c[scNum].barH - c[scNum].boxH,saveBoxY +(nowMouseY-saveMouseY)));
		// スクロールするオブジェクトの座標を更新
		scObj.style.top = (-c[scNum].avlH) * (c[scNum].boxY/(c[scNum].barH - c[scNum].boxH))+"px";
		// スクロールボックスの座標を更新
		scBoxObj.style.top = c[scNum].boxY +"px";
	}
}

// ドキュメントのmouseup時処理
function scDocMouseUp() {
	if (!scArrowMode || scBox  || scBar) {
		// スクロールアローのスタイル変更
		if (scArrowObj) changeArrowStyle(0);
		// スクロールのループ処理停止
		if (scTimer) clearInterval(scTimer);
		// 変数初期化
		scClearAll();
	}
}

// スクロールのループ処理
function scScroll(d) {
	if ((scBar && d<0 && scBoxObj.offsetTop<= saveMouseY) || (scBar && d > 0 && scBoxObj.offsetTop + c[scNum].boxH >= saveMouseY)) return;
	if (scArrowObj || scBar) {
		// スクロールするオブジェクトの座標を更新
		scObj.style.top = Math.min(0, Math.max(c[scNum].H-scObj.offsetHeight, parseInt(scObj.style.top)-d))+"px";
		// スクロールボックスの座標を更新
		scBoxObj.style.top = Math.round((c[scNum].barH - c[scNum].boxH) * (Math.abs(parseInt(scObj.style.top)) / c[scNum].avlH)) + "px";
	}
}