buildCats = function() {

	var dd_open = false; // flag for status open/close of dd
	var dd_parent = false;

  // react on click on the box and the headerlink
  $$('.cat_link').each(function(s, index) {
		
		s.observe('mouseover', function(){
			
			$$('a.cat_dropdown').each(function(e){e.className='cat_dropdown';});
			try{$('dropdown_menu').remove();}catch(e){}
			dd_open=false;
			dd_parent = false;
			
			var box = "";
	
			var data = s.getAttribute('dd_object');
			json = data.evalJSON();
			
			var category = json.category;
			var catLen = category.length;	
			
			// make category dd html
			category.each(function(c, index){ box += showCat(home_makeCategoryObject(c),index, catLen); });
			
			box = '<div id="dropdown_menu">' + box + '</div>';
			
			
			// insert the category dropdown
			new Insertion.After($('website_container'), box);
			dd_parent = s.down(0);
			
			$('dropdown_menu').setStyle({
				position: 'absolute',
				display: 'none',
				top:  s.down(0).getHeight()+s.down(0).cumulativeOffset().top-1+'px',
				left:  s.down(0).cumulativeOffset().left+'px'
			});
			
			
			// if dd is not visible
			if(!dd_open){
				Effect.BlindDown('dropdown_menu', { duration: 0.2 });
				s.down(0).className = 'cat_dropdown active';
				dd_open = true;
			}
			else if(dd_open){
				$('dropdown_menu').hide();
				s.down(0).className = 'cat_dropdown';
				dd_open = false;
			}
		
		});
	
	
		s.observe('mouseover', function(){ s.down(0).className = 'cat_dropdown active'; });
		
		s.observe('mouseout', function(event){
			if(!dd_open) s.down(0).className = 'cat_dropdown';
			if(!$('dropdown_menu')) s.down(0).className = 'cat_dropdown';
		});
		
  });

  
  
	// on click outside the box --> hide it
	document.observe('click', function(event){
		var targ = getEventTarg(event, 'tg');
		try{
			if(targ.parentNode.id == 'dropdown_menu' /*|| targ.tagName == 'A'*/ ){
				//return;
			} else {
				$(dd_parent).className = 'cat_dropdown';
				$('dropdown_menu').hide();
				$('dropdown_menu').remove();
				dd_open = false;
			}
		}catch(e){}
	});
	
	document.observe('mouseover', function(event) {
		try{
			var tg = getEventTarg(event, 'tg');
			var reltg = getEventTarg(event, 'reltg');

			if (reltg.parentNode.className == 'cat_link' || reltg.parentNode.parentNode.id == 'dropdown_menu' || reltg.parentNode.parentNode.id == 'dropdown_menu' || reltg.parentNode.parentNode.id == ''){
				//return;
				//$('debug').insert(tg.parentNode.parentNode.id);
			}
			else{
				if($('dropdown_menu')){
					$('dropdown_menu').hide();
					$('dropdown_menu').remove();
					dd_open = false;
					$(dd_parent).className = 'cat_dropdown';
					$(dd_parent).hide();
					$(dd_parent).show();
					$$('a.cat_dropdown').each(function(e){e.className='cat_dropdown';});
				}
			}
		}
		catch(e){}
	});

};


///// 
/////
///// 
/////


function home_catTemplate(index, catLen){
	
	var content = "";
	// template of the box
	if(index < (catLen-1))	var content = '<p><a href="#{link}" onclick="SWFAddress.setValue(this.rel);return false;this.blur();" rel="#{rel}" style="white-space:nowrap;overflow:hidden;" title="#{title}">#{title}</a>&nbsp;&nbsp;&nbsp;#{amount_videos} videos, #{amount_images} images</p>';
	else content+= '<p class="bottom"><a href="#{link}" onclick="SWFAddress.setValue(this.rel);return false;this.blur();" rel="#{rel}" style="white-space:nowrap;overflow:hidden;" title="#{title}">#{title}</a>&nbsp;&nbsp;&nbsp;#{amount_videos} videos, #{amount_images} images</p>';		

	var template = new Template(content);
	
	return template;

};


function showCat(media, index, catLen){


	var template = home_catTemplate(index, catLen);
	var box = template.evaluate(media);
	
	return box;


};


function home_makeCategoryObject(c){

	var category = {
	
		title: unescape(c.title),
		link: c.link,
		rel: c.rel,
		amount_videos: c.amount_videos,
		amount_images: c.amount_images
				
	};

	return category;

};



function getPosition(element){
	
  var elem=element,tagname="",x=0,y=0;
  while ((typeof(elem)=="object")&&(typeof(elem.tagName)!="undefined") && elem.id !="website_container")
  {
    y+=elem.offsetTop;   
    x+=elem.offsetLeft;   
    tagname=elem.tagName.toUpperCase(); 


    if (elem.id=="website_container")
      elem=0;

    if (typeof(elem)=="object")
      if (typeof(elem.offsetParent)=="object")
        elem=elem.offsetParent;
  };

  position=new Object();
  position.x=x;
  position.y=y;
  return position;
};