/**************
album.js
(c) WATARU, 2006
http://wi-wi.jp/
**************/
var SHADOW_SUM=4;
var SHADOW_SRC='images/shadow.gif';
var SPACER_SRC='images/spacer.gif';
var CIRCLE_SRC='images/target.gif';
var THUMBNAIL_SRC='images/thumbnail.gif';
var swapimg={
	 'play':['play.gif','play_.gif','_play.gif']
	,'stop':['stop.gif','stop_.gif','_stop.gif']
	,'previous':['previous.gif','previous_.gif','_previous.gif']
	,'next':['next.gif','next_.gif','_next.gif']
	,'page_prev':['page_prev.gif','page_prev_.gif','_page_prev.gif']
	,'page_next':['page_next.gif','page_next_.gif','_page_next.gif']
	};

var album='';
var title='';
var pages=1;
var page=1;

var view;
var view_title;
var view_place;
var shadow=new Array(SHADOW_SUM);
var circle;
var btn=new Array();
var tnimgs;//=new Array();
var tnimgsinfo = new Array();

var selected={elm:null,id:-1,img:document.createElement('IMG')};
var onPlay=false;
var onView=false;

var ani={
	init:false
	,shadowmove:-1
	,enlarge:-1
	,closetitle:-1
	,close:-1
	,pvclose:-1
	,pvopen:-1
	,btnshow:-1
	,showmap:-1
};
var output;
var prs;

var gmap,icon,micon,mpoly;

