// main.js

function def_title_style_body () 
{
    with (document) {
	writeln(' <title>' + _titleStr + '</title>');
	writeln(' <meta http-equiv="Content-Type" content="text/html; charset=big5">');	
	writeln(' <link rel=stylesheet type=text/css href=/main3.css>');
	writeln(' </style> ');
	writeln(' </head> ');
	writeln(' <body id=body link=white aLink=white vLink=white">');
    }
}
	 
function write_table_begin () {
    with (document) {	
	writeln (' <table id=xtable1 height=100% width=100% cellpadding=0 cellspacing=0 bolder=0 align=center> ');
    	writeln ('   <tr id=xrow valign=center align=center> ');
    	writeln ('     <td id=xtd1><table id=xtable cellpadding=0 cellspacing=0 bolder=0 align=center> ');
    }
}

function write_table_end () {
    with (document) 
    	writeln(' </table></td></tr></table> ');
//    xtable1.style.background = 'red';
//    xrow.style.background = 'navy';
//    xtd1.style.background = 'pink';
//    xtable.style.background = 'grey';   
}

function write_title (_title) {
    if (typeof(_title) == "undefined") _title = _titleStr;   
    if (typeof(etitle) != "undefined") _title = etitle;
    if (typeof(_title) != "undefined") if (_title != "")
    	_write_str (_title, "xheader", "header");	
}

function write_sub (_sub) {
    if (typeof(sub) != "undefined") _sub = sub;
    if (typeof(_subtitleStr) != "undefined") _sub = _subtitleStr;
    if (typeof(esub) != "undefined") _sub = esub;
    if (typeof(_sub) != "undefined") if (_sub != "")
    	_write_str (_sub, "xsub", "sub1"); 
}

function write_camera (_camera) {
    if (typeof(_cameraStr) != "undefined") _camera = _cameraStr;
    if (typeof(_camera) != "undefined") if (_camera != "")
	 _write_str (_camera, "xcamera", "sub2"); 
}

function _write_str (_str, _id, _class) {
    with (document) {  
	writeln('  <tr><td>');
  	writeln('    <table cellspacing=0 cellpadding=0 align=center> ');
  	writeln('      <tr valign=bottom align=center> ');
  	writeln('        <td align=center><div id=' + _id + ' class=' + _class + '>' + _str + '</div></td>');
  	writeln('      </tr>');
  	writeln('    </table>');
  	writeln('  </td></tr>');
    }	
}

function write_all_icons1 () {
    if (typeof(icon) == "undefined") return;
    var icon_num = icon.length;
    row = Math.floor ((icon_num + col - 1) / col);
    if (row == 2) col = Math.floor((icon_num + 1) / 2);		// 2009.2.9, balance two rows
    with (document) {   	
    	writeln(' <tr id=myTr0><td>   ');
    	writeln('   <table cellpadding=2 align=center class=text2> ');
    	for (var j = 0; j < row; j++) {
    	    writeln('  <tr valign=bottom align=center>' );
    	    for (var i = j*col; (i < j*col+col) && i < icon_num; i++)
		write_icon1 (i);	
    	    writeln('  </tr> '); 	
    	}
    	writeln('   </table>');
    	writeln(' </td></tr> ');
    }
    if (typeof(bg_disp) != "undefined")
   	myTr0.style.display = 'none';
}

function write_icon1 (i) {
    document.writeln(' <td align=center><a href="' + icon[i][0] + '"><img id=img' + i + ' ' + 
//  	' onMouseover="zMouseOver(' + i + ')" ' + ' onMouseout="zMouseOut(' + i + ')" ' +
//	' style="width:60px; " ' +
	' class=img src="' + icon[i][1] + '"></a><br>' + icon[i][2] + '</td> ');	    
//	' class=img style="border-width:1px;border-color:ivory;" src="' + icon[i][1] + '"></a><br>' + icon[i][2] + '</td> ');	    
}

function big_icon () {
    with (document) {
    	writeln(' <tr><td>');
  	writeln(' <table id=bicon cellpadding=1 cellspacing=0 align=center class=text3> ');
	writeln('   <tr valign=bottom align=center> ');
  	writeln("     <td align=center><img id=biconimg style2='width:120px' src='" + icon[0][1] + "'></td> ");
 	writeln('   </tr> '); 
	writeln(' </table> ');
	writeln(' </td></tr> '); 
    }
    bicon.style.display = 'none';
}

var small_icon_width = 45;
var icon_should_update = false;

function get_icon_width () {
    var area = document.body.clientWidth * document.body.clientHeight;
    var factor = 0.56;
    if (screen.width >= 1280) factor = 0.64;
    if (screen.width >= 1600) factor = 0.64;   
    small_icon_width = Math.floor(Math.sqrt(area*factor/(icon.length*0.66667))); 
    if (small_icon_width > 150) small_icon_width = 150;		// 2009.7.9 update
}

function write_all_icons () {
    if (typeof(icon) == "undefined") return;
//    if (icon.length >= 20 && typeof(bg_disp) != "undefined") {
    if (typeof(bg_disp) != "undefined") {
    	get_icon_width ();
    	write_all_icons2();
    	icon_should_update = true;
        update_all_icons2();	
    }	
    else
	write_all_icons1();   
}

function write_all_icons2 () {
    if (typeof(icon) == "undefined") return;
    var icon_num = icon.length;
    col = Math.floor(screen.width/(small_icon_width+4));
    row = Math.floor ((icon_num + col - 1) / col);
    if (row == 2) col = Math.floor((icon_num + 1) / 2);		// 2009.2.9, balance two rows
    with (document) {   	
    	writeln(' <tr id=myTr0><td>   ');
    	writeln('   <table cellspacing=0 cellpadding=0 align=center class=text2> ');
    	for (var j = 0; j < row; j++) {
    	    writeln('  <tr valign=bottom align=center>' );
    	    for (var i = j*col; (i < j*col+col) && i < icon_num; i++)
		write_icon2 (i);	
    	    writeln('  </tr> '); 	
    	}
    	writeln('   </table>');
    	writeln(' </td></tr> ');
    }
    if (typeof(bg_disp) != "undefined")
   	myTr0.style.display = 'none';
}

function write_icon2 (i) {
    	var w = small_icon_width;
    	var h = Math.floor(w/1.5);
    document.writeln(' <td style="background:black;" align=center><a href="' + icon[i][0] + '"><img id=img' + i + ' ' + 
//  	' onMouseover="zMouseOver(' + i + ')" ' + ' onMouseout="zMouseOut(' + i + ')" ' +
//	' style="width:3px;height:2px;" ' +
	' style="width:' + w + 'px;height:' + h + 'px;" ' +
	' class=img src="' + icon[i][1] + '"></a></td> ');	    
}

function update_all_icons2 () {
    icon_should_update = false;
    return;
    if (typeof(icon) == "undefined") return;
    if (!icon_should_update) return;
    myTr0.style.display = 'none';
    var imgs = new Array();
    for (var i = 0; i < icon.length; i++) {
    	imgs[i] = new Image();
    	imgs[i].src = icon[i][1];
    }	
    for (i = 0; i < icon.length; i++) {
    	var w = small_icon_width;
    	var h = Math.floor(w/1.5);
    	if (imgs[i].height > imgs[i].width) {
    	    w = Math.floor(small_icon_width * 0.666 * 0.666);
    	    h = Math.floor(w*1.5);
	}	
    	var obj = document.getElementById('img' + i);
    	obj.src = icon[i][1];
    	obj.style.width  = w + 'px';
    	obj.style.height = h + 'px';
    }	    	
    icon_should_update = false;
}

function update_all_icons2 () {
    if (typeof(icon) == "undefined") return;
    if (!icon_should_update) return;
    myTr0.style.display = 'none';
    var imgs = new Array();
    for (var i = 0; i < icon.length; i++) {
    	imgs[i] = new Image();
    	imgs[i].src = icon[i][1];
    }	
    for (i = 0; i < icon.length; i++) {
    	if (imgs[i].height > imgs[i].width) {
    	    w = Math.floor(small_icon_width * 0.666 * 0.666);
    	    h = Math.floor(w*1.5);
    	    var obj = document.getElementById('img' + i);
    	    obj.src = icon[i][1];
    	    obj.style.width  = w + 'px';
    	    obj.style.height = h + 'px';
	}	
    }	    	
    icon_should_update = false;
}

