/**
 * Shows an ad in mid- or post-roll.
 * TODO: Implement mid-roll.
 * 
 * Configuration:
 * this.config.adspace = {
 *		post: {
 *			image: /path/to/post.png,
 *			link: http://www.demolink.com/,
 *			width: 336, // this is required for the time being for formatting
 *			class: 'overlay class', // should be the css class used for overlays
 *			exposeMaskOpacity: 60, // sets the opacity of the overlay that displays behind the ad
 *		},
 *		mid: {
 *			image: /path/to/mid.png,
 *			link: http://midlink.net/,
 *		}
 * };
 * 
 * @author Joey Line <joey.line@skiclubz.com>
 */
(function($) {
	zPlayer.prototype.adspace = function(domelement, JWlistener) {
		var player = this;
		this.plugins.adspace = {
			_endedListener: undefined
		};
		
		if(zPlayer.utils.isNull(domelement)) {
			domelement = this.domelement;
		}
		
		if(zPlayer.utils.isNull(this.config.adspace)) {
			// no config, don't do anything
			return false;
		}
		
		if(!zPlayer.utils.isNull(this.config.adspace.post)) {
			// pre-load the image
			var img = new Image();
			img.src = this.config.adspace.post.image;
			
			// build the elements first, so they'll only be created once per page load
			var exposeMask = $('<div/>')
				.css('background-color', '#000')
				.css('z-index', 100)
				.css('height', '100%')
				.css('width', '100%')
				.css('background-repeat', 'repeat')
				.css('position', 'absolute')
				.css('top', 0)
				.css('left', 0)
				.css('opacity', this.config.adspace.post.opacity / 100)
				.css('-moz-opacity', this.config.adspace.post.opacity / 100)
				.css('khtml-opacity', this.config.adspace.post.opacity / 100)
				.css('-ms-filter', 'progid:DXImageTransform.Microsoft.Alpha(Opacity=' + this.config.adspace.post.opacity + ')')
				.css('filter', 'alpha(opacity=' + this.config.adspace.post.opacity + ')')
				.css('display', 'none')
				.appendTo(this.container);
			
			var inner = $('<div/>')
				.addClass('in')
				.append('<small>Advertisement</small>')
				.css('font-size', 'smaller')
				.css('text-align', 'center');
				
			var link = $('<a/>')
				.attr('href', this.config.adspace.post.link)
				.appendTo(inner)
				.html(img);
			
			var overlay = $('<div/>')
				.addClass(this.config.adspace.post['class'])
				.css('display', 'none')
				.append('<a class="close closex" href="#close">close</a>')
				.append(inner)
				.appendTo(this.container);
			
			var width = this.config.adspace.post.width
				+ parseInt($(overlay).css('padding-left').replace('px', ''), 10)
				+ parseInt($(overlay).css('padding-right').replace('px', ''), 10);
			var height = this.config.adspace.post.height
				+ parseInt($(overlay).css('padding-top').replace('px', ''), 10)
				+ parseInt($(overlay).css('padding-bottom').replace('px', ''), 10);
			

			// FIXME: this should probably look at css rather than use an arbitrary 25...
			this.plugins.adspace.left = Math.round((parseInt(this.config.width.replace('px', ''), 10) - width) / 2) - 25;
			this.plugins.adspace.top = 0;
			
			this.plugins.adspace._endedListener = function() {
				if(player.fullscreen) {
					var left = ($(window).width() - width) / 2,
						top = ($(window).height() - height) / 2;
				} else {
					var left = player.plugins.adspace.left,
						top = 0;
				}
				
				if(!zPlayer.utils.isNull(player.plugins.adspace.overlay)) {
					// overlay already loaded once, load it again via the overlay API
					zPlayer.utils.log('reloading overlay');
					var config = player.plugins.adspace.overlay.getConf();
					config.left = left;
					config.top = top;
					
					player.plugins.adspace.overlay.load();
				} else {
					// show overlay for the first time
					overlay.overlay({
						load: true,
						fixed: false,
						closeOnClick: false,
						closeOnEsc: false,
						top: top,
						left: left,
						
						onBeforeLoad: function() {
							// show mask
							exposeMask.toggle();
							
							// only do this if the overlay hasn't been loaded before, otherwise it
							// breaks IE8
							if(zPlayer.utils.isNull(player.plugins.adspace.overlay)) {
								overlay
									.css('width', width + 'px')
									.css('padding-top', parseInt(overlay.css('padding-top').replace('px', ''), 10) - 10 + 'px')
									.css('margin-top', '5px')
								;
								
								// save the overlay
								player.plugins.adspace.overlay = this;
							}
						},
						onLoad: function() {
							// FIXME: For some reason, .overlay doesn't use the top configuration
							//	when the overlay is loaded over JWPlayer, but it works fine over
							//	zPlayer.
							if(!player.fullscreen) {
								overlay.css('top', top);
							}
						},
						onBeforeClose: function() {
							exposeMask.toggle();
						}
					});
				}
			};
			
			if(domelement.tagName=='VIDEO') {
				domelement.addEventListener('ended', this.plugins.adspace._endedListener);
			} else {
				domelement.addModelListener('STATE', JWlistener);
			}
		}
		
		// if(!zPlayer.utils.isNull(this.config.adspace.mid)) {
			// this.domelement.addEventListener('play', function() {
				// zPlayer.utils.log('!!! play !!!');
			// });
		// }
	};
	
	zPlayer.prototype.adspace.jwEndedListener = function(evt, player) {
		player.plugins.adspace._endedListener();
	};
})(jQuery);