/**
 * Project:		ZORROFILM - AYLA
 * 
 * @author:		Andreas Prockl <ap@okapi.de>
 * @version:	1.0
 * @date:		03/2010
 *
 */



var Background = new Class({
	options: { // HTML-Attribute des img-Tags
		container:	"fullsize-img", // (#fullsize-img)
		id:			"background",
		src:			"",
		alt:			"",
		style: { // CSS
			"width":		1000,
			"height":	800,
			"position":	"fixed"
		}
	},

	element: null, // speichert das img-Tag

	ratio: 1, // urspruengliches seitenverhaeltnis des bildes festhalten

	initialize: function(options) {
		this.options = $merge(this.options, options);

		// Image-Tag erstellen
		this.element = new Asset.image(this.options.src, {
			id: this.options.id,
			onload: function() { this.element.fade("in"); }.bind(this)
		}).setStyles(this.options.style).fade("hide").injectInside( $("fullsize-img") );
		this.ratio = this.options.style.width / this.options.style.height;

		// resizen aktivieren
    	window.addEvent('resize', this.resizeBackground.bind(this));
    	this.resizeBackground();

    	// IE-fix fuer position:fixed
    	if (Browser.Engine.name == "trident" && Browser.Engine.version < 5) {
      	window.addEvent("resize", this.fixPosition.bind(this));
      	window.addEvent("scroll", this.fixPosition.bind(this));
      	this.fixPosition();
    	}
	},

	resizeBackground: function() { // Hintergrundbild resizen, dabei Seitenverhaeltnis beibehalten
		if (window.getWidth() / window.getHeight() > this.ratio) { // breite beibehalten
      	this.element.setStyle("width", window.getWidth()).setStyle("height", window.getWidth() / this.ratio);
    	}
		else { // hoehe beibehalten
      	this.element.setStyle("width", window.getHeight() * this.ratio).setStyle("height", window.getHeight());
    	}
  	},

	fixPosition: function() { // position: fixed im IE6 simulieren
		
  		this.element.setStyles({
  			"position"	:	"absolute",
  			"top"		:	(window.getScroll().y + window.getSize().y - this.element.getSize().y)
    	});
	}
});




/*
 * Do this when DOM is ready
 */
window.addEvent("domready", function() {
	var bg = new Background({ src: hgImg, style: { width: breite, height: hoehe } });
});