function write_bottom_cmd (_cmd) {
    if (typeof(_cmd) == "undefined") return;
    var help_is_ready = false;
    if (typeof(help) != "undefined") if (help[0] != "") help_is_ready = true;
    with (document) {
  	writeln(' <tr><td id=xcell><div id=xcmd> ');
  	writeln('   <table cellspacing=0 cellpadding=4 align=center> ');
  	writeln('     <tr id=xcmdtr valign=bottom align=center> ');
    	if (_cmd.length == 1 && _cmd[0][1] == "Enter")
            writeln('    <td align=center><a href="' + _cmd[0][0] + '" class=cmdy>' 
      				+ '<div id=xenter class=cmdy>' 
      				+ _cmd[0][1] + '</div></a></td> ');
    	else				
            for (i = 0; i < _cmd.length; i++) {
            	if (typeof(cmd_not_show) != "undefined")
		    if (cmd_not_show.indexOf(_cmd[i][0], 0) != -1) continue;
		if (_cmd[i][0] == "") continue;  		
		if (_cmd[i][0] == "text") {			// text only
		    writeln('<td align=center class=cmdx>' + _cmd[i][1] + '</td> '); 
		    continue;  
		}		
            	writeln('<td align=center><a href="' + _cmd[i][0] + '" class=cmdx ');        	
		if (help_is_ready) 
           	    writeln(' onMouseover="xMouseOver(' + i + ')" '
           		  + ' onMouseout="xMouseOut(' + i + ')" ');
        	writeln('><div id=cmd' + (i+1) + ' class=cmdx>' + _cmd[i][1] + '</div></a></td> ');
            }						
  	writeln('     </tr> ');
  	writeln('   </table> ');
  	writeln(' </div></td></tr> ');
    }
    if (help_is_ready)
       	write_hidden_help ();
    if (typeof(bg_disp) != "undefined")  	
	xcmdtr.style.background = 'black';   	
}

function write_bottom_cmd (_cmd) {
    if (typeof(_cmd) == "undefined") return;
    with (document) {
  	writeln(' <tr><td id=xcell><div id=xcmd> ');
  	writeln('   <table cellspacing=0 cellpadding=4 align=center> ');
  	writeln('     <tr id=xcmdtr valign=bottom align=center> ');
        for (i = 0; i < _cmd.length; i++) {
            	writeln('<td align=center><a href="' + _cmd[i][0] + '" class=cmdx ');        	
		if (typeof(help) != "undefined") 
           	    writeln(' onMouseover="xMouseOver(' + i + ')" onMouseout="xMouseOut(' + i + ')" ');
        	writeln('><div id=cmd' + (i+1) + ' class=cmdx>' + _cmd[i][1] + '</div></a></td> ');
        }						
  	writeln('     </tr> ');
  	writeln('   </table> ');
  	writeln(' </div></td></tr> ');
    }
    if (typeof(help) != "undefined") 
    	write_hidden_help ();
    if (typeof(bg_disp) != "undefined") 
    	xcmdtr.style.background = 'black';   	
    xcmdtr.style.background = 'black';   	
}

function write_hidden_help () {	
    with (document) {
  	writeln(' <tr><td id=xhelptd><div id=xhelpdiv> ');
  	writeln('   <table cellspacing=0 cellpadding=0 align=center> ');
  	writeln('     <tr valign=bottom align=center> ');			
        writeln('       <td align=center>');
        writeln('         <div id=myHelp class=sub3 style="visibility:hidden">');
	writeln('            Hello</div></a></td> ');				
  	writeln('     </tr> ');
  	writeln('   </table> ');
  	writeln(' </div></td></tr> ');
    }
}

// ------------ xPage.html, Thumbnail  ----------------
		
function small_table () {
    var icon_num = _picNum;
    var col = col2;
    row = Math.floor ((icon_num + col - 1) / col);
    with (document) {
    	writeln(' <tr id=xpage><td>   ');
    	writeln('   <table cellpadding=2 align=center class=text2> ');
    	for (var j = 0; j < row; j++) {
    	    writeln(' <tr valign=bottom align=center>' );
    	    for (var i = j*col; (i < j*col+col) && i < icon_num; i++) {
            	writeln(' <td align=center>');
            	writeln(" <a href='javascript:singleSlide(" + i + ");'>"
           		+ "<img src='" + picsTN[i] + "'></a><br>" 
           		+ picsDigit[i] + "</td>");  
    	    }	
    	    writeln('  </tr> '); 	
    	}
    	writeln('    </table>');
    	writeln('  </td></tr> ');
    }
}

function small_table () {
    var icon_num = _picNum;
    var _col = col2;
    col = _col;
    row = Math.floor ((icon_num + _col - 1) / _col);
    with (document) {
    	writeln(' <tr id=xpage><td>   ');
    	writeln('   <table cellpadding=2 align=center class=text2> ');
    	for (var j = 0; j < row; j++) {
    	    writeln(' <tr valign=bottom align=center>' );
    	    for (var i = j*_col; (i < j*_col+_col) && i < icon_num; i++) {
            	writeln(' <td align=center>');
            	writeln(" <a href='javascript:singleSlide(" + i + ");'>"
           		+ "<img src='" + picsTN[i] + "'></a><br>" 
           		+ picsDigit[i] + "</td>");  
    	    }	
    	    writeln('  </tr> '); 	
    	}
    	writeln('    </table>');
    	writeln('  </td></tr> ');
    }
}


function singleSlide (index) {
    if (typeof(bg_disp) != "undefined") {
    	slideIndex = index;
	slideGo (false, slideIndex);
    	pic_slide_height_modify();
    	rpage_in();
    }
    else {	    
    	slide_index_set (index);
    	slide_show ('random');
    }	
}

// ------------ rPage.html, Slide Show ----------------

function slideStart () {
    auto2 = true;
    slideCurr ();
    timer_id = setInterval ('slideNext_with_effect();', slideSpeed);
}

function slideStop () {	
    auto2 = false;
    if (timer_id != 0) clearInterval (timer_id);
    timer_id = 0;
}

function slideCurr(){ 								slideGo (false, slideIndex); }
function slideHome(){ slideIndex = 0; 						slideGo (false, slideIndex); }
function slideEnd() { slideIndex = slideNum - 1;				slideGo (false, slideIndex); }
function slideNext(){ slideIndex = (slideIndex + 1) % slideNum;			slideGo (false, slideIndex); }
function slidePrev(){ slideIndex = (slideIndex + slideNum - 1) % slideNum; 	slideGo (false, slideIndex); }
function slideNext_with_effect() { slideIndex = (slideIndex + 1) % slideNum;	slideGo (true,  slideIndex); }

function _slideGo (_with_effect, i) { 
    if (typeof(TN_bg) != "undefined" && typeof(bg_disp) != "undefined") { slideGo2(_with_effect, i); return; }
    var _slide = document.slide, s1 = picsDigit[i] + '. ' + memo[i];
    slide[i].src = pics[i];
    if (typeof(bgmemo) != "undefined") bgmemo.innerHTML = s1;
    if (navigator.appName == "Microsoft Internet Explorer" && _with_effect) {
        _slide.style.filter="revealTrans(duration="+transSec+",transition="+transMode+")";
        _slide.filters[0].Apply();
        _slide.src = slide[i].src;
        _slide.filters[0].Play();
    }
    else
        _slide.src = slide[i].src;
    pic_slide_height_modify();
    preLoad ();   
    document.body.style.overflow = 'hidden'; 
    if (typeof(bg_disp) != "undefined") cmd_out2();
}

function slideGo (_with_effect, i) { 
    var s1 = picsDigit[i] + '. ' + memo[i];
    slide[i].src = pics[i];
    if (typeof(bgmemo) != "undefined") bgmemo.innerHTML = s1;
    if (typeof(TN_bg) != "undefined" && typeof(bg_disp) != "undefined")
    	slideGo2 (_with_effect, i);
    else
	slideGo1 (_with_effect, i);
    pic_slide_height_modify();
    preLoad ();   
    document.body.style.overflow = 'hidden'; 
    if (typeof(bg_disp) != "undefined") cmd_out2();
}

function slideGo1 (_with_effect, i) { 
    var _slide = document.slide;
    if (navigator.appName == "Microsoft Internet Explorer" && _with_effect) {
        _slide.style.filter="revealTrans(duration="+transSec+",transition="+transMode+")";
        _slide.filters[0].Apply();
        _slide.src = slide[i].src;
        _slide.filters[0].Play();
    }
    else
        _slide.src = slide[i].src;
}

function slideGo2 (_with_effect, i) { 
    document.body.background = pics[i];
    slidetable.style.display = 'none';
//    xrow.vAlign = 'bottom';
    xtd1.vAlign = 'bottom';
}

