ISO.addModule('popup',function()
{
	self.addEvent(_w,'load',init);
	self.addEvent(_w,'unload',finalize);
	
	var	// vars
	current = -1,
	collection = [],
	
	container = _d.createElement('div'),
	background = null,
	popup = null,
	
	inner = null,
	title = null,
	
	loading = null,
	counter = null,
	
	btnClose = null,
	btnNext = null,
	btnPrev = null,
	
	stage = null,
	fx = null,
	fl = null,
	
	state = 0,
	isFirst = true,
	isActive = false,
	isOpen = false,
	isPlay = false,
	isLoading = false,
	isIE = self.browser.isIE;
	
	function init()
	{
		self.includeCSS('css/popup_tvcm.css');
		
		/* popup tag */
		container.innerHTML =	'<div id="popup_bg"></div>' +
								'<div id="popup"><h3 id="popup_title"></h3><div id="popup_inner"></div></div>' +
								'<div id="popup_loading"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="60" height="60" align="middle"><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="true" /><param name="movie" value="img/popup/loading.swf" /><param name="quality" value="high" /><param name="scale" value="noscale" /><param name="wmode" value="transparent" /><param name="bgcolor" value="#000000" /><embed src="img/popup/loading.swf" quality="high" bgcolor="#000000" width="60" height="60" name="loading" align="middle" wmode="transparent" scale="noscale" allowScriptAccess="always" allowFullScreen="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer_jp" /></object></div>' +
								'<p id="popup_counter" style="display:none;"></p><a href="javascript:void(0);" title="閉じる" id="popup_close"></a><a href="javascript:void(0);" title="次へ" id="popup_next"></a><a href="javascript:void(0);" title="前へ" id="popup_prev"></a>';

		container.style.cssText = 'display:none;position:absolute;left:0px;top:0px;overflow:hidden;z-index:100;';
		_d.body.appendChild(container);


		stage = $$('html')[0];

		background = $('popup_bg');
		popup = $('popup');

		inner = $('popup_inner');
		title = $('popup_title');
		
		loading = $('popup_loading');
		counter = $('popup_counter');
		
		btnClose = $('popup_close');
		btnNext = $('popup_next');
		btnPrev = $('popup_prev');
		
		
		/* move & flash */
		fx = new self.Effect(popup,40,4);
		
		/* event setting */
		btnClose.onclick = close;
		btnNext.onclick = function()
		{
			if(isOpen)
			{
				fx.move(-1300,'auto',next);	
				isOpen = false;
			}
		};
		btnPrev.onclick = function()
		{
			if(isOpen)
			{
				fx.move(self.window.offset()[0]+1300,'auto',prev);
				isOpen = false;
			}
		};
		
		self.addEvent(_w,'resize',resize);
		self.addEvent(_w,'scroll',resize);
		
		/* convert gallery tags */
		var e = $('library');
		var e2 = $$('div',e);
		
		for(var i=0,l=e2.length;i<l;i++)
		{
			var h = $$('h3',e2[i])[0];
			var a1 = $$('a',e2[i])[0];
			var a2 = $$('a',e2[i])[1];
			
			var href = a1.href;
			href = href.substring(href.lastIndexOf('flv=')+4);
			
			collection[collection.length] = 
			{
				title	:h.innerHTML,
				flv		:href
			};
			
			a1.href = a2.href = 'javascript:void(0);'
			a1.target = a2.target = '_self';
			a1.num = a2.num = i;
			
			a1.onclick = a2.onclick = open;
		}
	}
	
	function finalize()
	{
		background.onclick = null;
		
		btnClose.onclick = null;
		btnNext.onclick = null;
		btnPrev.onclick = null;
		
		container.innerHTML = '';
		container = null;
		
		self.removeEvent(_w,'resize',resize);
		self.removeEvent(_w,'scroll',resize);
	}
	
	
	// animation
	function open()
	{
		current = this.num;
		
		var param = collection[current];
		
		loading.style.display = 'block';
		
		container.style.display = 'block';
		loading.style.display = 'block';
		popup.style.cssText = 'left:-9999px;top:9999px;';
		
		title.innerHTML = param.title;
		
		state = 0;
		isActive = true;
		
		ready();
	}
	
	function next()
	{
		if(current+1 >= collection.length)
		{
			current = 0;
		}
		else
		{
			current++;
		}
		
		state = 1;
		
		title.innerHTML = collection[current].title;
		loading.style.display = 'block';
		
		ready();
	}
	
	function prev()
	{
		if(current <= 0)
		{
			current = collection.length-1;
		}
		else
		{
			current--;
		}
		
		state = -1;
		
		title.innerHTML = collection[current].title;
		loading.style.display = 'block';
		
		ready();
	}
	
	function ready()
	{
		inner.innerHTML = '';
		stage.style.overflow = 'hidden';
		loading.style.display = 'none';
		
		var o = self.window.offset();
		var s = self.window.scroll();
		
		var w = 530;
		var h = 320;
		
		while(w > o[0] - 200 || h > o[1] - 220)
		{
			w /= 2;
			h /= 2;
			
			if(w < 10 || h < 10) break;
		}
		
		offset(container,o[0],o[1]);
		position(container,s[0],s[1]);
		
		offset(popup,w,h);
		offset(inner,w,h);
		
		offset(background,o[0],o[1]);
		
		if(!isPlay)
		{
			isPlay = true;
			if(state <= -1)
			{
				position(popup,-1300,(o[1] - h)/2-50);
				fx.move((o[0] - w)/2,'auto',complete);
			}
			else if(state >= 1)
			{
				position(popup,o[0]+1300,(o[1] - h)/2-50);
				fx.move((o[0] - w)/2,'auto',complete);
			}
			else
			{
				position(popup,(o[0] - w)/2,-500);
				fx.move('auto',(o[1] - h)/2-50,complete);
			}
		}
		
		/* counter */
		counter.innerHTML = current+1+'/'+collection.length;
	}
	
	function complete()
	{
		isOpen = true;
		isPlay = false;
		
		var o = offset(inner);
		
		fl = new self.Flash('flv/flvplayer.swf',
		{
			width:o[0],
			height:o[1],
			scale:'noscale',
			bgcolor:'#000000',
			allowFullScreen:'true',
			menu:'false'
		},'flash_includes',
		{
			file:collection[current].flv
		});
		
		fl.includeSWF(inner);
		
		inner.style.display = 'none';
		inner.style.display = 'block';
		
		var o2 = self.window.offset();
		
		if(isFirst)
		{
			if(collection.length > 1)
			{
				position(btnNext,o2[0],o2[1]/2);
				btnNext.className = 'next';
				
				(new self.Effect(btnNext,40,4)).move(o2[0]-100,'auto',function()
				{
					btnNext.style.cssText = '';
				});
				
				position(btnPrev,-100,o2[1]/2);
				btnPrev.className = 'prev';
				
				(new self.Effect(btnPrev,40,4)).move(0,'auto',function()
				{
					btnPrev.style.cssText = '';
				});
			}
			
			position(btnClose,o2[0]/2,o2[1]+160);
			btnClose.className = 'close';
			
			(new self.Effect(btnClose,40,4)).move('auto',o2[1]-70,function()
			{
				btnClose.style.cssText = '';
			});
			
			counter.style.display = 'block';
			
			isFirst = false;
		}
		
		while(o[0] > o2[0] - 200 || o[1] > o2[1] - 170)
		{
			o[0] /= 2;
			o[1] /= 2;
			
			if(o[0] < 10 || o[1] < 10) break;
		}
		
		position(popup,(o2[0] - o[0])/2, (o2[1] - o[1])/2-50);
		offset(inner,o[0],o[1]);
			
		var f = (isIE)? $$('object',inner)[0] : $$('embed',inner)[0];
		f.setAttribute('width',o[0]);
		f.setAttribute('height',o[1]);
	}
	
	function close()
	{
		if(isOpen)
		{
			stage.style.overflow = 'auto';
			container.style.display = 'none';
			inner.innerHTML = '';
			
			isOpen = false;
			isActive = false;
		}
	}
	
	function resize()
	{
		if(isActive)
		{
			var o = self.window.offset();
			var s = self.window.scroll();
			var w = 530;
			var h = 320;
			
			while(w > o[0] - 200 || h > o[1] - 220)
			{
				w /= 2;
				h /= 2;
				
				if(w < 10 || h < 10) break;
			}
			
			offset(container,o[0],o[1]);
			position(container,s[0],s[1]);
			
			offset(background,o[0],o[1]);
			
			offset(popup,w,h);
			offset(inner,w,h);
			
			if(isOpen)
			{
				position(popup,(o[0] - w)/2, (o[1] - h)/2-50);
			
				var f = (isIE)? $$('object',inner)[0] : $$('embed',inner)[0];
				f.setAttribute('width',w);
				f.setAttribute('height',h);
			}
		}
	}
	
	
	/* util */
	function offset(e,w,h)
	{
		if(w || h)
		{
			if(w == 'auto')
			{
				e.style.width = 'auto';
			}
			else if(w != 'default')
			{
				e.style.width = w + 'px';
			}
			
			if(h == 'auto')
			{
				e.style.height = 'auto';
			}
			else if(h != 'default')
			{
				e.style.height = h + 'px';
			}
		}
		else
		{
			return [parseInt(e.style.width),parseInt(e.style.height)];
		}
	}
	
	
	function position(e,x,y)
	{
		if(x || y)
		{
			if(x == 'auto')
			{
				e.style.left = 'auto';
			}
			else if(x != 'default')
			{
				e.style.left = x + 'px';
			}
			
			if(y == 'auto')
			{
				e.style.top = 'auto';
			}
			else if(y != 'default')
			{
				e.style.top = y + 'px';
			}
		}
		else
		{
			return [parseInt(e.style.left),parseInt(e.style.top)];
		}
	}
});

