// 定数定義
var TOOL_BAR = 
'<div id="Toolbar"><input type="image" src="skin/image/btn_close.gif" onclick="breakToolbar()" alt="[X]" />' +
'<input type="image" src="skin/image/btn_show.gif" onclick="showToolbar()" alt="[□]" />' +
'<input type="image" src="skin/image/btn_hidden.gif" onclick="hiddenToolbar()" alt="[＿]" /><br /></div>';

// 透過色関連
var _opacity = 100;
var _opacityOnTimer = null;
var _opacityOffTimer = null;


//非同期で指定ページを取得
function getPage(copy) {
	var uri = DOMAIN + "popn/wiki/?cmd=getpage&pagename=" + encodeURIComponent(copy.title);
	//アイコン変更
	copy.setAttribute("src", "skin/image/a_d_show_icon.gif");
	var func = function(res) {
		copy.setAttribute("src", "skin/image/show_icon.gif");
		showPage(res);
	}
	httpRequest(uri, "", func, "text", getPageLodingBegin, getPageLodingEnd);
}
//下部にコンテンツを表示
function showPage(pageHTML) {
	var showPageObj = document.getElementById("ShowPage");
	var bodyObj = document.getElementById("body");
	if(showPageObj == undefined) {
		showPageObj = document.createElement("div");
		showPageObj.id = "ShowPage";
		document.body.insertBefore(showPageObj, bodyObj);
	}
	
	// コンテンツの作成
	var contents = [];
	contents[contents.length] = TOOL_BAR;
	contents[contents.length] = '<div id="ShowPageContents" style="display:block; overflow: auto;">';
	contents[contents.length] = pageHTML;
	contents[contents.length] = "</div>";	
	showPageObj.innerHTML = contents.join("");
	
	//ドラッグ可能にする
	new DragDiv("ShowPage", "Toolbar", getWindowYOffset() + 30, 0);
	
	// コンテンツの幅と高さを指定
	var showPageWidth = (bodyObj.offsetWidth != undefined)? bodyObj.offsetWidth : bodyObj.pixelWidth;
	showPageObj.style.width = showPageWidth -30 + "px";
	document.getElementById("ShowPageContents").style.height = getWindowHeight() * 0.8 + "px"; // ブラウザの高さの8割くらいで良いんでない？
}

//現在のマウスの位置を取得
function getMouseXY(e) {
	if (e != undefined) {
		MouseXY = [e.clientX, e.clientY];
	} else {
		MouseXY = [event.clientX, event.clientY];
	}
}
document.onmousemove = getMouseXY;
var MouseXY;

function changeDisabledByName(target_name, disabled) {
	var disabledObj = document.getElementsByName(target_name);
	var len = disabledObj.length;
	
	//disabledにする
	if (disabled) {
		for (var i = 0; i < len; i++) disabledObj[i].disabled = true;
	} else {
		for (var i = 0; i < len; i++) disabledObj[i].disabled = false;
	}
}

//ローディング用
//innerHTMLで追加すると何故か制御が戻らないバグ→appendChildで回避
function getPageLodingBegin() {
	if(document.getElementById("LoadingDiv") == null) {
		var divOffsetWidth = 180;
		var p_top = getWindowYOffset();
		var p_left = (document.body.clientWidth != undefined)? document.body.clientWidth - divOffsetWidth : document.body.innerWidth - divOffsetWidth;
		var div = document.createElement("div");
		div.id = "LoadingDiv";
		div.style.position = "absolute";
		div.style.top = p_top + "px";
		div.style.left = p_left + "px";
		div.innerHTML = '<img src="skin/image/a_loading_circle.gif" /><strong>読み込み中...</strong>';
		document.body.appendChild(div);
	}
	changeDisabledByName("get_page", true);
}
function getPageLodingEnd() {
	if(document.getElementById("LoadingDiv") != null) {
		document.body.removeChild(document.getElementById("LoadingDiv"));
	}
	changeDisabledByName("get_page", false);
}

//toolbar用関数
function breakToolbar() {
	var showPageObj = document.getElementById("ShowPage");
	if(showPageObj != undefined) {
		document.body.removeChild(showPageObj);
	}
}
function hiddenToolbar() {
	var contentsObj = document.getElementById("ShowPageContents");
	if(contentsObj.style.display == 'block') {
		contentsObj.style.display = 'none';
	}
}
function showToolbar() {
	var contentsObj = document.getElementById("ShowPageContents");
	if(contentsObj.style.display == 'none') {
		contentsObj.style.display = 'block';
	}
}