function preLoad () {
    var curr = slideIndex;
    var next = (slideIndex + 1) % slideNum;
    slide[curr].src = pics[curr];
    slide[next].src = pics[next];
}

function Click () { slideNext (); }

function fullScreen (_html) {
    opt = 'fullscreen=yes,scrollbars=no,status=no';
    opt = "fullscreen=yes,scrollbars=no,width=" + screen.width + ",height=" + screen.height;
    full = window.open (_html, 'full', opt);
}

function bg_img_set () {
    if (typeof(bg_img) == "undefined") return;
    bg_img = bg_img_update (bg_img);
}

function bg_img_update (bg_img) {				// 2006.8.24
    var s3 = "";
    if (typeof(bg_img) == "undefined") return s3;
    if (bg_img == "") return s3;  
    var digits = "0123456789", dc = bg_img;
    dot = dc.length - 4;		// .jpg, bg_India01.jpg, bg_India01u.jpg 
    s1 = dc.substring (0, dot);		// "bg_India01u"
    c1 = dc.charAt (dot-1);		// c1 = "u"
    begin = digits.indexOf (c1);	// c1 is a digit (0-9) ?
    if (begin == -1) 			// if c1 is not 0-9, then update s1
    	s1 = dc.substring (0, dot-1); 
    var s2 = bg_tail ();  		// default: 1024x768     
    return new String(s1 + s2 + ".jpg");
}

var bg_tails = new Array (
	new Array (    0,   ""),	// 1024x680
//	new Array (  600,  "z"),	// 600x400, a
//	new Array (  800,  "t"),	// 800x532, b
//	new Array ( 1024,  "y"),	// 1024x680, c
	new Array ( 1280,  "u"),	// 1280x850, d
	new Array ( 1400,  "v"),	// 1440x810
	new Array ( 1600,  "w"),	// 1680x945
	new Array ( 1920,  "x"),	// 1920x1080
	new Array ( 2560,  "s")		// 2560x1440
);

var bg_tails2 = new Array (
	new Array (    0,    0, "z"),	// 1024x680
	new Array (  600,  300,	"z"),	// 600x400, a
	new Array (  800,  400, "t"),	// 800x532, t
	new Array ( 1024,  600,	"c"),	// 1024x600, c
	new Array ( 1024,  768,	"y"),	// 1024x680, y
	new Array ( 1280,  600,	"d"),	// 1280x800, d
	new Array ( 1280,  960, "u"),	// 1280x850, u
	new Array ( 1366,  768, "v"),	// 1366x768
	new Array ( 1400,  810, "v"),	// 1440x810
	new Array ( 1600,  900, "w"),	// 1680x945
	new Array ( 1920,  1080,"x"),	// 1920x1080
	new Array ( 2560,  1440,"s")	// 2560x1440
);

var bg_tails3 = new Array (		// ===== 2010.4.18 =====
	new Array (    0,    0, "a"),	// 
	new Array (  640,  480, "a"),	//  640x480   4:3  A    ABCD(1234) EFGH(5678)
	new Array (  720,  480, "b"),	//  720x480   3:2  A
	new Array (  800,  480, "c"),	//  800x500  16:10 H	// 更改
	new Array (  800,  600, "d"),	//  800x600   4:3  B
	new Array ( 1024,  600,	"e"),	// 1024x600  16:9  A (594)
	new Array ( 1024,  640,	"f"),	// 1024x640  16:10 A
	new Array ( 1024,  768,	"y"),	// 1024x768   4:3  C   		// g -> y OK
	new Array ( 1152,  720,	"h"),	// 1152x720  16:10 B
	new Array ( 1280,  720,	"i"),	// 1280x720  16:9  B
	new Array ( 1280,  800,	"u"),	// 1280x800  16:10 C		// j -> u OK   j is avialable
 	new Array ( 1280,  960, "k"),	// 1280x960   4:3  D
//	new Array ( 1280, 1024, "l"),	// 1280x1024  5:4  A		// l is available
	new Array ( 1366,  768, "m"),	// 1366x768  16:9  C
	new Array ( 1440,  900, "v"),	// 1440x900  16:10 D		// n -> v OK
	new Array ( 1600,  900,	"o"),	// 1600x900  16:9  D
	new Array ( 1600, 1200, "p"),	// 1600x1200  4:3  E
//	new Array ( 1600, 1280, "q"),	// 1600x1280  5:4  B		// q is available
	new Array ( 1680,  945,	"r"),	// 1680x945  16:9  E
	new Array ( 1680, 1050, "w"),	// 1680x1050 16:10 E		// s -> w OK
	new Array ( 1920, 1080, "t"),	// 1920x1080 16:9  F
	new Array ( 1920, 1200, "x"),	// 1920x1200 16:10 F		// u -> x OK
	new Array ( 2048, 1152, "n"),	// 2048x1152 16:9  G		// v -> n OK
	new Array ( 2560, 1440, "g"),	// 2560x1440 16:9  H		// w -> g OK
	new Array ( 2560, 1600, "s")	// 2560x1600 16:10 G		// x -> s OK
);

// 3:2 150, 720, (0.666)
// 16:9 1024/e, 1280/i, 1366/m, 1600/o, 1680/r, 1920/t, 2048/n, 2560/g  (0.5625)
// 16:10 1024, 1152, 1280, 1440, 1680, 1920, 2560   (0.625)
// 16:12 640/a, 800/d, 1024/y, 1280/k, 1600/p, (0.75)

// 5:4 1280/l. 1600/q  (0.8) (以 4:3 1280x960, 1600x1200 取代)
// 5:3 800/c    (0.6) (以 16:10 800x500 取代)


function bg_tail () {
    if (typeof(bg_tail_new3) != "undefined") return bg_tail3();
    if (typeof(bg_tail_new) != "undefined") return bg_tail2();
    if (typeof(_screenWidth) == "undefined") _screenWidth = 1920;
    var s2 = "";  							// default: 1024x768 
    for (var i = 0; i < bg_tails.length; i++)
    	if (screen.width >= bg_tails[i][0] && _screenWidth >= bg_tails[i][0]) 
    	    s2 = bg_tails[i][1];
//    if (screen.width == 1920) s2 = "x";
//    alert(screen.width);	    
    return s2;
}

function bg_tail3 () {							// 2010.4.18
    if (typeof(_screenWidth) == "undefined") _screenWidth = 2560;
    var s2 = "";  							// default: 640x480 
    for (var i = 0; i < bg_tails3.length; i++)
    	if (screen.width >= bg_tails3[i][0] && screen.height >= bg_tails3[i][1] && _screenWidth >= bg_tails3[i][0]) 
    	    s2 = bg_tails3[i][2];
    return s2;
}

function bg_tail2 () {							// 2006.8.24
    if (typeof(_screenWidth) == "undefined") _screenWidth = 1920;
    var s2 = "";  							// default: 1024x768 
    for (var i = 0; i < bg_tails2.length; i++)
    	if (screen.width >= bg_tails2[i][0] && screen.height >= bg_tails2[i][1] && _screenWidth >= bg_tails2[i][0]) 
    	    s2 = bg_tails2[i][2];
    return s2;
}

var pic_tails = new Array (
	new Array (    0,    0,	  0,	"z"),	// 		600x400
//	new Array (  600,  400,	600,	"z"),	//  600x400,    600x400
//	new Array (  800,  600,	800,	"t"),	//  800x600,    780x520
	new Array ( 1024,  768,	1000,	"y"),	// 1024x768,   1000x667
	new Array ( 1280,  960,	1260,	"u"),	// 1280x1024,  1260x837
	new Array ( 1680, 1050, 1470,	"w"),	// 1680x1050,  1470x976
	new Array ( 1600, 1200, 1581,	"v"),	// 1600x1200,  1581x1050
	new Array ( 1920, 1080, 1695,	"v"),	// 1920x1080,  1581x1050
	new Array ( 1920, 1200, 1695,	"x"),	// 1920x1200,  1695x1126
	new Array ( 2560, 1440, 2025,	"x"),	// 2560x1440 t
	new Array ( 2560, 1600, 2250,	"x")	// 2560x1600 s
);

function pic_tail () {							// 2006.8.24
    if (typeof(_picWidth) == "undefined") _picWidth = 1695;
    var s3 = "z";
    for (var i = 0; i < pic_tails.length; i++)
    	if (screen.width >= pic_tails[i][0] && screen.height >= pic_tails[i][1] && _picWidth >= pic_tails[i][2]) 
    	    s3 = pic_tails[i][3];
    return s3;
}

