


window.addEvent('domready',function(){
    

  	// replace title (galleries):
    if (document.id('replace_title')){
    	var replacer = document.id('replace_title');
    	var txt = replacer.get('html');
    	if (txt.contains('span')) txt =  replacer.get('text');
    	replacer.hide();
    	document.id('maintitle').set('text',txt);	
    }
  	
  	if (Browser.ie6) {
  		//alert('hi ie6');
  		DD_belatedPNG.fix('.flag img');	
  		DD_belatedPNG.fix('.frontstripe');
  		DD_belatedPNG.fix('.infobox .arrow');
  		DD_belatedPNG.fix('.infobox .send');	
  	}  
  	
  	
  	//directors list:
  	if (document.id('directors')){
  		var diritems = document.id('directors').getChildren(); 		
  		var firstinfobox = false;
  		for(var i=Math.floor(diritems.length/2); i<diritems.length; i++){
  			if (diritems[i].hasClass('infobox') && (firstinfobox == false)) firstinfobox = true;
  			if(firstinfobox == true){	
  				document.id('injectcol2').grab(diritems[i]);
  			}
  		}
  	}
  	
  	// video trailers list
    document.trailerlist = new TrailerList();
    // see also onLoad
    
  	
  	
  	// work around for image height=0
  	/*var fimg = $$('.filmdetail img');
  	console.log('test height');
  	if (fimg.length>0){
  		fimg.each(function(img){
  			var h = img.get('height');
  			if (h == 0 || h== null){
  				img.set('height', 'auto');
  				img.setStyles('height', 'auto');
  				console.log('height: '+img.get('height'));
  			}
  		});
  	}*/
  	
    //masonry:
    this.mason = document.id('masonry'); 
    //if (this.mason) this.mason.fade('hide');
    if (this.mason) {
	    var colwidth = '';
	    
	    if (this.mason.hasClass('ncols_3')) colwidth = 240;
	    if (this.mason.hasClass('ncols_2')) colwidth = 360;
	    
	    this.mason.masonry({
		    //columnWidth: 710,
		    //columnWidth: 360,
		    
		    columnWidth: colwidth, 
		    itemSelector: '.brick',
		   	resizeable: false
		});
    }
    
    // masonry for movie group description
    this.mason2 = document.id('masonry2'); 

    if (this.mason2) {
    	this.mason2.masonry({		    
		    columnWidth: 240, 
		    itemSelector: '.movie',
		   	resizeable: false
		});
    }    
    
    
    // masonry for movie list
    
    this.masons = $$('.films .group');
    
    if (this.masons.length>0){
    	
    	this.masons.each(function(group){
    		group.masonry({		    
			    columnWidth: 240, 
			    itemSelector: '.brick',
			   	resizeable: false
			});	
    	});
    	
    	
    	
    }
    
    
	// lazy loader    
    var lazy = new MooLazyloader({
        items: '.lazyload',
        loader: '/assets/templates/fiff/img/loader.gif',
        placeholder: '/assets/templates/fiff/img/trans.png'
    });

    
    // arrange mainmenu:
    var mainmenu = document.id('mainmenu');
    if(mainmenu){	
    	//var w = mainmenu.getDimensions().width; doesn't work for ie (css bug cause) => 
    	var as = mainmenu.getChildren().getFirst('a');
    	var w = 0;
    	as.each(function(a){w += Math.floor(a.getDimensions().width)-1;});
	 	var spaces = 740-w;
    	var padding = (spaces/as.length)/2;
       	as.each(function(a, i){
       		if(i == 0)
       		{
       			a.setStyles({
	    			'padding-left':padding
	    		});
       		}
       		else
       		{
	    		a.setStyles({
	    			'padding-left':padding,
	    			'padding-right':padding
	    		});
    		}
    	});
    }
    
    
    // general overlay grey boxes
    var infoboxes = new InfoBox('.infobox');
    
    // sliding infoboxes
   var sap = new SlideAndPin({
        items: '.slidepin' 
    });
    
    //ajax loading for the galleries
    //var galleryloader = new GalleryItemsLoader();
    
    
    
    //inject links in crumb:
    var crumbs = $$('.inject_crumb');
    if (crumbs.length>0){
    	var crumb = document.id('crumb')
    	crumb.adopt(crumbs);	
    	var margin_left = (950-crumb.getDimensions().width)/2;
    	crumb.setStyle('margin-left',margin_left);
    }
    
    
    // remove void img:
    var imgs = $$('img');
    imgs.each(function(img){
    	if (!img.get('src')||img.get('src')=='') img.destroy();	
    });
    
    
    // gallery albums
    var stacks = $$('.stack');
    stacks.each(function(stack){	
    	var clone = stack.clone().inject(stack,'after');
		clone.setStyles({
			'width':'220px',
			'z-index':'1',
			'-webkit-transform': 'rotate('+Number.random(-4,4)+'deg)', 
			'-moz-transform': 'rotate('+Number.random(-4,4)+'deg)'
		});
		stack.setStyles({
			'position':'absolute',		
			'width':'220px',
			'z-index':'10'
			/*'-webkit-transform': 'rotate('+Number.random(-5,5)+'deg)', 
			'-moz-transform': 'rotate('+Number.random(-5,5)+'deg)'*/
		});
    });
    
    
    // gallery download button
    var pgallery =document.id('privategallery');
    if(pgallery){
    	var btns =$$('#privategallery .item .download');
    	btns.fade('hide');
    	btns.each(function(btn){	
   
    		var parent = btn.getParent();
   
    		btn.x = (parent.getDimensions().width - btn.getDimensions().width) / 2;
			btn.y = (parent.getDimensions().height - btn.getDimensions().width) / 2;
    		
    		btn.setStyles({
    			'margin-top'  : btn.y,
    			'margin-left' : btn.x 
    		});
   
    		btn.set('html', '');
    		parent.addEvent('mouseover', function(){
				btn.fade('show');
			});
			
			parent.addEvent('mouseout', function(){
				btn.fade('hide');
			});
	    		
    	});
    }


	// download buttons (press galleries:
	
	var dwnldbtns = $$('.downloadgallery');
		
	if (dwnldbtns.length>0) {
		dwnldbtns.each(function(btn,i){
			var parent = btn.getParent();
			var img = parent.getElement('img');
			if (img) {
				var posx = (img.getDimensions().width - btn.getDimensions().width) / 2;
				var posy = (img.getDimensions().height - btn.getDimensions().height) / 2;
				btn.setStyles({
					'margin-left':posx,
					'margin-top':posy,
					'opacity':0	
				});
				
				parent.addEvent('mouseenter', function(){
					btn.fade('show');
					btn.setStyles({
						'opacity':0.8	
					});
				});
				parent.addEvent('mouseleave', function(){btn.fade('hide');});
				btn.addEvent('mouseenter', function(){this.setStyle('opacity',0.95);});
				btn.addEvent('mouseleave', function(){this.setStyle('opacity',0.8);	});
			}	
		});
	}	

    
    
    // newsbox limit items:
    var n_news = $$('.homepage .newsbox .news');
    //alert('test: '+n_news.length);
    if(n_news && n_news.length>4){
    	n_news.each(function(news, index){
    			if(index>3) news.destroy();
    	});	
    }
    
    
    
    
      
    
    
    // tiny mce title box hack:
    var titleboxes = $$('h2.box');
    titleboxes.each(function(h2){
    	var nxt = h2.getNext();
    	if (nxt.hasClass('box')) nxt.grab(h2, 'top');
    });
    
    
    // login box drawer
    var loginbtn = document.id('loginbtn');     
    if (loginbtn) {
    	var drawer = document.id('logindrawer')
    	drawer.ishidden = true;
    	var errormsgs = $$('#logindrawer .error');
    	
    	if (errormsgs.length == 0){ 
    		drawer.fade('hide');
    	}
    	
    	loginbtn.addEvent('click', function(){
			if (drawer.ishidden){
				drawer.fade('show');
				drawer.ishidden = false;
			}else{
				drawer.fade('hide');
				drawer.ishidden = true;
			}
		});
    }
    
      
   //anchors for masonry (see also onload):
   if ( window.location.hash ) {
       this.anchor = window.location.hash; 
	   window.location.hash = '#';
   }
   
   
   // movie detail:
   // arrange screenings
   var screenings = $$('.screening');
   if (screenings.length>0){
   		var w = screenings.length*screenings[0].getDimensions().width;
   		var parent = screenings[0].getParent();
   		var pw = parent.getDimensions().width;
   		var marginleft = (pw-w)/2;
   		screenings[0].setStyle('margin-left',marginleft);
   }
   
   
   // drawers:
   
   var drawers = $$('.drawer');
   var buttons = $$('.openclose');
   
   drawers.each(function(drawer,index){
   		
   		drawer.ishidden = true;
   		
   		drawer.btn = buttons[index];
   		
   		drawer.btnopentxt = drawer.btn.get('text');
   		drawer.btnclosedtxt = drawer.btn.getProperty('rel');
   		
   		drawer.fx = new Fx.Slide(drawer, {
		    duration: 400,
		    transition: Fx.Transitions.Cubic.easeInOut
		});
		
		drawer.fx.hide();
   		
   		drawer.btn.addEvent('click', function(){
   			
			if (drawer.ishidden){
				drawer.fx.slideIn();
				drawer.ishidden = false;
				drawer.btn.removeClass('closed');
				drawer.btn.addClass('open');
				drawer.btn.set('text',drawer.btnclosedtxt);
			}else{
				drawer.fx.slideOut();
				drawer.ishidden = true;
				drawer.btn.removeClass('open');
				drawer.btn.addClass('closed');
				drawer.btn.set('text',drawer.btnopentxt);
			}
			drawer.btn.blur();
		});
   	
   });
   
   
   
});



