// Parametry do modyfikacji
var opacityLevel = 75;
var slideshowTime = 5000;
var imagesPath = "./images/picturebox/"


// Zmienne ktorych nie modyfikujemy
var contentDivXY = new Array(210,220);
var pictureXY = new Array(0,0);
var pictureRealXY = new Array(0,0);

var picture;
var pictureTitle;
var pictureUrl;
var pictureGroup;

var timerId, timeIdSlideshow;
var currentOpacityLevel = 0;
var infoStrapHeight = 0;

var pageHeight, pageWidth ;
var windowDim = new Array(4);
var windowScroll = new Array(2);

var album = new Array();
var albumDescribe = new Array();
var albumIndex = 0;

var singlePicture = true;	// jesli zostanie wybrana opcja album lub slideshow (ale bedzie tam tylko jedno zdjecie) to singlePicture ustawiana jest na true i zdjecie jest wyswietlane jako pojedyncze picturebox
var slideshow = false;		// jesli slidshow == true to album zamienia sie w pokaz slajdow

function keyEnd(e) {
	return false;
}

function kp(e) {
   if (typeof(Event)=='function') { //NN
      var kod=e.which;
      var shift=e.modifiers & Event.SHIFT_MASK;
      var alt=e.modifiers & Event.ALT_MASK;
      var ctrl=e.modifiers & Event.CONTROL_MASK;
   } else { //IE
      var kod=event.keyCode;
      var shift = event.shiftKey;
      var alt = event.altKey;
      var ctrl = event.ctrlKey;
   }

	if (albumIndex == 0) {
		if (kod == 39) {
			albumNext();
			document.onkeyup = keyEnd;
		} else if (kod == 27 || kod == 88) {
			picureboxClose();
		} else {
			// inny klawisz
		}
	} else if (albumIndex == (album.length - 1)) {
		if (kod == 37) {
			albumPrevious();
			document.onkeyup = keyEnd;
		} else if (kod == 27 || kod == 88) {
			picureboxClose();
		} else {
			// inny klawisz
		}
	} else {
		if (kod == 37) {
			albumPrevious();
			document.onkeyup = keyEnd;
		} else if (kod == 39) {
			document.onkeyup = keyEnd;
			albumNext();
		} else if (kod == 27 || kod == 88) {
			picureboxClose();
		} else {
			// inny klawisz
		}
	}
}

function getPageSize(){
   
   var xScroll, yScroll;
   
   if (window.innerHeight && window.scrollMaxY) {   
      xScroll = document.body.scrollWidth;
      yScroll = window.innerHeight + window.scrollMaxY;
   } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
      xScroll = document.body.scrollWidth;
      yScroll = document.body.scrollHeight;
   } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
      xScroll = document.body.offsetWidth;
      yScroll = document.body.offsetHeight;
   }

  
   var windowWidth, windowHeight;
   if (self.innerHeight) {   // all except Explorer
      windowWidth = self.innerWidth;
      windowHeight = self.innerHeight;
   } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
      windowWidth = document.documentElement.clientWidth;
      windowHeight = document.documentElement.clientHeight;
   } else if (document.body) { // other Explorers
      windowWidth = document.body.clientWidth;
      windowHeight = document.body.clientHeight;
   }

   
   // for small pages with total height less then height of the viewport
   if(yScroll < windowHeight){
      pageHeight = windowHeight;
   } else {
      pageHeight = yScroll;
   }

   // for small pages with total width less then width of the viewport
   if(xScroll < windowWidth){   
      pageWidth = windowWidth;
   } else {
      pageWidth = xScroll;
   }


   arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
   return arrayPageSize;
}

function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }

   polozenie = new Array(scrOfX,scrOfY)
   return polozenie;
}

function picureboxClose() {
	album = new Array();
	albumDescribe = new Array();
	document.onkeyup = keyEnd;
	if (slideshow) {
		clearInterval(timeIdSlideshow);
	}
	albumIndex = 0;
	slideshow = false;
	singlePicture = true;
	timerId = setInterval("fadeOut()",5);


}

