var running = false;
	var images;


    function getImageNo(id) {
		return id.substr(4,id.length-4);
	}

	function getLeft(arrayID) {
		return images[arrayID].left;
	}
	function getTop(arrayID) {
		return images[arrayID].top;
	}
	function updateLeftTop(image) {
		var arrayID = parseInt(getImageNo(image.id)) -1;
		if(arrayID) {	
			// only update top left with small images
			var width = images[arrayID].width;
	
			if(parseInt($(image).getWidth()) < parseInt(width)){
			    images[arrayID].left = $(image).style.left;
			    images[arrayID].top = $(image).style.top;
			}
		}

	}

      function openImage(image){
	  var arrayID = parseInt(getImageNo(image.id)) -1;

         var width = images[arrayID].width;
         var height = images[arrayID].height;

	  var imageID = image.id;
		topOfPile(image);

         if(parseInt($(image).getWidth()) > parseInt(width)){
            //shrinkAll();
			shrinkImage(image);
         } else {
	    updateLeftTop(image);
		shrinkAll();
	     var scrollY = getScrollY() + 80;
	     var scrollX = (getWidth() / 2) - 300;
            new Effect.Morph(image, {
              style: {
                   width: width+'px',
	               top:   scrollY+'px',
	               left:  scrollX+'px'
                 }, 
	       duration: 0.75,
	       transition: Effect.Transitions.sinoidal,
               afterFinish: function(){ image.src =  images[arrayID].url;} 
            });
         }

      }

	function resetSearch(){
	removeImages();
//Effect.BlindUp('resourceBar',{duration:0.25});
	//$('centerSearchBox').appear();
}
function shrinkImage(image) {
	
	
	var arrayID = parseInt(getImageNo(image.id)) -1;
	
	var width = images[arrayID].width;
	var revertWidth = width / 3;
	
	if(parseInt($(image).getWidth()) > parseInt(width)){
		var arrayID = parseInt(getImageNo(image.id)) -1;
		var revertLeft = getLeft(arrayID);
		var revertTop = getTop(arrayID);
	
	   new Effect.Morph(image, {
						 style: {
							  width: revertWidth+'px',
							  top:  revertTop,
							  left: revertLeft
							}, 
						 duration: 0.75,
						 transition: Effect.Transitions.sinoidal,
				         afterFinish: function() { image.src = images[arrayID].thumb; }
					   });
	}
	

}
function shrinkAll() {
       

	$$('img.image').each( function(image) {
	   var arrayID = parseInt(getImageNo(image.id)) -1;

         var width = images[arrayID].width;
	  var revertWidth = width / 3;

	     if(parseInt($(image).getWidth()) > parseInt(width)){
				var arrayID = parseInt(getImageNo(image.id)) -1;
				var revertLeft = getLeft(arrayID);
				var revertTop = getTop(arrayID);
		
               new Effect.Morph(image, {
                 style: {
                      width: revertWidth+'px',
					  top:  revertTop,
					  left: revertLeft
                    }, 
                 duration: 0.75,
		 transition: Effect.Transitions.sinoidal,

		 afterFinish: function() { image.src = images[arrayID].thumb; }
               });
            }
           
         }); 
      }


		function getScrollY() {
			var scrOfX = 0, scrOfY = 0;
			if( typeof( window.pageYOffset ) == 'number' ) {
				//Netscape compliant
				scrOfY = window.pageYOffset;
			} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
				//DOM compliant
				scrOfY = document.body.scrollTop;
			} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
				//IE6 standards compliant mode
				scrOfY = document.documentElement.scrollTop;
			}
			return scrOfY ;
		}

      function topOfPile(image){
         var zIndex = parseInt($(image).style.zIndex);
         $$('img.image').each( function(img) {if(parseInt(img.style.zIndex) >= zIndex) { img.style.zIndex = parseInt(img.style.zIndex) -1;} });
		 var images = $$('img.image');
         $(image).style.zIndex = images.length + 100;
      }
      function removeImages() {
		  $$('img.image').each( function(img) {img.remove()} );  
	  }
	function nextPictures() {
		$$('img.image').each( 
							function(img) {
								new Effect.Fade(img, { duration: 0.2 });
							}
							);  

	}	  
      function loadImages(searchTerm,offset) {
      var params = {};
		var left = 50;
		var lastWidth = 0;
		var greatestHeight = 0;
		var top  = 100 + parseInt(getScrollY());
		var nextOffset = 0;
	  	 params['q'] = searchTerm;
		 params['o'] = offset;

	  //removeImages();
		overlay.show();
		
		
// new Effect.Morph(jamesimage, { style: { top:  0, left: 0 }, duration: 0.75, transition: Effect.Transitions.sinoidal });
 
		$('galleryTitle').innerHTML = "<h1>"+searchTerm+"</h1>";
       new Ajax.Request('/gallery/json.php', { 
               parameters: params ,
               onComplete: function(transport) {
							var response = transport.responseText;
							var counter = 0;
							var screenWidth = getWidth() - 200;
							var screenHeight = parseInt(getHeight());
							images = response.evalJSON(true);
							if(images.length > 0){

							images.each(function(image) {
								
								left = left + lastWidth + 30;
								if(left + (image.width /3) > (getWidth()-50)) {
									left = 80;
									top = parseInt(top) + parseInt(greatestHeight) + 30;
									greatestHeight = 0;

								}
								if(parseInt(top) + (parseInt(image.height)/3) >= parseInt(screenHeight) + parseInt(getScrollY())) {
									if(nextOffset == 0) {
										nextOffset = counter;
									}
								} else {
								if((parseInt(image.height) /3) > parseInt(greatestHeight)) {
									greatestHeight = parseInt(image.height) /3;
								}
 								lastWidth = (parseInt(image.width) / 3);
								counter++;

								/*
								var left=(Math.floor(Math.random()*100))%2;
								var top =(Math.floor(Math.random()*100))%2;
								
								
								var randomleft=Math.floor(Math.random()*(screenWidth/2));
								var randomtop=Math.floor(Math.random()*((screenHeight-140)/2));
								
								if(left == 0)
									randomleft = (screenWidth/2)-randomleft;
								else
									randomleft = (screenWidth/2)+randomleft;
								
								if(top == 0) 
									randomtop = (screenHeight/2)-randomtop;
								else
									randomtop = (screenHeight/2)+randomtop;  	
								
								randomtop = randomtop + + parseInt(getScrollY());
								*/
								var tag = image.thumb;
								var tagId = "img_"+image.imageID
								var newGalleryImage = Builder.node('img', {className:'image', id: tagId});   
								
								newGalleryImage.src = tag;
								newGalleryImage.style.display= "none";
								
								$('cloud').appendChild(newGalleryImage);
								newGalleryImage.style.top = top+"px";
								newGalleryImage.style.left = left+"px";

								newGalleryImage.style.width = (image.width /3)+"px";
								//newGalleryImage.style.height = (image.height /3)+"px";

								image.top  = top+"px";
								image.left = left+"px";
								
								

								if(left > getWidth()) {
									
								}
								newGalleryImage.style.zIndex = parseInt(image.imageID) + parseInt(100);
// line to make the images draggable
//new Draggable(newGalleryImage, {starteffect: null, endeffect: null, onEnd: function() { updateLeftTop(newGalleryImage) } });
								Event.observe(newGalleryImage, 'click', function(){topOfPile(newGalleryImage)});
								
								Event.observe(newGalleryImage, 'dblclick', function(){openImage(newGalleryImage)});
								Event.observe(newGalleryImage, 'mouseover', function(){highlight(newGalleryImage)});
								Event.observe(newGalleryImage, 'mousemove', function(){highlight(newGalleryImage)});
								Event.observe(newGalleryImage, 'mouseout', function(){unhighlight(newGalleryImage)});
	

							    $(newGalleryImage).appear({duration:0.2, queue: 'end'});
								
								}
							});

							if(nextOffset > 0) {
								var nextOffsetDiv  = Builder.node('div', {id: 'galleryTitle', className: 'galleryTitle'});
								nextOffSetDiv.innerHTML = "<h1>"+NextOffset+"</h1>";
								$("div.overlay").appendChild(nextOffsetDiv);
								//Event.observe(nextOffsetDiv, 'click', function(){(newGalleryImage)});
							}
							if(offset > 0) {
								alert('offset');
							}
							
							}
							
					 	}
               }); 
 
			   
      }

 function checkGalleryImages() {
      var params = {};
 
       new Ajax.Request('json.php', { 
               parameters: params ,
               onComplete: function(transport) {
							var response = transport.responseText;
							var counter = 0;
							var screenWidth = getWidth() - 200;
							var screenHeight = getHeight() - 200;
							var html = "";
							images = response.evalJSON(true);
							images.each(function(image) {
											image.left = "9";	 
											html = html + "<br />"+ image.left;	 
								
							
							});
							document.write(html);
					 	}
               }); 
 
			   
      }