function Photo(pID, pPhotoUrl, pThumbUrl, pWidth, pHeight){
	this.id = pID,
	this.photoUrl = pPhotoUrl,
	this.thumbUrl = pThumbUrl,
	this.width = pWidth,
	this.height = pHeight
	
	this.ratio = pWidth / pHeight;
}

Photo.prototype.thumbWidth = function(){
	if(this.ratio>=1){
		return Math.floor(100 * this.ratio);
	} else {
		return 100;
	}
}

Photo.prototype.thumbHeight = function(){
	if(this.ratio<=1){
		return Math.floor(100 / this.ratio);
	} else {
		return 100;
	}
}

var Album = {
	debug: false,
	animationSpeed: 400,

	photos: [],
	
	currentPhotoID: null,
	loadingPhotoID: null,
	loadingFinished: false,
	animatingPhoto: false,
	showPreloadedPhoto: false,
	
	slideshow: false,
	fullscreen: false,
	hideControlsAt: null,
	
	direction: "next",
	
	slideshowTimerSet: false,
	
	userID: null,
	albumID: null,
	photosUrl: null,
	thumbsUrl: null,
		
	getPhotoPosition: function(pPhotoID){
		var lPhotoSize = View.getPhotoSize(pPhotoID);
		var lWidth = lPhotoSize["width"];
		var lHeight = lPhotoSize["height"];
		
		var lLeft = Math.round((View.area["slide"].width - lWidth - (View.area["frame"].width * 2)) / 2);
		var lTop = Math.round((View.area["slide"].height - lHeight - (View.area["frame"].width * 2)) / 2);
		
		return {
			"width": lWidth,
			"height": lHeight,
			"left": lLeft,
			"top": lTop
		};
	},
	
	
	showLoadedPhoto: function(){
		this.currentPhotoID = this.loadingPhotoID;
		if(!this.slideshow){
			window.location.hash = this.photos[this.currentPhotoID].id;
		}
		this.loadingFinished = false;
		this.loadingPhotoID = null;
		this.animatingPhoto = true;
		this.showPreloadedPhoto = false;
		
		var lPreloadPhotoID = null;
		if(this.direction == "next" && this.photos[this.currentPhotoID + 1]){
			lPreloadPhotoID = this.currentPhotoID + 1;
		}
		
		if(this.direction == "previous" && this.photos[this.currentPhotoID - 1]){
			lPreloadPhotoID = this.currentPhotoID - 1;
		}
	
		var lOldSlideLeft = -View.area["slide"].width;
		var lNewSlideLeft = View.area["slide"].width;
		if (this.direction == "previous"){
			lOldSlideLeft = View.area["slide"].width;
			lNewSlideLeft = -View.area["slide"].width;
		}
		
		$("#photo .slide.newPhoto").css("left", lNewSlideLeft + "px");
	
	//            $(this).parents(".slide").removeClass("loadingPhoto").addClass("newPhoto");
	
		$("#thumbs li.current").removeClass("current");
		$($("#thumbs li")[this.currentPhotoID]).addClass("current");
		
		Thumbs.scrollToPhoto(this.currentPhotoID);
		
		$("#photo .newPhoto").animate({"left": ["0", "swing"]}, Album.animationSpeed, function(){
			
			$("img", this).bind("click", function(){
				InputManager.nextButtonPressed();
				return false;			
			});
			
		
			Album.animatingPhoto = false;
	
			Album.setSlideshowTimer();
		
			Album.loadingPhotoID = null;
			$(this).removeClass("newPhoto").addClass("oldPhoto");
			$lNewSlide = $('<div class="slide newPhoto"></div>');
			$lNewSlide.css({"position": "absolute", "left": View.area["slide"].width + "px"});
			$("#photo").append($lNewSlide);
			if(lPreloadPhotoID !== null){
				Album.preloadPhoto(lPreloadPhotoID);
			}
	
			if (Album.isCurrentPhotoFirst()){
				$("a.previousPhoto").css("opacity", "0.2");
			} else {
				$("a.previousPhoto").css("opacity", "1");
			}
	
			if (Album.isCurrentPhotoLast()){
				$("a.nextPhoto").css("opacity", "0.2");
			} else {
				$("a.nextPhoto").css("opacity", "1");
			}				
		});
		$('#photo .oldPhoto').animate({"left": [lOldSlideLeft + "px", "swing"]}, Album.animationSpeed, function(){
			$(this).remove();
		});
	
	},	
	
	showPhoto: function(pPhotoID){
		if (pPhotoID == this.currentPhotoID){ return; }

		if((this.loadingPhotoID !== null && !this.loadingFinished && this.showPreloadedPhoto) || this.animatingPhoto){ return; }

		//tohle tu asi k nicemu neni, ne?
//		var lPhoto = this.photos[pPhotoID];
		
		if(pPhotoID == this.loadingPhotoID){
			this.showLoadedPhotoWhenReady();
		} else {
			this.preloadPhoto(pPhotoID, true);
		}
	},
	
	showNextPhoto: function(){
		if(this.currentPhotoID < (this.photos.length - 1)){
			this.showPhoto(this.currentPhotoID + 1);
		} else {
			if (this.slideshow){ this.stopSlideshow(); }
		}

	},
	
	showPreviousPhoto: function(){
		if(this.currentPhotoID > 0){
			var lCurrentPhoto = this.currentPhotoID;
			this.showPhoto(lCurrentPhoto - 1);
		}
	},
	
	showSlideshowNextPhoto: function(){
		clearTimeout(Slideshow.timer);
		Slideshow.timer = null;
		if (this.slideshow){
			if(this.isCurrentPhotoLast()){
				this.stopSlideshow();			
			} else {
				this.showLoadedPhotoWhenReady();
			}
		}
	},
	
	setSlideshowTimer: function(){
		if(!Slideshow.timer && this.slideshow){
			Slideshow.timer = setTimeout("Album.showSlideshowNextPhoto()", 4000);
		}
	},
	
	pauseSlideshow: function(){
		clearTimeout(Slideshow.timer);
		Slideshow.timer = null;
		$("a.button.pauseSlideshow").css({
			"background-image": "url(/inc/css/images/slideshow.gif)" 
		});
	},
	
	resumeSlideshow: function(){
		Slideshow.timer = setTimeout("Album.showSlideshowNextPhoto()", 4000);
		$("a.button.pauseSlideshow").css({
			"background-image": "url(/inc/css/images/pauseSlideshow.gif)" 
		});
	},
	
	startSlideshow: function(){
		if(!this.slideshow){
			this.slideshow = true;
			this.fullscreen = true;
			View.detect();
			this.repositionObjects();
			Controls.hide();
			
			$("body").bind("mousemove", Controls.show);
			
			this.direction = "next";
			this.showPreloadedPhoto = false;
			
			window.location.hash = "play";
			
			if(this.currentPhotoID !== null){
				this.preloadPhoto(this.currentPhotoID + 1);
				Album.setSlideshowTimer();
			} else {
				this.showPhoto(0);
			}

			
/*			if(this.currentPhotoID === 0){
				this.preloadPhoto(1);
				Album.setSlideshowTimer();
			} else {
				//timer se spusti sam po zobrazeni prvni fotky
				this.showPhoto(0);
			} */
			
//			$(".buttons .slideshow").addClass("running");
		}
	},
	
	stopSlideshow: function(){
		this.slideshow = false;
		this.fullscreen = false;
		clearTimeout(Slideshow.timer);
		Slideshow.timer = null;
		$("body").unbind("mousemove", Controls.show);
		Controls.show();
		View.detect();
		this.repositionObjects();
		$(".buttons .slideshow").removeClass("running");
	},
	
	startFullscreen: function(){
		if(!this.fullscreen){
			this.fullscreen = true;
			View.detect();
			this.repositionObjects();
			Controls.hide();
			$("a.button.fullscreen").addClass("exitFullscreen");
			$("body").bind("mousemove", Controls.show);
		}
	},
	
	stopFullscreen: function(){
		this.fullscreen = false;
		$("body").unbind("mousemove", Controls.show);
		Controls.show();
		$("a.button.fullscreen").removeClass("exitFullscreen");
		View.detect();
		this.repositionObjects();
	},
	
	
	initObjects: function(){
		$("#head").css({"z-index": "100"});
		
		$("html").css({"overflow": "hidden"}); //obcas se pri resizovani objevil verticalni scroller. Tohle to fixuje.
		$("#head").css({"position": "absolute"});
		$("#body").css({"position": "relative", "overflow": "hidden"});

		$("#bottomPanel").css({"width": "100%", "height": "64px", "position": "absolute", "bottom": "0", "left": "0"});

		$("#photo").css({"overflow": "hidden", "position": "absolute", "padding": 0, "left": 0});
		$("#photo .slide").css({"overflow": "hidden", "position": "absolute", "top": 0, "left": 0});
		$("#photo img").css({"position": "absolute"});

		$("#thumbs").css({"height": "54px", "position": "absolute", "left": "64px", "top": "5px"});
		$("#thumbs .scroller").css({"overflow": "hidden", "height": "54px", "top": 0});
		
		$lPreviousButton = $('<a href="#" class="button previousPhoto" />');
		$lPreviousButton.css({
			"left": "5px",
			"z-index": 1000
		});
		
		$lNextButton = $('<a href="#" class="button nextPhoto" />');
		$lNextButton.css({
			"right": "5px"
		});
		
		$lSlideshowButton = $('<a href="#" class="button slideshow" />');
		$lSlideshowButton.bind("click", function(){
			InputManager.slideshowButtonPressed();
			return false;
		});
		$lSlideshowButton.css({
			"left": "5px",
			"top": "5px"
		});
		
		$lFullscreenButton = $('<a href="#" class="button fullscreen" />');
		$lFullscreenButton.bind("click", function(){
			InputManager.fullscreenButtonPressed();
			return false;
		});
		$lFullscreenButton.css({
			"right": "5px",
			"top": "5px"
		});
		
		$lSlideshowControls = $('<div id="slideshowControls" />');
		
		$lStopSlideshowButton = $('<a href="#" class="button stopSlideshow" />');
		$lStopSlideshowButton.bind("click", function(){
			InputManager.stopSlideshowButtonPressed();
			return false;
		});
		$lStopSlideshowButton.css({
			"left": "5px",
			"top": "5px"
		});
		
		$lPauseSlideshowButton = $('<a href="#" class="button pauseSlideshow" />');
		$lPauseSlideshowButton.bind("click", function(){
			InputManager.pauseSlideshowButtonPressed();
			return false;
		});
		$lPauseSlideshowButton.css({
			"left": "64px",
			"top": "5px"
		});
		

		
		$("body").append($lPreviousButton);
		$("body").append($lNextButton);
		$("body").append($lSlideshowControls);
		$("#bottomPanel").append($lSlideshowButton);
		$("#bottomPanel").append($lFullscreenButton);
		$lSlideshowControls.append($lStopSlideshowButton);
		$lSlideshowControls.append($lPauseSlideshowButton);

		if(this.debug){
			$("#photo").css({"overflow": "visible"});		
		}
	
	},
	
	repositionObjects: function(){
		if (this.fullscreen){
			$("#head").css("opacity", "0.9");
			$("#bottomPanel").css("opacity", "0.9");
			$("#slideshowControls").css("opacity", "0.9");
		} else {
			$("#head").css("opacity", "1");
			$("#bottomPanel").css("opacity", "1");
			$("#slideshowControls").css("opacity", "1");
		}
	

		$("#body").css({"height": View.innerHeight + "px", "width": View.innerWidth + "px"});
		$("#head").css({"height": View.area["head"].height + "px", "width": View.area["head"].width + "px"});
		$("#thumbs").css({"height": View.area["thumbs"].height + "px", "width": View.area["thumbs"].width + "px"});
		$("#slideshowControls").css({"left": View.area["slideshowControls"].left + "px"});

		$("#thumbs a.button").remove();
		$("#thumbs .scroller").css({"left": View.area["scroller"].left + "px", "width": View.area["scroller"].width + "px"});

		$("a.previousPhoto, a.nextPhoto").css({
			"top": View.area["slideButton"].top + "px"
		});

		if(View.showThumbsButtons){
			$lLeftButton = $('<a class="button scrollerLeft" href="#" />');
			$lRightButton = $('<a class="button scrollerRight" href="#" />');
			
			$lLeftButton.css({"left": "5px"});
			$lRightButton.css({"right": "5px"});
			
			$lLeftButton.bind("click", function(){
				Thumbs.scrollLeft();
				return false;
			});
			
			$lRightButton.bind("click", function(){
				Thumbs.scrollRight();
				return false;
			});
			
			$("#thumbs").append($lLeftButton);
			$("#thumbs").append($lRightButton);
		}
	
		$("#photo").css({"top": View.area["slide"].top + "px", "height": View.area["slide"].height + "px", "width": View.area["slide"].width + "px"});
		
		
		$("#photo .slide").stop(true, true);
		
		$("#photo .slide").css({
			"height": View.area["slide"].height + "px", 
			"width": View.area["slide"].width + "px"
		});

		$("#photo .loadingIndicator").css({
			"top": View.area["loadingIndicator"].top + "px", 
			"left": View.area["loadingIndicator"].left + "px"
		});

		$("#photo .slide.newPhoto").css({
			"left": View.area["slide"].width + "px"
		});
		
		if(this.currentPhotoID !== null){
			var lPhotoPosition = this.getPhotoPosition(this.currentPhotoID);
			$("#photo .oldPhoto img.photo").css({
				"height": (lPhotoPosition["height"]) + "px", 
				"width": (lPhotoPosition["width"]) + "px",
				"left": (lPhotoPosition["left"]) + "px",
				"top": (lPhotoPosition["top"]) + "px"
			});

			if(this.loadingPhotoID !== null){
				var lNewPhotoPosition = this.getPhotoPosition(this.loadingPhotoID);
				$("#photo .newPhoto img.photo").css({
					"height": (lNewPhotoPosition["height"]) + "px", 
					"width": (lNewPhotoPosition["width"]) + "px",
					"left": (lNewPhotoPosition["left"]) + "px",
					"top": (lNewPhotoPosition["top"]) + "px"
				});
			}

		}
		
		Thumbs.update();

	},
				
    showLoadedPhotoWhenReady: function(){
		if(this.loadingFinished){
			this.showLoadedPhoto();
		} else {
			this.showLoadingIndicator();
			this.showPreloadedPhoto = true;
		}
    },
    
	preloadPhoto: function(pPhotoID, pShowWhenLoaded){

		this.loadingPhotoID = null;
		this.loadingFinished = false;
		
		if(pShowWhenLoaded){ 
			this.showPreloadedPhoto = true;
			this.showLoadingIndicator();
		}

		$("#photo .slide.newPhoto *").remove();
		var $lNewPhoto = $("#photo .slide.newPhoto");
		var $lImg = $('<img class="photo"/>');
		var lPhototPosition = this.getPhotoPosition(pPhotoID);
		$lImg.css({
			"position": "absolute", 
			"top": lPhototPosition.top + "px", 
			"left": lPhototPosition.left + "px", 
			"width": lPhototPosition.width + "px", 
			"height": lPhototPosition.height + "px"
		});
		$lNewPhoto.append($lImg);
		this.loadingPhotoID = pPhotoID;
		
		$lImg.bind("load", function(){
			Album.loadingFinished = true;
			
			Album.hideLoadingIndicator();
			
			if(Album.showPreloadedPhoto){
				Album.showLoadedPhoto();
			}
		});
		
		$lImg.bind("error", function(){
			Album.loadingFinished = true;
			
			Album.hideLoadingIndicator();

			if(Album.showPreloadedPhoto){
				Album.showLoadedPhoto();
			}
		});
		
		$lImg.attr("src", this.photos[pPhotoID].photoUrl);
	},
	
	showLoadingIndicator: function(){
		this.hideLoadingIndicator();	
		$lLoadingIndicator = $('<div class="loadingIndicator"><img src="/inc/css/images/aperture.gif"/></div>');
		$lLoadingIndicator.css({
			"top": View.area["loadingIndicator"].top + "px", 
			"left": View.area["loadingIndicator"].left + "px",
			"opacity": 0.7
		});
		
		$('#photo').append($lLoadingIndicator);
	},
	
	hideLoadingIndicator: function(){
		$('#photo .loadingIndicator').remove();
	},
	
	isCurrentPhotoFirst: function(){
		if (this.currentPhotoID === 0){ return true; }
		return false;
	},

	isCurrentPhotoLast: function(){
		if (this.photos[this.currentPhotoID + 1]){
			return false;
		} else {
			return true;
		}
	},

		
	preloadImages: function(){
		var laImages = [];

		laImages[0] = new Image(); 
		laImages[0].src="/inc/css/images/aperture.gif"; 

		laImages[1] = new Image(); 
		laImages[1].src="/inc/css/images/nextPhoto.gif"; 

		laImages[2] = new Image(); 
		laImages[2].src="/inc/css/images/previousPhoto.gif"; 

		laImages[3] = new Image(); 
		laImages[3].src="/inc/css/images/slideshow.gif"; 

		laImages[4] = new Image(); 
		laImages[4].src="/inc/css/images/fullscreen.gif"; 

		laImages[5] = new Image(); 
		laImages[5].src="/inc/css/images/logo-bw.gif"; 

		laImages[6] = new Image(); 
		laImages[6].src="/inc/css/images/scrollerLeft.gif"; 

		laImages[7] = new Image(); 
		laImages[7].src="/inc/css/images/scrollerRight.gif"; 

	},		
		
	init: function(){
		//prepare for javascript view
		$("#photo .slide").remove();
		
		var lUrlHash = window.location.hash.substr(1);
		
		if(lUrlHash == "debug"){
			this.debug = true;
		}

		$(document).bind("keydown", function(e){
		  return InputManager.keyPressed(e.which);
		});
		
		this.initObjects();
		View.detect();
		this.repositionObjects();	

		$(window).bind("resize", function(){
			View.detect();
			Album.repositionObjects();	
		});
		
		$lNewSlide = $('<div class="slide newPhoto"></div>');
		$lNewSlide.css({"position": "absolute", "left": View.area["slide"].width + "px"});
		$("#photo").append($lNewSlide);


		$("a.button").bind("focus", function(){
			this.blur();
		});
	
		var lIndex = 0;
		$('#thumbs li').each(function(){
			$(this).data("photoID", lIndex);
			lIndex++;
			$(this).bind("click", function(){
				InputManager.thumbnailClicked($(this).data("photoID"));
				return false;
			});

			$(this).bind("mouseenter", function(){
				Thumbs.showPhotoTooltip($(this).data("photoID"), $(this).offset().left);
				$(this).addClass("hovered");
			});

			$(this).bind("mouseleave", function(){
				Thumbs.hidePhotoTooltip();
				
				if(!$(this).removeClass("hovered"));
			});
		});
		
		$("a.button.previousPhoto").bind("click", function(){
			InputManager.previousButtonPressed();
			return false;
		});
		
		$("a.button.nextPhoto").bind("click", function(){
			InputManager.nextButtonPressed();
			return false;
		});
		
		
		var lPhotoIndex = 0;
		if(lUrlHash == "play"){
			this.startSlideshow();
		} else {
		//load photoID from hash	
			var lPhotoID = parseInt(lUrlHash, 10);
			if(lPhotoID){
					for(lIndex = 0; lIndex < this.photos.length; lIndex++){
					if (lPhotoID == this.photos[lIndex].id){
						lPhotoIndex = lIndex;
						break;
					}
				}
			}
			this.showPhoto(lPhotoIndex);
		}
	}
	
};