function pic_tail_set () {				// 2006.8.24
    if (typeof(_picWidth) == "undefined") return;	// var _imgWidth = 1280; 1280x1024, 2006.8.24
    _picTail = pic_tail();
}

// 320x240 640x480
// 800x600 1024x768 1152x864 1280x600 1280x720 1280x768 1280x960 1280x1024 
// 1366x768 1400x1050 1600x900 1600x1200 1856x1392 
// 1920x1080 1920x1200 2048x1536

// --------------- Initializtion -------------------

var	slideSpeed = 10000, 
	transMode = 12,
	transSec = 2.5;
var 	slideIndex = 0, 
	slideNum = 0;
var 	slide = new Array(), 
	pics = new Array(), 
	picsTN = new Array(), 
	picsDigit = new Array();
	
var cols = new Array (			// screen.width, col, col2
	new Array ( 0,	   1,	1),
	new Array ( 320,   2,	1),
	new Array ( 480,   3,	2),
	new Array ( 640,   4,	3),
	new Array ( 800,   5,	4),
	new Array ( 1024,  6,	5),
	new Array ( 1152,  7,	6),
	new Array ( 1280,  7,	6),
	new Array ( 1366,  8,	7),
	new Array ( 1400,  8,	7),
	new Array ( 1440,  8,	7),
	new Array ( 1600,  9,	8),
	new Array ( 1680,  10,	8),
	new Array ( 1920,  11,	10),
	new Array ( 2048,  12,	10),
	new Array ( 2560,  15,	12)
);

function col_num_def () { 
    var _col = 1, _col2 = 1;			// index.html, 150x100
    for (var i = 0; i < cols.length; i++)
	if (screen.width >= cols[i][0]) {
	    _col  = cols[i][1];
	    _col2 = cols[i][2];
	}    
    if (typeof(col) == "undefined") col = _col; // 150x100	
    col2 = _col2;	
    col2 = col;					// 2009.7.19, all icon = 150x100
//    col_num_def_update ();			// 2009.7.18
}

function col_num_def_update () { 
    var _img = new Image();			// 150x100, new icon size, 2009.7.18
    _img.src = "TN_" + _picToken + "01.JPG";
    if (_img.height != 0 && _img.complete) {
    	var _w = _img.width, _h = _img.height;
    	if (_w == 150 || _h == 150) col2 = col; 
    }	
}

col_num_def();
if (typeof(bg_disp) != "undefined" && !bg_icon_TNx()) col = col2;
if (typeof(_subtitleStr) != "undefined") var sub = _subtitleStr;
bg_img_set();	// bg_img, support 1280x1024, 1440x900, 1600x1200, 1680x1050, 1920x1200, ...
pic_tail_set();	// 'u', ... support 1280x1024, 1440x900, 1600x1200, 1680x1050, 1920x1200, ...

//var 	memo  = new Array(); 
//var 	picNumMax = 99;	
//for (var i = 0; i < picNumMax; i++) memo[i] = "";

function slideInit () {		// for pictures, 1, 2, 3, 4, ...
    if (typeof(_picNum) == "undefined") return;
    slideNum = _picNum;
    for (var i = 0; i < slideNum; i++) {
        slide[i] = new Image();
        var iStr = (i+1);
        if (i+1 < 10) iStr = "0" + iStr;
        pics[i] = _picToken + iStr +  _picTail + ".jpg";
        picsTN[i] = "TN_" + _picToken + iStr + ".JPG";
        picsDigit[i] = iStr;
    }
    var img1 = new Image();
    img1.src = pics[0];
}

// pic1(IE), pic2(FireFox)
// icon1(icon), icon2(bg_img/TNx.TN)

function main_type () { 	// icon1, icon2, pic1, pic2, bg_dsip = 2
    var ver = "1";
    if (typeof(bg_disp) != "undefined") ver = "2";
    var _type = "icon";
    if (typeof(_picToken) != "undefined") _type = "pic";
    return _type + ver;			
}

function main_part2 () {
    var mtype = main_type (); 
    if (mtype == "pic1") {
    	enter_page_cmd ();

    }
    else if (mtype == "pic2") {
	small_table();	 
    	slide_table();		
    	bg_memo_new();
    	write_camera ();
    	write_bottom_cmd(cmd);
    	bg_msg_new();
	epage_in();
    }
    else if (mtype == "icon1") {
 	icon_ini(); 
	write_all_icons ();
	write_bottom_cmd(cmd);
    }
    else if (mtype == "icon2") {
 	icon_ini();
 	big_icon(); 
	write_all_icons ();
	bg_slide();		
	bg_memo_new();				   
	write_bottom_cmd(cmd);
	bg_preload_curr();
	bg_addEvent(); 
   	bg_main();
    }
    enter_page_setting ();
    write_table_end (); 
}

function main_page () {	
    var hostname = window.location.hostname;
    var mtype = main_type();  
    if (mtype == "pic1" && browser_name() != "MSIE")
	bg_disp = true;	
    if (mtype == "pic1" && browser_name() == "MSIE" && hostname != "localhost")
    	bg_disp = true;	
    if (typeof(_picToken) != "undefined") {
    	slideInit ();
    	preLoad();
    }
       	
    def_title_style_body ();
    write_table_begin ();
    write_title ();
    write_sub ();
    
    main_part2 ();
    
    bg_img_display();
    document.body.style.overflow='auto';
     
    if (typeof(memo) == "undefined" && typeof(icon) != "undefined") 
    	xtd1.vAlign='center';
   	
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='8px';
    
//    xtable.style.marginLeft='20px';
//    xtable.style.marginRight='20px';
}

function bg_img_display() { 
    bg_img_set();
    if (typeof(bg_img) != "undefined") if (bg_img != "")	
    	document.body.background = bg_img;	
}
	
function enter_page () { main_page (); }

function enter_page_cmd ()   // for index.html
{
    var picCmd = new Array (		// only for ePage.html
	    new Array ( "javascript:slide_show('auto');",   "Slide(A)" ),
	    new Array ( "javascript:slide_show('manual');", "Slide(M)" ),
	    new Array ( "xPage.html", "Index" )
	);
    var picHelp = new Array (		// only for ePage.html
	    "幻燈片(自動,12秒/張)<br>Slide Show(Auto,12sec/slide)",
	    "幻燈片(手動,Click 下一張)<br>Slide Show(Manual,Click Next)",
	    "縮圖<br>Thumbnail"
	);
    help = picHelp;   // help is global variable
    write_bottom_cmd (picCmd);
}

function major_page (fn) { 		// for xPage.html
    slideInit ();
    def_title_style_body ();
    write_table_begin ();
    write_title ();
    write_sub ();
    small_table ();
    write_camera ();
    write_table_end ();
    xheader.style.marginBottom='20px';
    if (typeof(xsub) != "undefined") xsub.style.marginBottom='20px';
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='20px';
//    xrow.vAlign='center';
    xtd1.vAlign='center';
    xrow.style.textAlign='center';
    document.body.style.overflow='auto';	
}

function slide_show (mode) {
    slide_mode_set (mode);
    fullScreen('rPage.html');
}

function slide_auto (_dir) {	// slide_show auto mode, ex: "javascript:slide_auto ('02');"
    slide_mode_set ('auto');
    fullScreen(_dir + '/rPage.html');
}

function slide_page () {	// rPage.html
    var mode = slide_mode_get ();
    if (mode == "random") slideIndex = slide_index_get ();
    def_title_style_body ();
    slideInit ();
    write_table_begin ();
    slide_table ();
    write_table_end ();
    if (mode == "auto") slideStart ();
    xrow.style.textAlign='center';
}

function enter_page_setting ()   // for index.html
{
//    xrow.vAlign='top';
    xtd1.vAlign='top';
    xrow.style.textAlign='center';
//    xtable.style.margin='25px';
    xheader.style.fontSize='30pt';
//    xtable.style.margin='0px';
//   xheader.style.marginBottom='20px';
    xheader.style.marginBottom='0px';
}

// .... 2009.2.3 bg change ... begin

var TN_bg = true;
var bg_now = 0;
var auto = false;
var bg_auto_counter = 0;
var bg_auto_sec = 8;

