//      --------------------------------------------------------------------------
//      Javascript functions for www.young.ch
//      --------------------------------------------------------------------------
//      Image functions for the thumbnail/enlargements on the Image Gallery page
//      jset/funcs_gallpics_e.js
//      10-Jun-2009
            
//  	------------------------------------------------------------
//  	Image Set Menu and Thumbnails for ../gallery/index.htm
//  	------------------------------------------------------------
//  	re/writes the Set Menu
//  	makes the thumbnail set
//		first thumbnail chosen at random
//		but first get the no. pics in the new set!
//		the rest follow consecutively 
//  	data is stored in gallpics_data.js

//		-------------------------------------------
//		global variables
//		-------------------------------------------
		var Thumb1; var ThumbID; var ThumbOffset;

//		-------------------------------------------
//		basic / setup functions
//		-------------------------------------------
		function GetSet() {
			var kk = Math.floor(Math.random()*NoSets + 1);
			SetID = kk;
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);	
		}
		function DoMenu_E() {
			MakeMenuDiv();WriteMenuSet_E();
		}		
		function DoThumbnails_E() {
			MakeThumbDiv();GetThumbnails_E();
		}			
		function DoSubtitle_E() {
			MakeSubtitleDiv();WriteSubtitle_E();
		}
		function DoBigPic_E() {
			MakeBigPicDiv();GetBigPic_E();
		}			
		function DoFootnote_E() {
			MakeFootnoteDiv(); WriteFootnote_E();
		}
		function ChangeMenuAndThumbs_E() {
			WriteMenuSet_E(SetID);
			WriteSubtitle_E(SetID);
			GetThumbnails_E(SetID);
			GetBigPic_E(SetID);
			WriteFootnote_E(SetID);
		}
		function SwitchTo_1_E() {
			SetID = 1; 
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);
			ChangeMenuAndThumbs_E();
			}
		function SwitchTo_2_E() {
			SetID = 2;
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);
			ChangeMenuAndThumbs_E();
			}
		function SwitchTo_3_E() {
			SetID = 3;
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);
			ChangeMenuAndThumbs_E();
			}
		function SwitchTo_4_E() {
			SetID = 4;
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);
			ChangeMenuAndThumbs_E();
			}
		function SwitchTo_5_E() {
			SetID = 5;
			var np = eval("NoPics_" + SetID);
	        Thumb1 = Math.floor(Math.random()*np + 1);
			ChangeMenuAndThumbs_E();
			}
        function MakeMenuDiv() {
            var theTD; var theDiv;
            theTD = document.getElementById("gallMenuTD");
                theDiv = document.createElement("div");
                theDiv.id = "menuset";
				theDiv.className = "gallMenuSub";  
            theTD.appendChild(theDiv);      // creates empty DIV
        }		
        function MakeThumbDiv() {
            var theTD; var theDiv;
            theTD = document.getElementById("gallThumbsTD");
                theDiv = document.createElement("div");
                theDiv.id = "thumbset";
            	theDiv.style.textAlign = "center";     
            	theDiv.style.width = ThumbDivX;       
            	theDiv.style.height = ThumbDivY;             
            theTD.appendChild(theDiv);      // creates empty DIV
        }
        function MakeSubtitleDiv() {
            var theTD; var theDiv;
            theTD = document.getElementById("gallSetSubtitleTD");
                theDiv = document.createElement("div");
                theDiv.id = "subtitle";
				theDiv.className = "gallSubtitle";  
            theTD.appendChild(theDiv);      // creates empty DIV
        }              
        function MakeBigPicDiv() {
            var theTD; var theDiv;
            theTD = document.getElementById("gallBigPicTD");
                theDiv = document.createElement("div");
                theDiv.id = "bigpic";
            theTD.appendChild(theDiv);      // creates empty DIV
        }		
        function MakeFootnoteDiv() {
            var theTD; var theDiv;
            theTD = document.getElementById("gallFootnoteTD");
                theDiv = document.createElement("div");
                theDiv.id = "footnote";
            theTD.appendChild(theDiv);      // creates empty DIV
        }
		function StepBack() {
			var NoPics = eval("NoPics_" + SetID);
			Thumb1 = Thumb1 - 1;
			if (Thumb1 < 1) Thumb1 = NoPics;
			GetThumbnails_E();
		}		
		function StepFwd() {
			var NoPics = eval("NoPics_" + SetID);
			Thumb1 = Thumb1 + 1;
			if (Thumb1 == NoPics) Thumb1 = 1;
			GetThumbnails_E();		
		}		
        function WhichThumb () {
            var ThumbIs = 1.0 * this.id + Thumb1;
			var np = eval("NoPics_" + SetID);
			if (ThumbIs > np) ThumbIs = ThumbIs - np;
            ShowBigPic_E(ThumbIs);
        }
