var top=100;  //我是Top設定喔！
var left=130; //我是Left設定喔！

if(!imgPath)
	var imgPath = 'http://hi.so61.com/img/round/';	

var symbolImg   = imgPath + "symbol.gif";
var maxImg      = imgPath + "max.gif";
var restoreImg  = imgPath + "min.gif";
var closeImg    = imgPath + "close.gif";
var helpImg     = imgPath + "help.gif";
var titleImg    = imgPath + "title.gif";
var bottomImg   = imgPath + "bottom.gif";
var internImg   = imgPath + "intern.gif";
var gripImg     = imgPath + "grip.gif";
var forwardImg  = imgPath + "forward.gif";
var backImg     = imgPath + "back.gif";
var borderImg   = imgPath + "border.gif";
var firstPage =  "/lib/htm/blank.htm";
var wid=350;
var hei=220;

// obj
var winObj;
var contObj    ;
var layerObj   ;
var frameObj ;     
var maxBtnObj ;  
var borderImg1Obj ; 
var borderImg2Obj ; 
var borderObj ;	
var sizeDivObj ;  

var initWidth, initHeight;
var dragapproved ;
var dragresized ; 
var minrestore   ;
var ie5 ;  
var ns6 ;  
//沒用到底var title_height;

function init(w,h){
	var winText;
  winText = "<div id='xDiv' style='position:absolute;z-index:100;width: "+w+"px; height: "+ h+"px ; left:10px;top:10px;font-size:12px; display:none ' onselectstart='return false'>\r\n";//
  winText += "<div>\r\n";
  winText += "<table width='100%'  border='0' cellspacing='0' cellpadding='0'>\r\n";
  winText += "	<tr>\r\n";
  winText += "		<td width='19'><img src='" + symbolImg + "' width='19' height='21' border='0'  title='網頁重整' onclick='xopen_reload();'//></td>\r\n";
  winText += "		<td width='5' style='background: url(" + titleImg + "); padding:0px'></td><td style='background: url(" + titleImg + "); padding:0px' onmousedown='initialize_drag(event)' ondblclick='maximize()'><font color='#333333'><div id='title_msg_layer'><strong>title</strong></div></font>\r\n";
  winText += "		</td>\r\n";
  winText += "		<td style='background: url(" + titleImg + "); padding:0px' onmousedown='initialize_drag(event)' ondblclick='maximize()'></td>\r\n";
  winText += "	<td width='44' style='cursor:default; ' align='center'>";
  winText += "<img src='" + helpImg + "' width='12' height='21' border='0' onclick='xAbout()' title='說明' />";
  winText += "<img src='" + maxImg + "' id='max_button_name' onclick='maximize()' width='16' height='21' border='0' title='最大化' />";
  winText += "<img src='" + closeImg + "' onclick='closeit()' width='16' height='21' border='0' title='關閉' />";
  winText += "</td>\r\n";
  winText += "	</tr>\r\n";
  winText += "</table>\r\n";
  winText += "</div>\r\n";
  winText += "<div id='x_open_content' align=center style='width:100%;  margin: 0px;background-color: #ffffff;	MOZ-OPACITY:0.50;FILTER :  Alpha(opacity=100);'>\r\n";
  winText += "<table style='width:100%;  margin: 0px;' border='0' cellpadding='0' cellspacing='0'>\r\n";//height:100%;
  winText += "	<tr>\r\n";
  winText += "		<td width='1'><img src='" + borderImg + "' id='borderImg_name1' border='0' style='border:0px; width:1px; height:177px; margin: 0px;' /></td>\r\n";
  winText += "		<td width=100% weight=100%>\r\n";
  winText += "		<iframe id='xFrame' name='xFrame' src='" + firstPage + "' frameborder=0 noresize scrolling=no style='width:100%; height:100%;background-color: #ffffff;color: #333;margin: 0px; padding: 0px;border:0px '></iframe>\r\n";
  winText += "		</td>\r\n";
  winText += "		<td width='1'><img src='" + borderImg + "' id='borderImg_name2' border='0' style='border:0px; width:1px; height:177px; margin: 0px;' /></td>\r\n";
  winText += "	</tr>\r\n";
  winText += "</table>\r\n";
  winText += "</div>\r\n";
  winText += "<div align='center' style='width:100%;height:15px;background: url(" + bottomImg + ");' onselectstart='return false'>\r\n";
  winText += "<table width='100%'  border='0' cellspacing='0' cellpadding='0'>\r\n";
  winText += "	<tr>\r\n";
  winText += "		<td width='19'><img src='" + internImg + "' width='28' height='15' border='0' /></td>\r\n";
  winText += "			<td width='42'><img src='" + backImg + "' width='19' height='13' border='0' title='上一頁' onclick='xopen_back();'/><img src='" + forwardImg + "' width='19' height='13' border='0'  title='下一頁' onclick='xopen_forward();'/></td>\r\n";
  winText += "		<td><div id='size_info_layer'>&nbsp;</div></td>\r\n";
  winText += "		<td>&nbsp;</td>\r\n";
  winText += "		<td width='19'><img src='" + gripImg + "' width='19' height='15' border='0' style='cursor:nw-resize' title='改變大小' onmousedown='return initResize(event)' /></td>\r\n";
  winText += "	</tr>\r\n";
  winText += "</table>\r\n";
  winText += "</div>\r\n";
  winText += "</div>\r\n";
  winText += "<div id='xDiv_border' style='position:absolute;z-index:100;width:0px;height:0px;display:none'></div>\r\n";
  //window.document.write(winText);
  //document.body.insertAdjacentHTML("BeforeEnd",winText);
  insertHtml("BeforeEnd",document.body,winText);
  winObj        = document.getElementById("xDiv");
  contObj    = document.getElementById("x_open_content");
  layerObj   = document.getElementById("title_msg_layer");
  frameObj      = document.getElementById("xFrame");
  maxBtnObj   = document.getElementById("max_button_name");
  borderImg1Obj  = document.getElementById("borderImg_name1");
  borderImg2Obj  = document.getElementById("borderImg_name2");
  borderObj = document.getElementById("xDiv_border");	
  sizeDivObj   =  document.getElementById("size_info_layer");	

  dragapproved = false;
  dragresized  = false;
  minrestore   = 0;
  ie5   = document.getElementById && document.all ;
  ns6   = document.getElementById && !document.all;
  //title_height = 36;
}