window.addEvent('load',function(){
    
    // moved masonry to  ready event because now all images have a width and height
     /*    
    if (!this.mason) return;
    
    var colwidth = '';
    
    if (this.mason.hasClass('ncols_3')) colwidth = 240;
    if (this.mason.hasClass('ncols_2')) colwidth = 360;
    
    this.mason.masonry({
	    //columnWidth: 710,
	    //columnWidth: 360,
	    
	    columnWidth: colwidth, 
	    itemSelector: '.brick' 
	});
	
	this.mason.fade('show');*/	
	
	//anchors:
	if (this.anchor){
		var dest  = this.anchor.substring(1, this.anchor.length);
		var y = $( dest ).getPosition().y-30;
		var myFx = new Fx.Scroll(window).start(0,y);
	}
	
	
	
	document.trailerlist.setPlayButtons();
	
	
	
		

	
});








/* 

InfoBox

author: Sylvain Aerni
license: GPL

*/

var InfoBox = new Class({

	/*Implements : Options,

	options : {
		//optionName : value,
	},*/
	
	//property : undefined,
	
	initialize : function(target) {
		this.boxes = $$(target);
		
		this.boxes.each(function(box){
		
			
			this._drawArrow(box);
			this._getParams(box);
			if (box.display=='hide'){
				this._setShowHide(box);
			}
			this._position(box);
		
		}.bind(this));
	},
	
	
	_position : function(box) {
		
		if (box.x=='center'){
			box.x=box.button.getComputedSize().totalWidth/2-box.arrow.x-12;
		}
		
		box.setStyles({
			'margin-left':box.x.toInt(),
			'margin-top':box.y.toInt()
		});
		
	},
	
	_drawArrow : function(box) {
		
		box.arrow = new Element('div');
		
		if (box.hasClass('arrowtop')){
			 box.arrow.addClass('arrow top');
			 
			 box.arrow.x = box.getComputedSize().totalWidth/2-14;
			 box.arrow.y = -12;
		}
		if (box.hasClass('arrowdown')) {
			//console.log('hi');
			box.arrow.addClass('arrow down'); 
			box.arrow.x = box.getComputedSize().totalWidth/2-26;
			box.arrow.y = box.getComputedSize().totalHeight-6;
			 
		}
		
		box.arrow.inject(box,'top');
		
		box.arrow.setStyles({
			'margin-left':box.arrow.x,
			'margin-top':box.arrow.y
		});
		
	},
	
	/*_drawArrow : function(box) {
		
		box.arrow = new Element('div');
		
		if (box.hasClass('arrowtop')){
			 box.arrow.addClass('arrow top');
			 
			 box.arrow.x = box.getComputedSize().totalWidth/2-14;
			 box.arrow.y = -12;
		}
		if (box.hasClass('arrowdown')) box.arrow.addClass('arrow down hidden');
		
		box.arrow.inject(box,'top');
		
		box.arrow.setStyles({
			'margin-left':box.arrow.x,
			'margin-top':box.arrow.y
		});
		
	},
	*/
	
	
	
	_getParams : function(box) {
		
		var title  = box.get('title');
		if (title == null) {
			box.x = 0;
			box.y = 0;
		}else{
			var params = title.split(",");
			
			box.x = params[0];
			box.y = params[1];
			
			if (params.length<3) {
				box.set('opacity', 1);
				return;
			}
			// setting the show/hide system:
			box.display = params[2];
			box.button = document.id(params[3]);
		}		
	},
	
	
	_setShowHide : function(box) {
		
		box.set('tween', {duration: 250});
		
		box.set('opacity', 0);
		
		//box.fade('hide');
		
		box.button.addEvent('click', function(){
				//console.log('box: '+box);
				//box.fade('toggle');
				if (box.get('opacity')==1){
					box.tween('opacity', 0);
				}else{
					box.tween('opacity', 1);
				}

		});
		
		// hide when clicked outside:
		$(document.body).addEvent('click',function(e) {  
		  
		  var target = $(e.target);
		  
		  if(target.getParents().contains(box) || target==box || target==box.button) { 
		    if (target.hasClass('close')) box.fade('hide');
		  }else{
		  		box.fade('hide');
		  }
		}); 
		
		
	}


});