var ads=[
'<a href="http://px.a8.net/svt/ejp?a8mat=ZX1MO+LFMK2+5WS+BYLJL" target="_blank"><img border="0" width="224" height="33" alt="" src="http://www21.a8.net/svt/bgt?aid=060328320036&wid=001&eno=01&mid=s00000000766002009000&mc=1"></a><img border="0" width="1" height="1" src="http://www18.a8.net/0.gif?a8mat=ZX1MO+LFMK2+5WS+BYLJL" alt="">'/*楽天市場*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZYP6Z+FG2VSI+0K+ZRXQP" target="_blank"><img border="0" width="224" height="33" alt="" src="http://www28.a8.net/svt/bgt?aid=060405515934&wid=001&eno=01&mid=s00000000002006009000&mc=1"></a><img border="0" width="1" height="1" src="http://www18.a8.net/0.gif?a8mat=ZYP6Z+FG2VSI+0K+ZRXQP" alt="">'/*A8net*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZX1MO+2SMA0I+9PG+656YP" target="_blank"><img border="0" width="224" height="33" alt="" src="http://www20.a8.net/svt/bgt?aid=060328320169&wid=001&eno=01&mid=s00000001258001032000&mc=1"></a><img border="0" width="1" height="1" src="http://www16.a8.net/0.gif?a8mat=ZX1MO+2SMA0I+9PG+656YP" alt="">'/*楽天トラベル*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZX1MO+2SMA0I+9PG+631SX" target="_blank"><img border="0" width="224" height="33" alt="" src="http://www20.a8.net/svt/bgt?aid=060328320169&wid=001&eno=01&mid=s00000001258001022000&mc=1"></a><img border="0" width="1" height="1" src="http://www19.a8.net/0.gif?a8mat=ZX1MO+2SMA0I+9PG+631SX" alt="">'/*楽天トラベル*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZX1MO+2IHWQA+SAW+5YZ75" target="_blank"><img border="0" width="234" height="60" alt="" src="http://www22.a8.net/svt/bgt?aid=060328320152&wid=001&eno=01&mid=s00000003668001003000&mc=1"></a><img border="0" width="1" height="1" src="http://www15.a8.net/0.gif?a8mat=ZX1MO+2IHWQA+SAW+5YZ75" alt="">'/*北海道JRトラベル*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZX1MO+21TRSI+UA0+614CX" target="_blank"><img border="0" width="234" height="60" alt="" src="http://www24.a8.net/svt/bgt?aid=060328320124&wid=001&eno=01&mid=s00000003924001013000&mc=1"></a><img border="0" width="1" height="1" src="http://www12.a8.net/0.gif?a8mat=ZX1MO+21TRSI+UA0+614CX" alt="">'/*淡路インターナショナルザサンプラザ*/
,'<a href="http://px.a8.net/svt/ejp?a8mat=ZYP6Z+F5YIIA+IZC+5YZ75" target="_blank"><img border="0" width="234" height="60" alt="" src="http://www29.a8.net/svt/bgt?aid=060405515917&wid=001&eno=01&mid=s00000002460001003000&mc=1"></a><img border="0" width="1" height="1" src="http://www10.a8.net/0.gif?a8mat=ZYP6Z+F5YIIA+IZC+5YZ75" alt="">'/*京都きもの市場*/
];
function init(){
	if(!document.getElementById || !document.getElementsByTagName || !document.getElementById('thumbnails').innerHTML)
		return;
	Mload();
	Motel.load('motel.xml');
	output=EI('output');
	if(album.substring(album.length-1,1)!='/'){album+='/';}
	if(location.search.length>0){
		page=(location.search.substring(0,1)=='?')?location.search.substring(1,location.search.length):location.search;
	}
	output.innerHTML='initializing and loading page:'+page;
	var tbl=EI('thumbnails');
	var tbody=tbl.getElementsByTagName('TBODY')[0];
	var tds=tbody.getElementsByTagName('TD');
	tnimgs=new Array(tds.length);
	for(var i=0;i<tds.length;i++){
		if(tds[i].nodeType!=1)continue;
		tnimgs[i]=tds[i].getElementsByTagName('IMG')[0];
	}
	//tnimgsinfo.length=tnimgs.length;
	
	btn.push(EI('btn_page_prev'));
	btn.push(EI('btn_page_next'));
	btn.push(EI('btn_play'));
	btn.push(EI('btn_stop'));
	btn.push(EI('btn_previous'));
	btn.push(EI('btn_next'));
	
	var div=EI('album');
	for(var i=SHADOW_SUM-1;i>=0;i--){
		shadow[i]=new OBS_IMAGE({top:140,left:680,width:64,height:48},SHADOW_SRC);
		div.appendChild(shadow[i]);
	}
	circle=new OBS_IMAGE({display:'none'},CIRCLE_SRC);
	var doc=(!!document.body)?document.body:document.documentElement;
	doc.appendChild(circle);
	
	view=EI('view');
	view_title=EI('view_title');
	view_place=EI('view_place');
	view_place.onclick=Mshow;

	setTimeout('MovePage()',500);
}//f
function PagesUpdate(){
	var pgs=EI('pages');
	while(pgs.firstChild){pgs.removeChild(pgs.firstChild);}
	var lbl=CE('SPAN');
	lbl.style.fontSize='small';
	lbl.appendChild(CT('PAGES: '));
	pgs.appendChild(lbl);
	for(var i=1;i<=pages;i++){
		var spn=CE('A');
		spn.appendChild(CT(' '+i+' '));
		spn.href='javascript:Page('+i+');';
		if(page==i)spn.style.backgroundColor='#ECC2CB';
		pgs.appendChild(spn);
	}
}//f
function Page(o){
if(o==='+1'){if(++page>pages)page=1;
}else if(o==='-1'){if(--page<1)page=pages;
}else{if(o>pages)o=pages;if(o<1)o=1;page=o;
}
Motel.start(ani['pvclose']);
}//f
function MovePage(){
PagesUpdate();
output.innerHTML='loading ... ';
loadAjax(album+'page'+page+'.xml',LoadXML);
}//f
function LoadXML(aj){
var xml=aj.responseXML;
var nodes;
	if(!!Motel && !ani['init']){
	var map=EI('gmap');
	var ad=EI('ads');
	ani['shadowmove']=Motel.set('shadowmove', shadow);
	ani['enlarge']=Motel.set('enlarge',shadow.concat([view,view,view_title,view_place]));
	ani['closetitle']=Motel.set('closetitle', [view_title,view_place,map,ad]);
	ani['close']=Motel.set('close', [view,view,view]);
	ani['pvclose']=Motel.set('pvclose',tnimgs);
	ani['pvopen']=Motel.set('pvopen',tnimgs);
	ani['btnshow']=Motel.set('btnshow',btn);
	ani['showmap']=Motel.set('showmap',[view,view,map,ad]);
	Motel.start(ani['closetitle']);
	ani['init']=true;
	}
	if(!xml){
		output.innerHTML='loading images ... failed';
		nodes=[];
	}else{
		nodes=xml.getElementsByTagName('item');
		output.innerHTML='loading images ... rest:'+nodes.length+'/'+tnimgs.length;
		var ttl=EI('title');
		title=xml.getElementsByTagName('album')[0].firstChild.nodeValue;
		ttl.replaceChild(CT(title),ttl.firstChild);
	}
	for(var i=0;i<tnimgs.length;i++){
		var node=nodes[i];
		if(!node){
			tnimgs[i].src=THUMBNAIL_SRC;
			tnimgs[i].onload=pvloaded;
			tnimgsinfo[i]=new OBS_IMAGE_INFO();
		}else{
			var img=node.getElementsByTagName('imgsrc')[0];
			var ttl=node.getElementsByTagName('title')[0].firstChild.nodeValue;
			tnimgsinfo[i]=new OBS_IMAGE_INFO(tnimgs[i],
					{src:album+img.firstChild.nodeValue
					,title:ttl
					,place:node.getElementsByTagName('place')[0].firstChild.nodeValue
				});
			tnimgs[i].title=ttl;
			tnimgs[i].alt=ttl;
			tnimgs[i].onload=pvloaded;
			tnimgs[i].src=album+img.getAttribute('src');
		}
	}
}//f
function pvloaded(){
	var flg=true;
	var rest=tnimgs.length;
	this.onload=null;
	for(var i=0;i<tnimgs.length;i++){
		if(this==tnimgs[i])
			this.onload=null;
			tnimgsinfo[i].pvloaded=true;
	}
	for(var i=0;i<tnimgsinfo.length;i++){
		if(!tnimgsinfo[i].pvloaded){
			flg=false;
		}else{
			rest--;
		}
	}
	output.innerHTML='<br>loading images ... rest:'+rest+'/'+tnimgs.length;
	if(flg){
		Motel.start(ani['pvopen']);
	}
}//f
function btnshow(){
	if(ani['btnshow']<0){
		ani['btnshow']=Motel.start('btnshow',btn);
	}else{
		Motel.start(ani['btnshow']);
	}
}//f
function preload(){
	var r=parseInt(Math.random()*ads.length);
	output.innerHTML=ads[r];
	for(var i=0;i<tnimgsinfo.length;i++){
		tnimgsinfo[i].startLoad();
	}
}
function swap(el,id,o){
	el.src='images/'+swapimg[id][o];
}//f
function Play(){onPlay=true;Next();}
function Stop(){onPlay=false;}
function Previous(){if(selected.id<1){Select(tnimgs.length-1);}else{Select(selected.id-1);}}
function Next(){if(selected.id==-1){Select(0);}else if(selected.id>=(tnimgs.length-1)){Select(0);}else{Select(selected.id+1);}}
function Select(id){
	if(selected.elm)selected.elm.style.borderColor='white';
	if(onView){
		selected.id=id-1;
		ani_close();
		return;
	}
	onView=true;
	selected.elm=EI('img'+id);
	selected.id=id;
	selected.img.src=tnimgsinfo[id].img.src;
	selected.elm.style.borderColor='red';
	Motel.start(ani['shadowmove']);
}//f
function ani_2(){
	for(var i=0;i<SHADOW_SUM;i++){
		shadow[i].src=selected.img.src;
	}
	//view.src=selected.img.src;
	view.src=tnimgsinfo[selected.id].src;
	view_title.replaceChild(CT(tnimgsinfo[selected.id].title),view_title.firstChild);
	view_place.replaceChild(CT(tnimgsinfo[selected.id].place),view_place.firstChild);
	Motel.start(ani['enlarge']);
}//f
function ani_3(){
	if(onPlay)setTimeout("ani_close();",2000);
}//f
function ani_close(){
	onView=false;
	Motel.start(ani['closetitle']);
	Motel.start(ani['close']);
}//f
function Mload() {
	if (GBrowserIsCompatible()) {
		gmap = new GMap2(document.getElementById("gmap"));
		icon = new GIcon();
		icon.image = "http://walk.wi-wi.jp/images/camera.gif";
		icon.iconSize = new GSize(25, 18);
		icon.iconAnchor = new GPoint(6, 10);
		gmap.addControl(new GSmallMapControl());
		gmap.setCenter(new GLatLng(34.99669, 135.68645), 16);
	}
}
function Mshow(){
	if (GBrowserIsCompatible()) {
		if(!!micon)gmap.removeOverlay(micon);
		if(!!mpoly)gmap.removeOverlay(mpoly);
		micon=mpoly=null;
		var p=tnimgsinfo[selected.id].pos;
		var point = new GLatLng(p[0], p[1]);
		gmap.setCenter(point, 16);
		micon=new GMarker(point, icon);
		gmap.addOverlay(micon);
		if(!!p[2]){
			if(document.all && !window.opera){
			try{mpoly = new GPolyline.fromEncoded(
				{color: "#0000FF",weight: 4,points: p[2],levels: "BBB",zoomFactor: 32,numLevels: 4}
			);
			if(!!mpoly) gmap.addOverlay(mpoly);
			}catch(e){}
			}else{
				mpoly = new GPolyline.fromEncoded(
					{color: "#0000FF",weight: 4,points: p[2],levels: "BBB",zoomFactor: 32,numLevels: 4}
				);
				if(!!mpoly) gmap.addOverlay(mpoly);
			}
		}
	}
	Motel.start(ani['showmap']);
}//f
function Pos(el){
var pos={x:0,y:0,w:0,h:0};
var doc;
	if(el.getBoundingClientRect){
		if(!!document.body){
			doc=document.body;
		}else if(!!document.documentElement){
			doc=document.documentElement;
		}else{
			doc={scrollTop:0,scrollLeft:0};
		}
		var rect=el.getBoundingClientRect();
		var top=rect.top+doc.scrollTop;
		var left=rect.left+doc.scrollLeft;
		var width=rect.right-rect.left;
		var height=rect.bottom-rect.top;
		pos={x:left,y:top,w:width,h:height};
	}else if(document.getBoxObjectFor){
		var rect=document.getBoxObjectFor(el);
		var top=rect.y;//-parseInt(GetStyle(el, "borderTopWidth"));
		var left=rect.x;//-parseInt(GetStyle(el, "borderLeftWidth"));
		var width=rect.width;
		var height=rect.height;
		pos={x:left,y:top,w:width,h:height};
	}else{
		pos.w=el.clientWidth;
		pos.h=el.clientHeight;
		while (el) {
			pos.x += parseInt(el.offsetLeft);
			pos.y += parseInt(el.offsetTop);
			el = el.offsetParent;
		}
		pos.x-=document.body.offsetLeft; // -1* html margin-left
		pos.y-=document.body.offsetTop; // -1* html margin-top
		if (UA.mac){
			pos.x+=document.body.offsetLeft;
			pos.y+=document.body.offsetTop;
		}
	}
	return pos;
}//f
function EI(a){return document.getElementById(a);}
function ET(a){return document.getElementsByTagName(a);}
function EN(a){return document.getElementsByName(a);}
function CE(a){return document.createElement(a);}
function CT(a){return document.createTextNode(a);}
function OBS_IMAGE(style,src){
	var img=CE('IMG');
	var st=img.style;
	st.position='absolute';
	st.borderTopWidth=st.borderLeftWidth=st.borderRightWidth=st.borderBottomWidth='0px';
	st.marginTop=st.marginLeft=st.marginRight=st.marginBottom='0px';
	st.paddingTop=st.paddingLeft=st.paddingRight=st.paddingBottom='0px';
	for(var i in style){
		img.style[i]=(isNaN(style[i]))?style[i]:style[i]+'px';
	}
	if(!!src)img.src=src;
	return img;
}//f
function OBS_IMAGE_INFO(pv,opt){
	this.title='';
	this.place='';
	this.pos=[-1,-1,''];
	this.pv=pv;
	this.src='';
	this.img=document.createElement('IMG');
	this.pvloaded=false;
	this.startLoad=function(){
		if(!!this.src)this.img.src=this.src;
	};
	if(!!opt){
		if(!!opt.src)this.src=opt.src;
		if(!!opt.title)this.title=opt.title;
		if(!!opt.place){
			var pl=opt.place;
			var len=pl.length;
			var p=pl.lastIndexOf(' ',len);
			this.place=pl.substring(0, p);
			pl=pl.substring(p+1, len);
			this.pos=pl.split(',');
			if(this.pos[0]!=null && this.pos[0]!=undefined){this.pos[0]=parseFloat(this.pos[0]);}else{this.pos[0]=35.0117384;}
			if(this.pos[1]!=null && this.pos[1]!=undefined){this.pos[1]=parseFloat(this.pos[1]);}else{this.pos[1]=135.6772255;}
			if(this.pos[2]==null || this.pos[2]==undefined){this.pos[2]='';}
		}
//		this.img.onload=function(){Loaded(this.img);};
		this.img.onload=function(){Loaded(pv);};
	}
	function Loaded(im){
		if(!im)return;
		Motel.start('pvloaded',im);
	}
}//f
window.onload=init;
