function SlideImage() {
	var this1 = this;
	var debug	= true;

	this.id = "SlideImage"; // name of this object

	logit('SlideImage');
	// Input
	this.getfunc = 'next';	
	//this.getorder = 'time';
	this.getorder = 'random'; // time or random
	this.getafterfile = '';		// get next file
	this.getafterdate = '';		// get next after this date
	this.getaftercity = '';   // get next after this city and afterdate
	this.getfileName = '';
	this.getkeywords = '';
  this.getcountryIso = '';
  this.getcity = '';
	this.divheight	= 0;
	this.divwidth	= 0;
	this.noimage = false; // set to true when no more images found

	this.displaySize = 'big';
  this.displayFunc = 'slide'; // slide (normal),popup (lightbox)
	this.def_fade_speed = 1500; 
  // Output
  this.pic  = new SlidePic();
	this.statuscd = "";
	// local variables for swapping image
	var imageId 	= new Array(); 	// contains Id of random image 
	var textId 		= new Array(); 	// contains Id of random image 
	var imageIdx1 = 2; 					// indicates index of current active Id 
	// set defaults for Pic Div & Image DOM id's
	
	var maindiv         = '#picslide';

	//this.maxwidth    = 804;
	//this.maxheigth   = 804;
	//this.miniMap 		= 'img#imageMap1';

	this.borderclass = '';
	this.ready       = true;   // tells if this object is ready for next request.
	// Local vars for easy id-access
	//var DivIdOn  		= "";
	//var DivIdOff 		= "";
	var ImageOn  		= "";
	//var ImageOff 		= "";
	var ImageTextOn = "";
	//var ImageTextOff= "";

  var imageFirst = true;
  
  var fade_speed = 0;  // declare only
  //var clickData = new Array();

  /*----------------------------------------------------------------------------------------
  
   Callbacks
  
   -----------------------------------------------------------------------------------------*/
  this.onready = function() {
  }
  this.changestatus = function() {
  }
  /*----------------------------------------------------------------------------------------
  
   Init
  
   -----------------------------------------------------------------------------------------*/
	this.initSlideImage = function() {
		this1 = this;
		logit("initSlideImage this.id="+this.id);
	  // Determine displaysize and border-type
	   
		if ($(maindiv).hasClass("big")) {
			logit("maindiv has class big");
			this.displaySize = 'big';
			this.borderClass = 'borderBig';
		} else if($(maindiv).hasClass("thumb")) {
			logit("maindiv has class thumb");
			this.borderClass = 'borderThumb';
			this.displaySize = 'thumb';
		} else if($(maindiv).hasClass("thumb4")) {
			logit("maindiv has class thumb4");
			this.borderClass = '';
			this.displaySize = 'thumb4';
		} else if($(maindiv).hasClass("popupslide")) {
			logit("maindiv has class popupslide");
			this.borderClass = 'borderPopupslide';
			this.displaySize = 'popupslide';
		}
		logit('displaySize('+maindiv+')='+this.displaySize);
	
		logit("div height="+$("#page").height());
		logit("div width="+$(maindiv).width());
	
		// determine height/width when display size = popupslide
		if (this.displaySize == 'popupslide') {
			this.divheight	  = $(maindiv).parent().height();
			this.divwidth			= $(maindiv).parent().width();
		  logit("maindiv<"+maindiv+"> height/width:"+this.divheight+'/'+this.divwidth);
			$(maindiv).height(this.divheight)
									.width(this.divwidth);
			$(maindiv+" div").height(this.divheight)
													.width(this.divwidth);
		} else {
			this.divheight	    = $(maindiv).height();
			this.divwidth				= $(maindiv).width();
		}

		// init maindiv 
	  this.setDiv(maindiv,1); // initial call

		// Set the Lightbox for each Slide-Picture
		//$(maindiv+" div:has(div#slide1)").each(function(n) {
		$("div#picslide img").each(function(n) {
			logit('setclick:'+this1.id+"/"+$(this).parent()[0].id);
			$(this).click(function () {
				logit("------------click="+this1.displaySize+"/"+this1.statuscd);
				if (this1.statuscd == 'ready' || this1.statuscd == 'swapped') {
					if (this1.displaySize == 'thumb4') {
						if ($(this).parent()[0].id == "idslide2") {
							var containerid = $(this).parent().parent().parent()[0];
						} else {
							var containerid = $(this).parent().parent()[0];
						}
						//containerid = maindiv;
						var filen1 = $(containerid).attr("henk");
						var filet1 = $(containerid).attr("title");
						logit("Container id="+containerid+"/"+filen1+"/"+filet1);
						showLightBox(filen1,filet1);
					} else {
						showLightBox($(maindiv).attr("henk"),$(maindiv).attr("title"));
					}
				}
				//}
			});
		});
	}
  /*----------------------------------------------------------------------------------------
  
   Method : setWidthHeight
  
   -----------------------------------------------------------------------------------------*/

	this.setWidthHeight = function(width,height) {
		logit('setWidthHeight:'+width+'/'+height);
		this1.divwidth = width;
		this1.divheight = height;
		$(maindiv).height(this1.divheight)
								.width(this1.divwidth);
		$(maindiv+" div").height(this1.divheight)
												.width(this1.divwidth);
		setTopMargin(this1,ImageOn);
	}
  /*----------------------------------------------------------------------------------------
  
   Method : setDiv : mainly for the Thumb-page

		div : main div-id
		slideNr : 1 - first,2 - second,1 - third etc   
   -----------------------------------------------------------------------------------------*/
 	this.setDiv = function(div,slideNr) {
 		logit("setDiv div="+div+',slide='+slideNr);
		maindiv 				= div;
		
		if (slideNr == 1) {
			imageIdx1 	= 2;
		} else {
			imageIdx1 	= 1;
		}
		imageId[1]	= div+' div.slide1 > img';
		imageId[2] 	= div+' div.slide2 > img';
		textId[1] 	= div+' div.slide1 > p';
		textId[2] 	= div+' div.slide2 > p';
		this.DivId2			= div+' div.slide2'; // this is the div that will be faded (front div)
	}
	this.newImage = function() {
		this.setDiv(maindiv,2);
		$(imageId[1]).css("visibility","hidden");
		$(imageId[2]).css("visibility","hidden");
		$(textId[1]).html("").removeClass(this1.borderClass);
		$(textId[2]).html("").removeClass(this1.borderClass);
	}
  /*----------------------------------------------------------------------------------------
  
   Method : getPic
  
   -----------------------------------------------------------------------------------------*/
	this.getPic = function() {
		//var this1 = this;
		
		logit("------------------------------------------get id="+this.id);
	  newstatus("loading");
	  
		this.pic.init(); // init pic object (empty)
		
		this.ready   = false;  // in progress...
	
		// if forward/backward button is pressed then no fade
	  if (this.getfunc == 'next' || this.getfunc == 'prev') {
			fade_speed = 0; // faster speed when button pressed
		} else {
			fade_speed = this.def_fade_speed; //1500; // normale fade speed
		}	  	
	  //if (debug) alert("start getPic");
	  // AJAX - call
		$.ajax({
			type	: "GET",
			url		: "ajaxGetPic.php",
			data	: "func="				 +this.getfunc
							+"&fileName="	 +this.getfileName
							+"&size="			 +this.displaySize
							+"&keywords="	 +this.getkeywords
							+"&countryIso="+this.getcountryIso
							+"&city="			 +this.getcity
							+"&order="		 +this.getorder
							+"&afterfile=" +this.getafterfile
							+"&afterdate=" +this.getafterdate
							+"&aftercity=" +this.getaftercity,
			error: function() {
				logit("error getting ajaxGetPic");
				newstatus("error");
			},
			success: function(data){
				if (this.getfunc == 'first') {this.getfunc = '';} // reset first get
				copyImgData(this1,data);
				this1.getafterfile = ''; // reset for the next get
				this1.getafterdate = ''; // reset for the next get
				this1.getaftercity = ''; // reset for the next get
			}
			}); //ajax
	}
	var copyImgData = function(this1,data) {
		this1.pic.errormsg = '';
		logit("copyImgData id="+this1.id);
  	this1.pic.fileName	 	= $(data).find('filename').text();
		if (this1.pic.fileName != '') {
			this1.noimage = false;
			var loadedImgSrc = "";
	  	this1.pic.fileName	 		= $(data).find('filename').text();
	  	this1.pic.picrate 	 		= $(data).find('picrate').text();
	  	this1.pic.continent 		= $(data).find('continent').text();
	  	this1.pic.country 	 		= $(data).find('country').text();
	  	this1.pic.state 		 		= $(data).find('state').text();
	  	this1.pic.city 					= $(data).find('city').text();
	  	this1.pic.album 	  		= $(data).find('album').text();
	  	this1.pic.geocountrycd 	= $(data).find('GeoCountryCd').text();
	  	this1.pic.geoarea 			= $(data).find('GeoArea').text();
	  	this1.pic.description 	= $(data).find('description').text();
	  	this1.pic.keywords    	= $(data).find('keywords').text();
	  	this1.pic.sublocation 	= $(data).find('sublocation').text();
	  	this1.pic.active      	= $(data).find('active').text();
	  	this1.pic.focallength 	= $(data).find('focallength').text();
	  	this1.pic.taken_date 		= $(data).find('taken_date').text();
	  	this1.pic.point.lat 		= $(data).find('gpslat').text();
	  	this1.pic.point.lng 		= $(data).find('gpslng').text();
	  	this1.pic.bigexists 		= $(data).find('bigexists').text();
	  	this1.pic.gpssource 		= $(data).find('gpssource').text();
	  	this1.pic.file_type 		= $(data).find('file_type').text();
	  	this1.pic.video_id 			= $(data).find('video_id').text();

			this1.pic.pictext = this1.pic.country;
			if (this1.pic.city != '' && this1.pic.city != this1.pic.country) {
				this1.pic.pictext = this1.pic.pictext + ',' + this1.pic.city;
			}

			// no GPS data then init null
	  	if (this1.pic.point.lat == '' || this1.pic.point.lng == '') {
	  		this1.pic.point.init();
	  	}
	  	// when no big image exists then use normal size source
	  	if (this1.pic.bigexists == '1') {
	  		this1.pic.bigsrc		= $(data).find('bigsource').attr('src');
		  	this1.pic.bigwidth	= parseInt($(data).find('bigwidth').text());
		  	this1.pic.bigheight	= parseInt($(data).find('bigheight').text());
  			logit('BIG exists:'+this1.pic.bigsrc+'/width='+this1.pic.bigwidth+'/height='+this1.pic.bigheight);
	  	} else {
		  	this1.pic.bigsrc 		= $(data).find('imagesource').attr('src');
  			logit('BIG NOT exists:'+this1.pic.bigsrc);
  		}
			// is there thumb source file, then copy source-filename and name title		  		
	  	var thumb = $(data).find('imagethumb').attr('src');
	  	if (thumb != undefined) {
	  		this1.pic.imagethumb.title = this1.pic.fileName;
	  		this1.pic.imagethumb.src	= thumb;
	  	}
	  	// depending what size should be showed, load the correct size image in Image object

			// Determine mediatype : .MOV or .JPG		
			var dotpos = this1.pic.fileName.lastIndexOf('.');
	    this1.pic.mediatype = this1.pic.fileName.substr(dotpos+1).toUpperCase();


	  	logit("this1.displaySize="+this1.displaySize);
  		switch(this1.displaySize) {
  			case "thumb4":
	  			loadedImgSrc = $(data).find('imagethumb4').attr('src');
	  			break;
	  		case "thumb":
		  		loadedImgSrc = this1.pic.imagethumb.src;
		  		break;
		  	default:
		  	  logit("------------------Divwidth="+this1.divwidth+",Divheight="+this1.divheight+',bigwidth='+this1.pic.bigwidth+',bigheight='+this1.pic.bigheight);
		  		if (this1.pic.bigexists == '1'
		  		  && this1.divwidth > 0 
		  		  && this1.divwidth >= this1.pic.bigwidth
		  		  && this1.divheight >= this1.pic.bigheight) {
		  		  logit("USE BIG");
		  			loadedImgSrc = this1.pic.bigsrc;
		  		} else {
		  			logit("Use small,no big");
		  			if (this1.pic.mediatype == 'JPG') {
			  			loadedImgSrc = $(data).find('imagesource').attr('src');
			  		} else {
			  			// other media : load thumb
			  			logit("media no jpg this load thumb:"+this1.pic.mediatype);
				  		loadedImgSrc = this1.pic.imagethumb.src;
			  		}
			  	}
		  		// load GEO-Map, not for other sizes 
			  	this1.pic.geomap.src = getGeoMap(160,100,this1.pic.geocountrycd,this1.pic.geoarea);
	  	}

	  	// wait till Image is loaded
  		imgLoaded(loadedImgSrc,function(loadedImg) {
		  	logit('xml width :'+loadedImg.width);
				// when Image too big, then resize
		  	var newwidth = loadedImg.width;
		  	var newheight = loadedImg.height;
		  	if (loadedImg.width > this1.divwidth) {
		  		newwidth = this1.divwidth;
		  		newheight = Math.round((newwidth/loadedImg.width)*loadedImg.height);
		  		logit('Resize:'+loadedImg.width+','+loadedImg.height+'->'+newwidth+','+newheight);
			  } else {
		  		logit('NO Resize:'+loadedImg.width+','+loadedImg.height);
		  	}
				this1.pic.img.src = loadedImg.src;					 
				this1.pic.img.width = newwidth;
				this1.pic.img.height = newheight;
				this1.pic.img.id = this1.pic.bigsrc;
	  		afterload(this1);
	  	});
	  	
	  	logit('xml src :'+loadedImgSrc+'/'+this1.pic.mediatype);
	  	logit('xml fileName :'+this1.pic.fileName);
			newstatus("received");
  	} else {
  		this1.noimage = true;
  		this1.pic.point.init();
  		var server_error = $(data).find('error').text();
  		this1.pic.errormsg = server_error;
  		switch(server_error) {
			case 'PREV NOT FOUND':
				logit('Previous not found');
			  break;
			case 'NEXT NOT FOUND':
				logit('Next not found');
				// display end image
				if (this1.displaySize != 'thumb' && this1.displaySize != 'thumb4') {
					this1.pic.imgdescript = 'No more images for this selection';
		  		imgLoaded('images/TheEnd.jpg',function(loadedImg) {
						this1.pic.img.src = loadedImg.src;					 
						this1.pic.img.width = loadedImg.width;
						this1.pic.img.height = loadedImg.height;
			  		swapImage(this1);
		  		});
				}
			  break;
			default:
			  logit('Other Error');
			}  			
  	  logit('NOT found data');
  	  newstatus("notfound");
  	}
	} 
	/*
	internal function called after fade is ready.
	*/
	var newstatus = function(statuscd) {
		logit("newstatus:"+statuscd);
		this1.statuscd = statuscd;
		this1.changestatus();
		switch (statuscd) {
	  case "loading":
	  case "received":
	  case "swapped":
	    break;
	  case "error":
	  	break;   
	  case "notfound":
	    break;
	  case "ready":
	    this1.ready = true;
	    this1.onready();
	    break;
	  default:
	    break;
		}
	}	
	var afterload = function(this1) {
		logit('afterload');
  	if (this1.displayFunc == 'slide' && this1.mediatype != 'MOV') {
			swapImage(this1);
		} 
		else if (this1.mediatype == 'MOV') {
			showMov(this1);
		} else {
			// showLightBox(this1); --> wrong parameters 
		}
	}
	var DivSwap = function() {
		if (imageIdx1 == 1) {
			imageIdx1 = 2;
		} else {
			imageIdx1 = 1;
		}
		ImageOn  = imageId[imageIdx1];
		ImageTextOn  = textId[imageIdx1];
	}

	var swapImage = function(this1){
		logit("swapImage:Slide");
			  	
		// get image description + alt-text
		if (this1.pic.imgdescript != '') {
			this1.pic.pictext = this1.pic.imgdescript;
		} 
		var alt_text = this1.pic.pictext;
		// Swap Div id's
		DivSwap();
		// init for first display
		if (imageIdx1 == 1) {
			if ($(imageId[1]).css("visibility") == "hidden") {
				$(imageId[1]).addClass(this1.borderClass).css("visibility","visible");
			} 
		} else {
			if ($(imageId[2]).css("visibility") == "hidden") {
				$(this1.DivId2).css('opacity',0);
				$(imageId[2]).addClass(this1.borderClass).css("visibility","visible");
			} 
		}
		// fadeout div, also for first, to set opacity to 0
		logit('FADE OUT:'+fade_speed);
	  // copy new image data into On-Div
		$(ImageOn).attr("src",this1.pic.img.src);
		setTopMargin(this1,ImageOn);
		$(maindiv).attr("henk",this1.pic.img.id)
		            .attr("title",this1.pic.pictext);
		$(ImageOn).attr("title",alt_text)
		          .attr("alt",alt_text); 
	  $(ImageTextOn).html(this1.pic.pictext);
	
		logit(ImageOn+' set to:'+this1.pic.img.src);

		if (fade_speed == 0) {
			// NO fade, just show image
			if (imageIdx1 == 1) {
				$(this1.DivId2).css('opacity',0).hide();
				newstatus("ready");
			} else {
				$(this1.DivId2).css('opacity',1).show();
				newstatus("ready");
			}
			//if ($(imageId[2]).css("visibility") == "hidden") {
			//	$(imageId[2]).addClass(this1.borderClass).css("visibility","visible");
			//} 
		} else {
			if (imageIdx1 == 1) {
				// fade front image out
				$(this1.DivId2).fadeTo(fade_speed,0,function() {
					$(this1.DivId2).hide();
					newstatus("ready");
					//if ($(imageId[2]).css("visibility") == "hidden") {
					//	$(imageId[2]).addClass(this1.borderClass).css("visibility","visible");
					//} 
				});
			} else {
				// fade front image in
				$(this1.DivId2).show().fadeTo(fade_speed,1,function() {
					newstatus("ready");
					// Only first time : show back image
				});
			}
		}
		
		logit('Fadin:img='+ImageOn);
		//logit('gpslat='+this1.point.lat+'/gpslng='+this1.point.lng);
		newstatus("swapped");
	
	}
	
	// function to set topmargin so that image is displayed in the middle of its canvas
	var setTopMargin = function(this1,thisimg) {
		logit("setTopMargin:"+this1.displaySize);
		if (this1.displaySize == 'thumb' || this1.displaySize == 'popupslide') {
			var topmargin = getTopMargin(this1.pic.img.height,this1.divheight);
			logit('setTopMargin '+this1.pic.img.height+'/'+this1.divheight+'/'+topmargin);
			$(thisimg).css("margin-top",topmargin+"px");
		}
	}
	function logit(text) {
		logitAll("SlideImage-"+text);
	}
}