function infoStrap() {
	if (infoStrapHeight < 50) {
		infoStrapHeight = infoStrapHeight + 10;
		document.getElementById('picturebox_info').style.height = infoStrapHeight + 'px';
	} else {
		document.getElementById('picturebox_info').style.height = 50 + 'px';

 		if (singlePicture) {
			document.getElementById('picturebox_info').innerHTML = '<span style="font-size: 11px;font-family: Tahoma;color: black;font-weight: normal; position: absolute; left: 0px; top: 5px;">&nbsp;' + pictureTitle + '&nbsp;</span><img src="' + imagesPath + 'close.jpg" onclick="picureboxClose()" alt="close picture" title="close picture" style="cursor: pointer; border: 0px; position: absolute; right: 0px; top: 5px;" />';
		} else {
			document.onkeyup=kp;
			if (albumIndex == 0) {
				document.getElementById('picturebox_info').innerHTML = '<span style="font-size: 11px;font-family: Tahoma;color: black;font-weight: normal; position: absolute; left: 0px; top: 5px;">&nbsp;' + pictureTitle + '&nbsp;</span><img src="' + imagesPath + 'close.jpg" onclick="picureboxClose()" alt="close picture" title="close picture" style="cursor: pointer; border: 0px; position: absolute; right: 0px; top: 5px;" /><img src="' + imagesPath + 'next.jpg" onclick="albumNext()" alt="next picture" title="next picture" style="cursor: pointer; border: 0px; position: absolute; right: 30px; top: 5px;" />';
				if (slideshow) {
					timeIdSlideshow = setTimeout('albumNext()',slideshowTime);
				}
			} else if (albumIndex == (album.length - 1)) {
				document.getElementById('picturebox_info').innerHTML = '<span style="font-size: 11px;font-family: Tahoma;color: black;font-weight: normal; position: absolute; left: 0px; top: 5px;">&nbsp;' + pictureTitle + '&nbsp;</span><img src="' + imagesPath + 'close.jpg" onclick="picureboxClose()" alt="close picture" title="close picture" style="cursor: pointer; border: 0px; position: absolute; right: 0px; top: 5px;" /><img src="' + imagesPath + 'previous.jpg" OnClick="albumPrevious()" alt="previous picture" title="previous picture" style="cursor: pointer; border: 0px; position: absolute; right: 60px; top: 5px;" />';
				if (slideshow) {
					timeIdSlideshow = setTimeout('picureboxClose()',slideshowTime);
				}
			} else {
				document.getElementById('picturebox_info').innerHTML = '<span style="font-size: 11px;font-family: Tahoma;color: black;font-weight: normal; position: absolute; left: 0px; top: 5px;">&nbsp;' + pictureTitle + '&nbsp;</span><img src="' + imagesPath + 'close.jpg" onclick="picureboxClose()" alt="close picture" title="close picture" style="cursor: pointer; border: 0px; position:absolute; right:0px; top: 5px;" /><img src="' + imagesPath + 'next.jpg" onclick="albumNext()" alt="next picture" title="next picture" style="cursor: pointer; border: 0px; position: absolute; right:30px; top: 5px;" /><img src="' + imagesPath + 'previous.jpg" OnClick="albumPrevious()" alt="previous picture" title="previous picture" style="cursor: pointer; border: 0px; position: absolute; right: 60px; top: 5px;" />';
				if (slideshow) {
					timeIdSlideshow = setTimeout('albumNext()',slideshowTime);
				}
			}
		}

		infoStrapHeight = 0;
		clearInterval(timerId);
	}
}

