window.addEvent('domready', function(){
	
	if ($('verkefni')) {
		$$('html').setStyle('background', '#333333');
	}
	
	if(document.id('verkefni') != null) {
		document.id('verkefni').masonry({
			columnWidth: 224,
			itemSelector: '.box'
		});
	}
	else {}
	
	/* hover! */
	Element.implement({
	  'hover': function(fn1,fn2) {
		return this.addEvents({
		  'mouseenter': function(e) {
			fn1.attempt(e,this);
		  },
		  'mouseleave': function(e) {
			fn2.attempt(e,this);
		  }
		})
	  }
	});
	
	
	var children = $$('#verkefni .box');
	
	children.each(function(el){
		el.set('morph', { duration: 200 });
		children.set('morph', { duration: 200 });
		
		
		
		el.hover(function(e) {
		  children.morph({'opacity': 0.7});
		  el.morph({'opacity': 1});
		  el.addClass("hover");
		  var rel = el.getElement('a').get('href').toLowerCase();
		  var nave = $$(".left .block ul li");
		  
		  nave.each(function(item){
			var href = item.getElement('a').get('href').toLowerCase();
			
			if (rel == href) {
				item.set('class', 'hover');
			}
		  });
		  
		}, function(e) {
		  children.morph({'opacity': 1});
		  el.removeClass("hover");
		  $$(".left .block ul li").removeClass('hover');
		});
		
		
	});
	
	var blod = $$('.blodin .box');
	var hoverimg = '<img src="/img/blodoverlay.png" class="overlay" alt="overlay" />';
	
	
	blod.each(function(el){
		var contentof = el.getElement('a').get('html') + hoverimg;
		el.getElement('a').set('html', contentof);
		el.getElement('img.overlay').set('morph', { duration: 300 });
		
		//Forhlağa myndum
		var elid = el.get('id');
		var imagesrc = '/img/blodin/background/' + elid + '.jpg';
		
		var preloadImages = function() {
			if (document.images) {
				preload_image_object = new Image();
				// set image url
				image_url = imagesrc;
				var i = 0;
				for(i=0; i<=3; i++) 
				preload_image_object = image_url[i];
			}
		};
		preloadImages();
		 
		el.hover(function(e) {
			el.addClass("hover");
			el.getElement('img.overlay').morph({'opacity': 1});
			var elid = el.get('id');
			var image = '/img/blodin/background/' + elid + '.jpg';
			$$('html').setStyle('background-image', 'url(' + image + ')');
			$$('#wrap').setStyle('background', 'none');
		}, function(e) {
			el.removeClass("hover");
			el.getElement('img.overlay').morph({'opacity': 0});
			$$('html').removeProperty('style');
			//$$('html').setStyle('background-image', 'url(/img/doodles.jpg)');
		});
		
		
	});
	
});