
function startup() {
  // expand image stuff  
  maxWidth = 500;
  
  try { // IE raise an error!
  HTMLElement.prototype.insertAdjacentHTML = function (sWhere, sHTML) {
   var df;   // : DocumentFragment
   var r = this.ownerDocument.createRange();
   
   switch (String(sWhere).toLowerCase()) {  // convert to string and unify case
      case "beforebegin":
         r.setStartBefore(this);
         df = r.createContextualFragment(sHTML);
         this.parentNode.insertBefore(df, this);
         break;
         
      case "afterbegin":
         r.selectNodeContents(this);
         r.collapse(true);
         df = r.createContextualFragment(sHTML);
         this.insertBefore(df, this.firstChild);
         break;
         
      case "beforeend":
         r.selectNodeContents(this);
         r.collapse(false);
         df = r.createContextualFragment(sHTML);
         this.appendChild(df);
         break;
         
      case "afterend":
         r.setStartAfter(this);
         df = r.createContextualFragment(sHTML);
         this.parentNode.insertBefore(df, this.nextSibling);
         break;
   }   
  };
  } catch(e) {};
}
  
  function getParent(e) {
if (e.parentNode && e.parentNode.parentNode) {
     r = e.parentNode.parentNode;
 } else if (e.parentElement && e.parentElement.parentElement) {
     r = e.parentElement.parentElement;
 }
 return r;
  }
  
  