function insertHtml(where, el, html){
	where = where.toLowerCase();
	if(el.insertAdjacentHTML){
	  switch(where){
  		case "beforebegin":
  		  el.insertAdjacentHTML('BeforeBegin', html);
  		  return el.previousSibling;
  		case "afterbegin":
  		  el.insertAdjacentHTML('AfterBegin', html);
  		  return el.firstChild;
  		case "beforeend":
  		  el.insertAdjacentHTML('BeforeEnd', html);
  		  return el.lastChild;
  		case "afterend":
  		  el.insertAdjacentHTML('AfterEnd', html);
  		  return el.nextSibling;
	  }
	  throw 'Illegal insertion point -> "' + where + '"';
	}
  var range = el.ownerDocument.createRange();
	var frag;
	switch(where){
	  case "beforebegin":
			range.setStartBefore(el);
			frag = range.createContextualFragment(html);
			el.parentNode.insertBefore(frag, el);
			return el.previousSibling;
	  case "afterbegin":
			if(el.firstChild){
			    range.setStartBefore(el.firstChild);
			    frag = range.createContextualFragment(html);
			    el.insertBefore(frag, el.firstChild);
			    return el.firstChild;
			}else{
			    el.innerHTML = html;
			    return el.firstChild;
			}
	  case "beforeend":
			if(el.lastChild){
		    range.setStartAfter(el.lastChild);
		    frag = range.createContextualFragment(html);
		    el.appendChild(frag);
		    return el.lastChild;
			}else{
		    el.innerHTML = html;
		    return el.lastChild;
			}
	  case "afterend":
			range.setStartAfter(el);
			frag = range.createContextualFragment(html);
			el.parentNode.insertBefore(frag, el.nextSibling);
			return el.nextSibling;
	}
	throw 'Illegal insertion point -> "' + where + '"';
}
function xHelp(url){
  x_open("遊戲小強說明頁", url, 420, 300);
}
function xOpen(title,url , w,h){
  x_open("遊戲小強說明頁", url, w, h);
}
function x_open(title, url, width, height){
  if(width<20||height<20){
    width=550;
    height=400;
  }
  if(!winObj){
    init(width,height);
  }
  if(!url){
    url="&nbsp;";
  }
  //return;
	if (!ie5 && !ns6){
		window.open(url, "errorPage", "width="+width+",height="+height+",scrollbars=1");
    //alert("ERROR");
	}else{
    //alert("HMM...");
		winObj.style.display  = 'block';
		//winObj.style.visible  = false;
    //alert("HMM...11");
		initWidth                 = width;
		initHeight                = height;
		change_size(initWidth, initHeight);
    //alert("HMM...2");
		winObj.style.left     = left + "px";
		winObj.style.top      = ns6 ? window.pageYOffset * 1 + top + "px" : iecompattest().scrollTop * 1 + top + "px";
    //alert("HMM...3");
		frameObj.src          = url;
		layerObj.innerHTML = '<font color=#333333>' + title + '</font>';
	}
  //change_size(wid,hei);
  //alert("PASS");
}