/* 

TrailerList

author: Sylvain Aerni
license: GPL

*/
/*
var GalleryItemsLoader = new Class({

	
	initialize : function() {
		
		var btn = document.id('additemsbutton');
		
		if (!btn) return;
		
		var myRequest = new Request.HTML({
		    url: 'http://www.fiff.ch/festival/galeries/images/ajax.html',
		    method: 'get',
		    data: { 'do' : '1' },
		    //onRequest: function() { alert('Request made. Please wait...'); },
		    //append: document.id('ajaxtarget'),
		    onComplete: function(responseTree, responseElements, responseHTML) { 
		    	
		    	
		    	var images = responseElements.filter('img');
		    	//console.log('images'+images[0].get('height'));
		    	
		    	var myImages = Asset.images(responseElements.getElements('img'), {
				    //properties: {
				      //  'class': 'myImage',
				      //  title: 'myImage'
				    //},
				    onComplete: function(){
				        var html = new Element( 'div', { html: responseHTML }); 
		    	
		    			var images= html.getElements('img');
		    			
		    			//console.log('myImages: '+images[0].getStyle('height'));
		    	
				    	var moreContent = html; //.getElements('.brick');
				    	
				    	document.id('masonry').adopt(moreContent);
				    	
				    	(function() {
   							document.id('masonry').masonry({
							    appendedContent: moreContent, //document.id('ajaxtarget')
							    singleMode: true
							});
						}).delay(500);						
				    }
				});
		    	
				Mediabox.scanPage();
		    }
		});
		
		btn.addEvent('click', function(){
			//console.log('clickk');
			myRequest.send();
		
		});
		
		
		
	}, //end constructor
		
	_setShowHide : function(box) {
		
	}

});
*/