//		--------------------------------------
//		Write the Menu
//		--------------------------------------
		function WriteMenuSet_E() {
            var theTD = document.getElementById("gallMenuTD");
            var theDiv = document.getElementById("menuset"); 
            theTD.removeChild(theDiv);      // clears previous thumbnails            
            MakeMenuDiv();            
            theDiv = document.getElementById("menuset"); 
			theDiv.className = "gallMenuSub";
			var theSet; var theMenuName; var aMenuItem; var aText; var br;
			for (var i = 0; i < NoSets; i++) {
				theSet = i+1;
				theMenuName = SetMenuNames_E[theSet];
				if (theSet == SetID) {	// make a span not an anchor
            		aMenuItem = document.createElement("span");   
            		aMenuItem.className = "gallMenuSubIs";					
            		aText = document.createTextNode("" + theMenuName +"");					
                	aMenuItem.appendChild(aText);
            		theDiv.appendChild(aMenuItem); 
				}
				else {
            		aMenuItem = document.createElement("a");
					aMenuItem.href = "#";
            		aMenuItem.onclick = eval("SwitchTo_" + theSet + "_E");					
            		aText = document.createTextNode("" + theMenuName +"");					
                	aMenuItem.appendChild(aText);
            		theDiv.appendChild(aMenuItem); 
				}		
				if (i < (NoSets-1)) {		
            		br = document.createElement("br");  
            		theDiv.appendChild(br); 
				}
			}
		}
//		--------------------------------------
//		Get the thumbnails 
//		--------------------------------------
        function GetThumbnails_E() {
            var theSet = SetID;
			var NoPics = eval("NoPics_" + theSet);
			var theFilenameSet = eval("Filename_" + theSet);
			var thePicTitleSet = eval("PicTitle_" + theSet + "_E");
	        var thePxSet = eval("px_" + theSet);
   			var thePySet = eval("py_" + theSet);       
            var theTD = document.getElementById("gallThumbsTD");
            var theDiv = document.getElementById("thumbset"); 
            theTD.removeChild(theDiv);      // clears previous thumbnails            
            MakeThumbDiv();            
            theDiv = document.getElementById("thumbset"); 
            var aLink; var imgThumb; var np; var px; var py; var hs; var vs; var i; var k;
			np = eval("NoPics_" + SetID);
			k = Thumb1; hs = 0; vs =0;			
            for (i = 0; i < NoThumbs; i++) {	// total the thumbnail widths
				if (k > np) k = 1;
				hs = hs + 0.2*thePxSet[k];
				k = k + 1;
			}
			hs = Math.floor(0.5*(ThumbDivX - hs)/NoThumbs);
			k = Thumb1;
            for (i = 0; i < NoThumbs; i++) {	// get the thumbnails      
				if (k > np) k = 1;
                aLink = document.createElement("a");
				aLink.id = "" + i + "";
				aLink.className = "imglink";
				aLink.style.cursor = "pointer";
				aLink.onclick = WhichThumb;
				aLink.title = "" + thePicTitleSet[k] + "";
                	imgThumb = document.createElement("img");
					ThumbOffset = k - 1;
					imgThumb.id = "" + ThumbOffset + "";
					imgThumb.src = "../../gifs/gallgifs/" + theFilenameSet[k] + ".gif";
                	imgThumb.alt = "" + thePicTitleSet[k] + "";
					px = 0.2*thePxSet[k];
					py = 0.2*thePySet[k];
					vs = 0.5*(ThumbDivY - py);
					imgThumb.width = "" + px + "";
					imgThumb.height = "" + py + "";
					imgThumb.hspace = "" + hs + "";
					imgThumb.vspace = "" + vs + "";
					imgThumb.style.padding = "0";
					aLink.appendChild(imgThumb);
				theDiv.appendChild(aLink);  
				k = k + 1;            
			}
        }