if (typeof(_picToken) != "undefined") {
    var cmd = new Array (
/*    
	new Array ( "javascript:slide_manual();", "手動" ),
	new Array ( "javascript:slidePrev();", "上一張" ),
	new Array ( "javascript:slideNext();", "下一張" ),
	new Array ( "javascript:slide_start();", "幻燈片" ),
	new Array ( "javascript:slide_stop();", "幻燈片停止" ),
	new Array ( "javascript:xpage_in();", "縮圖" ),
	new Array ( "javascript:epage_in();", "主頁" )
*/
	new Array ( "javascript:slide_manual();", "Manual" ),
	new Array ( "javascript:slidePrev();", "Prev" ),
	new Array ( "javascript:slideNext();", "Next" ),
	new Array ( "javascript:slide_start();", "Auto" ),
	new Array ( "javascript:slide_stop();", "Stop" ),
	new Array ( "javascript:xpage_in();", "Index" ),
	new Array ( "javascript:epage_in();", "Main" )
	);
    var _screenWidth = 1920;
}
else if (typeof(bg_disp) != "undefined") {
    var cmd = new Array (
/*    
	new Array ( "javascript:tr_in();", "索引" ),
	new Array ( "javascript:bg_auto();", "自動" ),
	new Array ( "javascript:bg_stop();", "停止" ),
	new Array ( "javascript:bg_prev();", "上一張" ),
	new Array ( "javascript:bg_next();", "下一張" ),
	new Array ( "javascript:bg_main();", "主頁" )
*/	
	new Array ( "javascript:tr_in();", "Index" ),
	new Array ( "javascript:bg_auto();", "Auto" ),
	new Array ( "javascript:bg_stop();", "Stop" ),
	new Array ( "javascript:bg_prev();", "Prev" ),
	new Array ( "javascript:bg_next();", "Next" ),
	new Array ( "javascript:bg_main();", "Main" )
	);
    var _screenWidth = 1920;
}

var xrow_valign = "top";
var xrow_halign = "center"; 
var xrow_saved = false;

function epage_xrow_pos_save() { 
    if (!xrow_saved) {	
//    	xrow_valign = xrow.vAlign;
    	xrow_valign = xtd1.vAlign;
    	xrow_halign = xrow.style.textAlign;
    	xrow_saved = true;
    }
}

function epage_xrow_pos_restore() { 
    if (xrow_saved) {		
//    	xrow.vAlign = xrow_valign;
    	xtd1.vAlign = xrow_valign;
    	xrow.style.textAlign = xrow_halign;
    }
}

function xpage_in() {
    epage_xrow_pos_save();
    slide_stop();
    if (typeof(xheader) != "undefined") xheader.style.display = 'block';
    if (typeof(xsub) != "undefined")    xsub.style.display = 'block';   
    if (typeof(xpage) != "undefined") xpage.style.display = 'block';
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'none';
    if (typeof(slidetable) != "undefined") slidetable.style.display = 'none';
    if (typeof(xcamera) != "undefined") xcamera.style.display = 'block';
    if (typeof(bgmsg) != "undefined") bgmsg.style.display = 'none';
    document.body.background = 'black';
    document.body.style.overflow = 'auto';
    xpage_cmd();
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='20px';
//    xrow.vAlign = 'center';
    xtd1.vAlign = 'center';
    xrow.style.textAlign = 'center';
}

function rpage_in() {
    epage_xrow_pos_save();
//    xrow.vAlign = 'center';
    xtd1.vAlign = 'center';
    xrow.style.textAlign = 'center';
    if (typeof(xheader) != "undefined") xheader.style.display = 'none';
    if (typeof(xsub) != "undefined")    xsub.style.display = 'none';   
    if (typeof(xpage) != "undefined") xpage.style.display = 'none';
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'block';
    if (typeof(slidetable) != "undefined") slidetable.style.display = 'block';
    if (typeof(xcamera) != "undefined") xcamera.style.display = 'none';
    if (typeof(bgmsg) != "undefined") bgmsg.style.display = 'none';
    document.body.background = 'black';	
    document.body.style.overflow = 'hidden'; 
    rpage_cmd();
    xtable.style.marginTop='8px';
    xtable.style.marginBottom='8px';
    if (typeof(TN_bg) != "undefined") slideCurr();
}

function epage_in() {
    slide_stop();
    if (typeof(xheader) != "undefined") xheader.style.display = 'block' ;
    if (typeof(xsub) != "undefined")    xsub.style.display = 'block';
    if (typeof(xpage) != "undefined") xpage.style.display = 'none';
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'none';
    if (typeof(slidetable) != "undefined") slidetable.style.display = 'none';
    if (typeof(xcamera) != "undefined") xcamera.style.display = 'none';
    if (typeof(bgmsg) != "undefined") bgmsg.style.display = 'none';
    document.body.background = 'black';
    if (typeof(bg_img) != "undefined") if (bg_img != "")
    	document.body.background = bg_img;   	
    document.body.style.overflow = 'hidden'; 
    epage_cmd();
    epage_xrow_pos_restore();
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='20px';
    slideIndex = 0;
    timerStart();
    cmd_in2 ();
}

function xpage_cmd() { page_cmd_display ('none', 'none', 'none', 'none', 'none', 'none', 'block'); }
function rpage_cmd() { page_cmd_display ('none', 'block', 'block', 'block', 'block', 'block', 'block'); }
function epage_cmd() { page_cmd_display ('block', 'none', 'none', 'block', 'none', 'block', 'none'); }

function page_cmd_display (s1, s2, s3, s4, s5, s6 ,s7) {
    cmd1.style.display = s1;
    cmd2.style.display = s2;
    cmd3.style.display = s3;
    cmd4.style.display = s4;
    cmd5.style.display = s5;
    cmd6.style.display = s6;
    cmd7.style.display = s7;
}

var timer_count = 0;
var switch_sec = 8;

function timerStart () {
    timer_id2 = setInterval ('timerCheck();', 1000);
}

function timerStop () {	
    if (timer_id2 != 0) clearInterval (timer_id2);
    timer_id2 = 0;
}

function timerCheck () {
    pic_slide_height_modify();
    if (auto) slide_auto_count ();	
}

var slide_auto_counter = 0;
var slide_auto_sec = 8;

function slide_auto_count () { 	
    var sec = ++slide_auto_counter;
    if ((sec >= slide_auto_sec) && slide_next_ready()) {
    	slideIndex = (slideIndex + 1) % slideNum;;
    	slideGo (true, slideIndex);
    	cmd_out2();
	slide_auto_counter = 0;
    }
    else {
    	timerString (sec, slide_auto_sec);
    	preLoad();
    }	 					
    if (slide_auto_counter > 40) slide_auto_counter = slide_auto_sec;		
}

function slide_next_ready() {
    var next = (slideIndex + 1) % slideNum;
    var img = new Image();
    img.src = pics[next];
    return ((img.height != 0) && img.complete);
}

function timerString(sec, period) {
    var i = slideIndex, s = " ... ";
    for (var j = 0; j < sec; j++)
	s = s + ">";
    if (typeof(period) != "undefined")
	for (j = 0; j < (period-sec); j++)
    	    s = s + "-";
    var t = '(' + (i+1) + '/' + _picNum + ') ' + memo[i] + s;
    bg_memo (t);
}

function cmd_in2() {
    xcmd.style.display = 'block';   
    pic_slide_height_modify ();
}

function cmd_out2() {
    xcmd.style.display = 'none'; 
    pic_slide_height_modify();  
}

function bg_main() {
    bg_stop();
    bg_now = 0;
    bg_auto_counter = 0;
    if (typeof(xheader) != "undefined") xheader.style.display = 'block' ;
    if (typeof(xsub) != "undefined")    xsub.style.display = 'block';
    if (typeof(myTr0) != "undefined") myTr0.style.display = 'none';
    if (typeof(slidetable) != "undefined") slidetable.style.display = 'none';
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'none';
    if (typeof(bgmsg) != "undefined") bgmsg.style.display = 'none';
    document.body.style.overflow = 'hidden'; 
    document.body.background = 'black';
    if (typeof(bg_img) != "undefined") if (bg_img != "")
    	document.body.background = bg_img;   	
    epage_xrow_pos_restore();
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='8px';
    xrow.vAlign = 'top';
}

function tr_in() {
    if (myTr0.style.display == 'block') return;
    if (icon_should_update) update_all_icons2 ();
    epage_xrow_pos_save();
    bg_stop();
    bg_now = 0;
    bg_auto_counter = 0;
//    xrow.vAlign = 'center';
    xtd1.vAlign = 'center';
    xrow.style.textAlign = 'center';
    if (typeof(xheader) != "undefined") xheader.style.display = 'block';
    if (typeof(xsub) != "undefined")    xsub.style.display = 'block';    
    document.body.background = 'black';		// set bg = black
    if (typeof(slidetable) != "undefined") slidetable.style.display = 'none';
    if (typeof(myTr0) != "undefined") myTr0.style.display = 'block';		// icon
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'none'; 
    document.body.style.overflow = 'auto';
    xtable.style.marginTop='20px';
    xtable.style.marginBottom='8px';
}

