/**
*
* JavaScript knihovna pro zobrazení prohlížeče obrázků
*
* @package		sllibs3
* @subpackage	jslibs
* @version		$Id: sl.imageview.js 17681 2010-06-15 08:56:00Z zdenek $
* @encoding		UTF-8
* @author		Filip Zach <filip.zach@e4you.cz>
* @author		Zdeněk Soukup <zdenek.soukup@e4you.cz>
* @copyright	(c) e4you spol. s r.o. 2002-2010, <design@e4you.cz>
*
* Obsah tohoto souboru je majetkem e4you spol. s r.o. Jeho kopírování,
* pozměňování, šíření a jakékoli další využití je možné výhradně
* se souhlasem e4you spol. s r.o.
*
* použití:
* <code>
* 	/// inicializuje prohlížeč pro předané pole s url obrázků
*	sl.imageview.init(array_with_url_images);
*	/// zobrazí první obrázek v pořadí
*	sl.imageview.show();
*
*	/// inicializuje prohlížeč obrázků
*	sl.imageview.init();
*	/// nastaví pole s obrázky
*	sl.imageview.setImages(photos_array);
*	/// nastavíme kód specifický pro aplikaci, který se provede při každém zobrazení obrázku
*   sl.imageview.extra_action = function() { nejaky kod }
*	/// zobrazí obrázek s přdaným url
*	sl.imageview.show([nejaka_url]);
*
* </code>
*/

