/**
 * overlay.js
 *
 */

var myPioneerOverlay;

/**
 * Pioneer overlay options
 *
 */
PioneerOverlayOptions = Object.extend({
	elements: {
		page: 'pageContainer',
		overlay: 'libriOverlay',
		panel: 'libriOverlayPanel'
	},
	createPanel: true,
	zIndex: 1000,
	backgroundColor: '#000000',
	panelBackgroundColor: '#FFFFFF',
	opacity: 0.5,
	panelOpacity: 1
	}, window.PioneerOverlayOptions || {});

/**
 * Pioneer overlay class
 *
 */
var PioneerOverlay = Class.create();

PioneerOverlay.prototype = Object.extend(new PioneerCommon(), {
	/**
	 * Parameters
	 */
	page: null,
	overlay: null,
	panel: null,
	width: 0,
	height: 0,
	panelWidth: 0,
	panelHeight: 0,
	panelTop: 0,
	panelLeft: 0,
	zIndex: 0,
	backgroundColor: '',
	panelBackgroundColor: '',
	opacity: 0,
	panelOpacity: 1,

	/**
	 * Methods
	 *
	 * Class constructor
	 *
	 * @return PioneerOverlay
	 */
	initialize: function() {
		this.page = $(PioneerOverlayOptions.elements.page);
		this.zIndex = PioneerOverlayOptions.zIndex;
		this.backgroundColor = PioneerOverlayOptions.backgroundColor;
		this.panelBackgroundColor = PioneerOverlayOptions.panelBackgroundColor;
		this.opacity = PioneerOverlayOptions.opacity;
		this.panelOpacity = PioneerOverlayOptions.panelOpacity;
		
		this.createOverlay();

		if (PioneerOverlayOptions.createPanel && PioneerOverlayOptions.elements.panel) {
			this.createPanel();
		}
	},

	createOverlay: function() {
		if (!$(PioneerOverlayOptions.elements.overlay)) {
			document.body.appendChild(
				Builder.node('div', {'id': PioneerOverlayOptions.elements.overlay})
				);
		}

		this.overlay = $(PioneerOverlayOptions.elements.overlay);

		if (this.overlay) {
			this.getDimensions();
			
			this.setStyle({
				display: 'none',
				position: 'absolute',
				top: '0px',
				left: '0px',
				zIndex: this.zIndex,
				width: this.width+'px',
				height: this.height+'px',
				backgroundColor: this.backgroundColor
				});

			this.setOpacity(this.opacity);
		}
	},

	getDimensions: function() {
		var viewDim = document.viewport.getDimensions();

		if (this.page) {
			var pageDim = this.page.getDimensions();

			if (pageDim && viewDim) {
				this.width = (pageDim.width > viewDim.width) ? pageDim.width : viewDim.width;
				this.height = (pageDim.height > viewDim.height) ? pageDim.height : viewDim.height;
			}
		} else {
			this.width = viewDim.width;
			this.height = viewDim.height;
		}
	},

	setStyle: function(style) {
		if (this.overlay && style) {
			this.overlay.setStyle(style);
		}
	},

	setOpacity: function(opacity) {
		if (this.overlay) {
			this.opacity = opacity;
			this.overlay.setOpacity(this.opacity);
		}
	},
	
	show: function() {
		if (this.overlay) {
			this.getDimensions();
			
			this.setStyle({
				width: this.width+'px',
				height: this.height+'px'
			});

			this.overlay.show();
		}
	},

	hide: function() {
		if (this.overlay) {
			this.overlay.hide();
		}
	},

	createPanel: function() {
		if (!$(PioneerOverlayOptions.elements.panel)) {
			document.body.appendChild(
				Builder.node('div', {'id': PioneerOverlayOptions.elements.panel})
				);
		}

		this.panel = $(PioneerOverlayOptions.elements.panel);

		if (this.panel) {
			this.setPanelStyle({
				display: 'none',
				position: 'absolute',
				top: this.panelTop+'px',
				left: this.panelLeft+'px',
				width: 'auto',
				height: 'auto',
				zIndex: (this.zIndex + 1),
				backgroundColor: this.panelBackgroundColor
				});

			this.setPanelOpacity(this.panelOpacity);
		}
	},

	setPanelStyle: function(style) {
		if (this.panel && style) {
			this.panel.setStyle(style);
		}
	},

	setPanelOpacity: function(opacity) {
		if (this.panel) {
			this.panelOpacity = opacity;
			this.panel.setOpacity(this.panelOpacity);
		}
	},

	getPanelDimensions: function() {
		if (this.panel) {
			var panelDim = this.panel.getDimensions();

			this.panelWidth = panelDim.width;
			this.panelHeight = panelDim.height;
		}
	},

	updatePanelContent: function(content) {
		if (this.panel) {
			this.panel.update(content);
		}
	},

	showPanel: function() {
		if (this.panel) {
			this.getPanelDimensions();
			
			var viewDim = document.viewport.getDimensions();
			var viewOffset = document.viewport.getScrollOffsets();
			
			this.panelLeft = Math.ceil((viewDim.width - this.panelWidth) / 2) + viewOffset.left;
			this.panelTop = Math.ceil((viewDim.height - this.panelHeight) / 2) + viewOffset.top;

			this.setPanelStyle({
				top: this.panelTop+'px',
				left: this.panelLeft+'px'
				});

			this.show();
			this.panel.show();
		}
	},

	hidePanel: function() {
		if (this.panel) {
			this.panel.hide();
			this.hide();
		}
	}
});

/**
 * Create overlay object
 *
 * @return void
 */
function createPioneerOverlay() {
	myPioneerOverlay = new PioneerOverlay();
}