function expandImage(e) {
  var thisImage = $(e.id);
  
  var newW;
  var newW;
  if (thisImage.needScroll == 'yes') {
	newW = maxWidth;
	newH = Math.round(thisImage.srcHeight * newW / thisImage.srcWidth);
  } else {
  	var newW = thisImage.srcWidth;
  	var newH = thisImage.srcHeight;
  	  }
  
  	  //tmpHTML = "<div id='" + thisImage.id + "_zoom' style='margin: 40px 0px;'></div>";
  	  
  	  var tmpDiv = new Element('div');
  	  tmpDiv.id = thisImage.id + '_zoom';
  	  
  //thisImage.insertAdjacentHTML('afterEnd', tmpHTML);
  
  tmpDiv.injectAfter(thisImage.id);
  $(tmpDiv.id).style.margin = '40px 0px 0px 0px';
  
  //$(thisImage.id + '_zoom').style.height = newH + 'px';
  //$(thisImage.id + '_zoom').style.width = newW + 'px';
  
  if (thisImage.needScroll == 'yes') {
	  
	  
	  var zoomBarWrap = document.createElement("div")
	  zoomBarWrap.id = thisImage.id + '_zoombarwrap';
	  $(thisImage.id + '_zoom').appendChild(zoomBarWrap);
	  zoomBarWrap.className = 'zoombarwrap';
	  zoomBarWrap.style.marginTop = '-40px';
	  zoomBarWrap.style.marginLeft = (maxWidth - 180) + 'px';
	  
	  var zoomBar = document.createElement("div")
	  zoomBar.id = thisImage.id + '_zoombar';
	  $(thisImage.id + '_zoombarwrap').appendChild(zoomBar);
	  zoomBar.className = 'zoombar';
	  zoomBar.style.marginTop = '0px';
	  zoomBar.style.marginLeft = '0px';
	  
	  var zoom100Img = new Image();
	  zoom100Img.id = thisImage.id + '_zoomin';
	  zoom100Img.src = '/public/images/zoom100_disabled.png';
  	  $(thisImage.id + '_zoombarwrap').appendChild(zoom100Img);
  	  zoom100Img.style.position = 'absolute';
  	  zoom100Img.style.marginTop = '12px';
  	  zoom100Img.style.marginLeft = '10px';
  	  zoom100Img.style.display = 'inline';
  	  
  	  $(zoom100Img.id).addEvent('click', function(){
    	$(thisImage.id + '_clone').style.display = 'block';
  		$(thisImage.id + '_scroll').style.display = 'none';
  		zoominImg.src = '/public/images/zoomin.png';
  		zoominImg.style.cursor = 'pointer';
  		this.src = '/public/images/zoom100_disabled.png';
  		this.style.cursor = 'default';
  		zoominImg.style.display = 'inline';
  		  });
  		    
  	  var zoominImg = new Image();
	  zoominImg.id = thisImage.id + '_zoom100';
	  zoominImg.src = '/public/images/zoomin.png';
  	  $(thisImage.id + '_zoombarwrap').appendChild(zoominImg);
  	  zoominImg.style.position = 'absolute';
  	  zoominImg.style.marginTop = '12px';
  	  zoominImg.style.marginLeft = '65px';
  	  zoominImg.style.cursor = 'pointer';
  	  zoominImg.style.display = 'inline';
  	  
  	  $(zoominImg.id).addEvent('click', function(){
    	$(thisImage.id + '_clone').style.display = 'none';
  		$(thisImage.id + '_scroll').style.display = 'block';
  		zoom100Img.src = '/public/images/zoom100.png';
  		zoom100Img.style.cursor = 'pointer';
  		this.src = '/public/images/zoomin_disabled.png';
  		this.style.cursor = 'default';
  		  });
  		  
  	  var zoomcloseImg = new Image();
	  zoomcloseImg.id = thisImage.id + '_zoomclose';
	  zoomcloseImg.src = '/public/images/zoomclose.png';
  	  $(thisImage.id + '_zoombarwrap').appendChild(zoomcloseImg);
  	  zoomcloseImg.style.position = 'absolute';
  	  zoomcloseImg.style.marginTop = '12px';
  	  zoomcloseImg.style.marginLeft = '120px';
  	  zoomcloseImg.style.cursor = 'pointer';
  	  zoomcloseImg.style.display = 'inline';
  	  
  	  $(zoomcloseImg.id).addEvent('click', function(){
  		thisImage.style.display = 'inline';
  		thisChild = $(thisImage.id + '_zoom');
		thisChild.parentNode.removeChild(thisChild);
  		  });
	
	
	// zoon in  with scrolling  	  
  	  	//tmpHTML = "<div id='" + thisImage.id + "_scroll' style='display: none; overflow: scroll; border: 1px solid #DADADA'></div>";
  	  	
  	  	var tmpDiv = new Element('div');
  	tmpDiv.id = thisImage.id + '_scroll';
  	  	
	//$(thisImage.id + '_zoom').insertAdjacentHTML('beforeend', tmpHTML);
	
	tmpDiv.injectInside(thisImage.id + '_zoom');
	
	$(tmpDiv.id).style.display = 'none';
  	$(tmpDiv.id).style.overflow = 'scroll';
  	$(tmpDiv.id).style.border = '1px solid #DADADA';
	
	$(thisImage.id + '_scroll').style.height = newH + 'px';
	$(thisImage.id + '_scroll').style.width = '100%'; // newW + 'px';
	$(thisImage.id + '_scroll').style.marginLeft = 'auto';
	$(thisImage.id + '_scroll').style.marginRight = 'auto';
	var cloneImage2 = new Image();
	cloneImage2.id = thisImage.id + '_clone2';
	cloneImage2.src =  thisImage.originalSrc;
	$(thisImage.id + '_scroll').appendChild(cloneImage2);
	cloneImage2.height = thisImage.srcHeight;
	cloneImage2.width = thisImage.srcWidth;
	cloneImage2.style.display = 'inline';
	
	// zoom 100%
	var cloneImage = new Image();
	cloneImage.id = thisImage.id + '_clone';
	cloneImage.src =  '/app/controllers/image.asp?f=' + thisImage.originalSrc + '&w=' + newW;
	$(thisImage.id + '_zoom').appendChild(cloneImage);
	cloneImage.height = newH;
	cloneImage.width = newW;
	cloneImage.style.display = 'block';
	cloneImage.style.marginLeft = 'auto';
	cloneImage.style.marginRight = 'auto';
	thisImage.style.display = 'none';
	
	
  	  } else {
  	  
	// zoom 100%
	var cloneImage = new Image();
	cloneImage.id = thisImage.id + '_clone';
	cloneImage.src =  thisImage.originalSrc;
	$(thisImage.id + '_zoom').appendChild(cloneImage);
	cloneImage.height = newH;
	cloneImage.width = newW;
	cloneImage.style.display = 'inline';
	cloneImage.style.marginLeft = 'auto';
	cloneImage.style.marginRight = 'auto';
	thisImage.style.display = 'none';
  	  
  	$(cloneImage.id).addEvent('click', function(){
  		thisImage.style.display = 'inline';
  		thisChild = $(thisImage.id + '_zoom');
		thisChild.parentNode.removeChild(thisChild);
	});
		  
  	 }
  	 
}  

  function prepareImages() {
	  var bodySpace = document.getElementById('ttmArt');
	  images = bodySpace.getElementsByTagName('img');
	  for (var i = 0; i < images.length; i++) {
		// assign ID
		images[i].id = 'img' + i;
		
		// calulate real size
		var tmpImage = new Image(); 
	  	
	  	tmpImage.src = images[i].src;
	  	
	  	images[i].srcWidth = tmpImage.width;
	  	images[i].srcHeight = tmpImage.height;
	  	
		images[i].originalWidth = images[i].width;
		images[i].originalHeight = images[i].height;

	  	
	  	
	  	//Resize old images
	  	
	  	
	  	if (document.getElementById(images[i].id).style.width) {
		  	styleWidth = parseInt(document.getElementById(images[i].id).style.width);
		  	styleHeight = parseInt(document.getElementById(images[i].id).style.height);
		} else {
			styleWidth = images[i].width;
			styleHeight = images[i].height;
		}
	  	
	  	if (styleWidth > maxWidth) {
	  		document.getElementById(images[i].id).style.height = Math.round(maxWidth/styleWidth * styleHeight) + 'px';
	  		document.getElementById(images[i].id).style.width = maxWidth + 'px';
	  		firstWidth = maxWidth;
	  	} else {
	  		firstWidth = styleWidth;
	  	}
	  	
	  	if (firstWidth == 0) {firstWidth = maxWidth;}
	  
		
	  	//attach click event
	  	
		if (images[i].srcWidth > images[i].width) {
			$(images[i].id).addEvent('click', function(){
		    	expandImage(this);
		  	});
		  	images[i].style.cursor = 'pointer';
		  	
		  	// get resampled version
			images[i].originalSrc = images[i].src;
			images[i].src = '/app/controllers/image.asp?f=' + images[i].src + '&w=' + firstWidth;
			images[i].style.display = 'inline';
			
			images[i].title = 'Zoom me :)::Clicka l\'immagine per ingrandirla';
			images[i].addClass('toolTipImg');
		
		  	
		  	if (tmpImage.width > maxWidth) {
			  	images[i].needScroll = 'yes';
		  	} else {
			  	images[i].needScroll = 'no';
		  	};

		} else {
			images[i].style.display = 'inline';
		}
	  	
	  }
	  
	  //var myTips = new Tips($S('.toolTipImg'), {'maxOpacity: 0.8'});
  }