/*
   Zoom Image 0.0.1
   Copyright (c) 2008. by Mladen Mijatov, MASSVision
*/

var src_Loading = 'Modules/Zoom/UI/Script/loading.gif';
var src_CloseText = 'Close';
var cnt_Loop = 0;

function zoomImg(pic,w,h,_width,_height,_align,_valign){
	alert('wtf');
	zImage_Show(pic);
	}

function zImage_Show(img,url_core) {
   var div_back = document.getElementById('zimage_back');
   var div_holder = document.getElementById('zimage_holder');
   var img_main = document.getElementById('zimage_image');
   var img_loading = document.getElementById('zimage_loading');
   if (url_core) src_Loading = url_core + '/Modules/Zoom/UI/Script/loading.gif';

   if (div_back == null) {
      // if object is not created
      zImage_Create();
      zImage_Show(img);
	}else{
      // change the image and align it properly
      page_scroll = zImage_GetScroll();
      page_size = zImage_GetPageSize();
      div_back.style.height = page_size[1]+'px';
      div_back.style.display = 'block';

      if (img_loading) {
         dim_loading = zImage_GetDim(img_loading);
         img_loading.style.left = (Math.round((page_size[0] - dim_loading[0]) / 2)) + 'px';
         img_loading.style.top = (page_scroll + Math.round((page_size[3] - dim_loading[1]) / 2)) + 'px';
         img_loading.style.display = 'block';
      }

      img_preload = new Image();
      img_preload.onload = function () {
         // show image
         img_main.src = img;
         div_holder.style.display = 'block';

         // align
         dim_image = zImage_GetDim(this);
         zImage_Align(dim_image);

         //hide loading animation
         img_loading.style.display = 'none';
		}

      img_preload.src = img;
   }
}

function zImage_Hide() {
   var div_back = document.getElementById('zimage_back');
   var div_holder = document.getElementById('zimage_holder');

   // hide holder and image container
   div_holder.style.display = 'none';
   div_back.style.display = 'none';

   // hide select components
   selects = document.getElementsByTagName("select");
   for (i = 0; i != selects.length; i++) {
      selects[i].style.visibility = "visible";
   }

	}

// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Edit for Firefox by pHaez
function zImage_GetPageSize () {
   var xScroll, yScroll;

   if (window.innerHeight && window.scrollMaxY) {
      xScroll = document.body.scrollWidth;
      yScroll = window.innerHeight + window.scrollMaxY;
   } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
      xScroll = document.body.scrollWidth;
      yScroll = document.body.scrollHeight;
   } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
      xScroll = document.body.offsetWidth;
      yScroll = document.body.offsetHeight;
   }

   var windowWidth, windowHeight;
   if (self.innerHeight) { // all except Explorer
      windowWidth = self.innerWidth;
      windowHeight = self.innerHeight;
   } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
      windowWidth = document.documentElement.clientWidth;
      windowHeight = document.documentElement.clientHeight;
   } else if (document.body) { // other Explorers
      windowWidth = document.body.clientWidth;
      windowHeight = document.body.clientHeight;
   }

   // for small pages with total height less then height of the viewport
   if(yScroll < windowHeight){
      pageHeight = windowHeight;
	}else{
      pageHeight = yScroll;
		}

   // for small pages with total width less then width of the viewport
   if(xScroll < windowWidth){
      pageWidth = windowWidth;
   } else {
      pageWidth = xScroll;
	}

   return [pageWidth,pageHeight,windowWidth,windowHeight];
	}

// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
function zImage_GetScroll () {
   var yScroll;

   if (self.pageYOffset) {
      yScroll = self.pageYOffset;
   } else if (document.documentElement && document.documentElement.scrollTop){    // Explorer 6 Strict
      yScroll = document.documentElement.scrollTop;
   } else if (document.body) {// all other Explorers
      yScroll = document.body.scrollTop;
	}

   return yScroll;
	}

function zImage_GetDim(obj) {
   if (obj.clientWidth)
      return [obj.clientWidth, obj.clientHeight]; else
      return [obj.width, obj.height];
	}

function zImage_GetPos(obj) {
   var curX = 0;
   var curY = 0;

   // find position using offsetParent
   // NOTE: IE skips objects with positon: relative
   if (obj.offsetParent) {
      do {
         curX += obj.offsetLeft;
         curY += obj.offsetTop;
      } while (obj = obj.offsetParent);
   }

   return [curX, curY];
}

function zImage_SetBackOpacity(obj_opacity) {
   var div_back = document.getElementById('zimage_back');

   // change opacity of the object
   with(div_back.style) {
      opacity = (obj_opacity / 100);
      MozOpacity = (obj_opacity / 100);
      KhtmlOpacity = (obj_opacity / 100);
      filter = "alpha(opacity=" + obj_opacity + ")";
   }
}