function iecompattest(){
	return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function xAbout(){
	alert("這個視窗的右上角可以關閉，\n也可以最大化及還原，\n另外，注意看一下左上方，\n這個視窗的內容，是可以重新載入的。");
}
function xopen_back(){
	xFrame.history.back();
}
function xopen_forward(){
	xFrame.history.go(1);
}
function xopen_reload(){
	xFrame.location.reload();
}
function closeit(){
	frameObj.src = firstPage;
  winObj.style.display = "none";
	return true;
}

function maximize(){
	if (minrestore == 0){
		minrestore = 1; //maximize window
		maxBtnObj.setAttribute("src", restoreImg);
		maxBtnObj.setAttribute("title", '往下還原');
		var w = ns6 ? window.innerWidth  - 40  : iecompattest().clientWidth  - 20;
		var h = ns6 ? window.innerHeight - 40 : iecompattest().clientHeight - 20;
    //alert(window.innerWidth+"=="+window.innerHeight);
		change_size(w, h);
	}
	else{
		minrestore=0; //restore window
		maxBtnObj.setAttribute("src", maxImg);
		maxBtnObj.setAttribute("title", '放到最大');
		change_size(initWidth, initHeight);
	}
	winObj.style.left = ns6 ? window.pageXOffset + 10 + "px" : iecompattest().scrollLeft + 10 + "px";
	winObj.style.top  = ns6 ? window.pageYOffset + 10 + "px" : iecompattest().scrollTop  + 10 + "px";
}

function change_size(w, h){ 
  if(w > 150 )
    winObj.style.width = w+"px";
  else
    winObj.style.width = "150px";
  //alert('COW8');
  if(h > 40 ){
    winObj.style.height = h+"px";
    borderImg1Obj.style.height = h+"px";
    borderImg2Obj.style.height = h+"px";
    frameObj.style.height = h+"px";
  }else{
    winObj.style.height = "40px";
    borderImg1Obj.style.height = "40px";
    borderImg2Obj.style.height = "40px";
    frameObj.style.height = "40px";
  }
  //alert(winObj.style.width+"=="+winObj.style.height);
  //我是視窗下方的size說明喔！  
  sizeDivObj.innerHTML = '<font style="font-size:11px;font-family:Courier New">size:' + moveUnit(winObj.style.width) + 'x' + moveUnit(winObj.style.height) + '</font>';
}
 
function moveUnit(elem){
	return(parseInt(elem.replace(/px/g,"")));			
}
//<<<drag move

function initialize_drag(e){
	var evt = ns6 ? e : event;
	offsetx = evt.clientX;
	offsety = evt.clientY;
	tempx   = parseInt(winObj.style.left);
	tempy   = parseInt(winObj.style.top);

	dragapproved = true;
	//xFrame.style.display = 'none';
	//frameObj.style.display = 'none';
	document.body.style.cursor    = 'move';
	document.onmousemove          = drag_drop;
	document.onmouseup       = drag_drop_stop;
	//winObj.onmouseup       = drag_drop_stop;
}

function drag_drop(e){
  if(dragapproved){
		var evt = ns6 ? e : event;
		winObj.style.left = tempx + evt.clientX - offsetx + "px";
		winObj.style.top  = tempy + evt.clientY - offsety + "px";
	}
	return false;
}
function drag_drop_stop(e){
	dragapproved = false;
	//contObj.style.display = '';
	frameObj.style.display = '';
	document.body.style.cursor    = 'default';
	document.onmousemove          = null;
}
 
//>>>drag move

//resize===<<<
function initResize(e){
	evt = ns6 ? e : event;
	borderObj.style.left    = winObj.style.left;
	borderObj.style.top     = winObj.style.top;
	borderObj.style.width   = winObj.style.width;
	borderObj.style.height  = winObj.style.height;

	click_x                            = evt.clientX;
	click_y                            = evt.clientY;
	evt_width                          = click_x - moveUnit(winObj.style.left);
	evt_height                         = click_y - moveUnit(winObj.style.top);
	dragresized                        = true;
	borderObj.style.display = '';
	borderObj.style.border  ='1px #808080 solid';
	
	document.body.style.cursor         = 'nw-resize';
	document.onmousemove               = drag_resize;
	document.onmouseup                 = drag_resize_stop;
	return false;
}
function drag_resize(e){
	if(dragresized){
		var evt = ns6 ? e : event;
		var w = evt_width + (evt.clientX - click_x);
		var h = evt_height + (evt.clientY - click_y);
		if(w > 0 )
			borderObj.style.width = w +"px";
		if(h > 0 )
			borderObj.style.height = h+"px";
	}
  //sizeDivObj.innerHTML =w+","+h;
	document.body.style.cursor = 'nw-resize';
	return false;
}
function drag_resize_stop(e){
	dragresized=false;
	change_size(moveUnit(borderObj.style.width), moveUnit(borderObj.style.height));
  //alert(moveUnit(borderObj.style.width)+"==="+moveUnit(borderObj.style.height));
	borderObj.style.border  = '0px';
	borderObj.style.display = 'none';
	document.body.style.cursor         = 'default';
	document.onmousemove               = null;
}