/**
 * View Port Object
 *
 */
var viewport = {
  getWinWidth: function () {
    this.width = 0;
    if (window.innerWidth) this.width = window.innerWidth - 18;
    else if (document.documentElement && document.documentElement.clientWidth)
          this.width = document.documentElement.clientWidth;
    else if (document.body && document.body.clientWidth)
          this.width = document.body.clientWidth;
  },

  getWinHeight: function () {
    this.height = 0;
    if (window.innerHeight) this.height = window.innerHeight - 18;
      else if (document.documentElement && document.documentElement.clientHeight)
          this.height = document.documentElement.clientHeight;
      else if (document.body && document.body.clientHeight)
          this.height = document.body.clientHeight;
  },

  getScrollX: function () {
    this.scrollX = 0;
      if (typeof window.pageXOffset == "number") this.scrollX = window.pageXOffset;
      else if (document.documentElement && document.documentElement.scrollLeft)
          this.scrollX = document.documentElement.scrollLeft;
      else if (document.body && document.body.scrollLeft)
          this.scrollX = document.body.scrollLeft;
      else if (window.scrollX) this.scrollX = window.scrollX;
  },

  getScrollY: function () {
    this.scrollY = 0;
    if (typeof window.pageYOffset == "number") this.scrollY = window.pageYOffset;
    else if (document.documentElement && document.documentElement.scrollTop)
          this.scrollY = document.documentElement.scrollTop;
      else if (document.body && document.body.scrollTop)
          this.scrollY = document.body.scrollTop;
      else if (window.scrollY) this.scrollY = window.scrollY;
  },

  getAll: function () {
    this.getWinWidth(); this.getWinHeight();
    this.getScrollX();  this.getScrollY();
  }
}

var width = 0;
var height = 0;

function hidePopupImage()
{
    opacity('popTable', 100, 0, 500);
}

function showPopupImage() {
    changeOpac(0, 'popTable');
    opacityOn('popTable', 0, 100, 500);
}

function showHidePopupImage(sign) {
    if(sign == 'true') {
        if (document.getElementById('ddlSize'))     document.getElementById('ddlSize').style.visibility     = 'hidden';
        if (document.getElementById('ddlQuantity')) document.getElementById('ddlQuantity').style.visibility = 'hidden';
        opacityOn('popTable', 1);
        document.getElementById('fullSizeImage').src    = ajaxImage;
        document.getElementById('fullSizeImage').width  = widthAjaxImage;
        document.getElementById('fullSizeImage').height = heightAjaxImage;
    }	else {
        if (document.getElementById('ddlSize'))     document.getElementById('ddlSize').style.visibility     = '';
        if (document.getElementById('ddlQuantity')) document.getElementById('ddlQuantity').style.visibility = '';
        //opacityOff('popTable', 1);
        clearInterval(timer1);
        changeOpac(0, 'popTable');
        document.getElementById('popTable').style.display = 'none';
        document.getElementById('popTable').style.left = "10000px";
        document.getElementById('popTable').style.top ="10000px";
    }
}

function showHidePopupImageNoSelectHide(sign) {
	if(sign == 'true') {

        if (document.getElementById('pgnPageNavigator_changePageSize'))     document.getElementById('pgnPageNavigator_changePageSize').style.visibility     = 'hidden';

		opacityOn('popTable', 1);
		document.getElementById('fullSizeImage').src    = ajaxImage;
		document.getElementById('fullSizeImage').width  = widthAjaxImage;
		document.getElementById('fullSizeImage').height = heightAjaxImage;
	}	else {
        if (document.getElementById('pgnPageNavigator_changePageSize'))     document.getElementById('pgnPageNavigator_changePageSize').style.visibility     = '';
		//opacityOff('popTable', 1);
		clearInterval(timer1);
		changeOpac(0, 'popTable');
		document.getElementById('popTable').style.display = 'none';
		document.getElementById('popTable').style.left = "10000px";
		document.getElementById('popTable').style.top ="10000px";
	}
}

function showPopupImage(e, imageURL, widthImage, heightImage, number)
{
    var divAddImageComment = document.getElementById('popTable');

  //  divAddImageComment.style.width  = widthImage  + 10;
  //  divAddImageComment.style.height = heightImage + 10;
      divAddImageComment.style.width  = widthImage;
      divAddImageComment.style.height = heightImage;

    for(var i=0; i<2; i++)
    {
        viewport.getAll();
        var x=e.pageX?e.pageX:e.clientX+viewport.scrollX;
        var y=e.pageY?e.pageY:e.clientY+viewport.scrollY;

        iMouseX = x;
        iMouseY = y;

        //posId = number%3;
        offset = 10;
        switch(number)
        {
            case 1: // left
                x=x+offset;
                break;
            case 2: // middle
                x=x-divAddImageComment.offsetWidth/2-offset;if(x<0)x=0;
                break;
            default: // right
                x=x-divAddImageComment.offsetWidth-offset;if(x<0)x=0;
                break;
        }

        if(y+divAddImageComment.offsetHeight+offset-100 > viewport.height)
        {
            y=y-divAddImageComment.offsetHeight-offset;
        }
        else
        {
            y=y+offset;
        }


        divAddImageComment.style.left = x+"px";
        divAddImageComment.style.top  = y+"px";
       // divAddImageComment.style.display='block';

    }
    if (x == 0 && y == 0) {divAddImageComment.style.display = 'none'; return false};
//	divAddImageComment.style.visibility = 'visible';

    //divAddImageComment.style.background = '#FFFFFF url('+imageURL+') no-repeat center center';

    img = new Image();

    img.onload = function(){
        document.getElementById('fullSizeImage').width = widthImage;
        document.getElementById('fullSizeImage').height = heightImage;
        document.getElementById('fullSizeImage').src = this.src;
    };

    img.width  = widthImage;
    img.height = heightImage;
    img.src    = imageURL;

    /*if (width > 0)
    {
        document.getElementById('popTable').style.width = width;
        document.getElementById('popTable').style.height = height;
    }*/
}