$(document).ready(function(){
    //auto position the blocs in the middle
    var top = ($(document).height() - 650)/2;
    var left = ($(document).width() - 1280)/2;

	var $whole_content = $('#whole_content');
    if(top > 0){
        $whole_content.css('top', top);
    }
    if(left > 0){
        $whole_content.css('left', left);
    }
    //by default, this element is hidden, after calculus, we show it
    $whole_content.css('display', 'block');
    
    //manage the current selected item
    $('#left_menu li').click(function(){
        $(this).addClass('on').siblings().removeClass('on');
    });
    
    //show the text on mouse over the video's image and hide it on mouse out
    $('#company_videos li').mouseover(function(){ 
        //$(this).children('a .texteidc, a .texteid2').css('display', 'block');
        $(this).children('.maskidc, .maskid2').css('display', 'block');
        $(this).children('.maskidc, .maskid2').css('opacity', '0.5');
    }).mouseout(function(){
        //$(this).children('a .texteidc, a .texteid2').css('display', 'none');
        $(this).children('.maskidc, .maskid2').css('display', 'none');        
    });
    
    //Search engine
    var $element = $('#search input');
    var text = $('#search label').text();
    $element.val(text)
    .focus(function() {
        //we remove the default text when the element has the focus
        if($element.val() == text){ $element.val(''); };
    })
    .blur(function(){
        //we put the original text when the element looses the focus
        if($element.val() == ''){ $element.val(text); }
    });
    
    //do requests when  the user types something in the search input
    $('#search input').keyup(function(key){
        if(this.value.length >= 3 || this.value == ''){
            //TODO - The Ajax query
        }
    });
    
    //wrap a scroll pane arround the lists
    var $menu = $('#menu');
    var $submenu = $('#submenu');
    var $company = $('#company_videos');
    
    if($menu.length != 0) {
    	//$menu.jScrollPane().parent().addClass('menuScrollPaneContainer');
    	var $menu_jsp = $menu.jScrollPane();
    	$menu_jsp.parent().addClass('menuScrollPaneContainer');
    	
    	//position the selected to be shown in the scroll pane
    	var $menu_jspapi = $menu_jsp.data('jsp');
    	var $elt = $('#menu .on');
    	if($elt.length != 0){ 
    		$menu_jspapi.scrollToElement($elt, true); 
    	}
    }
    if($submenu.length != 0) { 
    	var $submenu_jsp = $submenu.jScrollPane();
    	$submenu_jsp.parent().addClass('submenuScrollPaneContainer');
    	
    	//position the selected to be shown in the scroll pane if there are some elements inside
    	var $submenu_jspapi = $submenu_jsp.data('jsp');
    	var $onelt = $('#submenu .on');
    	if($onelt.length != 0){ 
    		$submenu_jspapi.scrollToElement($onelt, true); 
    	}
    }
    if($company.length != 0) { 
    	var $companyvideo_jsp = $company.jScrollPane();
    	$companyvideo_jsp.parent().addClass('companyVideosScrollPaneContainer');
    }
});