function ImageSlideShowObject(dataObject){

	DisplayObject.call(this);
	
	// create container
	
	// sub-elements
	this.dataObject = dataObject;
	this.optionButtonsElement = null;
	this.statusElement = null;
	
	this.imageArray = new Array();// array to store image elements, dataobjects and type (ieg image, floorplan, epc).
	this.imagePointer = 0;
	this.maxImageHeight = 600;
	this.maxImageWidth = 800;
	this.currentImageObject = null;
	
	this.imageTotal = 0;
	
	this.onRemoveFunction = null;
	
	this.overlay = null;
	
	// 
	
	this.ImageSlideShowObject = function(){
		
		// create array of images including floorplans and epc
		
		if(this.dataObject.images != null){
			for(var i in this.dataObject.images){
				this.imageArray[i] = this.dataObject.images[i];
			}
			
			this.imageTotal = this.dataObject.images.length;
		}
		

		
		this.createDOMElement("div","ImageSlideShowObject");
		this.setStyle("background","#FFF");
		
		this.setPosition();
		
	}
	
	this.setPosition = function(){
		
		this.setStyle("position","absolute");

		// get image width and height
		
		var pageSizes = this.getPageSizeObject();
		
		var w = Math.min(pageSizes.windowWidth-20,800);
		var h = Math.min(pageSizes.windowHeight-20,660);
		
		this.maxImageWidth = w-40;
		this.maxImageHeight = h-90;
		
		this.setStyle("width",w+"px");
		this.setStyle("height",h+"px");
		
		var yScroll = this.getYScroll();
		
		var top = Math.max(0,yScroll + ((pageSizes.windowHeight - h) / 2));
		
		this.setStyle("top",top+"px");
		this.setStyle("left", Math.max(0,(pageSizes.pageWidth - w) / 2) + "px");
	
		
	}
	
	
	this.displayContent = function(){
		
		this.displayOverlay();
		
		this.clearContents();
		
		this.addCloseButton();
		
		this.addStatusElement();
		
		if(this.imageArray.length > 0){
			
			this.loadImage(0);
			
			// add navigation
			
			if(this.imageArray.length > 1){
				
				this.addNavigation();
				
				
			}
				
			
		}
		
		this.setStyle("z-index",200);
		
		var bodyObj = document.getElementsByTagName("body").item(0);
		
		this.appendToElement(bodyObj);

	
	}
	
	this.remove = function(e){
		
		var bodyObj = document.getElementsByTagName("body").item(0);
		this.removeFromElement(bodyObj);
		
		this.removeOverlay();
				
		if(this.onRemoveFunction != null){
			this.onRemoveFunction(this);
		}
		
	}
	
	this.displayOverlay = function(){
		
		this.overlay = new OverlayObject();
		var thisObj = this;
		this.overlay.onRemoveFunction = function(){ thisObj.remove();};
		this.overlay.displayContent();
				
	}
	
	this.removeOverlay = function(){
		if (this.overlay != null) {
			this.overlay.remove();
			this.overlay = null;
		}
	}
	
	
	/// IMAGE METHODS
	
	this.loadImage = function(index){
		
		this.imagePointer = index;
		
		if(this.imageArray[index] != null){
			
			

			var newImage = new SlideShowImageObject(this.imageArray[index]);
			this.setStatus("Image "+(index+1)+" of "+this.imageTotal);
			
			newImage.setStyle("position","absolute");
			newImage.setStyle("left","20px");
			newImage.setStyle("top","20px");
			newImage.setOpacity(0);
			newImage.displayContent(this.maxImageWidth, this.maxImageHeight, 0);
			
			newImage.appendToElement(this.domElement);
			
			newImage.changeOpacity(100);
			
			if(this.currentImageObject != null){
				
				var thisObj = this;
				var func = function(displayObject){ thisObj.unloadImage(displayObject); };
				
				this.currentImageObject.onTransformEndFunction = func;
				
				this.currentImageObject.changeOpacity(0);
			}
			
			this.currentImageObject = newImage;
			
		}
	}
	
	this.unloadImage = function(imageObject){
		
		imageObject.removeFromElement(this.domElement);
		
	}
	
	
	// STATUS METHODS
	
	this.addStatusElement = function(){
		
		this.statusElement = this.addElement("p");
		this.statusElement.className = "status";
		this.statusElement.style.position = "absolute";
		this.statusElement.style.top = (this.maxImageHeight + 40)+"px";
		this.statusElement.style.left = "20px";
		
	}
	
	this.setStatus = function(msg){
		this.statusElement.innerHTML = msg;
	}
	
	
	
	// NAVIGATION METHODS
	
	this.addNavigation = function(){
		
		var thisObj = this;
		
		var p = this.addElement("p");
		p.className = "RPWSlideShowNavigation";
		
		p.style.position = "absolute";
		p.style.top = (this.maxImageHeight + 40)+"px";
		p.style.right = "20px";
		
		var button = document.createElement("a");
		button.setAttribute("href","javascript:void(0);");
		button.className = "previous";
		button.title = "Previous";
		button.innerHTML = "<span>Previous</span>";
		button.onclick = function(){ thisObj.gotoPrevious();this.blur();};
		
		p.appendChild(button);
		
		p.appendChild(document.createTextNode(" "));
		
		button = document.createElement("a");
		button.setAttribute("href","javascript:void(0);");
		button.className = "next";
		button.title = "Next";
		button.innerHTML = "<span>Next</span>";
		button.onclick = function(){ thisObj.gotoNext();this.blur();};
		
		p.appendChild(button);
		
		this.domElement.appendChild(p);
	}
	
	this.gotoPrevious = function(){
		
		this.imagePointer --;
		if(this.imagePointer < 0){
			this.imagePointer = this.imageArray.length -1;
		}
		
		this.loadImage(this.imagePointer);
		
	}
	
	this.gotoNext = function(){
		
		this.imagePointer++;
		if(this.imagePointer >= this.imageArray.length){
			this.imagePointer = 0;
		}
		
		this.loadImage(this.imagePointer);
		
	}
	
	
	this.addCloseButton = function(){
		
		button = document.createElement("a");
		button.setAttribute("href","javascript:void(0);");
		button.className = "closeButton";
		button.title = "Close";
		button.innerHTML = "<span>Close</span>";
		
		var thisObj = this;
		button.onclick = function(){ thisObj.remove();};
		button.style.position = "absolute";
		button.style.top = "5px";
		button.style.right = "5px";
		
		this.domElement.appendChild(button);
		
	}
	
	
	
	this.ImageSlideShowObject();
		
}