var Controls = {
	timeout: null,
	
	hide: function(){
		if(Album.fullscreen){
			this.timeout = null;
			$("#slideshowControls").css({"display": "none"});
			$("#head").css({"display": "none"});
			$("#bottomPanel").css({"display": "none"});
			$("a.button.nextPhoto, a.button.previousPhoto").css({"display": "none"});
		}
	},
	
	show: function(){
		if(this.timeout){
			clearTimeout(this.timeout);
			this.timeout = null;
		}
		
		if(Album.slideshow){
			$("#slideshowControls").css({"display": "block"});
		} else {
			$("#slideshowControls").css({"display": "none"});
			$("#head").css({"display": "block"});
			$("#bottomPanel").css({"display": "block"});
			$("a.button.nextPhoto, a.button.previousPhoto").css({"display": "block"});
		}
		
		if(Album.fullscreen){ this.timeout = setTimeout("Controls.hide()", 1000); }
	}
};

var Slideshow = {
	timer: null
};

var Thumbs = {
	speed: 0,
	position: 0,
	direction: null,
	scrollWidth: 0,
	maxLeft: 0,
	minLeft: 0,

	tooltipTimer: null,
	
	
	scroll: function(pPosition){
		this.position = pPosition;

		if (this.position < this.minLeft){ this.position = this.minLeft; }
		if (this.position > this.maxLeft){ this.position = this.maxLeft; }

		$("#thumbs .scroller ul").animate({"left": this.position + "px"}, "slow");
	},
	
	update: function(){
		var lThumbsCount = Math.floor(View.area["scroller"].width / 59);
		this.scrollWidth = lThumbsCount * 59;
		
		this.minLeft = View.area["scroller"].minLeft;
	
		if (this.position < this.minLeft){ this.position = this.minLeft; }
		if (this.position > this.maxLeft){ this.position = this.maxLeft; }
		
		$("#thumbs .scroller ul").css({"left": this.position + "px"});
	},
	
	scrollLeft: function(){
		this.scroll(this.position + this.scrollWidth);
	},
	
	scrollRight: function(){
		this.scroll(this.position - this.scrollWidth);
	},
	
	scrollToPhoto: function(pPhotoOrder){
		if(!this.isThumbnailVisible(pPhotoOrder)){
			var lPosition = (pPhotoOrder * -59) - 27 + Math.floor(this.scrollWidth / 2);
			this.scroll(lPosition);
		}
	},
	
	isThumbnailVisible: function(pPhotoOrder){
		var lRet = true;
		var lPhotoPosition = pPhotoOrder * -59;
		if(lPhotoPosition > this.position){ lRet = false; }
		if(lPhotoPosition < (this.position - this.scrollWidth + 59)){ lRet = false; }
		return lRet;
	},
	
	showPhotoTooltip: function(pPhotoID, pOffsetLeft){
		clearTimeout(this.tooltipTimer);
		$("#tooltip").stop(true);
		
		var lPhoto = Album.photos[pPhotoID];
		$("#tooltip .content img").remove();
		
		$("#tooltip").css({
			"height": Math.round(lPhoto.thumbHeight()) + 10 + "px",
			"width": Math.round(lPhoto.thumbWidth()) + 4 + "px",
			"left": (pOffsetLeft - 2) - Math.round((lPhoto.thumbWidth() - 50)/2) + "px",
			"bottom": "58px",
			"opacity": 0,
			"display": "block"
		});

		$("#tooltip .content").css({
			"height": Math.round(lPhoto.thumbHeight()) + 4 + "px",
			"width": Math.round(lPhoto.thumbWidth()) + 4 + "px"
		});

		$("#tooltip .content").append($('<img src="' + lPhoto.thumbUrl + '" />'));
		
		$("#tooltip").animate({"bottom": "+=10px", "opacity": 1}, "fast", "swing");
	},
	
	hidePhotoTooltip: function(){
		this.tooltipTimer = setTimeout(function(){
			$("#tooltip").animate({"bottom": "+=10px", "opacity": 0}, "fast", "swing", function(){
				$(this).css("display", "none");
			})
//			$("#tooltip").css("display", "none");
		}, 500);
	}
	
	
};