var imagepath = "/image/9th/glossary/";
var apiaddr = "http://www3.hamajima.co.jp/cgi-bin/api/b/9th/glossary/";
var apiimgaddr = "/image/9th/glossary/img/";
var searchaddr = "/9th/glossary/";

// クラス定義

// Popウィンドウの基底
var popWin = Class.create( {
	initialize : function() {
		this.popwinId = 0;
		this.width = 250;
	},
	setPopWinId : function(popwinid) {
		this.popwinId = popwinid;
	},
	getDomId : function() {
		return "pop_" + this.popwinId;
	},
	getContDomId : function() {
		return "pop_" + this.popwinId + "_cont";
	},
	createWindow : function(x, y) {
		var domid = this.getDomId();
	
		// ウィンドウの位置
		var winx = x;
		var xlim = document.viewport.getScrollOffsets().left + (document.viewport.getWidth() || document.body.clientWidth);
		if (winx + this.width > xlim && (document.viewport.getWidth() || document.body.clientWidth) > this.width) {
			winx = xlim - this.width;
		}

		// メインDIVの作成
		var popstyle = { 
			width: this.width + "px", 
			zIndex: popZIndex++, 
			top: y + "px",
			left: winx + "px",
			position: "absolute"
		};
		var wobj = createDivObj(domid, "pop", popstyle);

		// フレームの追加
		wobj.appendChild(createDivObj(null, "popf_left"));
		wobj.appendChild(createDivObj(null, "popf_right"));
		wobj.appendChild(createDivObj(null, "popf_top"));
		wobj.appendChild(createDivObj(null, "popf_bottom"));
		wobj.appendChild(createDivObj(null, "popf_tr"));
		wobj.appendChild(createDivObj(null, "popf_tl"));
		wobj.appendChild(createDivObj(null, "popf_br"));
		wobj.appendChild(createDivObj(null, "popf_bl"));

		// 閉じるボタンの追加
		var btnobj = createPopCloseImg();
		Event.observe(btnobj, 'click', 
			function () { 
				document.body.removeChild($(domid));
			}
		);
		wobj.appendChild(btnobj);

		var cobj = createDivObj(this.getContDomId(), "pop_content");
		wobj.appendChild(cobj);
	
		return wobj;
	},
	updateWindow : function(data) {
		var obj = $(this.getDomId());
		if (!obj) { return; }

		var contobj = $(this.getContDomId());
		removeChildren(contobj);

		var midasiobj = createDivObj(null, "popmidasi");
		midasiobj.appendChild(document.createTextNode(data.yougo));
		var imgobj = createPopSearchImg();
		imgobj.className = "popsearchbutton";
		var str = data.yougo;
		Event.observe(imgobj, 'click',
			function (event) { 
				location.href = searchaddr + "?str=" + encodeURIComponent(str);
				Event.stop(event);
			}
		);
		midasiobj.appendChild(imgobj);
		contobj.appendChild(midasiobj);
		
		var kaiobj = createDivObj(null, "popkaisetu");
		createKaiObj(data, kaiobj);
		contobj.appendChild(kaiobj);

		if (data.image != "") {
			var zuobj = createDivObj(null, "yougoimg");
			var imgobj = new Image();
			//var imgobj = document.createElement("img");

			var o = this; var f = this.resetWindow;
			Event.observe(imgobj, 'load', 
				function (obj, event) {
					if (imgobj.width > 150) {
						imgobj.height = imgobj.height * 150 / imgobj.width;
						imgobj.width = 150;
					}
					f.apply(o);
				}
			);

			var src = apiimgaddr + data.image + ".png";
			Event.observe(imgobj, 'click', 
				function (event) {
					var popobj = popup.createImagePopWin(src, Event.pointerX(event), Event.pointerY(event));
					Event.stop(event);
				}
			);
			imgobj.src = src;
			zuobj.appendChild(imgobj);
			contobj.appendChild(zuobj);
			if (imgobj.width > 150) {
				imgobj.height = imgobj.height * 150 / imgobj.width;
				imgobj.width = 150;
			}
		}
		this.resetWindow();
	},
	resetWindow : function() {
		var obj = $(this.getDomId());
		if (!obj) { return; }

		var h = obj.offsetHeight;
		var w = obj.offsetWidth;

		var cobj = obj.firstChild;
		while (cobj) {
			if (cobj.className == "popf_left") {
				cobj.style.height = (h - 25) + "px";
			} else if (cobj.className == "popf_right") {
				cobj.style.height = (h - 31) + "px";
			} else if (cobj.className == "popf_top") {
				cobj.style.width = (w - 26) + "px";
			} else if (cobj.className == "popf_bottom") {
				var nobj = cobj.nextSibling;
				obj.removeChild(cobj);
				cobj = nobj;
				continue;
			} else if (cobj.className == "popf_tr") {
			} else if (cobj.className == "popf_tl") {
			} else if (cobj.className == "popf_br") {
			} else if (cobj.className == "popf_bl") {
			}
			cobj = cobj.nextSibling;
		}
		var bobj = createDivObj(null, "popf_bottom");
		bobj.style.width = (w - 33) + "px";
		obj.appendChild(bobj);
	}
} );

