function imageObject(){
	var _self = this;
	this.properties = new Object();
	_self.properties['self'] = _self;
	_self.properties['type'] = "image";
	
	this.select 	   = function()				{_imageManager.selectedImage = _self;} 
	this.unSelect 	   = function()				{}
	this.appendTo      = function(parentObject)	{parentObject.appendChild(_self.properties["holderDiv"]);}
	this.changeName	   = function(newName)		{_self.properties['name'] = newName};
	this.startResize   = function()				{}
	this.resizeUp      = function(differenceY)	{_imageManager.selectedImage = _self;_imageManager.resizeUp(differenceY)}
	this.resizeDown    = function(differenceY)	{_imageManager.selectedImage = _self;_imageManager.resizeDown(differenceY)}
	this.resizeRight   = function(differenceX)	{_imageManager.selectedImage = _self;_imageManager.resizeRight(differenceX)}
	this.resizeLeft    = function(differenceX)	{_imageManager.selectedImage = _self;_imageManager.resizeLeft(differenceX)}
	this.endResize     = function()				{_objectManager.endResize(_self)}
	this.setPosition   = function(topPos,leftPos){_self.properties['holderDiv'].style.top = topPos;_self.properties['holderDiv'].style.left = leftPos;}	
	this.copyElement   = function()				{_imageManager.selectedImage = _self;return _imageManager.copyElement()}		
	this.toXML		   = function()				{_imageManager.selectedImage = _self;return _imageManager.toXML()}
	this.setImage 	   = function(imageSrc,imageName,imageHeight,imageWidth,oh,ow){_imageManager.selectedImage = _self;_imageManager.setImage(imageSrc,imageName,imageHeight,imageWidth,oh,ow)}
	this.setSize	   = function(height,width)	{_imageManager.selectedImage = _self; _imageManager.setSize(height,width) }
	this.getBorder     = function()				{return _self.properties['borderWeight'] +" "+ _self.properties['borderStyle']+" "+ _self.properties['borderColor'];};
	this.changeBorder  = function(borderObj)	{_objectManager.changeBorder(_self.properties['image'],borderObj); _self.properties['borderObj'] = borderObj;};
	this.setCursor 	   = function(cursor)		{_imageManager.selectedImage = _self; _imageManager.setCursor(cursor)}
	this.getCursor     = function()				{return _self.properties['cursor'];}
	this.deleteElement  = function()	{};
	this.setImageZoom = function(enabled,width,height){ _imageManager.setImageZoom(_self,enabled,width,height)}	
}

