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: 	'#f8f8f8',
	border: 			'gray 1px solid'
};
//--- public
ImageLayer.showOnce = function(image, description){
	ImageLayer.values = [{
		'id':			ImageLayer.defaultId,
		'image':		image,
		'description':	System.getValue(description)
	}];
	//ImageLayer.style.backgroundColor = 'white';
	ImageLayer.show(ImageLayer.defaultId, true);
};
//--- public
ImageLayer.showById = function(id){
	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);
};
//--- public
ImageLayer.setStyle = function(style){
	for(var i in style){
		ImageLayer.style[i] = style[i];
	}
};
//--- public
ImageLayer.setValues = function(id, image, description){
	//var image = System.getValue(image);
	//var description = System.getValue(description);
	var index = ImageLayer.values.length;
	ImageLayer.values[index] = {
		'id':			id,
		'image':		image,
		'description':	description
	};
	/*
	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 + 'px';
	ImageLayer.layer.style.height = ImageLayer.layerHeight + 'px';
};
ImageLayer.initPosition = function(){
	ImageLayer.layer.style.left = ImageLayer.getLayerPositionX() + 'px';
	ImageLayer.layer.style.top = ImageLayer.getLayerPositionY() + 'px';
};
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'];

	if(description == '')
		description = ' ';
	else
		description = '<div style="text-align: center; margin: 5px 0 5px 0;">' + description + '</div>';

	//Config.getPathToData() +
	var c = '<div style="margin: 30px 30px 20px 30px; text-align: center;">' +
	'<table cellspacing="0" cellpadding="0" border="0" style="margin: 0 auto;">' +
	'<tr><td style="text-align: center;"><img src="' +
	image + '" alt="" /></td></tr>' +
	'<tr><td style="padding: 4px;">' + description + '</td></tr>' +
	'</table>' +
	'<table cellspacing="0" cellpadding="0" border="0" style="margin: 0 auto;">' +
	'<tr>' +
	'<td style="width: 30px;">';
	if(!isOnce && previousId > 0)
		c += '<input type="button" value="<<" class="arrow" title="" style="width: 25px; height: 20px; font: 8pt;" onclick="ImageLayer.show(' + previousId + ');" />&nbsp;';
	else
		c += '&nbsp;';
	c += '</td>' +
	'<td><input type="button" value="zamknij" style="width: 60px; height: 20px; font: 8pt;" onclick="ImageLayer.hidden();" /></td>' +
	'<td style="width: 30px; text-align: right;">';
	if(!isOnce && nextId > 0)
		c += '&nbsp;<input type="button" value=">>" class="arrow" title="" style="width: 25px; height: 20px; font: 8pt;" onclick="ImageLayer.show(' + nextId + ');" />';
	else
		c += '&nbsp;';
	c += '</td>' +
	'</tr></table>' +
	'<div>';


	ImageLayer.layer.innerHTML = c;

	return true;
};

ImageLayer.computeSize = function(image){
	//var values = ImageLayer.getValuesById(id)
	ImageLayer.layerWidth = image.width + 120;
	ImageLayer.layerHeight = image.height + 140;
};

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

ImageLayer.getLayerPositionY = function(){
	//alert(PageOffset.getOffset() + ' - ' + document.body.clientHeight);
	//alert(document.body);
	//document.body = document.documentElement.clientHeight);
	return PageOffset.getOffset() + ImageLayer.calculatePosition(
		(document.documentElement || 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;
};