/**
 * TODO: jak u galerie 1 - AddImage ... 
 */ 
function Gallery2 (_el, _gal, _att, _opac) {
	var ref = this;
	var opac = _opac||false;
	this.el = SJEL.$$(_el);
	this.as = SJEL.$A(this.el, _att||"rel", _gal, "a");
	this.pad = 5;  // padding ze vsech stran
	this.topPad = 70;  // padding shora
	this.scrollY = 0;
	this.gi = new Array();
	this.scrWidth = 0;
	this.scrHeight = 0;
	this.currId = -1;  // index do this.gi prave pouzivaneho obrazku
	this.opened = false;  // galerie je zapnuta/vypnuta
	this.zoomed = false;
	this.tiSl = new SJEL.Timer(OnTimer);  // timer pro slideshow

	this.moZoomIn = new SJEL.Morph();
	this.moZoomOut = new SJEL.Morph();
	this.moFadeIn = new SJEL.Morph();
	this.moFadeOut = new SJEL.Morph();

	// nastaveni pozadi
	this.bg = SJEL.CE("div");  // pozadi
	this.bgCol = "#000";  // barva pozadi
	this.bgOpac = 0.7;  // pruhlednost pozadi
	this.bgSpeed = 350;  // rychlost animace
	this.moBg = new SJEL.Morph();
	this.bg.onclick = function() {
		ref.Close();
	};
	SJEL.SStyle(this.bg, {position: "fixed", zIndex: 5999, top: "0px", left: "0px", width: "100%", height: "100%", backgroundColor: this.bgCol, opacity: 0.0});
	if (SJEL.ie == 6)
		SJEL.SStyle(this.bg, {position: "absolute"});
	
	// obrazek nahravani
	this.loader = SJEL.CE("img");
	SJEL.SStyle(this.loader, {position: "absolute", zIndex: 6002, top: "0px", left: "0px"});
	this.loader.src = "/publisher/js/Fxs/Gallery2/imgs/loader.gif";
	
	// pozadi pod obrazkem
	this.imgBg = CDiv("g2_img_bg");
	this.moImgBg = new SJEL.Morph();
	this.moImgBg2 = new SJEL.Morph();  // toto dat do hajzlu -> pak ale blbne. zjistit proc!
	this.SetImgBg = function(_w, _h, _l, _t, _a) {
		var anim = _a||false,
			st = {
				width: _w + 2 * this.pad + "px", height: _h + 2 * this.pad + "px",
				left: _l - this.pad + "px", top: _t - this.pad + "px"
			};
		
		if (anim) {
			this.moImgBg2.Init(this.imgBg, st, 250);
			this.moImgBg2.OnMorphFinished(function(){
				ref.gi[ref.currId].FadeIn();
			});
			this.moImgBg2.Morph();
		} else
			SJEL.SStyle(this.imgBg, st);
	};
	
	// box s titulkem
	this.textBox = CDiv("g2_text_box");
	this.textBoxIn = CDiv("g2_text_box_in");
	this.textBox.appendChild(this.textBoxIn);
	this.moTextBox = new SJEL.Morph();
	this.SetTextBox = function(_w, _l, _t, _text) {
		SJEL.SStyle(this.textBox, {
			width: _w + 2 * this.pad + "px",
			left: (_l - this.pad) + "px", top: _t - this.pad - parseInt(this.textBox.offsetHeight) + "px"
		});
		
		this.textBoxIn.innerHTML = this.gi[this.currId].title;
	};
	
	// krizek (zavrit)
	this.cross = CDiv("g2_cross");
	this.cross.onclick = function() {
		ref.Close();
	};
	this.textBox.appendChild(this.cross);

	// pocitadlo
	this.counter = CDiv("g2_counter");
	this.SetCounter = function() {
		this.counter.innerHTML = this.currId + 1 + " / " + this.gi.length;
	};
	this.textBox.appendChild(this.counter);
			
	// panel s tlacitkama
	this.cPanel = CDiv("g2_control_panel");
	this.cPanelI = CDiv("g2_control_panel_in");
	this.leftA = CDiv("g2_left_arrow");
	this.rightA = CDiv("g2_right_arrow");
	this.slideshow = CDiv("g2_slideshow");
	this.slideshowOn = false;
	this.slideshowWait = 3000;
	this.cPanel.appendChild(this.cPanelI);
	this.cPanel.appendChild(this.leftA);
	this.cPanel.appendChild(this.rightA);
	this.cPanel.appendChild(this.slideshow);
	SJEL.SStyle(this.cPanelI, {opacity: 0.4});
	this.cPanel.onmouseover = function() {
		if (ref.zoomed) {
			ref.moCP.Init(this, {opacity: 1.0}, 350);
			ref.moCP.Morph();
		}
	};
	this.SlideshowOn = function () {
		this.slideshowOn = true;
		SJEL.AddClass(this.slideshow, "g2_slideshow_active");
		this.tiSl.SetSpeed(this.slideshowWait);
		this.tiSl.Start(true);
	};

	this.SlideshowOff = function () {
		if (this.slideshowOn) {
			this.slideshowOn = false;
			SJEL.RemoveClass(this.slideshow, "g2_slideshow_active");
			this.tiSl.Stop();
		}
	};
	this.leftA.onclick = function() {
		ref.gi[ref.currId].FadeOut("prev");
		ref.SlideshowOff();
	};
	this.rightA.onclick = function() {
		ref.gi[ref.currId].FadeOut("next");
		ref.SlideshowOff();
	};
	this.slideshow.onclick = function() {
		if (ref.slideshowOn)
			ref.SlideshowOff();
		else
			ref.SlideshowOn();
	};
	this.moCP = new SJEL.Morph();
	

	//
	for (var i = 0; i < this.as.length; i++) {
		this.gi.push(new GalItem(this.as[i], i));
	}
	
	// zmeni id - nebo + a zaroven nahraje obrazek
	this.ChangeId = function(_what) {
		if (_what == "prev") {
			if (this.currId - 1 < 0)
				this.currId = this.gi.length - 1;
			else
				this.currId--;
		} else {
			if (this.currId + 1 == this.gi.length)
				this.currId = 0;
			else
				this.currId++;
		}
		
		this.SetCounter();
		this.gi[this.currId].LoadBigImg();
	};
	
	// animuje pozadi obrazku na romery dalsiho obrazku + 
	this.AnimateImgBg = function() {
		var it = this.gi[this.currId];
		
		var pos = it.ImgPos(true);
		
		this.SetImgBg(it.biWidth, it.biHeight, pos[0], pos[1], true);
	};
	
	this.ShowImg = function(_what) {
		if (this.currId == -1)
			return;

		var w = _what||"zoom-in";
		var it = this.gi[this.currId];
		var sP = it.GetSIPos();
		var imgPos = it.ImgPos();
        var smallImgWidth = 0;
        var smallImgHeight = 0;

        if (!it.smallImg) {
            smallImgWidth = 100;
            smallImgHeight = 100;
        } else {
            smallImgWidth = it.smallImg.width;
            smallImgHeight = it.smallImg.height;
        }

		switch(w) {
			case "zoom-in":
				this.SetCounter();
				SJEL.SStyle(it.bigImg, {
					width: parseInt(smallImgWidth) + "px",
					height: parseInt(smallImgHeight) + "px",
					opacity: 0.5, display: "block",
					left: sP[0] + "px", top: sP[1] + "px"
				});
				this.moZoomIn.Init(it.bigImg, {
					opacity: 1.0,
					width: it.biWidth + "px", height: it.biHeight + "px",
					left: imgPos[0] + "px", top: imgPos[1] + "px"
				}, 350);
				this.moZoomIn.OnMorphFinished(function(){
					ref.zoomed = true;
					ref.SetImgBg(it.biWidth, it.biHeight, imgPos[0], imgPos[1]);
					ref.SetTextBox(it.biWidth, imgPos[0], imgPos[1]);
					//SJEL.SStyle(ref.imgBg, {});
					ref.moImgBg.Init(ref.imgBg, {opacity: 1.0}, 350);
					ref.moTextBox.Init(ref.textBox, {opacity: 1.0}, 350);
					ref.moImgBg.Morph();
					ref.moTextBox.Morph();
				});
				this.moZoomIn.Morph();
				break;
			case "zoom-out":
				this.moZoomOut.Init(it.bigImg, {
					width: parseInt(smallImgWidth) + "px",
					height: parseInt(smallImgHeight) + "px",
					opacity: 0.5, left: sP[0] + "px", top: sP[1] + "px"
				}, 350);
				this.moZoomOut.OnMorphFinished(function(){
					//document.body.removeChild(it.bigImg);
					SJEL.SStyle(it.bigImg, {display: "none", width: it.biWidth + "px", height: it.biHeight + "px"})
				});
				this.moZoomOut.Morph();
				break;
		}
	};
	
	this.Open = function() {
		SJEL.AddEvent(document, "keyup", this.OnKeyUp);

		this.SetWH();
		
		document.body.appendChild(this.bg);
		this.moBg.Init(this.bg, {opacity: this.bgOpac}, this.bgSpeed);
		this.moBg.Morph();
		this.moBg.OnMorphFinished(function(){});
		
		SJEL.SStyle(this.imgBg, {position: "absolute", opacity: 0.0, zIndex: 6000});
		document.body.appendChild(this.imgBg);

		SJEL.SStyle(this.textBox, {position: "absolute", opacity: 0.0, zIndex: 6000});
		document.body.appendChild(this.textBox);

		document.body.appendChild(this.cPanel);
		SJEL.SStyle(this.cPanel, {
			position: "absolute", opacity: 0.0, zIndex: 6002,
			left: (this.scrWidth - parseInt(this.cPanel.offsetWidth)) / 2 + "px", top: ref.topPad + ref.scrollY + 2 * ref.pad + "px"
		});
		
		//this.opened = true;
	};
	
	this.Close = function() {
		SJEL.RemoveEvent(document, "keyup", this.OnKeyUp);

		this.SlideshowOff();

		document.body.removeChild(this.imgBg);
		document.body.removeChild(this.textBox);
		document.body.removeChild(this.cPanel);

		this.moBg.Init(this.bg, {opacity: 0.0}, this.bgSpeed);
		this.moBg.OnMorphFinished(function(){
			document.body.removeChild(ref.bg);
		});
		this.moBg.Morph();
		this.ShowImg("zoom-out");
		
		this.opened = false;
		this.zoomed = false;
	};

	this.OnKeyUp = function (_e) {
		if (!_e)
			_e = event;

		switch (_e.keyCode) {
			case 27:ref.Close();break;  // esc
			case 37:ref.gi[ref.currId].FadeOut("prev");ref.SlideshowOff();break;  // leva sipka
			case 39:ref.gi[ref.currId].FadeOut("next");ref.SlideshowOff();break;  // prava sipka
			case 38:ref.SlideshowOn();break;  // sipka nahoru
			case 40:ref.SlideshowOff();break;  // sipka dolu
		}
	};
	
	this.SetWH = function() {
		var tmp = SJEL.GWindowWH();
		this.scrWidth = tmp[0];
		this.scrHeight = tmp[1];
	};
	
	this.ZoomIn = function() {
		if (!this.opened) {
			this.opened = true;
			this.ShowImg("zoom-in");
		}
	};
	
	function GalItem(_a, _id) {
		var r = this;
		this.a = _a;
		this.id = _id;
		this.smallImg = SJEL.$T(this.a, "img")[0];
		this.siPos = null;

		/*if (opac) {
			SJEL.SStyle(this.smallImg, {opacity: 0.5});
	
			this.smallImg.onmouseover = function() {
				SJEL.SStyle(this, {opacity: 1.0});
			};
	
			this.smallImg.onmouseout = function() {
				SJEL.SStyle(this, {opacity: 0.5});
			};
		}*/

		if (this.a.title != "")
			this.title = this.a.title;
		else if (this.smallImg)
			this.title = this.smallImg.alt;

		this.bigImg = SJEL.CE("img");
		this.biWidth = 0;
		this.biHeight = 0;
		
		this.a.onclick = function() {
			ref.currId = r.id;
			ref.scrollY = SJEL.GScrollXY()[1];
			ref.Open();
			r.LoadBigImg();
			return false;
		};
		
		this.LoadBigImg = function() {
			if (this.bigImg.src != "") {  // obrazek uz je nahrany
				if (!ref.zoomed)
					ref.ZoomIn();
				else
					ref.AnimateImgBg();
				return;
			}
			
			if (ref.zoomed) {
				// pripraveni loaderu a pripojeni
				var ibw = parseInt(ref.imgBg.offsetWidth), ibh = parseInt(ref.imgBg.offsetHeight)
					ibl = parseInt(SJEL.GStyle(ref.imgBg, "left")), ibt = parseInt(SJEL.GStyle(ref.imgBg, "top"));

				SJEL.SStyle(ref.loader, {
					left: ((ibw - ref.loader.width) / 2) + ibl + "px",
					top: ((ibh - ref.loader.height) / 2) + ibt + "px"
				});

				document.body.appendChild(ref.loader);
			}
			
			SJEL.SStyle(this.bigImg, {opacity: 0.0, position: "absolute", zIndex: 6001});
			this.bigImg.onload = function() {
				r.biWidth = this.width;
				r.biHeight = this.height;
				document.body.appendChild(this);
				if (!ref.zoomed)
					ref.ZoomIn();
				else {
					document.body.removeChild(ref.loader);
					ref.AnimateImgBg();
				}
			};
			this.bigImg.onmouseover = this.bigImg.onclick = function() {
				if (ref.zoomed) {
					ref.moCP.Init(ref.cPanel, {opacity: 1.0}, 350);
					ref.moCP.Morph();
				}
			};
			this.bigImg.onmouseout = function() {
				if (ref.zoomed) {
					ref.moCP.Init(ref.cPanel, {opacity: 0.0}, 350);
					ref.moCP.Morph();
				}
			};
			
			this.bigImg.src = this.a.href;
		};
		
		// absolutni pozice nahledoveho obrazku
		this.GetSIPos = function() {
			if (this.siPos == null) {
                if (this.smallImg) {
                    this.siPos = SJEL.GAbsPos(this.smallImg);
                } else {
                    this.siPos = SJEL.GAbsPos(this.a);
                }
            }

			return this.siPos;
		};

		// vypocita pozici obrazku vzhledem k rozmerum okna
		this.ImgPos = function(_set) {
			var set = _set||false;
			ref.SetWH();
			var pos = new Array((ref.scrWidth - this.biWidth) / 2, ref.topPad + ref.scrollY);

			if (set)
				SJEL.SStyle(this.bigImg, {left: pos[0] + "px", top: pos[1] + "px"});
			
			return pos;
		};
		
		this.FadeIn = function() {
			//alert('f');
			SJEL.SStyle(this.bigImg, {display: "block", opacity: 0.0}, 200);
			ref.moFadeIn.Init(this.bigImg, {opacity: 1.0});

			var imgPos = this.ImgPos();
			ref.SetTextBox(this.biWidth, imgPos[0], imgPos[1]);
			ref.moTextBox.Init(ref.textBox, {opacity: 1.0}, 150);

			ref.moFadeIn.Morph();
			ref.moTextBox.Morph();
		};	

		this.FadeOut = function(_w) {
			ref.moFadeOut.Init(this.bigImg, {opacity: 0.0}, 150);
			ref.moFadeOut.OnMorphFinished(function(){
				SJEL.SStyle(r.bigImg, {display: "none"});
				ref.ChangeId(_w);
			});
			ref.moTextBox.Init(ref.textBox, {opacity: 0.0}, 150);

			ref.moFadeOut.Morph();
			ref.moTextBox.Morph();
		};	
	}	

	function OnTimer() {
		ref.gi[ref.currId].FadeOut("prev");
	};

	function CDiv(_cn) {
		var di = SJEL.CE("div");
		di.className = _cn;
		
		return di;
	};
}