var Lenn = new Class({
	fonts			: $empty, // Cufon fonts
	gridImages		: $empty, // Image objects in grid
	addedGridImages	: $empty, // Added images before load
	imageElements	: $empty, // Image elements in grid
	containers		: $empty, // Image containers
	overlays		: $empty, // Image overlays
	type			: $empty, // Page or Grid
	prevBodySize	: 0, 	  // Previous body size
	timer			: 0, 
	imageLayer		: $empty,
	
	initialize:function() {
		// Init vars
		this.addedGridImages = new Array();
		this.gridImages 	 = new Array();
		this.imageElements 	 = new Array();
		this.containers 	 = new Array();
		this.overlays 		 = new Array();
		
		// Set fonts
		fonts = [
			{name:'bureau', fontName:'BureauGrotOneThree', ids:new Array()},
			{name:'bureauThreeSeven', fontName:'BureauGrotThreeSeven', ids:new Array()},
			{name:'helvetica', fontName:'Helvetica', ids:new Array()},
			{name:'phaistos', fontName:'Phaistos', ids:new Array()},
			{name:'futura', fontName:'Futura ND', ids:new Array()},
			{name:'typewriter', fontName:'ITC American Typewriter', ids:new Array()},
			{name:'tiffany', fontName:'ITC Tiffany', ids:new Array()}
		];

		// Add window event listeners
		window.addEvent('domready', this.onDOMReady.bind(this));
		window.addEvent('resize', this.resizeWebsite.bind(this));
	}
	
	/**
	 * Sets the page type
	 *
	 */
	,setType:function(sType) {
		this.type = sType;
	}
	
	/**
	 * DOM Ready
	 *
	 */
	,onDOMReady:function() {
		if(this.type=="grid")
			this.initGrid();
		else if(this.type=="page")
			this.initPage();
		
		//this.initFonts();
		this.resizeWebsite();	// Resize
	}
	
	/**
	 * Initialize and preload
	 * the grid
	 *
	 */
	,initGrid:function() {
		var images = [];
		// Get all image urls
		this.addedGridImages.forEach(function(item){
			images.push(item.src);
		}.bind(this));
		
		// Create an Asset.image for each url
		this.imageElements = new Asset.images(images, {
			    onComplete:this.onGridLoaded.bind(this)
		});	
		
		// Set the correct header height
		var h = $('header-lenn').getSize().y;
		var ph = $('photographers').getSize().y;
		var th = $('tags').getSize().y;
		var mh = $('menu').getSize().y;
		
		this.setHeaderHeight([h, ph, th, mh], false);
				
		// Init fonts
		this.initFonts();	
	}
	
	/**
	 * Gird images loaded callback
	 *
	 */
	,onGridLoaded:function() {
		
		// Replace the div for the img
		this.imageElements.forEach(function(el,i){
			var c = $(this.addedGridImages[i].id);
			el.set('id', this.addedGridImages[i].id);
			el.addClass('grid-item-img');
			el.replaces(c);
			el.set('width', el.getSize().x);
			el.set('height', el.getSize().y);
			this.initGridImage(el, this.addedGridImages[i].hasOverlay, this.addedGridImages[i].hasLink);
		}.bind(this));

		
		// Calc the correct widths
		this.setContainerWidth();
		
		// Resize
		this.resizeGrid();
	
	}
	
	
	/**
	 * Initialize fonts
	 *
	 */
	,initFonts:function() {
	
		fonts.forEach(function(o){
			var font_elements = new Array();
			var css_elements  = new Array();
			
			
			
			// Get all category-fonts
			o.ids.forEach(function(fid){
				Cufon.replace('.font-id-'+fid, {fontFamily:o['fontName'], hover:true});
			});
			
			
			Cufon.replace('.'+o['name'], {fontFamily:o['fontName'], hover:true});
			Cufon.replace('.p-'+o['name'], {fontFamily:o['fontName'], hover:true});
			Cufon.replace('.tag-'+o['name'], {fontFamily:o['fontName'], hover:true});
			
			
			
		});
		Cufon.replace('#formbuilder_form_lenn_mailinglist>h2', {fontFamily:'Futura ND', hover:true});
		Cufon.replace('#formbuilder_form_lenn_mailinglist label', {fontFamily:'Futura ND', hover:true});
		

		Cufon.replace('.single-post-text h2', {fontFamily:'BureauGrotOneThree', hover:true});
			
		
	}
	
	/**
	 * Adds a font by category id
	 *
	 */
	,addFont:function(catId, fontName) {
		fonts.forEach(function(o){
			if(o.name==fontName) {
				if(o.ids==undefined) o.ids = new Array();
				o.ids.push(catId);
			}
		});
	}
	
	/**
	 * Adds an image to the grid
	 *
	 */
	,addGridImage:function(id, src, hasOverlay) {
		
		this.addedGridImages.push({
			id:id,
			src:src,
			hasOverlay:hasOverlay
		});
	}
	
	/**
	 * Initialize a grid image
	 * after preloading
	 *
	 */
	,initGridImage:function(image, hasOverlay) {
		
		var container = image.getParent();
		
		var id		  = container.get('id').substr(11,container.get('id').length);
		var overlay   = $('grid-overlay-'+id);
		var text 	  = $('grid-text-'+id);
		
		
		// Position the overlay
		if(hasOverlay) {
			var overlaytexts = overlay.getElements('span');
			var overlaylinks = overlay.getElements('a');
			overlay.setStyle('margin-top',-(container.getSize().y)+7+'px');
		}
		
		// Initialize the container
		if(!container.retrieve('initialized')) {
			
			
			// Do we have a overlay mouseOver
			if(hasOverlay) {
				overlay.setStyle('visibility', 'hidden');
				// Create a hovergroup
				var hg = new HoverGroup({
					elements: [overlay, text, container, container.getParent()],
					onEnter: function() {
						overlay.setStyle('visibility', 'visible');
					},
					onLeave: function() {
						overlay.setStyle('visibility', 'hidden');
					}
				});
				
				//container.store('index_link', container.getElement('a').href);
				//overlay.addEvent('click', f);
				container.getParent().addEvent('click', function(e){
					e.stop();
					new URI(container.getParent().getElement('a').href).go();
				});
				
			} else {
				
	
				// Add click
				var elp = container.getParent();
				var me = this;
				if(elp.getElement('a')) {
					elp.addEvent('click', function(e){
						e.stop();
						
						if(elp.getElement('a').hasClass('mil-imagelink')) {
							me.imageLayer.showLayer(elp.getElement('a').href);
						} else {
							new URI(elp.getElement('a').href).go();
						}
					});
				}
			
			}
			
			container.store('initialized', true);
			container.store('hasOverlay', hasOverlay);
			
			
			// Store the container
			this.containers.push(container);
			
			// Store the overlay
			this.overlays.push(overlay);
			
			
			
		}

		container.store('cheight', container.getSize().y);
		
		// Store the image
		this.gridImages.push({
			overlay:overlay, 
			container:container, 
			image:image, 
			id:id
		});
	}
	
	/**
	 * Sets the container width
	 *
	 */
	,setContainerWidth:function() {
		this.containers.forEach(function(container,i){
			// Set the width of the parent container
			container.getParent().setStyle('width', this.getContainerWidth(container)+'px');
			
			if(container.retrieve('hasOverlay')) {
				// Set the width of the overlay
				this.overlays[i].setStyle('width', (container.getSize().x-5)+'px');
				// Set the height of the overlay
				if(Browser.Engine.trident) {
					this.overlays[i].setStyle('height', (container.getSize().y-15)+'px');
				} else {
					this.overlays[i].setStyle('height', (container.getSize().y-20)+'px');
				}
				
			}
			
		}.bind(this));
		
	}
	
	/**
	 * Gets the container width
	 *
	 */
	,getContainerWidth:function(container) {
		var images = [];
		this.gridImages.forEach(function(item){
			if(item.container==container) {
				images.push(item.image);
			}
		});
		
		var w = 0;
		// Get the widest image
		images.forEach(function(image, i){
				
			if(i==0) {
				w = image.getSize().x;	
			} else {
				if(image.getSize().x>w) {
					w = image.getSize().x;
				}
			}
		});
		
		return w;
	}
	
	/**
	 * Resize the grid
	 *
	 */
	,resizeGrid:function() {
		
		var py = 0;
		var rowh = 0;
		this.containers.forEach(function(item){
			
			var item_h = item.getParent().getSize().y;
			if(item_h>rowh)
				rowh = item_h;
				
			item.getParent().setStyle('height', rowh);
			
			if(item.getParent().getPosition().y>py) {
				//item.getParent().setStyle('clear', 'both');
				//item.getParent().setStyle('float', 'left');
				py = item.getParent().getPosition().y;
				item.getParent().setStyle('height', item_h);
				rowh = item_h;
			} else {
				
			}
		});
		
		this.resizePage();
	}
	
	/**
	 * Init page
	 *
	 */
	,initPage:function() {
		// Set the correct header height
		var h = $('header-lenn').getSize().y;
		var ph = $('photographers').getSize().y;
		var th = $('tags').getSize().y;
		var mh = $('menu').getSize().y;
		
		this.setHeaderHeight([h, ph, th, mh], true);
		
		// Init fonts
		this.initFonts();
		
		this.resizePage();
	}
	
	/**
	 * Page resize
	 *
	 */
	,resizePage:function(e) {
		this.positionWebsite();
	}
	
	,positionWebsite:function() {
		var header_x = (window.getSize().x-$('header-lenn').getSize().x)/2+10;
		var wrapper_x = (window.getSize().x-750)/2;
		if(wrapper_x<30 || header_x<30) {
			header_x = 60;
			wrapper_x = 30;
		}
		
		
		
		$('wrapper').setStyle('left', wrapper_x+'px');	
		$('header-lenn').setStyle('left', header_x+'px');
	}
	
	/**
	 * Window resize callback
	 *
	 */
	,setHeaderHeight:function(aHeights, isPage) {
		var h = 0;
	
		aHeights.forEach(function(height){
			if(height!=null) {
				if(height>h) {
					h = height;
				}
			}
		});
		$('photographers').setStyle('height', h+'px');
		$('tags').setStyle('height', h+'px');
		$('menu').setStyle('height', h+'px');
		$('logo').setStyle('height', h+'px');
		
		$('header-lenn').setStyle('height', h+10+'px');
	
		$('content').setStyle('margin-top', (h+70)+'px');
	}
	
	/**
	 * Window resize callback
	 *
	 */
	,resizeWebsite:function() {
		if(this.type=="grid")
			this.resizeGrid();
		else if(this.type=="page")
			this.resizePage("event");
	}
	
	/**
	 * Tag mouseover callback
	 *
	 */
	,onTagOver:function(e) {
		e.stop();
		var t = $(e.target);
		
		if(t.retrieve('cats')==null) {
			t = t.getParent('a');
		}
		
		var cats = t.retrieve('cats');
		
		cats.forEach(function(cat){
			var p = $('photographer-'+cat);
			p.addClass('selected');
		});
		
		this.refreshPhotographers();
		
	}
	
	
	/**
	 * Tag moueout callback
	 *
	 */
	,onTagOut:function(e) {
		e.stop();
		var t = $(e.target);
		
		if(t.retrieve('cats')==null) {
			t = t.getParent('a');
		}
		
		var cats = t.retrieve('cats');	
		cats.forEach(function(cat){
			var p = $('photographer-'+cat);
			p.removeClass('selected');
			
		});
		
		this.refreshPhotographers();
	}
	
	,onItemOver:function(e) {
		e.stop();
		var t = $(e.target);
		
		if(t.retrieve('tags')==null) {
			t = t.getParent('a');
		}
		
		var tags = t.retrieve('tags');
		
		tags.forEach(function(tag){
			tag.addClass('selected');
		});
		
		this.refreshTags();
	}
	
	,onItemOut:function(e) {
		e.stop();
		var t = $(e.target);
		
		if(t.retrieve('tags')==null) {
			t = t.getParent('a');
		}
		
		var tags = t.retrieve('tags');	
		tags.forEach(function(tag){
			tag.removeClass('selected');
			
		});
		
		this.refreshTags();
	}
	
	/**
	 * Init tags
	 *
	 */
	,initTags:function() {
		var tags = $$('a.tag');
		
		if(Browser.Engine.trident) return;
		
		tags.forEach(function(tag){
			var tag_cats = tag.get('class').split('#')[1].split('-');
			tag_cats.shift();
			var cats = new Array();
			//console.log(tag_cats);
			for(var i=0; i<tag_cats.length; i++) {
				
				var e = $('photographer-'+tag_cats[i]);
				if(e!=null) {
				cats.push(tag_cats[i]);
				e.addEvent('mouseover', this.onItemOver.bind(this));
				e.addEvent('mouseleave', this.onItemOut.bind(this));
				
				var t = e.retrieve('tags');
				if(t==null) {
					t = [tag]
				} else {
					t.push(tag)
				}
				
				e.store('tags', t);
				}
			}
			tag.store('cats', cats);
			tag.addEvent('mouseover', this.onTagOver.bind(this));
			tag.addEvent('mouseleave', this.onTagOut.bind(this));
		}.bind(this));
	}
	
	,refreshPhotographers:function() {
		
		fonts.forEach(function(o){
			Cufon.refresh('.p-'+o['name'], {fontFamily:o['fontName'], hover:true});
			
		});
	}
	
	,refreshTags:function() {
		
		fonts.forEach(function(o){
			Cufon.refresh('.tag-'+o['name'], {fontFamily:o['fontName'], hover:true});
			
		});
	}

	/**
	 * Add an image layer
	 *
	 */
	,addImageLayer:function() {
				
			this.imageLayer = new mooImageLayer({
				resize:true
			});
		
	}
	
	
});

Lenn = new Lenn();