// 用語ウィンドウ
var yougoPopWin = Class.create( popWin, {
	initialize : function ($super) {
		$super();
		this.yougoId = 0;
	},
	setYougoId : function (id) {
		this.yougoId = id;
	},
	createWindow : function($super, x, y) {
		var obj = $super(x, y);

		var cobj;
		for (var sobj = obj.firstChild; sobj; sobj = sobj.nextSibling) {
			if (sobj.className == "pop_content") {
				cobj = sobj;
			}
		}
		
		// 内容DIVの作成
		cobj.appendChild(createLoadImg());
		cobj.appendChild(document.createTextNode("データを取得しています..."));

		// クリックしたときの処理
		Event.observe(obj, 'click', function() { obj.style.zIndex = popZIndex++; });
		new Draggable(obj, { });
	
		return obj;
	}
} );

// 画像ウィンドウ
var imagePopWin = Class.create( popWin, {
	initialize : function ($super) {
		$super();
		this.imageSrc = "";
	},
	setImageSrc : function (src) {
		this.imageSrc = src;
	},
	createWindow : function($super, x, y) {
		var obj = $super(x, y);

		var cobj;
		for (var sobj = obj.firstChild; sobj; sobj = sobj.nextSibling) {
			if (sobj.className == "pop_content") {
				cobj = sobj;
			}
		}

		var imgobj = new Image();
		var o = this;
		var f = this.resetWindow;
		Event.observe(imgobj, 'load', 
			function (event) {
				var ot = document.viewport.getScrollOffsets().top;
				var ol = document.viewport.getScrollOffsets().left;
				var vw = (document.viewport.getWidth() || document.body.clientWidth);
				var vh = (document.viewport.getHeight() || document.body.clientHeight);
				if (vw > imgobj.width) {
					obj.style.left = (ol + (vw - imgobj.width) / 2) + "px";
				} else {
					obj.style.left = (ol + 10) + "px";
				}
				if (vh > imgobj.height) {
					obj.style.top = (ot + (vh - imgobj.height) / 2) + "px";
				} else {
					obj.style.top = (ot + 10) + "px";
				}
				obj.style.width = (imgobj.width + 26) + "px";
				f.apply(o);
			}
		);
		imgobj.src = this.imageSrc;
		cobj.appendChild(imgobj);

		// クリックしたときの処理
		Event.observe(obj, 'click', function() { obj.style.zIndex = popZIndex++; });
		new Draggable(obj, { });

		return obj;
	}
} );

var popZIndex = 1;

var popStat = Class.create( {
	initialize : function () {
		this.popWinId = 0;
		this.popObj = {}; // 用語id->[popwin]
	},
	createYougoPopWin : function (yougoid, x, y) {
		(this.popWinId)++;
		var popwin = new yougoPopWin();
		popwin.setYougoId(yougoid);
		popwin.setPopWinId(this.popWinId);

		var domobj = popwin.createWindow(x, y);

		if (this.popObj[yougoid]) {
			this.popObj[yougoid].push(popwin);
		} else {
			this.popObj[yougoid] = [popwin];
		}
		document.body.appendChild(domobj);

		popwin.resetWindow();
		this.showYougoPopWin(yougoid);
		return popwin;
	},
	showYougoPopWin : function (yougoid) {
		if (yougodat.dataExists(yougoid)) {
			this.updateYougoPopWin(yougoid);
		} else {
			yougodat.queryData(yougoid);
		}
	},
	updateYougoPopWin : function (yougoid) {
		var poparr = this.popObj[yougoid];
		if (!poparr) { return; }

		for (var i = 0; i < poparr.length; ++i) {
			poparr[i].updateWindow(yougodat.getData(yougoid));
		}
	},
	createImagePopWin : function (src, x, y) {
		(this.popWinId)++;
		var popwin = new imagePopWin();
		popwin.setImageSrc(src);
		popwin.setPopWinId(this.popWinId);
		var domobj = popwin.createWindow(x, y);
		document.body.appendChild(domobj);
		popwin.resetWindow();
	},
	// ポップアップの削除
	removePopWin : function () {
		this.popObj = {};
		var obj = document.body.firstChild;
		while (obj) {
			if (obj.id && obj.id.substr(0, 4) == "pop_") {
				var pobj = obj;
				obj = obj.nextSibling;
				document.body.removeChild(pobj);
			} else {
				obj = obj.nextSibling;
			}
		}
	}	
} );