function tr_out() {
    epage_xrow_pos_restore();
    if (bg_icon_TNx()) { 
//    	xrow.vAlign = 'bottom'; 
    	xtd1.vAlign = 'bottom'; 
    }
    else { 
//    	xrow.vAlign = 'center'; 
    	xtd1.vAlign = 'center'; 
    }
    if (typeof(TN_bg) != "undefined") { 
//    	xrow.vAlign = 'bottom'; 
    	xtd1.vAlign = 'bottom'; 
    }
    xrow.style.textAlign = 'center';
    if (typeof(bgmemo) != "undefined") bgmemo.style.display = 'block';  
    if (typeof(myTr0) != "undefined") myTr0.style.display = 'none';		// icon		
    if (typeof(xsub) != "undefined") xsub.style.display = 'none';		// sub
    if (typeof(xheader) != "undefined") xheader.style.display = 'none';		// title
//    if (typeof(slidetable) != "undefined") slidetable.style.display = 'none';
//    xtable.style.margin='8px';
    xtable.style.marginTop='8px';
    xtable.style.marginBottom='8px';
}

function cmd_in() {
    xcmd.style.display = 'block';   
//    if (xheader.style.display == 'none') myTr0.style.display = 'block';	
    bg_slide_height_modify ();
}

function cmd_out() {
    if (in_cmd_area()) return;
    xcmd.style.display = 'none';   
//    myTr0.style.display = 'none';			
    bg_slide_height_modify ();
}

function slide_next() { slideNext(); if (typeof(bg_disp) != "undefined") rpage_in(); }
function slide_prev() { slidePrev(); if (typeof(bg_disp) != "undefined") rpage_in(); }
function slide_home() { slideHome(); if (typeof(bg_disp) != "undefined") rpage_in(); }
function slide_end()  { slideEnd();  if (typeof(bg_disp) != "undefined") rpage_in(); }

function slide_manual() {
    if (auto == true) return;
    slideHome();
    rpage_in();
}

function slide_start() {
    if (auto == true) return;
    auto = true;
    rpage_in();
}

function slide_stop() {
    if (auto != true) return;
    auto = false;
}

function bg_new (_bg_img) {
    for (var i = 0; i < icon.length; i++) {
    	var dc = icon[i][0];
    	if (dc.indexOf (_bg_img,0) != -1) bg_now = i;	 
    }
    bg_change();	
}

function bg_next() { bg_now = (bg_now + 1) % icon.length; 		bg_change(); bg_preload_next(); bg_auto_counter = 0; }
function bg_prev() { bg_now = (bg_now - 1 + icon.length) % icon.length; bg_change(); bg_preload_prev(); bg_auto_counter = 0; }
function bg_home() { bg_now = 0; 					bg_change(); }
function bg_end()  { bg_now = icon.length - 1; 				bg_change(); }

function slide_table () {		// 2009.2.6 
    var i = slideIndex;
    with (document) {
    	writeln(' <tr><td id=sid>');
  	writeln(' <table id=slidetable cellpadding=1 cellspacing=0 align=center class=text3> ');
	writeln('   <tr valign=bottom align=center> ');
  	writeln("     <td align=center><img name='slide' style='filter:blendTrans(duration=" 
//  			+ transSec + ");' src='" + pics[i] + "'></td> ");
  			+ transSec + ");' src='" + pics[i] + "' onMousedown='yClick()'></td> ");
    	if (typeof(bg_disp) == "undefined") {
	    writeln(' <tr valign=bottom align=center> '); 			
	    writeln('     <td align=center><div id=bgmemo>' + picsDigit[i] + '. ' + memo[i]
	    		    + '</div><a href="javascript:slidePrev();"><b> <</b></a> <a href="javascript:window.close();"><b> X</b></a> <a href="javascript:slideNext();"><b> ></b></a>'
			    + '</td>' );
	    writeln(' </tr> ');		
	}
	writeln('   </tr> '); 
	writeln(' </table> ');
	writeln(' </td></tr> '); 
    }
    if (typeof(bg_disp) == "undefined") {
	preLoad ();
	slideGo (slide_mode_get () == "auto", i);  
    }
    document.body.style.overflow = "hidden"; 
    slide_addEvent();	// 2009.2.4, added for slide show, rPage.html
}

function bg_slide () {
    with (document) {
    	writeln(' <tr><td>');
  	writeln(' <table id=slidetable cellpadding=1 cellspacing=0 align=center class=text3> ');
	writeln('   <tr valign=bottom align=center> ');
  	writeln("     <td align=center><img name='slide' style='filter:blendTrans(duration=" 
//  			+ transSec + ");' src='" + bg_icon_fn(0) + "'></td> ");
  			+ transSec + ");' src='" + bg_icon_fn(0) + "' onMousedown='xClick()'></td> ");
	writeln('   </tr> '); 
	writeln(' </table> ');
	writeln(' </td></tr> '); 
    }
    slidetable.style.display = 'none';
}

function bg_preload_curr() { bg_preload(bg_now); }
function bg_preload_next() { bg_preload(bg_now+1); }
function bg_preload_prev() { bg_preload(bg_now-1); }
function bg_preload(i) { (new Image()).src = bg_icon_fn(i); }

function bg_icon_fn(i) {
    i = (i + icon.length) % icon.length;
    var dc = icon[i][0];
    return dc.substring (19, dc.length-3);
}

function bg_auto() {
    if (auto == true) return;
    auto = true;
    bg_change();
    cmd_out();
    tr_out();
    timer_id = setInterval ('bg_auto_count();', 1000);	// counts every second
    if (myTr0.style.display == 'block')
    	bg_change();
}

function bg_auto_count() {
    var sec = ++bg_auto_counter;
    if ((sec >= bg_auto_sec) && bg_next_ready()) {
	bg_next();
	bg_preload_next();
	bg_auto_counter = 0;
    }
    else {
	bg_memo_change(sec, bg_auto_sec);
	bg_preload_next();
    }
    if (bg_auto_counter > 40) bg_auto_counter = bg_auto_sec;		
}

function bg_next_ready() {
    var img = new Image();
    img.src = bg_icon_fn(bg_now+1);
    return ((img.height != 0) && img.complete);
}

function bg_memo_change(sec, period) {
    var i = bg_now, s = " ... ";
    for (var j = 0; j < sec; j++)
	s = s + ">";
    if (typeof(period) != "undefined")
	for (j = 0; j < (period-sec); j++)
    	    s = s + "-";
    var t = '(' + (i+1) + '/' + icon.length + ') ... ' + icon[i][2] + s;
    bg_memo(t);
}

function bg_memo_new(){ bg_text_new ('memo', 'bgmemo', 'sub4'); }
function bg_msg_new() { bg_text_new ('msg', 'bgmsg', 'sub4'); }

function bg_text_new (_name, _id, _class) {
    with (document) { 
	writeln('  <tr><td>');
  	writeln('    <table cellspacing=0 cellpadding=0 align=center> ');
	writeln('       <tr valign=bottom align=center> '); 			
	writeln('          <td align=center><div id=' + _id + ' class=' + _class + '>[' + _name + ']</div></td>' );
	writeln('       </tr> ');
  	writeln('    </table>');
  	writeln('  </td></tr>');
    }
    var obj = document.getElementById(_id);
    obj.style.display = 'none';
    obj.style.background = 'black';
}

function bg_msg(msg) { if (typeof(bgmsg) != "undefined") bgmsg.innerHTML  = msg; }
function bg_memo(s1) { if (typeof(bgmemo)!= "undefined") bgmemo.innerHTML = s1;	}

function bg_stop() {
    if (auto == false) return;
    auto = false;    
    cmd_in();
    if (timer_id != 0) clearInterval (timer_id);
    timer_id = 0;
}

// new Array ( "javascript:bg_new('/friend/2008/1227YBP10/bg_YBP57w.jpg');",	"/friend/2008/1227YBP10/TN_YBP57x.jpg",		"12.27 洋幫辦多人合照" ),

function bg_change() {
    epage_xrow_pos_save();
    bg_now = (bg_now + icon.length) % icon.length;
    var fn = bg_icon_fn(bg_now);
    bg_preload_curr();
    bg_memo_change(0);
    if (bg_icon_TNx())
    	document.body.background = fn;		
    else
    	bg_slideGo (fn); 		
//    if (auto) 
    cmd_out();
    tr_out();
    if (in_cmd_area()) cmd_in();
    bg_preload_next();
}

