// preload next+prev mini
// preload next+prev big
// lupka

$(document).ready(function(){
	$(document).click(function(){
		//$('#debug').html('');
		//$('#debug').append('#container: '+$('#container').offset().left+'<br/>')
		//$('#debug').append('#dim: '+$('#dim').offset().left+'<br/>')
		//$('#debug').append('#enlargement: '+$('#enlargement').offset().left+'<br/>')
		//$('#debug').append('#largeblack: '+$('#largeblack').offset().left+'<br/>')
		//$('#debug').append('img.big.offset().left: '+$('img.big').offset().left+'<br/>')
		//$('#debug').append('img.big.attr("src"): '+$('img.big').attr("src")+'<br/>')
		//$('#debug').append('img.big.width(): '+$('img.big').width()+'<br/>')
		//$('#debug').append('$(document).height()='+$(document).height()+'<br/>')
		//$('#debug').append('$(window).height()='+$(window).height())
	})
	$(window).resize(function(){
		/*
		*/
		//$('#debug').text($(window).width()+', '+docwid)
		if($('body').css('overflow')=='hidden'){
			$('body').css('overflow', 'auto')
			docwid = $(window).width()
			$('body').css('overflow', 'hidden')
		}
		else docwid = $(window).width()
		enwid = docwid
		enhig = enwid*1100/1500
		enleft = (docwid-800)/2+271
		$('#dim').css('height', (Math.min(document.body.clientHeight, $(window).height())<600) ? 600 : '100%' )
		if($('#enlargement').width()==490) $('#enlargement').css('left', enleft)
		else $('#enlargement').css({width: enwid, height: enhig, left: (docwid-enwid)/2, top: ($(document).height()-enhig)/2})
		//$('#debug').html('Math.min('+document.body.clientHeight+','+$(window).height()+') = '+Math.min(document.body.clientHeight,$(window).height())+"<br/>\n")
		//$('#debug').html('$(window): '+$(window).height()+"<br/>\n")
		//$('#debug').append('$(document): '+$(document).height()+"<br/>\n")
		//$('#debug').append('$("html"): '+$("html").height()+"<br/>\n")
		//$('#debug').append('$("body"): '+$("body").height()+"<br/>\n")
		//$('#debug').append('document.body.clientHeight: '+document.body.clientHeight+"<br/>\n")
		//$('#debug').append('window.innerHeight: '+window.innerHeight+"<br/>\n")
		//$('#debug').append('document.documentElement.clientHeight: '+document.documentElement.clientHeight+"<br/>\n")
		
		przelicz()
	})
		//$('#debug').html('Math.min('+document.body.clientHeight+','+$(window).height()+') = '+Math.min(document.body.clientHeight,$(window).height())+"<br/>\n")
		//$('#debug').css('background','white')
		//$('#debug').html('$(window): '+$(window).height()+"<br/>\n")
		//$('#debug').append('$(document): '+$(document).height()+"<br/>\n")
		//$('#debug').append('$("html"): '+$("html").height()+"<br/>\n")
		//$('#debug').append('$("body"): '+$("body").height()+"<br/>\n")
		//$('#debug').append('document.body.clientHeight: '+document.body.clientHeight+"<br/>\n")
		//$('#debug').append('window.innerHeight: '+window.innerHeight+"<br/>\n")
		//$('#debug').append('document.documentElement.clientHeight: '+document.documentElement.clientHeight+"<br/>\n")
	docwid = $(window).width()
	enwid = docwid
	enhig = enwid*1100/1500
	enleft = $('#container').offset().left+271
	
	$('area[class!="menu"][href='+document.location.href+']').parent().parent().addClass('hactive')
	$('area[class!="menu"][href!='+document.location.href+']').hover(
		function(){
			$('area[href='+$(this).attr('href')+']').parent().parent().addClass('hactive')
		},
		function(){
			$('area[href='+$(this).attr('href')+']').parent().parent().removeClass('hactive')
		})
	
	var imglib = new Array()
     $("li.thumbitem").each(function(){
		imglib[$("li.thumbitem").index($(this))] = new Array($(this).find('span.mini').text(), $(this).find('span.big').text(), $(this).find('span.desc').text())
	})
	
	kierunek = 1
	widoczne = 0
	$('a.small').attr('href', imglib[widoczne][1])
	$('img.small').attr('src',imglib[widoczne][0])
	$('a.go').click(function(e){
		e.preventDefault()
		if($(this).attr('id')=='goright'){
			widoczne = widoczne<imglib.length-1 ? widoczne+1 : 0
			kierunek = 1
		}
		else{ 
			widoczne = widoczne>0 ? widoczne-1 : imglib.length-1
			kierunek = -1
		}
		$('img.small').animate({left: -50*kierunek, opacity: 0}, 'normal', 'swing', function(){
			$('#loading').css('display', 'block')
			$('a.small').attr('href', imglib[widoczne][1])
			$('img.small').attr('src',imglib[widoczne][0])
		})
	})
	
	$('a.small').click(function(e){
		e.preventDefault()
		//alert($('html').scrollTop() +"\n"+$('html').attr('scrollTop'))
		/*
		*/
		$('#container').fadeOut('normal', function(){
			$('body').css('overflow', 'hidden')
			pamietajscroll = $('html').scrollTop()
			$('html').animate({scrollTop:0}, 'normal', 'swing', function(){
				//przelicz()
				$('img.big').fadeIn('normal', function(){
					$('#enlargement').animate({width: enwid, height: enhig, left: (docwid-enwid)/2, top: ($(window).height()-enhig)/2}, 
										'normal', 'swing')
				})
			})
		})
	})
	
	jQuery('<div>').attr('id', 'dim')
				.css('position', 'absolute')
				.css('overflow', 'hidden')
				.css('top', 0)
				.css('left', 0)
				.css('height', ($(window).height()<600) ? 600 : '100%' )
				.css('width', '100%')
				.css('z-index', '1')
				.insertBefore('#container')
	jQuery('<div>').attr('id', 'enlargement')
				.css('position', 'absolute')
				.css('height', 360)
				.css('width', 490)
				.css('top', 75)
				.css('left', enleft)
				.css('z-index', '2')
				//.css('outline', '1px solid red')
				.appendTo('#dim')
				//.css('cursor', 'hand').css('cursor', 'pointer')
	jQuery('<img>').attr('id', 'largeblack')
				.attr('src', './html/images/enlargement.gif')
				.css('height', '100%')
				.css('width', '100%')
				.css('z-index', '3')
				.appendTo('#enlargement')
	jQuery('<img>').attr('id', 'close')
				//.attr('alt', 'Zamknij')
				//.attr('title', 'Zamknij')
				//.attr('href', '#close')
				//.css('background', 'url("./html/images/close.gif")')
				.attr('src', './html/images/close.gif')
				.css('position', 'absolute')
				.css('height', (100*40/360)+'%')
				.css('width', (100*25/490)+'%')
				.css('top', (100*90/360)+'%')
				.css('right', (100*55/490)+'%')
				.css('z-index', '6')
				.css('outline', '0px solid red')
				.appendTo('#enlargement')
				.css('cursor', 'hand').css('cursor', 'pointer')
				.click(function(e){
					e.preventDefault()
					$('#enlargement').animate({width: 490, height: 360, left: enleft, top: 75}, 'normal', 'swing', function(){
						$('img.big').fadeOut('normal', function(){
							$('html').animate({scrollTop:pamietajscroll}, 'normal', 'swing', function(){
								$('body').css('overflow', 'auto')
								$('#container').fadeIn('normal')
							})
						})
					})
				})
	jQuery('<img>').attr('id', 'loading')
				.attr('src', './html/images/loading.gif')
				.css('position', 'absolute')
				.css('top', '49%')
				.css('left', '49%')
				.css('height', 25)
				.css('width', 25)
				.css('z-index', '4')
				.appendTo('#enlargement')
	jQuery('<a>').attr('id', 'biggoleft')
				.attr('class', 'biggo')
				.attr('href', '#left')
				.css('left', 0)
				.appendTo('#enlargement')
	jQuery('<a>').attr('id', 'biggoright')
				.attr('class', 'biggo')
				.attr('href', '#right')
				.css('right', 0)
				.appendTo('#enlargement')
	$('.biggo').css('position', 'absolute')
				.css('outline', 0)
				.css('background-image', 'url("./html/images/empty.gif")')
				.css('height', (100*60/360)+'%')
				.css('width', (100*70/490)+'%')
				.css('top', (100*150/360)+'%')
				.css('z-index', '6')
				.appendTo('#enlargement')
				//.css('opacity', 0.5)
				//.css('background-color', 'blue')
				//.css('outline', '1px solid red')
				.click(function(e){
					e.preventDefault()
					if($(this).attr('id')=='biggoright'){
						widoczne = widoczne<imglib.length-1 ? widoczne+1 : 0
						kierunek = 1
					}
					else{ 
						widoczne = widoczne>0 ? widoczne-1 : imglib.length-1
						kierunek = -1
					}
					$('img.big').animate({marginLeft: -(50*enwid/490)*kierunek, opacity: 0}, 'fast', 'swing', function(){
						$('#loading').css('display', 'block')
						$('img.big').css('display', 'none')
						$('a.small').attr('href', imglib[widoczne][1])
						$('img.small').attr('src',imglib[widoczne][0])
					})
				})
	/*
	//$('#debug').append('okno: '+$(window).width()+'x'+$(window).height()+'<br/>')
	//$('#debug').append('dokument: '+docwid+'x'+$(document).height()+'<br/>')
	*/
	function przelicz(){
		
		//$('#debug').append($(document).width()+' - '+$(window).width()+'<br/>');
		//$('#debug').append($('img.big').css('height').slice(0,-1)/100+'*'+enhig+' = '+$('img.big').css('height').slice(0,-1)/100*enhig+' > '+oheight+'<br/>')
		/*
		*/
		// img.big nie większy niż osize
		//$('#dim').css('height', ($(window).height()<600) ? 600 : '100%' )
		if($('img.big').css('height').slice(0,-1)/100 * (docwid*1100/1500) > oheight){
			//imgbigheight*360/100*srednica/300 = oheight
			//newenhig = Math.round($('img.big').css('height').slice(0,-1)/100*srednica*360/300)
			
			toobighig = $('img.big').css('height').slice(0,-1)/100*(docwid*1100/1500)
			//$('#debug').append('za duze => '+enhig+'*'+oheight+'/'+toobighig+'='+newenhig+'<br/>')
			enhig = Math.round( (docwid*1100/1500)*oheight/toobighig )
			enwid = enhig/1100*1500
			//$('#debug').append(enhig+'<br/>')
		}
		else{
			enwid = docwid
			enhig = docwid*1100/1500
		}
		
		enleft = (docwid-800)/2+271
		
		/*
		*/
		// img.big height nie większy niż $(window).height()-20
		if($('img.big').css('height').slice(0,-1)/100 * enhig > $(window).height() ){
			toobighig = $('img.big').css('height').slice(0,-1)/100*enhig
			desiredheight = $(window).height()-50
			//$('#debug').append(desiredheight+'<br/>')
			enhig = Math.round( (docwid*1100/1500)*desiredheight/toobighig )
			enwid = enhig/1100*1500
		}
		//$('#debug').append(enwid+'x'+enhig+'<br/>')
		
		if($('#enlargement').width()!=490) $('#enlargement').animate({width: enwid, height: enhig, left: (docwid-enwid)/2, top: ($(window).height()-enhig)/2}, 
							'fast', 'swing')
		/*
		$('#dim').css('height', ($(window).height()<600) ? 600 : '100%' )
		if($('#enlargement').width()==490) $('#enlargement').css('left', enleft)
		else $('#enlargement').css({width: enwid, height: enhig, left: (docwid-enwid)/2, top: ($(document).height()-enhig)/2})
		*/
	}
	jQuery('<img>').attr('class', 'big')
				.css('position', 'absolute')
				.css('display', 'none')
				.css('z-index', '5')
				.appendTo('#enlargement')
				.load(function(){
					/*
					//$('#debug').append('test: '+this.height+'<br/>')
					*/
					$('#loading').css('display', 'none')
					temp = new Image()
					temp.src = $(this).attr('src')
					temp2 = jQuery("<img>").attr("src", $(this).attr('src'))
					//owidth = jQuery("<img>").attr("src", $(this).attr('src')).attr('width')
					//oheight = jQuery("<img>").attr("src", $(this).attr('src')).attr('height')
					//owidth = temp.width
					//oheight = temp.height
					owidth = temp.width==0 ? this.width : temp.width
					oheight = temp.height==0 ? this.height : temp.height
					//owidth = Math.max(temp.width, this.width)
					//oheight = Math.max(temp.height, this.height)
					srednica = Math.sqrt(Math.pow(owidth,2)+Math.pow(oheight,2))
					/*
					//$('#debug').html('')
					//$('#debug').append("$(this).width()="+$(this).width()+' x '+$(this).height()+'<br/>')
					//$('#debug').append("$('img.big').width()="+$('img.big').width()+' x '+$('img.big').height()+'<br/>')
					//$('#debug').append("$('img.big').attr('width')="+$('img.big').attr('width')+' x '+$('img.big').attr('height')+'<br/>')
					//$('#debug').append("this.width="+this.width+' x '+this.height+'<br/>')
					//$('#debug').append("temp.width="+temp.width+' x '+temp.height+'<br/>')
					//$('#debug').append("jQuery('\< img \>').attr="+jQuery("<img>").attr("src", $(this).attr('src')).attr('width')+' x '+jQuery("<img>").attr("src", $(this).attr('src')).attr('height')+'<br/>')
					temp2.load(function(){
						//$('#debug').append("load $(this).width()="+$(this).width()+' x '+$(this).height()+'<br/>')
						//$('#debug').append("load this.width="+this.width+' x '+this.height+'<br/>')
						//$('#debug').append("load temp2.width="+temp2.width()+' x '+temp2.height()+'<br/>')
						//$('#debug').append('<br/>')
					})
					//$('#debug').append('<br/>')
					*/
					//$('#debug').append($(this).attr('class')+'<br/>')
					$('img.big').css('top', Math.round(100*(360/2 - (oheight * 300/srednica)/2)/360) +'%')
							.css('left', Math.round(100*(490/2 - (owidth * 300/srednica)/2)/490) +'%')
							.width(Math.round(100*(owidth * 300/srednica)/490) +'%')
							.height(Math.round(100*(oheight * 300/srednica)/360) +'%')
					przelicz()
					if($('#enlargement').width()!=490){
						$('img.big').css('display', 'block')
						$('#enlargement').animate({width: enwid, height: enhig, left: (docwid-enwid)/2, top: ($(window).height()-enhig)/2}, 
											'fast', 'swing', function(){
							$('img.big').css('marginLeft',(50*enwid/490)*kierunek).animate({marginLeft: 0, opacity: 1}, 'fast', 'swing')
						})
					}
				})
				//.css('cursor', 'hand').css('cursor', 'pointer')
	
	$('img.small').load(function(){
						$('img.big').attr('src',imglib[widoczne][1])
						$('img.small').css('left',50*kierunek).animate({left: 0, opacity: 1}, 'normal', 'swing')
					})
	$('a.small').attr('href', imglib[widoczne][1])
	$('img.small').attr('src',imglib[widoczne][0])
	
})