// JavaScript Document

CategoryList = {
	
	
	headers : [],
	stretchers : [],
	
	taglookup : null,  // tag => element lookup
	headerlookup : null, // element => tag lookup
	
	accordion : null, // The Mootools fx
	
	current_selected_header : null,
	current_selected_subcat : null,
	
	/*
	*	BUG FIX: Stop loading data twice on load. Skip initial opening event.
	*/
	skipped_first_event : false, 
	
	init : function(){
		//Build DOM
		CategoryList.build();
				
		//Add effect
		CategoryList.accordion = new Fx.Accordion(
											$$('div.header'), 
											$$('div.stretcher'), 
											{
												opacity: false, 
												height: true,
												onComplete: CategoryList.openComplete, 
												onActive : CategoryList.headerClicked,
												duration: 250
											}
									 );
		
		//Add category tags to exclude tags
		State.genericExcludeTags.extend(UIConfig.tag_categories);
		for (var i = 0; i < UIConfig.tag_subcats.length ; i++){
			State.genericExcludeTags.extend(UIConfig.tag_subcats[i]);
		}
	},
	
	build : function(){				
		CategoryList.taglookup = new Hash();
		CategoryList.headerlookup = new Hash();
		
		//Get category details from UIConfig
		var category_names = UIConfig.categories;
		var category_tags = UIConfig.tag_categories;
		var subcat_names = UIConfig.subcats;
		var subcat_tags = UIConfig.tag_subcats;
		
		//Container
		var container = UIConfig.category_container;
		
		//Add 'All categories'
		CategoryList.current_selected_header = CategoryList.addSection(container, 'All Categories', '', [], []);
		CategoryList.stretchers[0].style.fontSize = '2px'; //Fix IE height bug
		
		//Add sections
		for (var i = 0; i < category_names.length; i++){
			
			//Add section
			CategoryList.addSection(container, category_names[i], category_tags[i], subcat_names[i], subcat_tags[i]);
			
		}
	},
	
	addSection : function(container, title, tag, child_names, child_tags){
		//Create
		var hdiv = new Element('div');
		var sdiv = new Element('div');
		var tlink = new Element('a');

		//Init
		hdiv.addClass('header');
		sdiv.addClass('stretcher');
		tlink.setHTML(title);
		tlink.onclick="return false;";
		tlink.href="#";
		hdiv.id="cat_"+tag;
		
		//Events
		tlink.addEvent('mouseover', CategoryList.elementHover);
		tlink.addEvent('mouseout', CategoryList.elementDehover);
		
		//Children
		if (child_names.length > 0){
			
			var list = new Element('ul');
			
			for (var i = 0; i < child_names.length; i++){
				CategoryList.addChild(list, child_names[i], child_tags[i]);
			}
			
			sdiv.appendChild(list);
		}
				
		//Append
		hdiv.appendChild(tlink);
		container.appendChild(hdiv);
		container.appendChild(sdiv);
		
		//Add to lookup
		CategoryList.headers.push(hdiv);
		CategoryList.stretchers.push(sdiv);
		
		CategoryList.taglookup.set(tag, hdiv);
		CategoryList.headerlookup.set(hdiv.id, tag);
		
		return hdiv;
	},
	
	addChild : function(container, title, tag){
		//Create
		var tlink = new Element('a');
		var item = new Element('li');
		
		//Init
		tlink.setHTML(title);
		tlink.onclick="return false;";
		tlink.href="#";
		item.id="cat_"+tag;
		
		//Events
		tlink.addEvent('click', CategoryList.subsectionClicked);
		tlink.addEvent('mouseover', CategoryList.elementHover);
		tlink.addEvent('mouseout', CategoryList.elementDehover);
		
		//Append
		item.appendChild(tlink);
		container.appendChild(item);
		
		//Add to lookup
		CategoryList.taglookup.set(tag, item);
		CategoryList.headerlookup.set(item.id, tag);
	},
	
	elementHover : function(event){
		event = new Event(event);
		//Called when a item / header is mouseovered
		var element = event.target.parentNode;
		var tag = CategoryList.headerlookup.get(element.id);
		Markers.hilightByTag(tag);
		
		delete element;
		delete tag;
	},
	
	elementDehover : function(event){
		//Called when a item / header is mouseouted
		Markers.stopHoverOverAll();
	},
	
	hilightHeadersByTag : function(tagstr){
		CategoryList.taglookup.each(function(tag,el){
			if (tagstr.indexOf(","+tag+" ") != -1){
					el.addClass("hover");
				} 
			});		
	},
	
	unhilightHeaders : function(){
		CategoryList.taglookup.each(function(tag,el){
				el.removeClass("hover");
		});		
	},
	
	
	headerClicked : function(element){
		
		//Un-hilight old category
		CategoryList.current_selected_header.removeClass('selected');
		CategoryList.current_selected_header.removeClass('open');
		
		//Hilight this one and update pointer
		CategoryList.current_selected_header = element;
		element.addClass('selected');
		
		//Un-hilight old sub cat if there
		if (CategoryList.current_selected_subcat != null) 
			CategoryList.current_selected_subcat.removeClass('selected');
			
		//Set subcat to null
		CategoryList.current_selected_subcat = null;
	},
	
	subsectionClicked : function(event){
		event = new Event(event);
		//Get the LI item, slightly hackerish
		var element = event.target.parentNode;
		
		//Set the category to 'open'
		CategoryList.current_selected_header.removeClass('selected');
		CategoryList.current_selected_header.addClass('open');
		
		//Un-hilight old category
		if (CategoryList.current_selected_subcat != null) 
			CategoryList.current_selected_subcat.removeClass('selected');
		
		//Hilight this one and update pointer
		CategoryList.current_selected_subcat = element;
		element.addClass('selected');
		
		CategoryList.openComplete();
		
	},
	
	closeAll : function(){
		CategoryList.current_selected_header.removeClass('selected');
		CategoryList.current_selected_header.removeClass('open');
		CategoryList.current_selected_header = CategoryList.taglookup.get('');
		CategoryList.current_selected_header.addClass('selected');
		
		CategoryList.accordion.display(0);
	},
	
	selectCategoryByTag : function(tag){
		
		return false;
	},
	
	getCurrentTags : function(){
		
		if (CategoryList.current_selected_header == null) return '';
		
		var tags = [];
		
		tags.push(CategoryList.headerlookup.get(CategoryList.current_selected_header.id));
		
		if (CategoryList.current_selected_subcat != null) 
			tags.push(CategoryList.headerlookup.get(CategoryList.current_selected_subcat.id));
		
		tags.remove("");
		
		return tags;
	},
	
	openComplete : function(){
		if (CategoryList.skipped_first_event == false){
			CategoryList.skipped_first_event = true;
			return;  //skip first event
		}

		Explore.tagClicked(CategoryList.getCurrentTags(), true)
		
	}
	
}


