
	/* 
		images toolbag - pike*kw.nl 2005
		
		
		in your page, use 
		
			<script language="javascript" type="text/javascript" src="Images.js" ></script>
			<script language="javascript" type="text/javascript"><!--
				onload = function() {
					if (self.Images) {
						Images.preload(document.images["button-ak"],"hi","../shared/gfx/header/icon_ak_hi.gif");
						......
						
						
		and
			
			<img id="button-ak" src="icon_ak.gif" 
				onmouseover	= "if (self.Images) Images.flip(this,'hi')"  
				onmouseout="if (self.Images) Images.flip(this)"
			/>		
					
						
						
						
		== description ==
		
		images are weird objects. an HtmlImageObject may change a
		memory handler if you assign a new value to the src property.
		
		if you assign the image1.src to image2.src,
		image2 is told to point to image1 for its image, inmemory. 
		this voodoo allows for high speed flipping of images,
		
		so: just playing around with strings containing the
		location of images can be much less efficient then keeping an
		array of javascript image objects and using their src properties. 
		
		Images.stack keeps a hash with img.id as keys
		each entry is a hash of versions with the 
		version as key and an image object as value
		
		like
		
			stack = { 
				"leftbutton"	: { 
					"default" 	: new Image("leftbutton.gif"),
					"rollover" 	: new Image("leftbuttonro.gif"),
				} 
				"rightbutton"	: { 
					"default" 	: new Image("rightbutton.gif"),
					"rollover" 	: new Image("rightbuttonro.gif"),
				} 
				
			} 
			
			
			
		
	*/
	
	
	var Images =  {
		stack		: { "dummy"	: { "default" : new Image("") } } ,	
		preload		: IMGPreload,
		flip		: IMGFlip,
		debug		: IMGDebug
			
	}
	
	
	function IMGPreload(img,version,url) {
		// a new array with id of img is tucked in this.stack
		// the versions name/url are the index of the hash
		if (img) {
			if (!img.id) img.id = "img"+Math.random()*1000;
			if (!version) version="default";
			if (!url) url = img.src;
			this.debug("preload "+img.id+":"+version+":"+url);
			if (!this.stack[img.id]) {
				this.debug("creating "+img+":default:"+img.src);
				this.stack[img.id] = new Array();
				this.stack[img.id]["default"] = new Image();
				this.stack[img.id]["default"].src = img.src;
			}
			
			this.stack[img.id][version] = new Image();
			this.stack[img.id][version].src = url;
			
		} else this.debug("IMGPreload: no img");
	}
	
	function IMGFlip(img,version,url) {
		// flip a given img to a version
		// if the version is not in stack, 
		// use url and put it in the stack as version
		if (img) {
			if (!img.id) img.id = "img"+Math.random()*1000;
			if (!version) version = "default";
			//this.debug("flip "+img.id+":"+version+":"+url);
			if (!this.stack[img.id]) {
				if (url) this.preload(img,version,url);
			}
			if (this.stack[img.id]) {
				if (!this.stack[img.id][version]) {
					if (url) this.preload(img,version,url);
				}
				if (this.stack[img.id][version]) {
					img.src = this.stack[img.id][version].src;
				}
			} else this.debug("IMGFlip: "+version+" not in stack");
		} else this.debug("IMGFlip: no img");

	}
	
	function IMGDebug(msg) {
		window.status = msg;
	}



