Miniatures = {
	'clean': function() {
		$$("div.imagePreview").each(function(img){
			$(img).parentNode.removeChild(img);
		});
	},

	'init': function(miniatureClickedEvent) {
		miniatureClickedEvent.stop();
		Miniatures.clean();

		// body
		var body = $(document.getElementsByTagName("body")[0]);

		// pobierz informacje o pliku....
		var matches = /(\w{32})\.(\w{3})$/.exec(Event.element(miniatureClickedEvent).src);
		var file = matches[1] + '.' + matches[2];

		// stwórz obrazek do preloadu...
		var previewImageToShow = new Image();
			$(previewImageToShow).style.display = 'none';
			$(previewImageToShow).id = 'imagePreview-' + matches[1];

		// dodaj obrazek dopiero po załadowaniu....
		$(previewImageToShow).observe('load',function(imageLoadEvent){
			var biggerImage = $(Event.element(imageLoadEvent));
			var biggerImageDiv = biggerImage.up();
				biggerImageDiv.removeChild(biggerImageDiv.down('span.loading'));

			biggerImage.style.display = 'block';
		});

		// informacje do pozycjonowania
		var middle = Miniatures.miniatureMiddle(Event.element(miniatureClickedEvent));

		// text o ładowaniu
		var loading = $(document.createElement('span'));
			loading.appendChild(document.createTextNode('Ładuję...'));
			loading.addClassName('loading');

		// stwórz warstwę podglądu
		var divPrev = $(document.createElement('div'));
			divPrev.id = 'previewFor-' + matches[1];
			divPrev.addClassName('imagePreview');
			divPrev.style.top = middle[0] + 'px';
			divPrev.style.left = middle[1] + 'px';

			divPrev.appendChild(loading);
			divPrev.appendChild(previewImageToShow);

		// kliknięcie na stronę (poza miniaturką) zamyka powiększenie (i wszystkie inne)
		$(body).observe('click',function cleanOnBody(bodyClickEvent) {
			Miniatures.clean();
			$(Event.element(bodyClickEvent)).stopObserving('click');
		});

		// dołącz warstwę podglądu do dokumentu
		body.appendChild(divPrev);

		// zrodlo na samym koncu..
		$(previewImageToShow).src = envHttpPath + "/varia/data/products/200x200/" + file;
	},

	'miniatureMiddle': function(miniature) {
		var topLeftOfMiniature = $(miniature).cumulativeOffset();
		var returnTopLeft = [topLeftOfMiniature[1],topLeftOfMiniature[0]];

		returnTopLeft[0] = returnTopLeft[0] - ((200 - $(miniature).getWidth())/2);
		returnTopLeft[1] = returnTopLeft[1] - ((200 - $(miniature).getHeight())/2);

		return returnTopLeft;
	}
};