function albumNext() {
	if (slideshow) {
		clearInterval(timeIdSlideshow);
	}

	albumIndex ++;

	picture = new Image();
	picture.src = album[albumIndex]

	pictureXY[0] = 0;
	pictureXY[1] = 0;

	windowScroll= getScrollXY();

	pictureTitle =  "<b>Album - " + pictureGroup + ": " + (albumIndex + 1) + "/" + album.length+ "</b> - " + albumDescribe[albumIndex]

	document.getElementById("picturebox_div_02").style.top = (windowScroll[1] + 20) + 'px';
	document.getElementById('picturebox_info').innerHTML = '';
	document.getElementById('picturebox_info').style.height = infoStrapHeight + 'px';

	timerId = setInterval("fadeIn();",5);
	
}

function albumPrevious() {
	if (slideshow) {
		clearInterval(timeIdSlideshow);
	}

	albumIndex --;

	picture = new Image();
	picture.src = album[albumIndex]

	pictureXY[0] = 0;
	pictureXY[1] = 0;

	windowScroll = getScrollXY();

	pictureTitle =  "<b>Album - " + pictureGroup + ": " + (albumIndex + 1) + "/" + album.length + "</b> - " + albumDescribe[albumIndex]

	document.getElementById("picturebox_div_02").style.top = (windowScroll[1] + 20) + 'px';
	document.getElementById('picturebox_info').innerHTML = '';
	document.getElementById('picturebox_info').style.height = infoStrapHeight + 'px';

	timerId = setInterval("fadeIn();",5);
}


function resizeHeight() {

       	var step = 50;
	if (pictureXY[1] > contentDivXY[1]) {

		if ((pictureXY[1] - contentDivXY[1]) < step) {
			document.getElementById('picturebox_content').style.height = pictureXY[1] + 'px';
			contentDivXY[1] = pictureXY[1];
		} else {
			document.getElementById('picturebox_content').style.height = (contentDivXY[1] + step) + 'px';
			contentDivXY[1] = contentDivXY[1] + step;
		}

	} else if (pictureXY[1] < contentDivXY[1]) {

		if ((contentDivXY[1] - pictureXY[1]) < step) {
			document.getElementById('picturebox_content').style.height = pictureXY[1] + 'px';
			contentDivXY[1] = pictureXY[1];
		} else {
			document.getElementById('picturebox_content').style.height = (contentDivXY[1] - step) + 'px';
			contentDivXY[1] = contentDivXY[1] - step;
		}

	} else {
		clearInterval(timerId);
		timerId = setInterval("resizeWigth();",50);
	}

}

function resizeWigth() {

	var pageWidth = document.body.scrollWidth;
	
	var step = 50;
	if (pictureXY[0] > contentDivXY[0]) {

		if ((pictureXY[0] - contentDivXY[0]) < step ) {
			document.getElementById('picturebox_div_02').style.left = ((pageWidth/2) -(pictureXY[0]/2))+'px';
			document.getElementById('picturebox_content').style.width = pictureXY[0] + 'px';
			document.getElementById('picturebox_info').style.width = pictureXY[0] + 'px';
			contentDivXY[0] = pictureXY[0];
		} else {
			document.getElementById('picturebox_div_02').style.left = ((pageWidth/2) -((contentDivXY[0] + step)/2))+'px';
			document.getElementById('picturebox_content').style.width = (contentDivXY[0] + step) + 'px';
			document.getElementById('picturebox_info').style.width = (contentDivXY[0] + step) + 'px';
			contentDivXY[0] = contentDivXY[0] + step;
		}

	} else if (pictureXY[0] < contentDivXY[0]) {

		if ((contentDivXY[0] - pictureXY[0]) < step ) {
			document.getElementById('picturebox_div_02').style.left = ((pageWidth/2) -(pictureXY[0]/2))+'px';
			document.getElementById('picturebox_content').style.width = pictureXY[0] + 'px';
			document.getElementById('picturebox_info').style.width = pictureXY[0] + 'px';
			contentDivXY[0] = pictureXY[0];
		} else {
			document.getElementById('picturebox_div_02').style.left = ((pageWidth/2) -((contentDivXY[0] - step)/2))+'px';
			document.getElementById('picturebox_content').style.width = (contentDivXY[0] - step) + 'px';
			document.getElementById('picturebox_info').style.width = (contentDivXY[0] - step) + 'px';
			contentDivXY[0] = contentDivXY[0] - step;
		}

	} else {
		clearInterval(timerId);
		document.getElementById('picturebox_content').innerHTML = '<img width="' + pictureXY[0] + '" height="' + pictureXY[1] + '" src="' + picture.src + '" alt="" />';
		timerId = setInterval("infoStrap();",50);
	}

}