var yougoData = Class.create( {
	initialize : function () {
		this.yougoData = {};
	},
	dataExists : function (yougoid) {
		return this.yougoData[yougoid] ? true : false;
	},
	queryData : function (yougoid) {
		// データ取得
		var request = apiaddr + 'getdata.pl?callback=popdata&id=' + encodeURIComponent(yougoid);
		sobj = new JSONscriptRequest(request);
		sobj.buildScriptTag();
		sobj.addScriptTag();
	},
	setData : function (yougoid, resobj) {
		this.yougoData[yougoid] = resobj;
	},
	getData : function (yougoid) {
		return this.yougoData[yougoid];
	}
} );

// popupデータ受信コールバック
function popdata(json) {
	var resobj = json.result;
	if (json.status != "success") {
		// エラー
		alert("ERROR:データの取得に失敗しました");
		return;
	}
	var id = resobj.id;
	yougodat.setData(id, resobj);
	popup.updateYougoPopWin(id);
	sobj.removeScriptTag();
}

var popup = new popStat();
var yougodat = new yougoData();

Event.observe(window, 'load', pop_init);

function pop_init() {
	var rootobj = document.body;
	createPopLink(rootobj);
}

function createPopLink(obj) {
	if (obj.id) {
		var res = obj.id.match(/^popup_([a-z]+)_(\d+|a)(_\d+)?$/);
		if (res) {
			var id = res[2] == "a" ? "a:" + obj.firstChild.nodeValue : parseInt(res[2]);
			function pop_onclick(event) { 
				var popobj = popup.createYougoPopWin(id, Event.pointerX(event), Event.pointerY(event));
				Event.stop(event);
				return false;
			};
			Event.observe(obj, 'click', pop_onclick);
			if (!obj.className) {
				obj.className = "poplink-default";
				if (Prototype.Browser.IE) {
					obj.style.padding = "0";
					obj.style.backgroundImage = "none";
					obj.style.borderBottom = "2px dotted #4AF300";
				}
			}
		}
	}
	if (obj.nodeType == 1 /* Node.ELEMENT_NODE */) {
		for (var n = obj.firstChild; n != null; n = n.nextSibling) {
			createPopLink(n);
		}
	}
}

function removeChildren(obj) {
	if (obj == null) { return; }
	while (obj.firstChild != null) {
		obj.removeChild(obj.firstChild);
	}
}

// ロード画像生成
function createLoadImg() {
	var loadimg = document.createElement("img");
	loadimg.setAttribute('src', imagepath + 'loading.gif');
	return loadimg;
}

// 閉じるボタン画像生成
function createPopCloseImg() {
	var popcloseimg = document.createElement("img");
	popcloseimg.className = "popclosebutton";
	popcloseimg.src = imagepath + 'clo.png';
	popcloseimg.alt = '閉じる';
	Event.observe(popcloseimg, 'mouseover', function () { this.src = imagepath + 'clo_sel.png'; });
	Event.observe(popcloseimg, 'mouseout', function () { this.src = imagepath + 'clo.png'; });
	return popcloseimg;
}

// 検索ボタン画像生成
function createPopSearchImg() {
	var popsearchimg = document.createElement("img");
	popsearchimg.src = imagepath + 'ser.png';
	popsearchimg.alt = '検索する';
	Event.observe(popsearchimg, 'mouseover', function () { this.src = imagepath + 'ser_sel.png'; });
	Event.observe(popsearchimg, 'mouseout', function () { this.src = imagepath + 'ser.png'; });
	return popsearchimg;
}

// DIV要素を作成
function createDivObj(id, className, style) {
	var obj = document.createElement("div");
	if (id) { obj.id = id; }
	for (name in style) {
		obj.style[name] = style[name];
	}
	if (className) { obj.className = className; }
	return obj;
}

// 解説の生成
function createKaiObj(resobj, kaiobj) {
	kaiobj.innerHTML = resobj.kaisetu;
	for (var aobj = kaiobj.firstChild; aobj != null; aobj = aobj.nextSibling) {
		if (aobj.id && parseInt(aobj.id) > 0) {
//			aobj.href="#";
			(function () {
				var id = parseInt(aobj.id);
				function pop_onclick(event) { 
					var popobj = popup.createYougoPopWin(id, Event.pointerX(event), Event.pointerY(event));
					Event.stop(event);
					return false;
				};
				Event.observe(aobj, 'click', pop_onclick);
			})();
		}
	}
}