//  	---------------------------------------------------------
//  	Get the big picture, ie. of the first thumbnail
//  	---------------------------------------------------------
        function GetBigPic_E() {
			var theFilenameSet = eval("Filename_" + SetID);
			var thePicTitleSet = eval("PicTitle_" + SetID + "_E");
			var theArtistNameSet = eval("ArtistName_" + SetID);
			var theMediumSet = eval("Medium_" + SetID + "_E");
			var thePicCommentSet = eval("PicComment_" + SetID + "_E");
	        var thePxSet = eval("px_" + SetID);
   			var thePySet = eval("py_" + SetID);       
            var theTD; var theDiv; var imgPic; var pTitle; var pName;  var pComment; var pText; var k;
            theTD = document.getElementById("gallBigPicTD");
                theDiv = document.getElementById("bigpic"); 
            theTD.removeChild(theDiv);      // clears previous picture
            MakeBigPicDiv();
            theDiv = document.getElementById("bigpic");
                imgPic = document.createElement("img");
                imgPic.id = "bigpic";
                imgPic.src = "../../jpgs/galljpgs/" + theFilenameSet[Thumb1] + ".jpg";
                imgPic.alt = "" + thePicTitleSet[Thumb1] + "";
                imgPic.title = "" + thePicTitleSet[Thumb1] + "";
				px = thePxSet[Thumb1];
				py = thePySet[Thumb1];
				hs = 0.5*(BigPicDivX - px);
				vs = 0.5*(BigPicDivY - py);
				imgPic.width = "" + px + "";
				imgPic.height = "" + py + "";
				imgPic.hspace = "" + hs + "";
				imgPic.vspace = "" + vs + "";
				imgPic.style.padding = "0";
            theDiv.appendChild(imgPic);					
				pTitle = document.createElement("p");
            	pTitle.style.textAlign = "center";     
            	pTitle.style.margin = "30px 0 0 0";
				pTitle.style.fontSize = "16px";
				pTitle.style.fontWeight = "bold";
                   pText = document.createTextNode("" + thePicTitleSet[Thumb1]+  "");
                pTitle.appendChild(pText);
            theDiv.appendChild(pTitle);
				pName = document.createElement("p");
            	pName.style.textAlign = "center";     
            	pName.style.margin = "10px 0 5px 0";
				pName.style.fontSize = "14px";
				pName.style.fontWeight = "normal";
                   pText = document.createTextNode("" + theMediumSet[Thumb1] + " by " + theArtistNameSet[Thumb1] + "");
                pName.appendChild(pText);
            theDiv.appendChild(pName);
				pComment = document.createElement("p");
            	pComment.style.textAlign = "center";     
            	pComment.style.margin = "0 30px 10px 0";
				pComment.style.fontSize = "11px";
				pComment.style.fontWeight = "normal";
                   pText = document.createTextNode("" + thePicCommentSet[Thumb1] + "");
                pComment.appendChild(pText);
            theDiv.appendChild(pComment);
        }