function fadeOut() {
	if (0 < currentOpacityLevel) {
		document.getElementById('picturebox_div_01').style.MozOpacity = (currentOpacityLevel / 100); // Mozilla i FireFox
		document.getElementById('picturebox_div_01').style.KhtmlOpacity = (currentOpacityLevel / 100); // Safari < 1.2
		document.getElementById('picturebox_div_01').style.opacity = (currentOpacityLevel / 100); // Safari 1.2, nowszy FireFox i Mozilla
		document.getElementById('picturebox_div_01').style.filter = "alpha(opacity=" + currentOpacityLevel + ")"; // Internet Explorer
		currentOpacityLevel = currentOpacityLevel - 20;
	} else {
		currentOpacityLevel = 0;
		
		var theDiv = document.getElementById("picturebox_div_01");
        	window.document.body.removeChild(theDiv);
		theDiv = document.getElementById("picturebox_div_02");
        	window.document.body.removeChild(theDiv);

		clearInterval(timerId);
	}

}


function fadeIn() {
	if (currentOpacityLevel < opacityLevel) {
		document.getElementById('picturebox_div_01').style.MozOpacity = (currentOpacityLevel / 100); // Mozilla i FireFox
		document.getElementById('picturebox_div_01').style.KhtmlOpacity = (currentOpacityLevel / 100); // Safari < 1.2
		document.getElementById('picturebox_div_01').style.opacity = (currentOpacityLevel / 100); // Safari 1.2, nowszy FireFox i Mozilla
		document.getElementById('picturebox_div_01').style.filter = "alpha(opacity=" + currentOpacityLevel + ")"; // Internet Explorer
		currentOpacityLevel = currentOpacityLevel + 20;
	} else {
		currentOpacityLevel = (opacityLevel - 1);
		clearInterval(timerId);

		document.getElementById('picturebox_content').innerHTML = '<img src="' + imagesPath + 'loading.gif" alt="loading ..." title="loading ..." />';
		timerId = setTimeout('pictureLoad()',5);
	}

}


function pictureLoad() {
	if (picture.complete) {
		var showArea = windowDim[2]-100;
		pictureRealXY[1] = picture.height;
		pictureRealXY[0] = picture.width;

		// dopasowujemy do szerokosci okna
		if (pictureRealXY[0] > showArea) {
			pictureXY[1] = Math.round((pictureRealXY[1] * showArea) / pictureRealXY[0]);
			pictureXY[0] = showArea;
		} else {
			pictureXY[1] = pictureRealXY[1];
			pictureXY[0] = pictureRealXY[0];
		}

		// dopasowujemy do wysokosci okna
		showArea = windowDim[3]-150;
		if (pictureXY[1] > showArea) {
			pictureXY[0] = Math.round((pictureXY[0] * showArea) / pictureXY[1]);
			pictureXY[1] = showArea;
		} else {
			pictureXY[1] = pictureXY[1];
			pictureXY[0] = pictureXY[0];
		}
		//document.getElementById('picturebox_content').innerHTML = '<img src="' + imagesPath + 'loading.gif" name="picturebox_loader" id="picturebox_loader" alt="" />';
		timerId = setInterval("resizeHeight();",50);
	} else {
		timerId = setTimeout('pictureLoad()',5);
	}
}