function bg_slideGo (fn) {
    if (typeof(TN_bg) != "undefined") { document.body.background = fn; return; }
    slidetable.style.display = 'none';
    document.body.background = 'black';		
    var slide = document.slide;
    slide.src = fn;
    bg_slide_height_modify ();
    slidetable.style.display = 'block';
}

function bg_slide_height_modify () { slide_h_modify (54, 78); }
function pic_slide_height_modify() { slide_h_modify (54, 78); }

function slide_img_ratio () {
    var _img = new Image();
    _img.src = pics[slideIndex].src;
    var w = _img.width, h = _img.height;
//    alert(h/w);
    return h/w;    
}

function slide_h_modify (diff1, diff2) {
    var diff = diff2, ratio = 0.666667;	
    if (typeof(xcmd) != "undefined") if (xcmd.style.display == 'none') diff = diff1;
    document.slide.height = document.body.clientHeight - diff;
//    if (ratio != 0) document.slide.width  = Math.floor(document.slide.height/ratio);
    if (document.slide.width >= (document.body.clientWidth - 8)) {
//	document.slide.width  = document.body.clientWidth - 10;
//	document.slide.height  = Math.floor (document.slide.width*ratio);
//	if (ratio != 0) document.slide.height = Math.floor (document.slide.width*ratio);
    }
}

// new Array ( "/friend/2008/1231NTHU/",	"/friend/2008/1231NTHU/TN_NTHU13x.jpg",		"12.31 清大校園" ),

function icon_ini () {
    if (typeof(bg_disp) != "undefined") 
    	bg_icon_ini ();
    if (typeof(icon_reverse) != "undefined")
    	bg_icon_reverse ();	
}

function bg_icon_ini () {
//    var i = Math.floor(Math.random()*icon.length);
    var i = 0;
    if (typeof(bg_img) == "undefined")
    	bg_img = new String(bg_fn_replace1 (icon[i][1]));	
    var n = icon.length;
    for (var i = 0; i < n; i++) {
    	var s1 = new String(bg_fn_replace (icon[i][1]));
    	icon[i][0] = new String("javascript:bg_new('" + s1 + "');");
    }
}

function bg_fn_replace (s1) {    
    if (s1.indexOf("x.jpg",0) != -1)			// is 150x100 icon ?  
    	return bg_fn_replace1 (s1);			// 150x100
    else
    	return bg_fn_replace2 (s1);			// 180x120
}

function bg_icon_TNx () {				// is TNx ? 150x100
    if (typeof(icon) == "undefined") return false;
    return (icon[0][1]).indexOf("x.jpg",0) != -1;
}

function bg_fn_replace1 (s1) {				// TN_x.jpg --> bg_
    var s2 = new String(s1.replace(/TN/, "bg"));
    var s3 = new String (bg_tail() + ".jpg"); 
    var s4 = new String (s2.replace(/x.jpg/, s3));  
    return s4;
}

function bg_fn_replace2 (s1) {				// TN_ --> 
//    if (s1.indexOf("x.jpg",0) != -1) return bg_fn_replace1 (s1);  
    var s2 = new String(s1.replace(/TN_/, ""));
    var s3 = new String (pic_tail() + ".jpg");
    var s4;
    if (s1.indexOf ("x.jpg",0) != -1) 
    	s4 = new String (s2.replace(/x.jpg/, s3)); 
    else
     	s4 = new String (s2.replace(/.jpg/, s3));    	
    return s4;
}

function bg_icon_reverse () {
    var n = Math.floor(icon.length/2);				// 2006.8.24
    for (i = 0; i < n; i++)
    	bg_icon_exchange (i);
}

function bg_icon_exchange (i) {				// 2006.8.24
    var s = new Array (3);
    var k = icon.length - i - 1;
    if (i >= k) return;
    for (j = 0; j < 3; j++)
	s[j] = new String(icon[i][j]);
    for (j = 0; j < 3; j++)
	icon[i][j] = icon[k][j];
    for (j = 0; j < 3; j++)
	icon[k][j] = s[j];	
}

function browser_name () {
    var _userAgent = navigator.userAgent, s;   
    if (_userAgent.indexOf("MSIE") != -1)        { s = "MSIE"; }
    else if(_userAgent.indexOf("Firefox") != -1) { s = "Firefox"; } 
    else if(_userAgent.indexOf("Chrome") != -1)  { s = "Chrome"; }   
    else if(_userAgent.indexOf("Safari") != -1)  { s = "Safari"; }   
    else if(_userAgent.indexOf("Opera") != -1)   { s = "Opera"; }     
    else { s = "Firefox"; }
    return s;            
}

// ---------------- event ----------------------------

function bg_addEvent() {			// bg_img Event
    if (typeof(bg_disp) == "undefined") return;  
    document.onkeydown = xKeyDown;
    document.onmousewheel = xMouseWheel;
    if (document.addEventListener)  		// only for firefox
        document.addEventListener('DOMMouseScroll', xMouseWheel, false);   
    slidetable.onmousewheel = xMouseWheel2;
    if (slidetable.addEventListener)  		// only for firefox
        slidetable.addEventListener('DOMMouseScroll', xMouseWheel2, false);   
    window.document.onmousemove = xMouseMove;
    window.document.onmousedown = xMouseDown;
    window.document.onmouseup = xMouseUp;
}

function slide_addEvent() {			// slide Event
    document.onmousewheel = yMouseWheel;
    if (document.addEventListener)  		// only for firefox
        document.addEventListener('DOMMouseScroll', yMouseWheel, false);   
    document.onkeydown = yKeyDown;
    window.document.onmousemove = yMouseMove;
    window.document.onmousedown = yMouseDown;
}

var mouse_down = false;
var mouse_down_count = 0;
var mouse_move_x0 = 0;
var mouse_move_y0 = 0;

function xMouseDown(e) { mouse_down = true; }
function xMouseUp(e)   { mouse_down = false; }
function yMouseDown(e) { mouse_down = true; }
function yMouseUp(e)   { mouse_down = false; }

function yMouseMove(e) {				// pic mouse move
//    if (!auto) return; 
    if (typeof(bg_disp) == "undefined") return;	
    if (document.all) e = event;
    bg_msg (e.clientX + "/" + e.clientY);
    cmd_in2();
}

function xMouseMove(e) {				// icon2 mouse move & drag
    if (typeof(bg_disp) == "undefined") return;
    if (document.all) e = event;
    bg_msg (e.clientX + "/" + e.clientY);
    if (myTr0.style.display != 'block') cmd_in();
    if (mouse_down == true) {
	if (xheader.style.display != 'none') return;
    	bg_msg (e.clientX + "/" + e.clientY + "/" + "Drag");
    	if ((++mouse_down_count % 3) == 0) {
    	    if ((e.clientX - mouse_move_x0 + e.clientY - mouse_move_y0) > 0)
    	    	bg_next();
    	    else
    	    	bg_prev();	
    	}    
    }
    mouse_move_x0 = e.clientX;
    mouse_move_y0 = e.clientY;
}

function in_cmd_area() {
    var limit_y = Math.floor (document.body.clientHeight * 0.8);
    var y = mouse_move_y0; 
    return (y >= limit_y);
}

function xClick(e) {
    if (typeof(bg_disp) == "undefined") return;
    if (myTr0.style.display == 'block') return;
    if (document.all) e = event;
    bg_next();
}

function yClick(e) { slideNext (); }

var msec2 = (new Date()).getTime();

function xMouseWheel(e)  { xMouseWheel_step(e, true);  } // bg_img body  MouseWhell	
function xMouseWheel2(e) { xMouseWheel_step(e, false); } // bg_img slide MouseWhell	

function xMouseWheel_step(e, is_body) {	
    if (xheader.style.display == 'block') return;
    if (is_body) {
    	var msec = (new Date()).getTime();
    	if ((msec - msec2) <= 15) return;
    }
    else
    	msec2 = (new Date()).getTime();
    if (!e) e = window.event;
    if (e.wheelDelta <= 0 || e.detail > 0) 
    	bg_next(); 
    else 
    	bg_prev();   
}

