/**************************************************************

	Script		: MultiBox
	Version		: 1.3.1
	Authors		: Samuel Birch
	Desc		: Supports jpg, gif, png, flash, flv, mov, wmv, mp3, html, iframe
	Licence		: Open Source MIT Licence

**************************************************************/

var MultiBox = new Class({

	getOptions: function(){
		return {
			initialWidth: 250,
			initialHeight: 250,
			container: document.body,
			useOverlay: false,
			contentColor: '#FFF',
			waitDuration: 2000,
			movieWidth: 400,
			movieHeight: 300,
			offset: {x:0, y:0},
			fixedTop: false,
			path: 'mb_files/',
			onOpen: null,
			onClose: null,
			openFromLink: true,
			useTemplate: true,
			transparent: false,
			flashParams: {}
		};
	},

	initialize: function(className, options){
		this.setOptions(this.getOptions(), options);

		if ($type(this.options.onOpen) != 'function') this.options.onOpen = $empty;
		if ($type(this.options.onClose) != 'function') this.options.onClose = $empty;

		this.openClosePos = {};
		this.timer = 0;
		this.contentToLoad = {};
		this.index = 0;
		this.opened = false;
		this.contentObj = {};
		this.containerDefaults = {};
		this.useOverlayDefault = this.options.useOverlay;
		this.useTemplateDefault = this.options.useTemplate;


		if(this.options.useOverlay){
			this.overlay = new Overlay($merge(this.options, {'container': this.options.container, 'onClick':this.close.bind(this)}));
		}

		this.content = $$('.'+className);
		this.container = new Element('div').addClass('MultiBoxContainer').inject(this.options.container);
		this.iframe = new Element('iframe').setProperties({
			'id': 'multiBoxIframe',
			'name': 'mulitBoxIframe',
			'src': '/ri/blank.jsp',
			'frameborder': 1,
			'scrolling': 'no'
		}).setStyles({
			'border': 0,
			'position': 'absolute',
			'top': -20,
			'left': -20,
			'width': '100%',
			'height': '100%',
			'filter': 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)',
			'opacity': 0
		}).injectInside(this.container);
		this.box = new Element('div').addClass('MultiBoxContent').inject(this.container);

		if(this.options.transparent){
			this.container.setStyle('backgroundColor', 'transparent');
			this.box.setStyle('backgroundColor', 'transparent');
		}

		if(this.options.useTemplate){
			this.closeButton = new Element('div').addClass('MultiBoxClose').injectInside(this.container).addEvent('click', this.close.bind(this));
			this.headerContainer = new Element('div').addClass('MultiBoxHeaderContainer').inject(this.container, 'top');
			this.header = new Element('div').addClass('MultiBoxHeader').inject(this.headerContainer);
			this.footerContainer = new Element('div').addClass('MultiBoxFooterContainer').inject(this.container, 'bottom');
			this.footer = new Element('div').addClass('MultiBoxFooter').inject(this.footerContainer);
		}

		this.content.each(function(el,i){
			el.index = i;
			el.addEvent('click', function(e){
				new Event(e).stop();
				this.open(el);
			}.bind(this));
			if(el.href.indexOf('#') > -1){
				el.content = $(el.href.substr(el.href.indexOf('#')+1));
				if(el.content){el.content.setStyle('display','none');}
			}
		}, this);

		this.containerEffects = new Fx.Morph(this.container, {duration: 400});
		this.reset();
	},

	setContentType: function(link){
		var str = link.href.substr(link.href.lastIndexOf('.')+1).toLowerCase();

		if(this.contentOptions.type != undefined) str = this.contentOptions.type;

		this.contentObj = {
			'url': link.href,
			'xH': 0,
			'width': (this.contentOptions.width) ? this.contentOptions.width : this.options.movieWidth,
			'height': (this.contentOptions.height) ? this.contentOptions.height : this.options.movieHeight
		};
		this.panelPosition = (this.contentOptions.panel) ? this.contentOptions.panel : this.options.panel;

		switch(str){
			case 'jpg':
			case 'gif':
			case 'png':
				this.type = 'image';
				break;
			case 'swf':
				this.type = 'flash';
				break;
			case 'flv':
				this.type = 'flashVideo';
				this.contentObj.xH = 70;
				break;
			case 'mov':
				this.type = 'quicktime';
				break;
			case 'wmv':
				this.type = 'windowsMedia';
				break;
			case 'rv':
			case 'rm':
			case 'rmvb':
				this.type = 'real';
				break;
			case 'mp3':
				this.type = 'flashMp3';
				this.contentObj.width = 320;
				this.contentObj.height = 70;
				break;
			case 'element':
				this.type = 'htmlelement';
				this.elementContent = link.content;
				this.elementContent.setStyles({
					display: 'block',
					opacity: 0
				})
				this.contentObj.height = this.elementContent.getSize().y;
				this.elementContent.setStyles({
					display: 'none',
					opacity: 1
				})
				break;
			default:
				this.type = 'iframe';
				if(this.contentOptions.ajax) this.type = 'ajax';
				break;
		}
	},

	reset: function(){
		this.container.setStyles({
			'opacity': 0,
			'display': 'none'
		});
		this.removeContent();
		this.opened = false;
	},

	getOpenClosePos: function(el){
		if (this.options.openFromLink) {
			if (el.getFirst()) {
				var w = el.getFirst().getCoordinates().width - (this.container.getStyle('border').toInt() * 2);
				if (w < 0) w = 0;

				var h = el.getFirst().getCoordinates().height - (this.container.getStyle('border').toInt() * 2);
				if (h < 0) h = 0;

				this.openClosePos = {
					'width': w,
					'height': h,
					'top': el.getFirst().getCoordinates().top,
					'left': el.getFirst().getCoordinates().left
				};
			}
			else {
				var w = el.getCoordinates().width - (this.container.getStyle('border').toInt() * 2);
				if (w < 0) w = 0;

				var h = el.getCoordinates().height - (this.container.getStyle('border').toInt() * 2);
				if (h < 0) h = 0;

				this.openClosePos = {
					'width': w,
					'height': h,
					'top': el.getCoordinates().top,
					'left': el.getCoordinates().left
				};
			}
		}else{
			var top = (this.options.fixedTop) ? this.options.fixedTop : ((window.getHeight()/2)-(this.options.initialHeight/2)-this.container.getStyle('border').toInt())+this.options.offset.y;

			this.openClosePos = {
				'width': this.options.initialWidth,
				'height': this.options.initialHeight,
				'top': top,
				'left': ((window.getWidth()/2)-(this.options.initialWidth/2)-this.container.getStyle('border').toInt())+this.options.offset.x
			};
		}
		return this.openClosePos;
	},

	open: function(el){
		this.options.onOpen();
		this.index = this.content.indexOf(el);
		this.openId = el.getProperty('id');
		this.contentOptions = {};

		if($chk(el.rel)){
			var optArr = el.rel.split('::');
			optArr.each(function(el){
				var ta = el.split(':');
				this.contentOptions[ta[0]] = ta[1];
			}.bind(this));
		}else{
			var html = el.get('html').replace(/\n/g, "");
			var reDATA = /^.*<\!--(\{.*\})-->.*$/;
			if(reDATA.test(html)){
				var DATA = html.replace(reDATA, "$1");
				this.contentOptions = eval("(" + DATA + ")");
			}
		}

		if(this.contentOptions.transparent){
			this.container.setStyle('backgroundColor', 'transparent');
			this.box.setStyle('backgroundColor', 'transparent');
		}else{
			this.container.setStyle('backgroundColor', '');
			this.box.setStyle('backgroundColor', '');
		}

		if(this.contentOptions.useOverlay != undefined){
			if(this.contentOptions.useOverlay == 'true' && this.useOverlayDefault) {
				this.options.useOverlay = true;
				if(this.overlay && !this.overlay.opened) this.overlay.show();
			}else{
				this.options.useOverlay = false;
				if(this.overlay && this.overlay.opened) this.overlay.hide();
			}
		}else{
			this.options.useOverlay = this.useOverlayDefault;
			if(this.overlay && !this.overlay.opened) this.overlay.show();
		}

		if(this.contentOptions.useTemplate != undefined){
			if(this.contentOptions.useTemplate == 'true' && this.useTemplateDefault) {
				this.closeButton.setStyle('display', '');
				this.headerContainer.setStyle('display', '');
				this.footerContainer.setStyle('display', '');
			}else if(this.useTemplateDefault){
				this.closeButton.setStyle('display', 'none');
				this.headerContainer.setStyle('display', 'none');
				this.footerContainer.setStyle('display', 'none');
			}
		}
		else if(this.contentOptions.useTemplate == undefined || this.useTemplateDefault && (!this.closeButton || !this.headerContainer || !this.footerContainer) )
		{
				this.closeButton.setStyle('display', '');
				this.headerContainer.setStyle('display', '');
				this.footerContainer.setStyle('display', '');
		}

		if(this.contentOptions.flashParams != undefined){
			this.options.flashParams = this.contentOptions.flashParams;
		}else{
			this.options.flashParams = this.getOptions().flashParams;
		}

		if(this.contentOptions.offset != undefined){
			this.options.offset = this.contentOptions.offset;
		}else{
			this.options.offset = this.getOptions().offset;
		}

		if(!this.opened){
			this.opened = true;

			if(this.options.useOverlay) this.overlay.show();

			this.container.setStyles(this.getOpenClosePos(el));
			this.container.setStyles({
				'opacity': 0,
				'display': 'block'
			});
/*			if(Browser.Platform.mac && Browser.Engine.gecko18){
				this.container.setStyle('position','fixed');
			}*/

			if(this.options.useOverlay) this.overlay.show();

			var top = (this.options.fixedTop) ? this.options.fixedTop : ((window.getHeight()/2)-(this.options.initialHeight/2)-this.container.getStyle('border').toInt())+this.options.offset.y;

			this.containerEffects.start({
				'width': this.options.initialWidth,
				'height': this.options.initialHeight,
				'top': top,
				'left': ((window.getWidth()/2)-(this.options.initialWidth/2)-this.container.getStyle('border').toInt())+this.options.offset.x,
				'opacity': [0, 1]
			});

			this.load(this.index);
		}else{
			this.box.addClass('MultiBoxLoading');
			this.getOpenClosePos(this.content[this.index]);
			this.timer = this.load.pass(this.index, this).delay(1100);
		}
	},

	getContent: function(index){
		this.setContentType(this.content[index]);
		this.contentToLoad = {
			'title': this.content[index].title || '&nbsp;'
		};
	},

	close: function(){
		if(this.options.useOverlay){
			this.overlay.hide();
		}

		if($("overlayswf") && $("MultiBoxMediaObject")) $("MultiBoxMediaObject").setStyle('display', 'none');
		else this.hideContent();
		this.containerEffects.cancel();
		this.zoomOut.bind(this).delay(500);
		this.options.onClose();
	},

	zoomOut: function(){
		this.containerEffects.start({
			'width': this.openClosePos.width,
			'height': this.openClosePos.height,
			'top': this.openClosePos.top,
			'left': this.openClosePos.left,
			'opacity': 0
		});
		this.reset.bind(this).delay(500);
	},

	load: function(index){
		this.getContent(index);
		if(this.type == 'image'){
			var xH = this.contentObj.xH;
			this.contentObj = new Asset.image(this.content[index].href, {onload: this.resize.bind(this)});
			this.contentObj.xH = xH;
			/*this.contentObj = new Image();
			this.contentObj.onload = this.resize.bind(this);
			this.contentObj.src = this.content[index].href;*/
		}else{
			this.resize();
		}
	},

	resize: function(){
		var top = (this.options.fixedTop) ? this.options.fixedTop : ((window.getHeight() / 2) - ((Number(this.contentObj.height) + this.contentObj.xH) / 2) - this.container.getStyle('border').toInt() + window.getScrollTop()) + this.options.offset.y;
		var left = ((window.getWidth() / 2) - (this.contentObj.width / 2) - this.container.getStyle('border').toInt()) + this.options.offset.x;

		if (top < 0) top = 0;
		if (left < 0) left = 0;

		this.containerEffects.cancel();
		this.containerEffects.start({
			'width': this.contentObj.width,
			'height': Number(this.contentObj.height) + this.contentObj.xH,
			'top': top,
			'left': left,
			'opacity': 1
		});
		this.timer = this.showContent.bind(this).delay(500);
	},

	showContent: function(){
		this.box.addClass('MultiBoxLoading');
		this.contentContainer = new Element('div').setProperties({id: 'MultiBoxContentContainer'}).setStyles({opacity: 0, width: this.contentObj.width+'px', height: (Number(this.contentObj.height)+this.contentObj.xH)+'px'}).inject(this.box);

		if(this.type == 'image'){
			this.box.removeClass('MultiBoxLoading');
			this.contentObj.inject(this.contentContainer);
		}else if(this.type == 'iframe'){
			this.box.removeClass('MultiBoxLoading');
			new Element('iframe').setProperties({
				'id': 'iFrame'+new Date().getTime(),
				'width': this.contentObj.width,
				'height': this.contentObj.height,
				'src': this.contentObj.url,
				'frameborder': 0,
				'scrolling': 'auto'
			}).inject(this.contentContainer);
		}else if(this.type == 'htmlelement'){
			this.box.removeClass('MultiBoxLoading');
			this.elementContent.clone().setStyle('display','block').inject(this.contentContainer);
		}else if(this.type == 'ajax'){
			new Request({
				'method': 'get',
				'url': this.contentObj.url,
				'data': { 'do' : '1' },
				'onComplete': function(data) {
					$('MultiBoxContentContainer').set('html', data);
					this.box.removeClass('MultiBoxLoading');
				}.bind(this)
			}).send();
		}else{
			this.box.removeClass('MultiBoxLoading');
			var obj = this.createEmbedObject().inject(this.contentContainer);
			if(this.str != '' && $('MultiBoxMediaObject')) $('MultiBoxMediaObject').set('html', this.str);
		}

		this.contentEffects = new Fx.Morph(this.contentContainer, {duration: 500});
		this.contentEffects.start({
			'opacity': 1
		});

		if(this.header) this.header.set('html', this.contentToLoad.title);
		if(this.footer) this.footer.set('html', '&nbsp;');
	},

	hideContent: function(){
		this.contentEffects.start({
			'opacity': 0
		});
		this.removeContent.bind(this).delay(500);
	},

	removeContent: function(){
		if($('MultiBoxMediaObject')){
			$('MultiBoxMediaObject').destroy();
		}
		if($('MultiBoxContentContainer')){
			$('MultiBoxContentContainer').destroy();
		}
	},

	createEmbedObject: function(){
		if(this.type == 'flash'){
			var url = this.contentObj.url;

			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object id="overlayswf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" '
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+this.contentObj.height+'">';
			this.str += '<param name="movie" value="'+url+'" />'
			this.str += '<param name="quality" value="high" />';
			for(var params in this.options.flashParams){
				var name = params;
				var value = this.options.flashParams[params];
				this.str += '<param name="' + name + '" value="' + value + '" />';
			}
			this.str += '<embed src="'+url+'" ';
			this.str += 'quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" ';
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+this.contentObj.height+'" ';
			for(var params in this.options.flashParams){
				var name = params;
				var value = this.options.flashParams[params];
				//Hack for FF2 on a Mac
				this.str += name + '="' + value+'" ';
			};
			this.str += '></embed></object>';

		}

		if(this.type == 'flashVideo'){
			//var url = this.contentObj.url.substring(0, this.contentObj.url.lastIndexOf('.'));
			var url = this.contentObj.url;


			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" '
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+(Number(this.contentObj.height)+this.contentObj.xH)+'">';
			this.str += '<param name="movie" value="'+this.options.path+'flvplayer.swf" />'
			this.str += '<param name="quality" value="high" />';
			this.str += '<param name="salign" value="TL" />';
			this.str += '<param name="scale" value="noScale" />';
			this.str += '<param name="FlashVars" value="path='+url+'" />';
			this.str += '<embed src="'+this.options.path+'flvplayer.swf" ';
			this.str += 'quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" ';
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+(Number(this.contentObj.height)+this.contentObj.xH)+'"';
			this.str += 'salign="TL" ';
			this.str += 'scale="noScale" ';
			this.str += 'FlashVars="path='+url+'"';
			this.str += '></embed>';
			this.str += '</object>';

		}

		if(this.type == 'flashMp3'){
			var url = this.contentObj.url;

			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" '
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+this.contentObj.height+'">';
			this.str += '<param name="movie" value="'+this.options.path+'mp3player.swf" />'
			if(this.options.wmode && this.options.wmode != '') this.str += '<param name="wmode" value="' + this.options.wmode + '" />';
			this.str += '<param name="quality" value="high" />';
			this.str += '<param name="salign" value="TL" />';
			this.str += '<param name="scale" value="noScale" />';
			this.str += '<param name="FlashVars" value="path='+url+'" />';
			this.str += '<embed src="'+this.options.path+'mp3player.swf" ';
			this.str += 'quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" ';
			this.str += 'width="'+this.contentObj.width+'" ';
			this.str += 'height="'+this.contentObj.height+'"';
			this.str += 'salign="TL" ';
			this.str += 'scale="noScale" ';
			this.str += 'FlashVars="path='+url+'"';
			this.str += '></embed>';
			this.str += '</object>';
		}

		if(this.type == 'quicktime'){
			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object  type="video/quicktime" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab"';
			this.str += ' width="'+this.contentObj.width+'" height="'+this.contentObj.height+'">';
			this.str += '<param name="src" value="'+this.contentObj.url+'" />';
			this.str += '<param name="autoplay" value="true" />';
			this.str += '<param name="controller" value="true" />';
			this.str += '<param name="enablejavascript" value="true" />';
			this.str += '<embed src="'+this.contentObj.url+'" autoplay="true" pluginspage="http://www.apple.com/quicktime/download/" width="'+this.contentObj.width+'" height="'+this.contentObj.height+'"></embed>';
			this.str += '<object/>';

		}

		if(this.type == 'windowsMedia'){
			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object  type="application/x-oleobject" classid="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112"';
			this.str += ' width="'+this.contentObj.width+'" height="'+this.contentObj.height+'">';
			this.str += '<param name="filename" value="'+this.contentObj.url+'" />';
			this.str += '<param name="Showcontrols" value="true" />';
			this.str += '<param name="autoStart" value="true" />';
			this.str += '<embed type="application/x-mplayer2" src="'+this.contentObj.url+'" Showcontrols="true" autoStart="true" width="'+this.contentObj.width+'" height="'+this.contentObj.height+'"></embed>';
			this.str += '<object/>';

		}

		if(this.type == 'real'){
			var obj = new Element('div').setProperties({id: 'MultiBoxMediaObject'});
			this.str = '<object classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"';
			this.str += ' width="'+this.contentObj.width+'" height="'+this.contentObj.height+'">';
			this.str += '<param name="src" value="'+this.contentObj.url+'" />';
			this.str += '<param name="controls" value="ImageWindow" />';
			this.str += '<param name="autostart" value="true" />';
			this.str += '<embed src="'+this.contentObj.url+'" controls="ImageWindow" autostart="true" width="'+this.contentObj.width+'" height="'+this.contentObj.height+'"></embed>';
			this.str += '<object/>';

		}

		return obj;
	}

});
MultiBox.implement(new Options);
MultiBox.implement(new Events);


/*************************************************************/