function pictureboxStart(object) {

        contentDivXY[0] = 120;
        contentDivXY[1] = 120;
       	windowScroll = getScrollXY();
	windowDim = getPageSize();

	// gdy dokument jest nizszy niz wielkosc okna - to tlo jest wielkosci okna
	if (document.body.scrollHeight < windowDim[3]) {
		pageHeight = windowDim[3];
	} else {
		pageHeight = document.body.scrollHeight;
	}
	pageWidth = document.body.scrollWidth;

        var theDiv = document.createElement('div');
        var cssString = 'position: absolute; left:0px; top:0px; width: '+pageWidth+'px; height: '+pageHeight+'px; background-color: #000000; display: block; opacity:.0; -moz-opacity:.0; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);';
        theDiv.style.cssText = cssString;
        theDiv.setAttribute('style',cssString);
        theDiv.setAttribute('id','picturebox_div_01');
        window.document.body.appendChild(theDiv);

        theDiv = document.createElement('div');
        cssString = 'padding: 10px; background: white; border: 0px dashed black; position: absolute; left: '+ ((pageWidth/2) -60)+'px; top: '+ (windowScroll[1] + 20)+'px; min-width: 120px; min-height: 120px;';
        theDiv.style.cssText = cssString;
        theDiv.setAttribute('style',cssString);
        theDiv.setAttribute('id','picturebox_div_02');
        window.document.body.appendChild(theDiv);

	document.getElementById('picturebox_div_02').innerHTML = '<div id="picturebox_content" style="text-align:center; vertical-align:middle;"></div><div id="picturebox_info" style="position:relative;"></div>';
        
	// przyklad id="slideshow-grupa-picture_01.jpg"
	// uzyskanie: rodzaju pokazu, nazwy grupy tematycznej(jesli jest okreslona) oraz adresu grafiki do powiekszenia z id obiektu img
	var indeks_01 = object.id.indexOf("-");
	var indeks_02 = object.id.lastIndexOf("-");
	var indeks_03 = object.src.lastIndexOf("/");

	kindOfShow = object.id.substring(0,indeks_01);
	dirUrl = object.src.substring(0,indeks_03 + 1);
	pictureName = object.id.substring(indeks_02 + 1,object.id.length);
	pictureUrl = dirUrl + pictureName;
        pictureTitle = object.title;

	if (indeks_01 == indeks_02) {
	       // Forma wyświetlania - standardowy pixturebox
		singlePicture = true;
	} else {
		//  Forma wyświetlania - Album lub slideshow
		pictureGroup = object.id.substring(indeks_01 + 1,indeks_02);

		var m = 0;
		for (var j=0; j < document.images.length; j++) {
			indeks_01 = document.images[j].id.indexOf("-");
			indeks_02 = document.images[j].id.lastIndexOf("-");

			kindOfShowTmp = document.images[j].id.substring(0,indeks_01);
			pictureGroupTmp = document.images[j].id.substring(indeks_01 + 1,indeks_02);
			
			if (kindOfShow == kindOfShowTmp && pictureGroup == pictureGroupTmp) {
        			indeks_03 = document.images[j].src.lastIndexOf("/");
				dirUrlTmp = document.images[j].src.substring(0,indeks_03 + 1);
				pictureNameTmp = document.images[j].id.substring(indeks_02 + 1,document.images[j].id.length);

				album[m] = dirUrlTmp + pictureNameTmp;
				albumDescribe[m] = document.images[j].title;
				if (pictureUrl == album[m]) {
					albumIndex = m;
				}
				m++;
			}
		}

		if (kindOfShow == "slideshow") {
                        slideshow = true;
		} else {
		        slideshow = false;
		}
		
		if (album.length == 1) {
			singlePicture = true;
		} else {
			singlePicture = false;
			pictureTitle = "<b>Album - " + pictureGroup + ": " + (albumIndex + 1) + "/" + album.length + "</b> - " + pictureTitle;
		}
	}

	picture = new Image();
	picture.src = pictureUrl;
	timerId = setInterval("fadeIn();",100);


}