function GpsPoint() {
	this.lat = null;
	this.lng = null;
	this.init = function() {
		this.lat = null;
		this.lng = null;
	}
}

function SlidePic() {
	var this1 = this;
	this.fileName 	= '';
	this.picrate   = ''; 	
	this.continent = ''; 
	this.state 		= '';
  this.country   = '';
	this.city 		 	= '';
	this.imgdescript = '';
	this.album 		= '';
	this.geocountrycd = '';
	this.geoarea 	= '';
	this.description    = '';
	this.keywords       = '';
	this.sublocation    = '';
	this.active         = '';
	this.focallength    = '';
	this.taken_date    	= '';
	this.point     = new GpsPoint();
	//this.gpslat 	 	= '';
	//this.gpslng 	 	= '';
	this.bigexists = '';
	this.gpssource = '';
	this.imagethumb = new Image();
	this.geomap    = new Image(); // google map in top-right
	this.geomapBig = new Image(); // when rollover geomap then this bigger map will be shown
	this.mediatype = '';   // jpeg,mov
	this.pictext 	= '';
  this.img        = new Image();
  this.bigsrc     = '';
  this.bigwidth   = 0;
  this.bigheight  = 0;
  this.errormsg   = '';
  this.file_type   = '';
  this.video_id   = '';

  this.init = function() {
		this.fileName 	= '';
		this.picrate   = ''; 	
		this.continent = ''; 
		this.state 		= '';
	  this.country   = '';
		this.city 		 	= '';
		this.imgdescript = '';
		this.album 		= '';
		this.geocountrycd = '';
		this.geoarea 	= '';
		this.description    = '';
		this.keywords       = '';
		this.sublocation    = '';
		this.active         = '';
		this.focallength    = '';
		this.taken_date   	 = '';
		//this.point.init(); keep previous point
		//this.gpslat 	 	= '';
		//this.gpslng 	 	= '';
		this.bigexists = '';
		this.mediatype = '';   // jpeg,mov
		this.pictext 	= '';
	  this.bigsrc     = '';
		this.gpssource = '0';
	  this.bigwidth   = 0;
  	this.bigheight  = 0;
  	this.errormsg   = '';
	  this.file_type   = '';
	  this.video_id   = '';
  }
}
function showLightBox(src,title) {
	logit("showLightBox:"+src);
	var img = new Image();
	img.src = src;

	Shadowbox.open({
		title:      title,
		player:     'img',
		content:    img.src
	});
}
function showMov(this1) {
		Shadowbox.open({
		title:      this.pic.pictext,
		player:     'qt',
		content:    this.pic.img.src,
		height:     400,
		width:      640
		});	
}
/*
function showMiniMap(this1) {
	  var geocountrycd = this.pic.geocountrycd;
	  var geoarea      = this.pic.geoarea;
	  if (geoarea == '') {geoarea = 'world';}
		$(this.miniMap).attr("src","http://chart.apis.google.com/chart?chs=160x100&cht=t&chco=BFE4FF,FF0000,FF0000&chd=s:Z&chf=bg,s,0066B3"+
		"&chld="+geocountrycd+"&chtm="+geoarea);
		logit("CountryCd="+geocountrycd+",area="+",area="+geoarea);
}
*/
function getGeoMap(mapwidth,mapheight,geocountrycd,geoarea) {
	// http://code.google.com/apis/chart/
	if (geocountrycd == '' || geoarea == '') {
		geocountrycd 	= '';
		geoarea				= 'world';
	}
	var map = "http://chart.apis.google.com/chart?chs="+mapwidth+"x"+mapheight+"&cht=t&chco=BFE4FF,FF0000,FF0000&chd=s:Z&chf=bg,s,0066B3"+
		"&chld="+geocountrycd+"&chtm="+geoarea;
	logit("new geomap:"+map);
	return map;
}