function xKeyDown(e) {			// icon KeyDown
    if (!e) e = window.event; 
    switch(e.keyCode) {
    	case 73:			tr_in();	break;	// I 73, I = Index
    	case 27: case 32:		bg_main();	break;	// ESC 27, space 32,
    	case 33: case 39: case 38:	bg_next();	break;	// PgUp 33, Right 39, Up 38
    	case 34: case 37: case 40:	bg_prev();	break;	// PgDown 34, Left 37, Down 40 
    	case 35:			bg_end();	break;	// End 35
    	case 36:			bg_home();	break;	// Home 36
    	case 65:			bg_auto();	break;	// A 65, a 65, A = Auto
    	case 83:			bg_stop();	break;	// A 83, s 83, S = Stop (Auto)
    	case 66:			history.back(); break;	// B 66, b 66, B = Back
    	default:			break;
    }	
}

function bg_back() { history.back(); }

function yMouseWheel(e) {		// slide mousewheel
    if (!e) e = window.event; 
    if (e.wheelDelta <= 0 || e.detail > 0) 	// 滾輪向前
    	slide_next(); 
    else 					// 滾輪向後
    	slide_prev();
}

function yKeyDown(e) {			// pic slide KeyDown
    if (!e) e = window.event; 
    if (typeof(bg_disp) != "undefined")
	yKeyDown2(e);
    else
 	yKeyDown1(e);
}

function yKeyDown1(e) {			// pic slide KeyDown
    switch(e.keyCode) {
    	case 73: case 27: case 32:	window.close();	break;	// ESC 27, space 32, I 73, I = Index
    	case 33: case 39: case 40:  	slideNext();   	break;	// PgUp 33, Right 39, Down 40
    	case 34: case 37: case 38:	slidePrev();   	break;	// PgDown 34, Left 37, Up 38 
    	case 35:			slideEnd();    	break;	// End 35
    	case 36:			slideHome();	break;	// Home 36
    	case 65:			slide_auto();	break;	// A 65, a 65, A = Auto
    	case 83:			window.close();	break;	// S 83, s 83, S = Stop (Auto)
    	case 66:			history.back(); break;	// B 66, b 66, B = Back
    	default:			break;
    }	
}

function yKeyDown2(e) {			// bg slide KeyDown
    switch(e.keyCode) {
    	case 77:			slide_manual();	break;	// M 77, M = Manual
    	case 73:			xpage_in();	break;	// I 73, I = Index
     	case 27: case 32:		epage_in();	break;	// ESC 27, space 32
    	case 33: case 39: case 40:	slide_next();	break;	// PgUp 33, Right 39, Down 40
    	case 34: case 37: case 38:	slide_prev();	break;	// PgDown 34, Left 37, Up 38 
    	case 35:			slide_end();	break;	// End 35
    	case 36:			slide_home();	break;	// Home 36
    	case 65:			slide_start();	break;	// A 65, a 65, A = Auto
    	case 83:			slide_stop();	break;	// S 83, s 83, S = Stop (Auto)
    	case 66:			history.back(); break;	// B 66, b 66, B = Back
    	default:			break;
    }	
}

function xMouseOver (i) {
    myHelp.innerHTML = help[i];
    myHelp.style.visibility = 'visible';
}

function xMouseOut (i) {
    myHelp.style.visibility = 'hidden';
}

var icon_width; 
	
function zMouseOver (i) {
    var _img = document.getElementById("img" + i);
    _img.src = TN_fn_replace (icon[i][1]);
    icon_width = _img.style.width;
    _img.style.width = '150px';
}

function zMouseOut (i) {
    var _img = document.getElementById("img" + i);
    _img.src = icon[i][1];
    _img.style.width = icon_width;
}

function zMouseOver (i) {
    var x = mouse_move_x0;
    var diff = document.body.clientWidth - myTr0.style.width;
    var x_left = x - Math.floor(diff/2);
    var mod = i % col;
    if (mod > (col-4)) mod = col-4;
    x_left = (small_icon_width+2) * mod;
    biconimg.src = icon[i][1];
    bicon.style.display = 'block';
    bicon.style.marginLeft = x_left + 'px';
//    alert("x/cw/tr/x_left:" + x + "/" + document.body.clientWidth + "/" +
//    	myTr0.style.width + "/" + x_left);
}

function zMouseOut (i) {
    bicon.style.display = 'none';
}

function _in_cmd_area() {
    var limit_y = Math.floor (document.body.clientHeight * 0.8);
    var y = mouse_move_y0; 
    return (y >= limit_y);
}

function TN_fn_replace (s1) {				// 2006.8.24
    var s2 = new String(s1.replace(/TN_/, ""));
    var s3 = "z.jpg"; 
    var s4 = new String (s2.replace(/x.jpg/, s3));  
    return s4;
}

// ------ cookie -----------

var cookie_slide_index = "yhkuan_slide_index",
    cookie_slide_mode  = "yhkuan_slide_mode";

function slide_index_set (index) {
    var exp = new Date();
    exp.setTime (exp.getTime() + (1000*60*60));
    cookie_set (cookie_slide_index, index, exp);
}

function slide_index_get () {
    return Math.floor (cookie_get (cookie_slide_index));
}

function slide_mode_set (mode) {
    var exp = new Date();
    exp.setTime (exp.getTime() + (1000*60*60));
    cookie_set (cookie_slide_mode, mode, exp);
}

function slide_mode_get () {
    return cookie_get (cookie_slide_mode);
}

function cookie_get (s) {
    var dc = document.cookie;
    if (dc.length > 0) {
        var s2 = dc.split(";");
        for (i = 0; i < s2.length; i++)
            if (s2[i].indexOf(s) != -1) {
            	var s3 = s2[i].split("=");
            	return s3[1];
            }     
   }
   return null;
}

function _cookie_get (name) {
    var cname = name + "=";
    var dc    = document.cookie;
    if (dc.length > 0) {
        begin = dc.indexOf(cname);
        if (begin != -1) { 
            begin = begin + cname.length;
            end = dc.indexOf (";",begin);
            if (end == -1) end = dc.length;
            return dc.substring (begin, end);
        }
    }
    return null;
}
 
function cookie_set (name, value, expires) {
    if (expires == null) expires = "";
    document.cookie = name + "=" + value + ";path=/" +"; expires=" + expires.toGMTString();
}

function cookie_delete (name)
{
    document.cookie = name + "exipires=Thu, 01-Jan-70 00:00:00 GMT" + "; path=/";
}


// ------ cookie blog bg index -----------

var curr_j = 0;
var bgs = new Array();

function set_bg_auto () {	
    var j;
    if (cookie_bg_index_exist()) 
    	j = cookie_bg_index_get();
    else
       	j = Math.floor((new Date()).getTime()/(1000*60*60*24));	// every 24 hours
    curr_j = j % bgs.length;
    set_bg (bgs[curr_j]);
}

function set_bg_auto () {		// 2009.7.16, change bg every day, rollover	
    var j = Math.floor((new Date()).getTime()/(1000*60*60*24));	// every 24 hours
    curr_j = j % bgs.length;
    curr_j = 40;			// 2010.1.1 台北 101 跨年煙火
    set_bg (bgs[curr_j]);
}

function set_bg_next () {	
    curr_j = (curr_j + 1) % bgs.length;
    set_bg (bgs[curr_j]);
    cookie_bg_index_set (curr_j);
}

function set_bg_prev () {	
    curr_j = (curr_j + bgs.length - 1) % bgs.length;
    set_bg (bgs[curr_j]);
    cookie_bg_index_set (curr_j);
}

function set_bg (fn) {
    document.body.background = bg_img_update (fn);
}

// 2009.8.31
//	new Array ( "",	"/friend/2009/0605ABC/TN_ABC04x.jpg", "2009/6，ABC Beach，海外婚禮攝影，關島" )
//	"/friend/2009/0605ABC/bg_ABC04.jpg"

function bgicon_to_bgs () {
    var n = bgicon.length;
    for (var i = 0; i < n; i++) {
    	var s1 = bgicon[i][1];
    	var s2 = new String(s1.replace(/TN_/, "bg_"));
    	bgs[i] = new String(s2.replace(/x.jpg/, ".jpg"));
    }
}

var cookie_bg_i = "yhkuan_bg_index";

function cookie_bg_index_set (index) {
    var s1 = "yhkuan_bg_index";
    var exp = new Date();
    exp.setTime (exp.getTime() + (1000*60*60*24*365*100));	// keep 100 years, forever
    cookie_set (s1, index, exp);
}

function cookie_bg_index_get () {
    var s1 = "yhkuan_bg_index";
    return Math.floor (cookie_get (s1));
}

function cookie_bg_index_exist () {
    var s1 = "yhkuan_bg_index";
    return cookie_get( s1 );
}

// ------------------------------------------------------------------------------
// for reference, mousewhell 2009.2.4

