Import('myLib/util/PageOffset.js');
Import('myLib/util/ImageManager.js');

ImageLayer = function(){};

ImageLayer.defaultId = 's1j9k2e4r5t';

ImageLayer.layerWidth = 0;

ImageLayer.layerHeight = 0;

ImageLayer.layer = null;

ImageLayer.indexType = {
	CURRENT:	1,
	PREVIOUS:	2,
	NEXT:		3
};

ImageLayer.values = [];

ImageLayer.style = {
	backgroundColor: 	'',
	border: 			'#8e030a 3px solid'
};

//--- public
ImageLayer.showOnce = function(image, description, closeLabel){
	ImageLayer.values = [{
		'id':			ImageLayer.defaultId,
		'image':		image,
		'description':	System.getValue(description),
		'closeLabel':	System.getValue(closeLabel)
	}];

	ImageLayer.style.backgroundColor = '#f5eed9';
	ImageLayer.show(ImageLayer.defaultId, true);

};

//--- public
ImageLayer.showById = function(id){
	ImageLayer.style.backgroundColor = 'black';
	ImageLayer.show(id, false);
};

//--- private
ImageLayer.show = function(id, isOnce){
	if(ImageLayer.layer == null){
		ImageLayer.createLayer();
	}

	var src = ImageLayer.getValuesById(id)['image'];
	var func = function(image, params){
		ImageLayer.computeSize(image);
		ImageLayer.initSize();
		ImageLayer.initPosition();
		if(ImageLayer.loadContent(params.id, params.isOnce)){
			ImageLayer.visible();
		}
	};
	var params = {
		'id':		id,
		'isOnce':	isOnce
	}

	ImageManager.load(src, func, params);
};

//---

ImageLayer.setStyle = function(style){
	for(var i in style){
		ImageLayer.style[i] = style[i];
	}
};

ImageLayer.setValues = function(id, image, description, closeLabel){
	//var image = System.getValue(image);
	//var description = System.getValue(description);
	var index = ImageLayer.values.length;
	ImageLayer.values[index] = {
		'id':			id,
		'image':		image,
		'description':	description,
		'closeLabel':	closeLabel
	};
	/*
	if(typeof(id) == 'object'){
		var values = id;
		for(var i in values){
			ImageLayer.values[index][i] = values[i];
		}
	}
	*/
	return index;
};

ImageLayer.visible = function(){
	ImageLayer.layer.style.visibility = 'visible';
};

ImageLayer.hidden = function(){
	ImageLayer.layer.style.visibility = 'hidden';
};

ImageLayer.createLayer = function(){
	ImageLayer.layer = document.createElement('div');

	ImageLayer.layer.style.position = 'absolute';
	ImageLayer.layer.style.backgroundColor = ImageLayer.style.backgroundColor;
	ImageLayer.layer.style.border = ImageLayer.style.border;

	var body = document.getElementsByTagName('body')[0];
	body.appendChild(ImageLayer.layer);
};

ImageLayer.initSize = function(){
	ImageLayer.layer.style.width = ImageLayer.layerWidth;
	ImageLayer.layer.style.height = ImageLayer.layerHeight;
};

ImageLayer.initPosition = function(){
	ImageLayer.layer.style.left = ImageLayer.getLayerPositionX();
	ImageLayer.layer.style.top = ImageLayer.getLayerPositionY();
};

ImageLayer.loadContent = function(id, isOnce){
	var index = ImageLayer.loadIndex(id, ImageLayer.indexType.CURRENT);

	//alert(ImageLayer.values[index]);

	if(typeof(ImageLayer.values[index]) == 'undefined'){
		return false;
	}

	var previousId = ImageLayer.loadId(id, ImageLayer.indexType.PREVIOUS);
	var nextId = ImageLayer.loadId(id, ImageLayer.indexType.NEXT);

	//alert(previousId + ' - ' + index + ' - ' + nextId);

	var description = ImageLayer.values[index]['description'];
	var image = ImageLayer.values[index]['image'];
	var closeLabel = ImageLayer.values[index]['closeLabel'];

	//Config.getPathToData() +
	var c =
	'<table cellspacing="0" cellpadding="0" border="0" style="padding-top: 10px; margin: 0 auto;">' +
	'<tr><td colspan="3" style="text-align: center;">' +
		'<img src="' + image + '" alt="" />' +
	'</td></tr>' +
	'<tr>' +
	'<td style="font-size: 10px; color: #8e030a; text-align: center; margin-bottom: 5px; padding-top: 5px; vertical-align: bottom;">'
	+ description + '<br/><br/><a style="font-size: 12px; color: #666666 ;text-decoration: none;" href="javascript:ImageLayer.hidden();">' + closeLabel + '</a></td>'
	'</tr>' +
	'</table>';

	ImageLayer.layer.innerHTML = c;

	return true;
};

ImageLayer.computeSize = function(image){
	//var values = ImageLayer.getValuesById(id)


	if(navigator.appName == 'Microsoft Internet Explorer') {
		ImageLayer.layerWidth = image.width - 100;
		ImageLayer.layerHeight = image.height - 50;
	}
	else {
		ImageLayer.layerHeight = image.height + 100;
		ImageLayer.layerWidth = image.width + 50;
	}
};

ImageLayer.getLayerPositionX = function(){
	return ImageLayer.calculatePosition(
		document.body.clientWidth,
		ImageLayer.layerWidth
	);
};

ImageLayer.getLayerPositionY = function(){
	return PageOffset.getOffset() + ImageLayer.calculatePosition(
		document.body.clientHeight,
		ImageLayer.layerHeight
	);
};

ImageLayer.calculatePosition = function(windowLength, layerLength){
	var value = 0;
	if(windowLength > layerLength){
		value = (windowLength / 2) - (layerLength / 2);
	}
	return value;
};

//---

ImageLayer.getValuesById = function(id){
	for(var i = 0; i < ImageLayer.values.length; i++){
		if(ImageLayer.values[i]['id'] == id){
			return ImageLayer.values[i];
		}
	}
};

ImageLayer.loadIndex = function(id, indexType){
	for(var i = 0; i < ImageLayer.values.length; i++){
		if(ImageLayer.values[i]['id'] == id){
			if(indexType == ImageLayer.indexType.CURRENT)
				return i;
			else if(indexType == ImageLayer.indexType.PREVIOUS)
				return i - 1;
			else if(indexType == ImageLayer.indexType.NEXT)
				return i + 1;
		}
	}
	return -1;
};

ImageLayer.loadId = function(id, indexType){
	var index = ImageLayer.loadIndex(id, indexType);
	if(typeof(ImageLayer.values[index]) != 'undefined')
		return ImageLayer.values[index]['id'];
	else
		return 0;
};