//  	---------------------------------------------------------
//  	show the big picture of the thumbnail which was clicked
//  	---------------------------------------------------------
        function ShowBigPic_E(ThumbID) {
			var theFilenameSet = eval("Filename_" + SetID);
			var thePicTitleSet = eval("PicTitle_" + SetID + "_E");
			var theArtistNameSet = eval("ArtistName_" + SetID);
			var theMediumSet = eval("Medium_" + SetID + "_E");
			var thePicCommentSet = eval("PicComment_" + SetID + "_E");
	        var thePxSet = eval("px_" + SetID);
   			var thePySet = eval("py_" + SetID);      
            var theTD; var theDiv; var imgPic; var pTitle; var pName; var pComment; var pText; var k;
            theTD = document.getElementById("gallBigPicTD");
                theDiv = document.getElementById("bigpic"); 
            theTD.removeChild(theDiv);      // clears previous picture
            MakeBigPicDiv();
            theDiv = document.getElementById("bigpic");
                imgPic = document.createElement("img");
                imgPic.id = "bigpic";
                imgPic.src = "../../jpgs/galljpgs/" + theFilenameSet[ThumbID] + ".jpg";
                imgPic.alt = "" + thePicTitleSet[ThumbID] + "";
                imgPic.title = "" + thePicTitleSet[ThumbID] + "";
				px = thePxSet[ThumbID];
				py = thePySet[ThumbID];
				hs = 0.5*(BigPicDivX - px);
				vs = 0.5*(BigPicDivY - py);
				imgPic.width = "" + px + "";
				imgPic.height = "" + py + "";
				imgPic.hspace = "" + hs + "";
				imgPic.vspace = "" + vs + "";
				imgPic.style.padding = "0";
            theDiv.appendChild(imgPic);					
				pTitle = document.createElement("p");
            	pTitle.style.textAlign = "center";     
            	pTitle.style.marginTop = "30px";
				pTitle.style.fontSize = "16px";
				pTitle.style.fontWeight = "bold";
                   pText = document.createTextNode("" + thePicTitleSet[ThumbID]+  "");
                pTitle.appendChild(pText);
            theDiv.appendChild(pTitle);
				pName = document.createElement("p");
            	pName.style.textAlign = "center";     
            	pName.style.margin = "10px 0 5px 0";
				pName.style.fontSize = "14px";
				pName.style.fontWeight = "normal";
                   pText = document.createTextNode("" + theMediumSet[ThumbID] + " by " + theArtistNameSet[ThumbID] + "");
                pName.appendChild(pText);
            theDiv.appendChild(pName);
				pComment = document.createElement("p");
            	pComment.style.textAlign = "center";     
            	pComment.style.margin = "0 30px 10px 0";
				pComment.style.fontSize = "11px";
				pComment.style.fontWeight = "normal";
                   pText = document.createTextNode("" + thePicCommentSet[ThumbID] + "");
                pComment.appendChild(pText);
            theDiv.appendChild(pComment);
		}
//		--------------------------------------
//		Write the Set Subtitle
//		--------------------------------------
		function WriteSubtitle_E() {
            theTD = document.getElementById("gallSetSubtitleTD");
            theDiv = document.getElementById("subtitle"); 
            theTD.removeChild(theDiv);      // clears previous subtitle            
            MakeSubtitleDiv();            
            theDiv = document.getElementById("subtitle");
			var theSubtitle; var pItem; var pText;
			theSubtitle = SetSubtitles_E[SetID];
            	pItem = document.createElement("p");  
            	pText = document.createTextNode("" + theSubtitle +"");					
            	pItem.appendChild(pText);
            theDiv.appendChild(pItem);			
		}
//		--------------------------------------
//		Write the Set Footnote
//		--------------------------------------
		function WriteFootnote_E() {
            theTD = document.getElementById("gallFootnoteTD");
            theDiv = document.getElementById("footnote"); 
            theTD.removeChild(theDiv);      // clears previous subtitle            
            MakeFootnoteDiv();            
            theDiv = document.getElementById("footnote");
			var theFootnote; var pItem; var pText;
			theFootnote = SetFootnotes_E[SetID];
            	pItem = document.createElement("p"); 
            	pText = document.createTextNode("" + theFootnote +"");					
            	pItem.appendChild(pText);
            theDiv.appendChild(pItem);			
		}
		 
        
// ---------------- End