function zImage_Create() {
   // create elements
   var div_back = document.createElement('div');
   var div_holder = document.createElement('div');
   var div_toolbar = document.createElement('div');
   var btn_close = document.createElement('span');
   var img_main = document.createElement('img');
   var img_loading = document.createElement('img');

   // set back element properties
   div_back.setAttribute('id', 'zimage_back')
   with (div_back.style) {
      display = 'none';
      position = 'absolute';
      left = '0px';
      top = '0px';
      width = '100%';
      height = '100%';
      backgroundColor = 'rgb(50, 50, 50)';
      zIndex = '100000';
   }
   document.body.appendChild(div_back);
   zImage_SetBackOpacity(50);

   // set holder element properties
   div_holder.setAttribute('id', 'zimage_holder')
   with (div_holder.style) {
      display = 'none';
      position = 'absolute';
      left = '50%';
      top = '50%';
      backgroundColor = '#FFFFFF';
      padding = "5px";
      border = "1px solid rgb(0,0,0)";
      zIndex = '100001';
   }
   document.body.appendChild(div_holder);

   // set image properties
   img_main.setAttribute('id', 'zimage_image');
   img_main.onclick= function(){zImage_Hide()};
   img_main.style.cursor = 'pointer';
   div_holder.appendChild(img_main);

   // set image properties
   img_loading.setAttribute('id', 'zimage_loading');
   with (img_loading.style) {
      position = 'absolute';
      left = '50%';
      top = '50%';
      zIndex = '100002';
      display = 'none';
   }
   img_loading.src = src_Loading;
   document.body.appendChild(img_loading);

   // set toolbar options
   div_toolbar.setAttribute('id', 'zimage_toolbar')
   with (div_toolbar.style) {
      height = '10px';
      width = '100%';
      marginTop = '5px';
      position = 'relative';
   }
   div_holder.appendChild(div_toolbar);

   // set close button properties
   btn_close.innerHTML = src_CloseText;
   with (btn_close.style) {
      display = 'block';
      width = '40px';
      height = '10px';
      color = 'rgb(0,0,0)';
      fontFamily = 'Verdana, Tahoma, Arial';
      fontSize = '10px';
      fontWeight = 'bold';
      cursor = 'pointer';
      position = 'absolute';
      right = '0px';
      textAlign = 'center';
      padding = '0px 0px 3px 0px';
   }
   btn_close.onclick = function() { zImage_Hide() };
   div_toolbar.appendChild(btn_close);
}

function zImage_GetRatio(dim_back, dim_image) {
   cnt_Loop++;

   // default ratio, no resize
   ratio = 1;
   ratioW = 1;
   ratioH = 1;

   if (dim_image[0] > dim_back[0] - 30)
      ratioW = (dim_back[0] - 30) / dim_image[0];
   if (dim_image[1] > dim_back[1] + 45)
      ratioH = (dim_back[1] - 45) / dim_image[1];

   ratio = (ratioW < ratioH)? ratioW : ratioH;

   // if calculated ratio needs to be recalculated
   if ((Math.round(dim_image[0] * ratio) > (dim_back[0]-30)) || (Math.round(dim_image[1] * ratio) > (dim_back[1]-45))) {
      dim_image = [ Math.round(dim_image[0] * ratio), Math.round(dim_image[1] * ratio) ];
      if (cnt_Loop < 3) ratio = zImage_GetRatio(dim_back, dim_image);
   }

   return ratio;
}

function zImage_Align(dim_image) {
   // find the right objects
   var div_back = document.getElementById('zimage_back');
   var div_holder = document.getElementById('zimage_holder');
   var img_main = document.getElementById('zimage_image');
   var div_toolbar = document.getElementById('zimage_toolbar');
   var page_size = zImage_GetPageSize();
   var page_scroll = zImage_GetScroll();

   // get their dimensions
   dim_back = zImage_GetDim(div_back);
   dim_holder = zImage_GetDim(div_holder);

   // discover wheter image needs to be resized and calculate ratio
   cnt_Loop = 0;
   ratio = zImage_GetRatio([page_size[0], page_size[3]], dim_image);

   // resize image
   dim_image = [Math.round(dim_image[0] * ratio), Math.round(dim_image[1] * ratio)];
   img_main.style.width = dim_image[0] + 'px';
   img_main.style.height = dim_image[1] + 'px';

   // position and resize center element
   div_holder.style.left = (Math.round((page_size[0] - dim_image[0]) / 2)) + 'px';
   div_holder.style.top = (page_scroll + Math.round((page_size[3] - dim_image[1]) / 2) - 15) + 'px';
   div_toolbar.style.width = div_holder.style.width = (dim_image[0]) + 'px';
   div_holder.style.height = (dim_image[1] + 15) + 'px';
}