/*document.id('append_primary').addEvent('click',function() {
    var moreContent = makeNewBoxes(3);
    document.id('primary').append( moreContent )
        .masonry({ appendedContent: moreContent }
            // using a callback to style the new elements
            , function() { $(this).css({background: '#222', color: '#EEE' }); }
        )
    ;
});*/




/* 

TrailerList

author: Sylvain Aerni
license: GPL

*/

var TrailerList = new Class({
	
	initialize : function(target) {
		
		this.links = $$('.videolink');
		
		if (this.links.length>0) {
			this.links.each(function(link,i){
				link.set('rel','lightbox[flash 550 410]');							
			}.bind(this));
		}
		
		if (!document.id('trailers')) return;
		
		var container = document.id('trailers');
		
		var images = $$('#trailers img');
		var links  = $$('#trailers a');
		
		if (images.length != links.length) {
			alert('Saisie incorrecte, il manque un lien ou une image');
			return;
		}
		
		links.href = links.get('href');
		links.text = links.get('text');
		
		container.getChildren().dispose();
		
		
		links.each(function(link,i){
			
			//console.log(link.href+'  '+i);
			
			var item = new Element('div.item.brick');
			item.inject(container,'top');
			
			
			var textlink = new Element('a', {
			    href: link.href,
			    rel:'lightbox[flash 550 410]',
			    html: link.text,
			    title: link.text
			}).inject(item);
			
			var imagelink = new Element('a', {
			    href: link.href,
			    rel:'lightbox[flash 550 410]',
			    title: link.text
			}).inject(item,'top');
			
			images[i].inject(imagelink);
				
		});
		
		
	},
	
	
	
	setPlayButtons : function() {
		
		if (this.links.length>0) {
			this.links.each(function(link,i){
				if (link.getFirst() && link.getFirst().get('tag')== 'img') {
					var posx = link.getDimensions().width/2-21;
					var posy = link.getFirst().getDimensions().height/2-21;
					
					var playbtn = new Element('a.infobox.play');
					playbtn.inject(link,'top');
					
					playbtn.setStyles({
						'margin-left':posx,
						'margin-top':posy,
						'opacity':0.85	
					});
				}	
			});
		}	
	}


});