// 透過色変更関数
function changeOpacityOnOff(onOffFlag)
{
	// ※FireFoxは透過＋overflorの相性が最悪なので処理中はhiddenにしておく
	// 透過オフ処理
	if (onOffFlag) {
		document.getElementById("ShowPageContents").style.overflow = "auto";
		_opacityOffTimer = setInterval("changeOpacity(" + onOffFlag + ")", 10);
	// 透過オン処理
	} else {
		document.getElementById("ShowPageContents").style.overflow = "hidden";
		_opacityOnTimer = setInterval("changeOpacity(" + onOffFlag + ")", 10);
	}
}
function changeOpacity(flag)
{
	var showPageObj = document.getElementById("ShowPage");
	if (showPageObj != undefined) {
		if (flag) {
			// 透過オン処理がまだ続いている場合は解除
			if (_opacityOnTimer != null)
			{
				clearInterval(_opacityOnTimer);
				_opacityOnTimer = null;		
			}
			
			if (_opacity < 100) {
				_opacity += 20;
			} else {
				clearInterval(_opacityOffTimer);
				_opacityOffTimer = null;
				return;
			}
		} else {
			// 透過オフ処理がまだ続いている場合は、オフ処理を完了させる
			if (_opacityOffTimer != null)
			{
				return;
			}
			
			if (40 < _opacity) {
				_opacity -= 20;
			} else {
				clearInterval(_opacityOnTimer);
				_opacityOnTimer = null;
				return;
			}
		}
		showPageObj.style.filter = "alpha(opacity=" + _opacity + ")";
		showPageObj.style.mozOpacity = _opacity / 100;
		showPageObj.style.opacity = _opacity / 100;
	}
}

function DragDiv(baseId, dragId, top, left) {
	this.baseId = baseId;
	this.dragId = dragId;
	this.board_left_dif = 0;
	this.board_top_dif = 0;
	this.dragTarget = null;
	this.top = (top == undefined)?  "0px" : top + "px";	
	this.left = (left == undefined)? "0px" : left + "px";
	this.rootObj = window.document;
	document.getElementById(baseId).style.top = this.top;
	document.getElementById(baseId).style.left = this.left;
	//強制的にabsolute
	document.getElementById(baseId).style.position = "absolute";
	//イベントの登録
	var copy = this;
	this.callDragStart = function(e) { dragWindowStart(e, copy); }
	this.callDragEnd = function(e) { dragWindowEnd(e, copy); }
	this.callMove = function(e) { moveWindow(e, copy); }
	addListener(document.getElementById(dragId), "mousedown", this.callDragStart, false);
	//IE Only 選択を解除
	this.callReturn = function() { return false; }
	
	//ドラッグ開始処理
	function dragWindowStart(e, copy) {
		if(copy.dragTarget != null) return false;   //ドラッグ中のものがある時は起動させない
		var dragObj = document.getElementById(copy.baseId);	//大本のドラッグするターゲット
		copy.dragTarget = document.getElementById(baseId);
		//ドラッグ開始の初期処理
		document.body.style.cursor = "move";
		
		copy.board_left_dif = e.clientX - parseInt(dragObj.style.left);
		copy.board_top_dif = e.clientY - parseInt(dragObj.style.top);
		
		//イベントリスナーをセット
		addListener(copy.rootObj, "mouseup", copy.callDragEnd, false);
		addListener(copy.rootObj, "mousemove", copy.callMove, false);
		addListener(copy.rootObj, "selectstart", copy.callReturn, false);
		
		// 透過処理
		if (_opacityOnTimer == null) {
			changeOpacityOnOff(false);
		}
	}
	
	//ドラッグ終了処理
	function dragWindowEnd(e, copy) {
		//イベントリスナーをセット
		removeListener(copy.rootObj, "mouseup", copy.callDragEnd, false);
		removeListener(copy.rootObj, "mousemove", copy.callMove, false);
		removeListener(copy.rootObj, "selectstart", copy.callReturn, false);
		//ドラッグ終了
		document.body.style.cursor = "default";
		
		copy.left = left;
		copy.top = top;
		copy.dragTarget = null;
		
		// 透過処理
		if (_opacityOffTimer == null) {
			changeOpacityOnOff(true);
		}
	}
	
	function moveWindow(e, copy) {
		if(copy.dragTarget == null) return false;
		copy.dragTarget.style.left = (e.clientX - copy.board_left_dif) + "px";
		copy.dragTarget.style.top = (e.clientY - copy.board_top_dif) + "px";
		//IE以外のブラウザで選択状態を解除
		if(document.all == undefined) window.getSelection().removeAllRanges();
	}
	
	//クロスブラウザ用
	function addListener(elem, eventType, func, cap) {
		if(elem.addEventListener) {//IE以外のブラウザ
			elem.addEventListener(eventType, func, cap);
		}else if(elem.attachEvent) {//IE用
			elem.attachEvent("on" + eventType, func);
		}else {
			alert("ブラウザがサポートされてません。ご利用する場合は最新のブラウザにバージョンアップしてください。");
			return false;
		}
	}
	function removeListener(elem, eventType, func, res, cap) {
		if(elem.removeEventListener) {
			elem.removeEventListener(eventType, func, cap);
		} else if(elem.detachEvent) {
			elem.detachEvent("on" + eventType, func);
		}
	}
}