function ImageManager(){
	var _self = this
	this.selectedImage = null;
	
	var _toolkitOptions = new Object();
	_toolkitOptions['selectImage'] = 'selectImage';
	//_toolkitOptions['editImage'] = 'editImage';
	_toolkitOptions['border'] = 'border';
	_toolkitOptions['cursor'] = 'cursor';
	_toolkitOptions['link'] = 'link';
	_toolkitOptions['elementSize'] = 'elementSize';
	_toolkitOptions['elementPosition'] = 'elementPosition';
	_toolkitOptions['imageZoom'] = 'imageZoom';
	
	var _itemMenuOptions = new Object();
	_itemMenuOptions['insertPicture']   = 'insertPicture';
	_itemMenuOptions['addElement']  	= 'addElement';
	
	var _videos = new Object();
	//_videos["image_zoom"]="Image Zoom";
	
	this.createImage = function(height, width, borderObj, imageSrc){		
		_self.selectedImage = new imageObject();
		setProperty("id",_objectManager.createId("image"));				
		setProperty("borderObj",borderObj);
		setProperty("visibility","visible");
		setProperty("show",true);
		setProperty("imageSrc",imageSrc);
		setProperty("link","");	
		setProperty("itemMenu",_itemMenuOptions);	
		setProperty("toolkit",_toolkitOptions);
		setProperty("videos",_videos);
		createHolderDiv(height, width);
		createImageHolder(imageSrc)
		_self.selectedImage.changeBorder(borderObj);
		return _self.selectedImage;	
	}
	function setProperty(property,value){_self.selectedImage.properties[property] = value;}
	function getProperty(propertyName){	return _self.selectedImage.properties[propertyName];}	
	function createHolderDiv(height,width){		
		var holderDiv = document.createElement('div');
		holderDiv.id = getProperty('id');
		holderDiv.cancelBubble = true;
		_pm.setStyle(holderDiv,"position:absolute;width:"+width+"; height:"+height+"; top:0; left:0; overflow:hidden;")
		holderDiv.onmousedown = function(e){if (!e) var e = window.event;
											_elementsManager.selectElement(this,e.ctrlKey);
											e.cancelBubble = true;} 
		holderDiv.ondblclick = function(){_imageUploadManager.displayLibrary('image');} 
		setProperty("holderDiv", holderDiv);	
	}
	
	function createImageHolder(imageSrc){		
		var image = document.createElement('img');
		image.style.position = 'absolute';
		image.style.height = "100%";
		image.style.width = "100%";		
		image.src = imageSrc; 		
		getProperty("holderDiv").appendChild(image);
		setProperty("image", image);					
	}
	
	this.resizeDown = function(differenceY){
   		if(parseInt(getProperty("holderDiv").style.height) + differenceY >1){
           getProperty("holderDiv").style.height = parseInt(getProperty("holderDiv").style.height) + differenceY;
   		}
   	}

   this.resizeUp = function(differenceY){
   		if(parseInt(getProperty("holderDiv").style.height)- differenceY >1){
           getProperty("holderDiv").style.top = parseInt( getProperty("holderDiv").style.top ) + differenceY;
           getProperty("holderDiv").style.height = parseInt(getProperty("holderDiv").style.height)- differenceY;           
   		}
   }

   this.resizeRight = function(differenceX){
   		if(parseInt(getProperty("holderDiv").style.width) + differenceX > 1){
           getProperty("holderDiv").style.width = parseInt(getProperty("holderDiv").style.width) + differenceX;
   		}
   }

   this.resizeLeft = function(differenceX){
   		if(parseInt(getProperty("holderDiv").style.width) - differenceX >1){
           getProperty("holderDiv").style.left = parseInt( getProperty("holderDiv").style.left ) + differenceX;
           getProperty("holderDiv").style.width = parseInt(getProperty("holderDiv").style.width) - differenceX;
   		}
   }
   
	this.copyElement = function(){
		var copyFromImage = _self.selectedImage;
		var borderObj = _objectManager.cloneObject(getProperty("borderObj"));
		var newImage = _self.createImage(getProperty("holderDiv").style.height, getProperty("holderDiv").style.width,borderObj,getProperty("imageSrc"));		
		newImage.setPosition(copyFromImage.properties['holderDiv'].style.top,copyFromImage.properties['holderDiv'].style.left);
		/* Copy specific properties here */
		newImage.properties['visibility'] = copyFromImage.properties['visibility'];
		newImage.properties['isImageSet'] = copyFromImage.properties['isImageSet'];
		/* Copy the Children here*/
		var copyChildren = copyFromImage.properties['children'];
		newImage.properties['children'] = new Object();
		for (eachChild in copyChildren){
			var newChild = copyChildren[eachChild].copyElement();
			newChild.appendTo(newImage.properties['holderDiv']);
			newImage.properties['children'][newChild.properties['id']] = newChild;
			newChild.properties['parent'] = newImage;
			newChild.properties['parentId'] = newImage.properties['id'];
			_elementsManager.addToAllElementsTable(newChild);	
		}
		return newImage;
	}
	
	this.toXML = function(){
		var xml = "";
		if(getProperty('isImageSet') != undefined){
			var dimensions = _objectManager.getProperDimensions(_self.selectedImage)
			xml = "<element>" 
			xml+= xmlTag("type","image")
			xml+= xmlTag("id",getProperty('id'));
			xml+= xmlTag("imageName","<![CDATA[" +getProperty('imageName')+"]]>");
			xml+= xmlTag("top",dimensions["top"])
			xml+= xmlTag("left",dimensions["left"])
			xml+= xmlTag("width",dimensions["width"])
			xml+= xmlTag("height",dimensions["height"])
			xml+= xmlTag("parentId",getProperty('parentId'));
			xml+= xmlTag("border", _objectManager.borderToString(getProperty("borderObj")));
			if(getProperty('holderDiv').style.zIndex == "") 
				xml+= xmlTag("zindex","0");
			else
				xml+= xmlTag("zindex",getProperty('holderDiv').style.zIndex);
			xml+= xmlTag("link","<![CDATA[" +getProperty('link')+"]]>"); 
			var linkTarget = "_parent";
			if(getProperty('linkTarget') != undefined && getProperty('linkTarget')!="") linkTarget = getProperty('linkTarget');
			xml+= xmlTag("linkTarget",linkTarget);  
			xml+= xmlTag("imageSrc", getProperty("imageSrc"));
			xml+= xmlTag("cursor", getProperty("cursor"));
			xml+= xmlTag("originalHeight", getProperty("originalHeight"))
			xml+= xmlTag("originalWidth", getProperty("originalWidth"))
			if(getProperty("imageZoom")==true){
				var zoom = xmlTag("width",getProperty("zoomWidth"))
				zoom += xmlTag("height",getProperty("zoomHeight"))
				xml+=xmlTag("zoom",zoom);
			}
			var children = getProperty('children')
			for(eachChild in children){xml+= children[eachChild].toXML();}
			xml+="</element>"
		}
		return xml;	
	}
	
	function xmlTag(tagName,tagData){
		if(tagData == "undefined")tagData = "";
		return "<" + tagName +">" + tagData + "</" + tagName + ">"
	}
	
	this.setImage = function(imageSrc,imageName, imageHeight,imageWidth, originalHeight, originalWidth){
		var image  = getProperty('image');		
		image.src = imageSrc; 
		setProperty("imageSrc",imageSrc);
		var holderDiv  = getProperty('holderDiv');
		holderDiv.style.width = imageWidth
		holderDiv.style.height = imageHeight;
		setProperty('originalHeight', originalHeight);
		setProperty('originalWidth', originalWidth);
		setProperty('imageName', imageName);
		setProperty('isImageSet', true);
		_objectManager.endResize(_self.selectedImage);		
	}
	
	this.setSize = function(height,width){
        getProperty("holderDiv").style.height = height;	
		getProperty("holderDiv").style.width = width;
		_self.selectedImage.endResize();
	}
	
	this.loadImage = function(id, imageName, topPos, leftPos, height, width,link,imageSrc,parentId,zindex,border,cursor,originalHeight,originalWidth,linkTarget,zWidth,zHeight){
		var borderObj = _objectManager.loadBorderObj(border);
		var newElement = _self.createImage(height, width, borderObj, imageSrc)
		_objectManager.changeId(newElement,id);
		newElement.properties['holderDiv'].id = id;
		newElement.properties['holderDiv'].style.zIndex = zindex;
		newElement.setPosition(topPos,leftPos);
		newElement.properties['parentId'] = parentId;
		newElement.properties['imageName'] = imageName;
		newElement.properties['link'] = link;
		newElement.properties['linkTarget'] = linkTarget;
		newElement.properties['isImageSet'] = true;
		newElement.properties['originalHeight'] = originalHeight;
		newElement.properties['originalWidth'] = originalWidth;		
		newElement.setCursor(cursor)	;			
		_objectManager.loadElement(newElement);
		if(zWidth!="" && zWidth!="undefined" &&zWidth!=undefined)newElement.setImageZoom(true,zWidth,zHeight);
		
	} 
	this.setCursor = function(cursor){
		getProperty("holderDiv").style.cursor = cursor;
		setProperty("cursor",cursor);	   
	}		
	this.setImageZoom = function(image,enabled,width,height){
		image.properties["imageZoom"] = enabled;
		if(enabled){
			image.properties["zoomWidth"] = width;
			image.properties["zoomHeight"] = height;
			var zoomImg = document.createElement("img");
			zoomImg.id = image.properties.id+"_zoom";
			zoomImg.src="work/WebsiteEditor/Images/common/zoom.gif";
			_pm.setStyle(zoomImg,"position:absolute;zIndex:5;");
			image.properties["holderDiv"].appendChild(zoomImg);
		}else{
			var zoom = document.getElementById(image.properties.id+"_zoom");
			if(zoom!=undefined)zoom.parentNode.removeChild(zoom);
		}
		
	}	
}	