/*
---
description: Masonry layout engine (converted from jQuery Masonry)

license: mooMasonry is dual-licensed under GPL and MIT, just like jQuery Masonry itself. You can use it for both personal and commercial applications.

authors:
- David DeSandro
- Olivier Refalo

requires:
- core/1.2.4:'*'

provides: [Element.masonry]
...
*/

var MasonryClass = new Class({

	Implements : Options,

	options : {
		singleMode : false,
		columnWidth : undefined,
		itemSelector : undefined,
		appendedContent : undefined,
		resizeable : true
	},
	
	element : undefined,
	colW : undefined,
	colCount : undefined,
	lastColCount : undefined,
	colY : undefined,
	lastColY: undefined,
	bound : undefined,
	masoned : undefined,
	bricks : undefined,
	posLeft : undefined,
	brickParent : undefined,

	initialize : function(element) {
		this.element = document.id(element);
	},
	
	go: function(options) {
	
		this.setOptions(options);

		if (this.masoned && options.appendedContent != undefined)
			// if we're dealing with appendedContent
			this.brickParent = options.appendedContent;
		else
			this.brickParent = this.element;
		
		if (this.brickParent.getChildren().length > 0) {
			// call masonry layout
			this.masonrySetup();
			this.masonryArrange();

			// binding window resizing

			// TODO: a REVOIR
			var resizeOn = this.options.resizeable;
			if (resizeOn)
			{
			  if(this.bound == undefined)
			  {
					this.bound = this.masonryResize.bind(this);
					this.attach();
			  }
			}

			if (!resizeOn)
				this.detach();
		}
	},

	attach : function() {
		window.addEvent('resize', this.bound);
		return this;
	},

	detach : function() {
	  if(this.bound != undefined )
	  {
		  window.removeEvent('resize', this.bound);
		  this.bound = undefined;
	  }
	  return this;
	},

	placeBrick : function(brick, setCount, setY, setSpan)
	{
		var shortCol = 0;

		for (var i = 0; i < setCount; i++)
			if (setY[i] < setY[shortCol])
				shortCol = i;

		brick.setStyles({
					top : setY[shortCol],
					left : this.colW * shortCol + this.posLeft
		});

		var size=brick.getSize().y+brick.getStyle('margin-top').toInt()+brick.getStyle('margin-bottom').toInt();
		for (var i = 0; i < setSpan; i++)
			this.colY[shortCol + i] = setY[shortCol] + size;
	},

	masonrySetup : function()
	{
		var s = this.options.itemSelector;
		this.bricks = s == undefined ? this.brickParent.getChildren() : this.brickParent.getElements(s);

		if (this.options.columnWidth == undefined)
		{
			var b = this.bricks[0];
			this.colW = b.getSize().x + b.getStyle('margin-left').toInt() + b.getStyle('margin-right').toInt();
		}
		else
			this.colW = this.options.columnWidth;

    	var size = this.element.getSize().x+this.element.getStyle('margin-left').toInt()+this.element.getStyle('margin-right').toInt();
		this.colCount = Math.floor(size / this.colW);
		this.colCount = Math.max(this.colCount, 1);
		
		return this;
	},

	masonryResize : function()
	{
		this.brickParent = this.element;
		this.lastColY=this.colY;
		this.lastColCount = this.colCount;
		
		this.masonrySetup();
		
		if (this.colCount != this.lastColCount)
			this.masonryArrange();
		return this;
	},

	masonryArrange : function()
	{
		// if masonry hasn't been called before
		if (!this.masoned) 
			this.element.setStyle('position', 'relative');

		if (!this.masoned || this.options.appendedContent != undefined)
			// just the new bricks
			this.bricks.setStyle('position', 'absolute');

		// get top left position of where the bricks should be
		var cursor = new Element('div').inject(this.element, 'top');

		var pos = cursor.getPosition();
		var epos = this.element.getPosition();
		
		var posTop = pos.y - epos.y;
		this.posLeft = pos.x - epos.x;

		cursor.dispose();
	
		// set up column Y array
		if (this.masoned && this.options.appendedContent != undefined) {
			// if appendedContent is set, use colY from last call
			if(this.lastColY != undefined)
				this.colY=this.lastColY; 
		 
			/*
			 * in the case that the wall is not resizeable, but the colCount has
			 * changed from the previous time masonry has been called
			 */
			for (var i = this.lastColCount; i < this.colCount; i++)
				this.colY[i] = posTop;
				
		} else {
			this.colY = [];
			for (var i = 0; i < this.colCount; i++)
				this.colY[i] = posTop;
		}

		// layout logic
		if (this.options.singleMode)
   		{
			for (var k = 0; k < this.bricks.length; k++)
      		{
				var brick = this.bricks[k];
				this.placeBrick(brick, this.colCount, this.colY, 1);
			}
		}
		else
		{
			for (var k = 0; k < this.bricks.length; k++)
			{
				var brick = this.bricks[k];

				// how many columns does this brick span
				var size=brick.getSize().x+brick.getStyle('margin-left').toInt()+brick.getStyle('margin-right').toInt();
				var colSpan = Math.ceil(size / this.colW);
				colSpan = Math.min(colSpan, this.colCount);

				if (colSpan == 1)
					// if brick spans only one column, just like singleMode
					this.placeBrick(brick, this.colCount, this.colY, 1);
				else {
					// brick spans more than one column
					// how many different places could this brick fit horizontally
					var groupCount = this.colCount + 1 - colSpan;
					var groupY = [0];
					// for each group potential horizontal position
					for (var i = 0; i < groupCount; i++)
					{
						groupY[i] = 0;
						// for each column in that group
						for (var j = 0; j < colSpan; j++)
							// get the maximum column height in that group
							groupY[i] = Math.max(groupY[i], this.colY[i + j]);
					}        					
					this.placeBrick(brick, groupCount, groupY, colSpan);
				} // else
			}
		} // /layout logic

		// set the height of the wall to the tallest column
		var wallH = 0;
		for (var i = 0; i < this.colCount; i++)
			wallH = Math.max(wallH, this.colY[i]);

		this.element.setStyle('height', wallH - posTop);

		// let listeners know that we are done
		this.element.fireEvent('masoned', this.element);
		this.masoned = true;
		this.options.appendedContent = undefined;

		// set all data so we can retrieve it for appended appendedContent
		// or anyone else's crazy jquery fun
		// this.element.data('masonry', props );
		return this;
	} // /masonryArrange function

});

