Team:TU Munich/menu.js

From 2011.igem.org

(Difference between revisions)
 
(14 intermediate revisions not shown)
Line 7: Line 7:
var projectcolor="#52aa28";
var projectcolor="#52aa28";
var projectcolorlight="#e1ffb1";
var projectcolorlight="#e1ffb1";
-
var teamcolor="#52aa28";
+
var teamcolor="#63a3d4";
-
var teamcolorlight="#e1ffb1";
+
var teamcolorlight="#d0eaf5";
-
var labcolor="#52aa28";
+
var labcolor="#d15353";
-
var labcolorlight="#e1ffb1";
+
var labcolorlight="#f6b297";
-
var extracolor="#52aa28";
+
var extracolor="#bdc71f";
-
var extracolorlight="#e1ffb1";
+
var extracolorlight="#f9f8b1";
-
var modelcolor="#52aa28";
+
var modelcolor="#fea044";
-
var modelcolorlight="#e1ffb1";
+
var modelcolorlight="#ffedcd";
-
var humancolor="#52aa28";
+
var humancolor="#354da7";
-
var humancolorlight="#e1ffb1";
+
var humancolorlight="#ac96ff";
Line 59: Line 59:
     if (count == 2) {       
     if (count == 2) {       
         $('.subcontent').css({backgroundColor: bgarea,borderColor: navcolor});
         $('.subcontent').css({backgroundColor: bgarea,borderColor: navcolor});
 +
            $('hr').css({color: navcolor,backgroundColor: navcolor});
         $('h1').css({borderColor: navcolor});
         $('h1').css({borderColor: navcolor});
         $('h2').css({borderColor: navcolor});
         $('h2').css({borderColor: navcolor});
Line 73: Line 74:
}
}
$(document).ready(function(){
$(document).ready(function(){
 +
 +
    $('#menubar li').css({color: 'white'});
 +
   
     $('#navproject').css({color: projectcolorlight});
     $('#navproject').css({color: projectcolorlight});
     $('#navlab').css({color: labcolorlight});
     $('#navlab').css({color: labcolorlight});
Line 86: Line 90:
     $('.litopic').mouseover(function(){
     $('.litopic').mouseover(function(){
-
$('.litopic').not(this).css("color","#CCCCCC");
 
  switch (this.id)
  switch (this.id)
  {
  {

Latest revision as of 01:19, 22 September 2011

// ---------------------- // Breadcrumbs Navigation // ---------------------- var currentURL = window.location.pathname; constituentFolders=currentURL.split("/");

var projectcolor="#52aa28"; var projectcolorlight="#e1ffb1"; var teamcolor="#63a3d4"; var teamcolorlight="#d0eaf5"; var labcolor="#d15353"; var labcolorlight="#f6b297"; var extracolor="#bdc71f"; var extracolorlight="#f9f8b1"; var modelcolor="#fea044"; var modelcolorlight="#ffedcd"; var humancolor="#354da7"; var humancolorlight="#ac96ff";


switch (constituentFolders[2]) { case 'project':

   var areacolor=projectcolorlight;
   var navcolor=projectcolor;
   var bgarea='white';
   break;      

case 'team':

   var areacolor=teamcolorlight;
   var navcolor=teamcolor;
   var bgarea='white';
   break;

case 'lab':

   var areacolor=labcolorlight;
   var navcolor=labcolor;
   var bgarea='white';
   break;

case 'extra':

   var areacolor=extracolorlight;
   var navcolor=extracolor;
   var bgarea='white';
   break;

case 'model':

   var areacolor=modelcolorlight;
   var navcolor=modelcolor;
   var bgarea='white';
   break;

case 'human':

   var areacolor=humancolorlight;
   var navcolor=humancolor;
   var bgarea='white';
   break;

}

function buildBreadCrumbTrail(page) {

 	for (count=2;count<(constituentFolders.length);count++)
 	{ 
   	if (count == 2) {      
   	    $('.subcontent').css({backgroundColor: bgarea,borderColor: navcolor});
           $('hr').css({color: navcolor,backgroundColor: navcolor});
   	    $('h1').css({borderColor: navcolor});
   	    $('h2').css({borderColor: navcolor});
   	    $('h3').css({borderColor: navcolor});
   	    $('h4').css({borderColor: navcolor});
			$('#bacli'+constituentFolders[2]).stop().fadeTo(500,1);
			$('#li'+constituentFolders[2]).stop().animate({backgroundColor: navcolor}, 500);
   	}
       if (count == 3) {      
			$('#bac'+constituentFolders[3]).children('li').children('img').stop().fadeTo(500,1);
   	}
 	}

} $(document).ready(function(){

    $('#menubar li').css({color: 'white'});
    
    $('#navproject').css({color: projectcolorlight});
    $('#navlab').css({color: labcolorlight});
    $('#navteam').css({color: teamcolorlight});
    $('#navextra').css({color: extracolorlight});
    $('#navmodel').css({color: modelcolorlight});
    $('#navhuman').css({color: humancolorlight});
    
    // ----------------------
    // Main Navigation
    // ----------------------

buildBreadCrumbTrail(window.location.pathname);

   $('.litopic').mouseover(function(){
		switch (this.id)
		{
		case 'liproject':
			var areacolor=projectcolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$('#liproject').stop().animate({backgroundColor: projectcolor}, 500); 
			break;
		case 'liteam':
			var areacolor=teamcolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$('#liteam').stop().animate({backgroundColor: teamcolor}, 500); 
			break;
		case 'lilab':
			var areacolor=labcolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$('#lilab').stop().animate({backgroundColor: labcolor}, 500); 
			break;
		case 'liextra':
			var areacolor=extracolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$(this).stop().animate({backgroundColor: extracolor}, 500); 
			break;
 		case 'limodel':
			var areacolor=modelcolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$(this).stop().animate({backgroundColor: modelcolor}, 500); 
			break;
 		case 'lihuman':
			var areacolor=humancolorlight;
			$('.litopic').stop().not(this).animate({backgroundColor: "#444444"},500)
			$(this).stop().animate({backgroundColor: humancolor}, 500); 
			break;
		}
		var vActive = $(this).attr("id");
		$('.bacnav').not(document.getElementById('bac'+vActive)).stop().fadeTo(500,0, function(){ $(this).css({display:'none'});});
		$('#bac'+vActive).stop().fadeTo(500,1);
	});
	
   if (constituentFolders.length>=3) { 
       if (constituentFolders.length>=4) { //begin 4
       $('#navmenu').mouseleave(function() {
			$('.bacnav').not(document.getElementById('bac'+constituentFolders[2])).stop().fadeTo(500,0, function(){ $(this).css({display:'none'});});
			$('.litopic').not(this).animate({backgroundColor: "#444444"},500)
			$('#bacli'+constituentFolders[2]).stop().fadeTo(500,1);
			$('#li'+constituentFolders[2]).stop().animate({backgroundColor: navcolor}, 500);
			$('#bac'+constituentFolders[3]).children('li').children('img').stop().fadeTo(500,1);
    	});
    	$('#navmenu').mouseover(function(){$('#bac'+constituentFolders[3]).children('li').children('img').stop().fadeTo(500,0);});
       }
       else { //begin 3
      	$('#navmenu').mouseleave(function() {
			$('.bacnav').not(document.getElementById('bac'+constituentFolders[2])).stop().fadeTo(500,0, function(){ $(this).css({display:'none'});});
			$('.litopic').animate({backgroundColor: "#444444"},500)
			$('#bacli'+constituentFolders[2]).stop().fadeTo(500,1);
			$('#li'+constituentFolders[2]).stop().animate({backgroundColor: navcolor}, 500);
    	});
    	}
   } // end 3
   else { // begin 2
  		$('#navmenu').mouseleave(function() {
  		 	$('.litopic').animate({backgroundColor: "#444444"},500)
  		 	$('.bacnav').stop().fadeTo(500,0, function(){ $(this).css({display:'none'});});

$('#bacli'+constituentFolders[2]).stop().fadeTo(500,1);

			$('#li'+constituentFolders[2]).stop().animate({backgroundColor: navcolor}, 500);
   	});
   } // endelse  

});