ImageSlideShowObject.inherits(DisplayObject);


function SlideShowImageObject(dataObject){

	DisplayObject.call(this);
	
	this.dataObject = dataObject;
	
	// Constructor
	
	this.SlideShowImageObject = function(){
		
		this.createDOMElement("div","SlideShowImageObject");
		
	}
	
	this.displayContent = function(maxWidth,maxHeight,crop){
		
		// add image
		
		this.imageElement = this.addElement("img",null,"src",httpRoot+unescape(this.dataObject.thumbnail)+"&width="+maxWidth+"&height="+maxHeight+"&quality=85&crop="+crop);
		if(dataObject.caption != null){
			this.imageElement.title = dataObject.caption;
		}
		
		// get sizes
		var w,h;
		
		if(this.dataObject.width/this.dataObject.height > maxWidth/maxHeight){
			
			w = maxWidth;
			h = this.dataObject.height * maxWidth/this.dataObject.width;
			
		}else{
			
			h = maxHeight;
			w = this.dataObject.width * maxHeight/this.dataObject.height;
		}			
			
		this.setStyle("width", w+"px");
		this.setStyle("height", h+"px");
		
		this.setStyle("left",(20+((maxWidth-w)/2))+"px");
		this.setStyle("top",(30+((maxHeight-h)/2))+"px");
			
		
	}
		
	this.SlideShowImageObject();
	
}

SlideShowImageObject.inherits(DisplayObject);