Element.Properties.mason = { 
 
    set: function(options) { 
        return this.store('mason:options', options); 
    }, 

    get: function(options) {
        var mason = this.retrieve('mason');  
        if (!mason)
        { 
            if (options || !this.retrieve('mason:options'))
            	this.set('mason', options);

            mason = new MasonryClass(this, this.retrieve('mason:options'));                  
            this.store('mason', mason); 
        } 
        return mason; 
    }
};

Element.implement({
	masonry : function(options) {
	 	
	 	//console.log('hi::'+this.get('mason', options).go(options));
	 	
	 	return this.get('mason').go(options);
		//get('mason', options).go(options);
	}
});





var SlideAndPin = new Class({
	Implements: [Options, Events],

	options: {

		items: '.slidepin',
		startpoint: 80
	},


	initialize: function(options) {
		this.setOptions(options);
		
		if (Browser.ie6 || Browser.ie7){
			//alert('hi test');
			 return;
		}
		
		if(this.options.items) {
			this.items = $$(this.options.items);
		} else {
			return;
		}
		//alert(this.items.length);
		this.items.each(function(item) { 
    		item.parent = item.getParent();
    		item.parent.top 	= item.parent.getCoordinates().top;
    		item.parent.bottom 	= item.parent.getCoordinates().bottom;
    		item.margintop0 = item.getStyle('margin-top').toInt();
    		//item.set('morph', {'duration': '500'});		
   	    });
	
		window.addEvent('scroll', function() {
			this.checkPosition(this.items, window.getScroll().y);
		}.bind(this));
        window.fireEvent("scroll");

	},
	

	checkPosition: function(items, scrollposition) {	
    	items.each(function(item, id) {   		
    		
    		var deltatop    = item.parent.top - scrollposition - this.options.startpoint;
    		var deltabottom = item.parent.bottom - scrollposition - this.options.startpoint +20;
    		
       		if (deltatop < 0){   			
    			var top = item.getCoordinates().top+window.getScroll().y;
    			//item.morph({'margin-top': -deltatop});	
    			item.setStyle('position', 'fixed');
    			item.setStyle('top', 80);			
    		}else {
    			//item.morph({'margin-top': item.margintop0});
    			item.setStyle('position', 'absolute');
    			item.setStyle('margin-top', item.margintop0);
    			item.setStyle('top', 0);
    		}	
    		
    		if (deltabottom < 0){  
    			item.setStyle('position', 'absolute');
    			item.setStyle('margin-top', item.margintop0); 
    			item.setStyle('top', 0);			
    			//item.morph({'margin-top': item.margintop0});				
    		}
    		
    			
       }.bind(this));
	}
	
	

});