if(!sl.loaded['sl.imageview.js']) {

	/// načteme potřebné knihovny
	sl.require('sl.dom.js');
	sl.require('sl.event.js');
	sl.require('sl.effect.js');

	/// definujeme modul a jeho metody
	sl.imageview = {

		/**
		* Objekt s obrázky
		* Viz definice objektu sl.imageview.images
		*/
		images: null,

		/**
		* Vrstva, kryjící veškerý obsah stránky mimo obrázku
		*/
		layer: null,

		/**
		* Objekt s vnějším rámečkem, obsahující aktuálně zobrazovaný obrázek
		*/
		viewport : null,

		/**
		* Objekt s vnitřním rámečkem, obsahující aktuálně zobrazovaný obrázek
		*/
		image_box: null,

		/**
		* Objekt s aktuálně zobrazovaným obrázkem
		*/
		image: null,

		/**
		* Odkaz na zavření galerie
		*/
		close_link: null,

		/**
		* Objekt s odkazem na další obrázek
		*/
		next_link: null,

		/**
		* Objekt s odkazem na předchozí obrázek
		*/
		prev_link: null,

		/**
		* Defaultní čas v milisekundách pro výměnu obrázků ve slideshow
		*/
		slideshow_time: 3000,

		/**
		* Identifikátor časovače pro slideshow
		*/
		slideshow_timeout: null,

		/**
		* Je-li zapnuto slideshow
		*/
		slideshow: false,

		/**
		* Je-li zapnuto zobrazování počtu obrázků
		*/
		show_image_counts: true,

		/**
		* Text zobrazovaný před počítadlem obrázků
		*/
		image_counts_text: '',

		/**
		* Akce, která se provede po kliknutí na obrázek
		* Může být 'next_image' (přechod další obrázek); close (zavření prohlížeče)
		*/
		image_onclick_action: 'next_image',

		/**
		* Akce, která se provede po kliknutí na obrázek
		* Může být 'next_image' (přechod další obrázek); close (zavření prohlížeče)
		*/
		show_tool_box: false,

		/**
		* Inicializuje prohlížeč obrázků
		*
		* @param Array images Pole s url zobrazovaných obrázků
		* @param Array descriptions Pole s popisy obrázků
		*/
		init: function(images,descriptions) {

			/// nastavíme pole se zobrazovanými obrázky
			sl.imageview.setImages(images);

			/// nastavíme pole s popisy
			sl.imageview.setDescriptions(descriptions);

			/// pokud ještě prohlížeč obrázků neexistuje, inicializujeme ho
			if ( ! sl.imageview.layer) {

				/// vytvoříme nový div, který bude obsahovat prohlížeč obrázků
				sl.imageview.layer = document.createElement('DIV');
				sl.imageview.layer.setAttribute('id', 'sl_imageview');
				sl.imageview.layer.style.display = 'none';

				/// vytvoříme vnořený objekt, který se používá jako zatemnění
				var _shader = document.createElement('DIV');
				_shader.setAttribute('id','sl_imageview_shader');
				/// na kliknutí zavřeme prohlílžeč obrázků
				_shader.onclick = sl.imageview.hide;
				sl.imageview.layer.appendChild(_shader);

				/// vytvoříme vnější objekt, ve kterém se budou zobrazovat obrázky
				sl.imageview.viewport = document.createElement('DIV');
				sl.imageview.viewport.setAttribute('id', 'sl_imageview_viewport');
				sl.imageview.layer.appendChild(sl.imageview.viewport);
				new sl.effect_factory(sl.imageview.viewport);
				sl.imageview.viewport.style.visibility = 'hidden';

				/// vytvoříme vnitřní objekt, ve kterém se budou zobrazovat obrázky
				sl.imageview.image_box = document.createElement('DIV');
				sl.imageview.image_box.setAttribute('id', 'sl_imageview_content');
				new sl.effect_factory(sl.imageview.image_box);
				sl.imageview.viewport.appendChild(sl.imageview.image_box);

				/// vytvoříme objekt s obrázkem
				sl.imageview.image = document.createElement('IMG');
				sl.imageview.image.setAttribute('id', 'sl_imageview_image');
				sl.imageview.image.style.visibility = 'hidden';
				sl.imageview.image_box.appendChild(sl.imageview.image);
				new sl.effect_factory(sl.imageview.image);
				/// na onload přiřadíme obrázku událost - zobrazení
				sl.event.addHandler(sl.imageview.image,'load', sl.imageview.resizeViewportStepOne );

				/// vytvoříme odkaz na zavření prohlížeče
				sl.imageview.close_link = document.createElement('A');
				sl.imageview.close_link.setAttribute('id','sl_imageview_close');
				sl.imageview.image_box.appendChild(sl.imageview.close_link);
				/// na kliknutí mu nastavíme zavření prohlížeče
				sl.event.addHandler(sl.imageview.close_link, 'click',sl.imageview.hide);

				/// vytvoříme odkaz na předchozí obrázek
				sl.imageview.prev_link = document.createElement('SPAN');
				sl.imageview.prev_link.setAttribute('id','sl_imageview_prev');
				sl.imageview.prev_link.style.visibility = 'hidden';
				sl.imageview.image_box.appendChild(sl.imageview.prev_link);

				/// vytvoříme odkaz na další obrázek
				sl.imageview.next_link = document.createElement('SPAN');
				sl.imageview.next_link.setAttribute('id','sl_imageview_next');
				sl.imageview.next_link.style.visibility = 'hidden';
				sl.imageview.image_box.appendChild(sl.imageview.next_link);

				/// vytvoříme objekt s ovládacími prvky slideshow atd
				sl.imageview.info_box = document.createElement('DIV');
				sl.imageview.info_box.setAttribute('id', 'sl_imageview_info_box');
				new sl.effect_factory(sl.imageview.info_box);
				sl.imageview.image_box.appendChild(sl.imageview.info_box);
				sl.imageview.info_box_content = document.createElement('DIV');
				sl.imageview.info_box_content.setAttribute('id', 'sl_imageview_info_box_content');
				sl.imageview.info_box.appendChild(sl.imageview.info_box_content);

				/// počítadlo obrázků
				if (sl.imageview.show_image_counts) {

					sl.imageview.images_count_box = document.createElement('DIV');
					sl.imageview.images_count_box.setAttribute('id','sl_imageview_images_count_box');
					sl.imageview.info_box_content.appendChild(sl.imageview.images_count_box);

					/// vytvoříme odkaz na předchozí obrázek
					sl.imageview.infobox_prev_link = document.createElement('SPAN');
					sl.imageview.infobox_prev_link.setAttribute('id','sl_imageview_small_prev');

					sl.imageview.infobox_next_link = document.createElement('SPAN');
					sl.imageview.infobox_next_link.setAttribute('id','sl_imageview_small_next');

				}

				sl.imageview.slideshow_box = document.createElement('SPAN');
				sl.imageview.slideshow_box.setAttribute('id', 'sl_imageview_slideshow');
				sl.event.addHandler(sl.imageview.slideshow_box,'click',sl.imageview.toggleSlideShow);
				sl.imageview.slideshow_box.className = 'sl_imageview_slideshow_stopped';
				sl.imageview.info_box_content.appendChild(sl.imageview.slideshow_box);

				sl.imageview.description_box = document.createElement('SPAN');
				sl.imageview.description_box.setAttribute('id','sl_imageview_description');
				sl.imageview.info_box_content.appendChild(sl.imageview.description_box);

				/// přidáme prohližeč na konec body
				var _body = document.getElementsByTagName('body')[0];
				_body.appendChild(sl.imageview.layer);

				/// nastavíme vnitřnímu rámu obrázku kulaté rohy
				sl.imageview.image_box.effect_factory.addRoundCorners();

				/// při změně velikosti okna vycentrujeme rám s obrázkem
				sl.event.addHandler(window,'resize',function() { sl.imageview.viewport.effect_factory.center() });

			}
		},


		/**
		* Zapne zobrazení ovladačů editace
		*
		* @param string relation Jméno DB relace, z níž budou načtena data potřebná pro manipulaci s obrázkem
		* @param regExp file_name_patter Regulární výraz, jehož pomocí se z ména souboru vyparsuje jméno ve tvaru potřebném pro načtení dat
		* @param string image_dir Jméno adresáře s obrázky společné všem zpracováváným obrázkům bez BASEURI|BASEDIR (např. images/tourplans/)
		* @param string edit_url Cesta k souboru, který se stará o manipulaci s obrázky, je-li jiný, než výchozí
		*/
		setEditable: function(relation,file_name_pattern,image_dir,edit_url) {

			sl.imageview.relation = relation;
			sl.imageview.file_name_pattern = file_name_pattern;
			sl.imageview.image_dir = image_dir;
			sl.imageview.edit_url = edit_url || '_tools/image/rotate/' ;
			sl.imageview.show_tool_box = true;

			/// pokud ještě není definován objekt s ovládacími prvky
			if ( ! sl.imageview.tool_box) {

				/// vytvoříme ho
				sl.imageview.tool_box = document.createElement('SPAN');
				sl.imageview.tool_box.setAttribute('id','sl_imageview_tool_box');

				/// vytvoříme ovládací prvek pro otočení obrázku vlevo
				sl.imageview.rotate_left = document.createElement('SPAN');
				sl.imageview.rotate_left.name='rotate-left';
				sl.imageview.rotate_left.className='rotateLeft';
				sl.imageview.rotate_left.title=sl.imageview._('Rotate left');
				sl.imageview.rotate_left.innerHTML = '&nbsp;';
				sl.imageview.tool_box.appendChild(sl.imageview.rotate_left);
				sl.event.addHandler(sl.imageview.rotate_left, 'click', sl.imageview.imageModifyHandler);

				/// vytvoříme ovládací prvek pro otočení obrázku vpravo
				sl.imageview.rotate_right= document.createElement('SPAN');
				sl.imageview.rotate_right.name='rotate-right';
				sl.imageview.rotate_right.className='rotateRight';
				sl.imageview.rotate_right.title=sl.imageview._('Rotate right');
				sl.imageview.rotate_right.innerHTML = '&nbsp;';
				sl.imageview.tool_box.appendChild(sl.imageview.rotate_right);
				sl.event.addHandler(sl.imageview.rotate_right, 'click', sl.imageview.imageModifyHandler);
				sl.imageview.info_box_content.insertBefore(sl.imageview.tool_box,sl.imageview.description_box);
			}

		},


		/**
		 * Handler pro zpracování požadavku na rotaci obrázku
		 */
		imageModifyHandler:function(event) {
			var target = sl.event.getTarget(sl.event.getEvent(event));
			if (sl.imageview.file_name_pattern) {
				var file_name = sl.imageview.images.getCurrent().match(sl.imageview.file_name_pattern)[1];
			} else {
				var file_name = sl.imageview.images.getCurrent();
			}
			var request_url =
				sl.baseuri
				+ sl.imageview.edit_url
				+'?action='+escape(target.name)
				+'&file='+escape(file_name)
				+'&relation='+escape(sl.imageview.relation)
				+'&image_dir='+escape(sl.imageview.image_dir);
			sl.http.request(
				request_url,
				function (_data) {
					try {
						if (_data=='OK') {
							/// zreloadujeme obrázek
							/// sl.imageview.hideImage();
							/// přidáním aktuálnímo času do volání src vynutíme reload obrázku
							sl.imageview.replaceImage(sl.imageview.image.src + '?' + new Date().getTime());
							///sl.imageview.show(sl.imageview.images.getCurrent());
						}
					} catch(e) {
						/// alert (e);
					}
				}
			);

		},

		/**
		 * Nahradí zdroj aktuálního obrázku a zobrazí ho
		*/
		replaceImage: function(src) {
			sl.imageview.images.urls[sl.imageview.images.current_key] = src;
			sl.imageview.hideImage();
		},


		/**
		* Ovladač pro událost keyup - zdvih kláves
		*
		* @param e Object Objekt s událostí
		*/
		setKeyUpEvents : function(e) {

			/// detekujeme událost DOM || IE
			var evnt = e || window.event;
			var event_code = sl.event.getKeyCode(evnt);

			/// při stisku Escape
			if ( event_code==sl.event.KEY_ESC ) {
				/// skryjeme prohlížeč
				sl.event.preventDefault(evnt);
				sl.event.stopPropagation(evnt);
				sl.imageview.hide();
			/// při stisku mezerníku, šipky vpravo a enter jdeme na další obrázek
			} else if (
				event_code==sl.event.KEY_SPACE
				|| event_code==sl.event.KEY_ARROW_RIGHT
				|| event_code==sl.event.KEY_ENTER
			) {
				sl.event.preventDefault(evnt);
				sl.event.stopPropagation(evnt);
				sl.imageview.showNext();
			/// při stisku klávesy vlevo jdeme na předchozí obrázek
			} else if ( event_code==sl.event.KEY_ARROW_LEFT ) {
				sl.event.preventDefault(evnt);
				sl.event.stopPropagation(evnt);
				sl.imageview.showPrevious();
			}

		},


		/**
		* Nastaví pole obsahující url zobraznovaných obrázků
		*
		* @param Array images Pole s url obrázků
		*/
		setImages : function(images) {
			sl.imageview.images.urls = images;
		},

		/**
		* Nastaví pole obsahující popisy zobraznovaných obrázků
		*
		* @param Array descriptions Popisy ;obrázků
		*/
		setDescriptions : function(descriptions) {
			sl.imageview.images.descriptions = descriptions;
		},

		/**
		* Skryje obrázek a nahradí ho novým
		*
		* @param String url Řetězec obsahující url obrázku, který se má zobrazit
		*/
		hideImage: function() {

			/// odstraníme handlery pro stisky kláves
			sl.event.removeHandler(document,'keydown',sl.imageview.setKeyUpEvents);

			/// zobrazíme informaci o tom, že probíhá nějaká akce
			sl.imageview.image_box.effect_factory.showProcessingInfo();

			/// pokud je zobrazen nějaký obrázek
			if (sl.imageview.image.src) {
				/// skryjeme ho
				sl.imageview.image.effect_factory.dim(null,null,sl.imageview.setImageSrc);
			} else {
				sl.imageview.setImageSrc();
			}

		},


		/**
		* Nastaví src obrázku a ovládací prvky
		*/
		setImageSrc: function() {

			/// nastavíme adresu nového obrázku (na onload se volá další akce - nastavení rozměrů rámu)
			sl.imageview.image.src = sl.imageview.images.getCurrent();

			/// skryjeme ovládací prvky
			if (sl.imageview.prev_link.style.display == 'block')  {
				sl.imageview.prev_link.style.visibility = 'hidden';
			}
			if (sl.imageview.next_link.style.display == 'block')  {
				sl.imageview.next_link.style.visibility = 'hidden';
			}
			sl.imageview.close_link.style.visibility = 'hidden';
			sl.imageview.info_box.style.visibility = 'hidden';

		},


		/**
		* Změní šířku velikost rámce, v němž se zobrazuje obrázek
		* Volá se jako onload událost objektu s obrázkem
		*/
		resizeViewportStepOne: function() {

			/// pokud je rámeček skrytý, nastavíme výchozí rozměry, vycentrujeme ho a zobrazíme
			if (sl.imageview.viewport.style.visibility=='hidden') {
				sl.imageview.viewport.style.width = '200px';
				sl.imageview.viewport.style.height='400px';
				sl.imageview.image_box.style.height='400px';
				sl.imageview.viewport.effect_factory.center();
				sl.imageview.viewport.style.visibility = 'visible';
			}

			/// var test = document.defaultView.getComputedStyle(sl.imageview.image_box,null).getPropertyValue('padding-left');
			/// alert (test);
			/// @todo - dodělat detekci a nastavení šířky a výšky podle skutečných hodnot nastavených v css, a to jak přímo u prvku jako style, tak externě

			/// měnit šířku vnořeného divu není potřeba, zajistí css
			/// plynule nastavíme šírku rámečku s obrázkem, po ukončené akce zavoláme funkci, která se postará o nastavení výšky
			var new_width = sl.imageview.image.width+30;
			sl.imageview.viewport.effect_factory.resizeWidth(new_width,true, sl.imageview.resizeViewportStepTwo);

		},

		/**
		* Změní výšku rámce, v němž se zobrazuje obrázek
		*/
		resizeViewportStepTwo: function() {

			/// @todo - dodělat detekci a nastavení šířky a výšky podle skutečných hodnot nastavených v css, a to jak přímo u prvku jako style, tak externě
			/// zatím je zde hodnota nastavena natvrdo
			var add_to_height = 34;

			/// nastavíme výšku pro zobrazení ovládacích prvků v závislosti na existenci popisku k obrázku
			if (sl.imageview.images.getCurrentDescription()) {
				action_controls_height = 0;
			} else {
				action_controls_height = 15;
			}

			/// musíme nastavit  i výšku vnořeného divu
			var new_imagebox_height = sl.imageview.image.height + sl.imageview.info_box.offsetHeight + action_controls_height;
			sl.imageview.image_box.effect_factory.resizeHeight(new_imagebox_height);

			/// upravíme výšku rámce
			var new_viewport_height = sl.imageview.image.height + sl.imageview.info_box.offsetHeight + add_to_height;
			sl.imageview.viewport.effect_factory.resizeHeight(new_viewport_height, true, sl.imageview.revealImage);

		},

		/**
		* Zobrazí obrázek
		*/
		revealImage: function() {

			/// skryjeme informaci o tom, že probíhá nějaká akce
			sl.imageview.image_box.effect_factory.hideProcessingInfo();

			/// pokud je zapnuto slideshow a je k dispozicii další obrázek, nastavíme timeout pro zobrazení dalšího obrázku
			/// a předáme ho jako parametr funkci pro zobrazení obrázku
			if (	sl.imageview.slideshow ) {

				if ( sl.imageview.images.getNext() )  {
					sl.imageview.image.effect_factory.appear(null, null, function() { sl.imageview.slideshow_timeout = setTimeout(sl.imageview.showNext,sl.imageview.slideshow_time) });
				} else {
					sl.imageview.image.effect_factory.appear();
					sl.imageview.stopSlideShow();
				}

			/// jinak pouze zobrazíme
			} else {
				sl.imageview.image.effect_factory.appear();
			}

			/// zobrazíme ovládací prvky, které mají být zobrazeny
			if (sl.imageview.prev_link.style.display == 'block')  {
				sl.imageview.prev_link.style.visibility = 'visible';
			}
			if (sl.imageview.next_link.style.display == 'block')  {
				sl.imageview.next_link.style.visibility = 'visible';
			}
			sl.imageview.close_link.style.visibility = 'visible';
			sl.imageview.info_box.style.visibility = 'visible';

			/// přidáme dokumentu handler zachycující uvolnění navigačních kláves
			sl.event.addHandler(document,'keydown',sl.imageview.setKeyUpEvents);

			/// je-li zadán kód, který se má provést po zobrazení obrázku, provedeme ho
			if (sl.imageview.extra_action && typeof sl.imageview.extra_action=='function') {
				sl.imageview.extra_action();
			}

		},

		/**
		* Zahájí slideshow
		*/
		startSlideShow: function(slideshow_time) {
			sl.imageview.slideshow_time = slideshow_time || sl.imageview.slideshow_time;
			sl.imageview.slideshow = true;
			sl.dom.setClass(sl.imageview.slideshow_box,'sl_imageview_slideshow_running');
			sl.imageview.slideshow_timeout = setTimeout(sl.imageview.showNext,sl.imageview.slideshow_time);
		},

		/**
		* Zastaví slideshow
		*/
		stopSlideShow: function () {
			sl.imageview.slideshow = false;
			sl.dom.setClass(sl.imageview.slideshow_box,'sl_imageview_slideshow_stopped');
			clearTimeout(sl.imageview.slideshow_timeout);
		},

		/**
		* Zastaví nebo spustí slideshow
		*/
		toggleSlideShow: function () {
			if ( sl.imageview.slideshow ) {
				sl.imageview.stopSlideShow();
			} else {
				sl.imageview.startSlideShow();
			}
		},

		/**
		* Zobrazí další obrázek v pořadí
		*/
		showNext: function() {
			sl.imageview.show(sl.imageview.images.getNext());
		},

		/**
		* Zobrazí předchozí obrázek v pořadí
		*/
		showPrevious: function() {
			sl.imageview.show(sl.imageview.images.getPrevious());
		},

		/**
		* Zobrazí obrázek s předaným url
		* Spolu s tím správně nastaví ovládací prvky
		*
		* @param String url Řetězec obsahující url obrázku, který se má zobrazit
		*/
		show: function(url) {

			/// pokud není prohlížeč zobrazen, zobrazíme ho
			if ( sl.imageview.layer.style.display != 'block' ) {
				sl.imageview.layer.style.display = 'block';
				sl.imageview.info_box.style.display = 'block';
			}

			/// incializujeme aktuální, předchozí a následující obrázek
			sl.imageview.images.initUrl(url);

			/// skryjeme starý obrázek a zobrazíme nový
			sl.imageview.hideImage();

			/// pokud je známo url předchozího a dalšího obrázku, nastavíme ovládacím prvkům ovladače

			/// ovládací prvky pro posun na předchozí obrázek
			if ( sl.imageview.images.getNext() ) {
				sl.imageview.next_link.style.display = 'block';
				sl.imageview.next_link.onclick = function() { sl.imageview.stopSlideShow(); sl.imageview.showNext() }

				var image_onclick_action = sl.imageview.showNext;
				if (sl.imageview.image_onclick_action == 'close') {
					image_onclick_action = sl.imageview.hide;
				}
				sl.imageview.image.onclick = function() { sl.imageview.stopSlideShow(); image_onclick_action() };

				if (sl.imageview.infobox_next_link) {
					sl.imageview.infobox_next_link.onclick = function() { sl.imageview.stopSlideShow(); sl.imageview.showNext() };
					sl.imageview.infobox_next_link.className = 'sl_imageview_small_next_active';
				}

			} else {
				sl.imageview.next_link.style.display = 'none';
				sl.imageview.image.onclick = null;
				if (sl.imageview.infobox_next_link) {
					sl.imageview.infobox_next_link.onclick = null;
					sl.imageview.infobox_next_link.className = 'sl_imageview_small_next_inactive';
				}
			}

			/// ovládací prvky pro posun na další obrázek
			if ( sl.imageview.images.getPrevious() ) {
				sl.imageview.prev_link.style.display = 'block';
				sl.imageview.prev_link.onclick = function() { sl.imageview.stopSlideShow(); sl.imageview.showPrevious() };
				if (sl.imageview.infobox_prev_link) {
					sl.imageview.infobox_prev_link.onclick = function() { sl.imageview.stopSlideShow(); sl.imageview.showPrevious() };
					sl.imageview.infobox_prev_link.className = 'sl_imageview_small_prev_active';
				}
			} else {
				sl.imageview.prev_link.style.display = 'none';
				if (sl.imageview.infobox_prev_link) {
					sl.imageview.infobox_prev_link.onclick = null;
					sl.imageview.infobox_prev_link.className = 'sl_imageview_small_prev_inactive';
				}
			}

			/// odkaz na spuštění slideshow zobrazíme jen pokud je k dispozici více než jeden obrázek
			if ( sl.imageview.images.getCount() > 1 ) {
				sl.imageview.slideshow_box.style.display = 'block';
			} else {
				sl.imageview.slideshow_box.style.display = 'none';
			}

			/// zobrazíme počet obrázků
			if (sl.imageview.show_image_counts) {
				sl.imageview.images_count_box.innerHTML = "<span>"+sl.imageview.image_counts_text+' '+ sl.imageview.images.getCurrentImageNumber() + ' / ' + sl.imageview.images.getCount() + "</span>" ;
				sl.imageview.images_count_box.appendChild(sl.imageview.infobox_prev_link);
				sl.imageview.images_count_box.appendChild(sl.imageview.infobox_next_link);
			}

			/// pokud je k dispozici popis, zobrazíme ho
			if ( sl.imageview.images.getCurrentDescription() )  {
				sl.imageview.description_box.style.display = 'block';
				sl.imageview.description_box.innerHTML = sl.imageview.images.getCurrentDescription();
			} else {
				sl.imageview.description_box.style.display = 'none';
				sl.imageview.description_box.innerHTML = '';
			}

		},

		/**
		* Skryje prohlížeč obrázků
		*/
		hide: function() {
			sl.imageview.stopSlideShow();
			sl.imageview.image.src = '#';
			sl.imageview.layer.style.display = 'none';
			sl.imageview.info_box.style.visibility = 'hidden';
			/// document.getElementsByTagName('body')[0].removeChild(sl.imageview.layer);

			/// odstraníme handlery pro stisky kláves
			sl.event.removeHandler(document,'keydown',sl.imageview.setKeyUpEvents);

		},

		/**
		 * Vrací lokalizovaný řetězec
		 *
		 * @param string message Řetězec
		*/
		_ : function(message) {
			try {
				var locale = sl.localization.getLocale();
				return sl.imageview.messages[locale][message] ;
			} catch (e) {
				return message;
			}
		},

		/**
		 * Objekt s lokalizovanými řetěci
		 */
		messages : {

			'cs_CZ.UTF-8' : {
				'Rotate left': 'Otočit vlevo',
				'Rotate right': 'Otočit vpravo',
				'Delete' : 'Smazat'
			},

			'de_DE.UTF-8' : {
				'Rotate left': 'Otočit vlevo',
				'Rotate right': 'Otočit vpravo',
				'Delete' : 'Delete'
			},

			'sk_SK.UTF-8' : {
				'Rotate left': 'Otočit vlevo',
				'Rotate right': 'Otočit vpravo',
				'Delete' : 'Smazat'
			}
		}

	}

	/**
	* Objekt s informacemi o obrázcích pro galerii
	*/
	sl.imageview.images = {

		/**
		* Je-li true, vrací funkce previous a next vždy přechozí nebo další obrázek
		* Je-li false, vrací funkce next při dosažení konce nebo začátku pole null
		*/
		loop: false,

		/**
		* Klíč aktuálně zobrazovaného obrázku
		*/
		current_key: undefined,

		/**
		* Klíč následujícího obrázku, nebo undefined, pokud další obrázek není k dispozici
		*/
		next_key: undefined,

		/**
		* Klíč předchozího obrázku, nebo undefined, pokud předchozí obrázek není k dispozici
		*/
		prev_key: undefined,

		/**
		* Pole s url obrázků
		*/
		urls: new Array,

		/**
		* Pole s popisem obrázků
		* Klíč se shoduje s klíčem v poli sl.imageview.images.urls
		*/
		descriptions: new Array,

		/**
		* Vrací počet obrázků v poli s obrázky
		*/
		getCount: function() {
			return  sl.imageview.images.urls.length;
		},

		/**
		* Vrací pořadí právě zobrazovaného obrázku
		*/
		getCurrentImageNumber: function() {
			return  parseInt(sl.imageview.images.current_key)+1;
		},

		/**
		* Vrací url prvního obrázku
		*/
		getFirst: function() {
			return  sl.imageview.images.urls[0];
		},

		/**
		* Vrací url posledního obrázku, nebo undefined, pokud není k dispozici
		*/
		getLast: function() {
			return sl.imageview.images.urls[sl.imageview.images.urls.length-1];
		},

		/**
		* Vrací url aktuálního obrázku, nebo undefined, pokud není k dispozici
		*/
		getCurrent: function() {
			return sl.imageview.images.urls[sl.imageview.images.current_key];
		},

		/**
		* Vrací url aktuálního obrázku, nebo undefined, pokud není k dispozici
		*/
		getCurrentDescription: function() {
			if (sl.imageview.images.descriptions) {
				return sl.imageview.images.descriptions[sl.imageview.images.current_key];
			} else {
				return null;
			}
		},

		/**
		* Vrací url předchozízho obrázku, nebo undefined, pokud není k dispozici
		*/
		getPrevious: function() {
			return sl.imageview.images.urls[sl.imageview.images.prev_key];
		},

		/**
		* Vrací url následujícího obrázku, nebo undefined, pokud není k dispozici
		*/
		getNext: function() {
			return sl.imageview.images.urls[sl.imageview.images.next_key];
		},

		/**
		* Nastaví hodnoty podle předané url
		*/
		initUrl: function(url) {

			/// pokud není předáno url, použijeme první obrázek v pořadí
			url = url || sl.imageview.images.getFirst();

			/// projdeme pole s url všech obrázků
			var images = sl.imageview.images.urls;
			for (var key in images) {
				/// najdeme-li v pole požadované url
				if (url === images[key]) {
					sl.imageview.images.current_key = key;
					/// je-li zapnuto procházení obrázků ve smyčce
					if (sl.imageview.images.loop) {
						/// zjistíme pozici předchozího obrázku, pokud předchozí obrázek není k dispozici, nastavíme poslední
						sl.imageview.images.prev_key = images[parseInt(key)-1] ? parseInt(key)-1 : sl.imageview.images.urls.length-1;
						/// zjistíme pozici dalšího obrázku, pokud další obrázek není k dispozici, nastavíme první
						sl.imageview.images.next_key = images[parseInt(key)+1] ? parseInt(key)+1 : 0 ;
					/// má-li se na začátku a nakonci procházení zastavit
					} else {
						/// zjistíme pozici předchozího obrázku, pokud předchozí obrázek není k dispozici, nastavíme null
						sl.imageview.images.prev_key = images[parseInt(key)-1] ? parseInt(key)-1 : null;
						/// zjistíme pozici dalšího obrázku, pokud další obrázek není k dispozici, nastavíme null
						sl.imageview.images.next_key = images[parseInt(key)+1] ? parseInt(key)+1 : null ;
					}
					break;
				}
			}
		}

	}

	sl.loaded['sl.imageview.js'] = true;
}