Object.extend(String.prototype, {
  // if a string doesn't end with str it appends it
  ensureEndsWith: function(str) {
    return this.endsWith(str) ? this : this + str;
  },
  
  // makes sure that string ends with px (for setting widths and heights)
  px: function() {
    return this.ensureEndsWith('px');
  }
});

Object.extend(Number.prototype, {
  // makes sure that number ends with px (for setting widths and heights)
  px: function() {
    return this.toString().px();
  }
});

var Window = {
  size: function() {
		var width  = window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth);
		var height = window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
		var x      = window.pageXOffset || (window.document.documentElement.scrollLeft || window.document.body.scrollLeft);
		var y      = window.pageYOffset || (window.document.documentElement.scrollTop || window.document.body.scrollTop);
		return {'width':width, 'height':height, 'x':x, 'y':y}
	}
}

var FancyZoomBox = {
  directory : '/fileadmin/templates/php_scripts/feeds/css/images',
  zooming   : false,
  setup     : false,
  
  init: function(directory) {
    if (FancyZoomBox.setup) return;
    FancyZoomBox.setup = true;
    
    var ie = navigator.userAgent.match(/MSIE\s(\d)+/);
    if (ie) {
      var version = parseInt(ie[1]);
      Prototype.Browser['IE' + version.toString()] = true;
      Prototype.Browser.ltIE7 = (version < 7) ? true : false;
    }

    var zoombox = '<div id="zoom" style="display:none;z-index:2000;"><div id="zoom_content"></div><a id="zoom_close" class="close icon-links" href="#">Close</a></div>';
    
    var body  = $$('body').first();
    body.insert(zoombox);
    
    FancyZoomBox.zoom = $('zoom');
    FancyZoomBox.zoom_content = $('zoom_content');

    
    // hide zoom if click fired is not inside zoom
    $$('html').first().observe('click', function(e) {
      var click_in_zoom = e.findElement('#zoom'),
          zoom_display  = FancyZoomBox.zoom.getStyle('display');
      if (zoom_display == 'block' && !click_in_zoom) {
        FancyZoomBox.hide(e);
      }
    });

    // esc to close zoom box
    $(document).observe('keyup', function(e) {
      var zoom_display = FancyZoomBox.zoom.getStyle('display');
      if (e.keyCode == Event.KEY_ESC && zoom_display == 'block') {
        FancyZoomBox.hide(e);
      }
    }); 
  },
  prepareIE: function(height, overflow){
	var body = $$('body').first();
	body.style.height = height;
	body.style.overflow = overflow;
	
	htm = document.getElementsByTagName('html')[0];
	htm.style.height = height;
	htm.style.overflow = overflow; 
	},
	
	// In IE, select elements hover on top of the lightbox
	hideSelects: function(visibility){
		selects = document.getElementsByTagName('select');
		for(i = 0; i < selects.length; i++) {
			selects[i].style.visibility = visibility;
		}
	},
	getScroll: function(){
		if (self.pageYOffset) {
			FancyZoomBox.yPos = self.pageYOffset;
		} else if (document.documentElement && document.documentElement.scrollTop){
			FancyZoomBox.yPos = document.documentElement.scrollTop; 
		} else if (document.body) {
			FancyZoomBox.yPos = document.body.scrollTop;
		}
	},
	
	setScroll: function(x, y){
		window.scrollTo(x, y); 
	},
  show: function(e) {

    e.stop();
		if (FancyZoomBox.zooming) return;
		FancyZoomBox.zooming   = true;
		
		if (Prototype.Browser.ltIE7) {
			FancyZoomBox.getScroll();
			FancyZoomBox.prepareIE("100%", "hidden");
			FancyZoomBox.hideSelects("hidden");
			FancyZoomBox.setScroll(0,0);
		}
		
		var element = e.findElement('a');
		if(element.content_div) {
			var related_div = element.content_div;
			var rel_width = related_div.getWidth();
			var rel_height = related_div.getHeight();
			var content = related_div.innerHTML;
		} else {
			var content = element.content;
		}
		var width              = (element.zoom_width || rel_width);
		var height             = (element.zoom_height || rel_height);
		var d                  = Window.size();
		var yOffset            = document.viewport.getScrollOffsets()[1];
		// ensure that newTop is at least 0 so it doesn't hide close button
		var newTop             = Math.max((d.height/2) - (height/2) + yOffset, 0);
		var newLeft            = (d.width/2) - (width/2);
		FancyZoomBox.curTop    = e.pointerY();
		FancyZoomBox.curLeft   = e.pointerX();
		FancyZoomBox.moveX     = -(FancyZoomBox.curLeft - newLeft);
		FancyZoomBox.moveY     = -(FancyZoomBox.curTop - newTop);

    
    FancyZoomBox.zoom.style.width = width.px();
    FancyZoomBox.zoom.style.height = height.px();
    FancyZoomBox.zoom.style.top = newTop.px();
    FancyZoomBox.zoom.style.left = newLeft.px();
    FancyZoomBox.zoom.setStyle({
		position : 'absolute',
		padding : "7px"
    });
    FancyZoomBox.zoom.show();
    //FancyZoomBox.zoom_close.show();
    FancyZoomBox.zoom_content.innerHTML = content;
    FancyZoomBox.zoom_close = $$('#zoom_close');
    
    FancyZoomBox.zoom_close.each(function(item) {
    	item.observe('click', FancyZoomBox.hide);
    });
    FancyZoomBox.zooming = false;
  },
  
  hide: function(e) {
    e.stop();
		if (FancyZoomBox.zooming) return;
		FancyZoomBox.zooming = true;		
		FancyZoomBox.zoom_content.innerHTML = '';
		//FancyZoomBox.zoom_close.hide();
		FancyZoomBox.zooming = false;
		FancyZoomBox.zoom.hide();
		if (Prototype.Browser.ltIE7) {
			FancyZoomBox.setScroll(0,FancyZoomBox.yPos);
			FancyZoomBox.prepareIE("auto", "auto");
			FancyZoomBox.hideSelects("visible");
		}
  }
}

var FancyZoom = Class.create({
	initialize: function(element) {
		this.options = arguments.length > 1 ? arguments[1] : {};
		FancyZoomBox.init();
		this.element = $(element);
		if (this.element) {
			if (this.options.content) {
				this.element.content = this.options.content;
			} else {
				this.element.content_div = $(this.element.readAttribute('rel').gsub(/^#/, ''));
				this.element.content_div.hide();
			}
			this.element.zoom_width = this.options.width;
			this.element.zoom_height = this.options.height;
			
			this.element.observe('click', FancyZoomBox.show);
  		}
	}
});

document.observe('dom:loaded', function() {
	var body = $$('body').first();
	var height = body.getStyle("height");
});