/*
---

name: MooLazyloader

description: A lazy load script for MooTools Core 1.3.

authors: Stephane P. Pericat (@sppericat)

license: MIT-style license.

requires: [Core]

provides : MooLazyloader

...
*/

var MooLazyloader = new Class({
	Implements: [Options, Events],

	options: {
		container: window,
		items: '.lazyload',
        loader: 'loading.gif',
        placeholder: 'placeholder.gif'
	},

	images: null,
	containerHeight: null,
	loaded: new Array(),

	initialize: function(options) {
		
		this.setOptions(options);
		if(this.options.items) {
			this.images = $$(this.options.items);
		} else {
			throw 'no pictures to lazyload';
		}
		this.containerHeight = this.options.container.getSize().y;
		this.images.each(function(item, id) {
			item.setStyle('visibility', 'hidden');
			item.setStyle('background', 'url(' + this.options.loader + ') center center no-repeat');

			/*if(item.get('src'))
			{
				item.set('rel', item.get('src'));
				item.set('src', '');
			}*/ 
			/*if(!item.get('src')) {
				item.set('src', this.options.placeholder);
			}*/
		}.bind(this));
		this.options.container.addEvent('scroll', function() {
			this.display(this.images, this.options.container.getScroll().y);
		}.bind(this));
        this.options.container.fireEvent("scroll");
	},

	display: function(images, scrollPosition) {
		bottom = scrollPosition + this.containerHeight; 
    	images.each(function(item, id) { 
    		if(this.loaded.contains(id)) return; 
    		if(item.getPosition().y < bottom && item.getPosition().y > scrollPosition) { 
    			this.loaded.push(id); 
    			item.set('src', item.get('rel')); 
    			item.setStyle('visibility', 'visible');
    			//item.set('style', '');
    			//item.setStyle({width: 'inherit', height: 'inherit'});
    			//item.set('morph', {'duration': '0'});
				/*(function() {
					
					item.setStyle('background', '');
				}).delay(150);*/
    		} 
       }.bind(this));
	}
});




