Difference between revisions of "Template:Team:Bielefeld-CeBiTec/JS"

m (renamed highlight to highleighted, to avoid collision with unoverridable class)
(updated js to make new navbar working)
Line 3: Line 3:
  
  
−
 
−
function toggleContent() {
 
−
//textVar = "title_" + id
 
−
$title = $(".labnote-title");
 
−
$title.hide();
 
−
//$title.hide();
 
−
//$content = $title.next();
 
−
//$content.slideToggle(500);
 
−
}
 
  
 
$(document).ready(function() {
 
$(document).ready(function() {
Line 28: Line 19:
 
});
 
});
 
     });
 
     });
 +
});
 +
 +
function resizeNavbar() {
 +
 +
$imgSrc = $("#logo-img").attr("src");
 +
if ($("#logo-img").attr("class") == "navbar center shrink") {
 +
if ($imgSrc == "https://static.igem.org/mediawiki/2017/4/4a/T--Bielefeld-CeBiTec--expand_monochrome_white_2.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/a/ad/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans1.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/a/ad/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans1.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/1/16/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans2.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/1/16/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans2.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/0/0c/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans3.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/0/0c/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans3.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/6/6e/T--Bielefeld-CeBiTec--expand_monochrome_white_2_collapse.svg");
 +
}
 +
} else if ($("#logo-img").attr("class") == "navbar center grow") {
 +
if ($imgSrc == "https://static.igem.org/mediawiki/2017/6/6e/T--Bielefeld-CeBiTec--expand_monochrome_white_2_collapse.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/0/0c/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans3.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/0/0c/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans3.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/1/16/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans2.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/1/16/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans2.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/a/ad/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans1.svg");
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/a/ad/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans1.svg") {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/4/4a/T--Bielefeld-CeBiTec--expand_monochrome_white_2.svg");
 +
}
 +
}
 +
$imgSrc = $("#logo-img").attr("src");
 +
 +
$logoHeight = $("#logo").innerHeight();
 +
$newHeight = $logoHeight * 0.5;
 +
$("header").attr("style", "height: " + $logoHeight + "px;");
 +
$scrollHeight = 50;
 +
if ($imgSrc == "https://static.igem.org/mediawiki/2017/4/4a/T--Bielefeld-CeBiTec--expand_monochrome_white_2.svg") {
 +
$scrollHeight = 50;
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/a/ad/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans1.svg") {
 +
$scrollHeight = 62.5;
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/1/16/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans2.svg") {
 +
$scrollHeight = 75;
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/0/0c/T--Bielefeld-CeBiTec--expand_monochrome_white_2_trans3.svg") {
 +
$scrollHeight = 87.5;
 +
} else if ($imgSrc == "https://static.igem.org/mediawiki/2017/6/6e/T--Bielefeld-CeBiTec--expand_monochrome_white_2_collapse.svg") {
 +
$scrollHeight = 100;
 +
}
 +
 +
$("#navbar-left, #navbar-right").attr("style", "height: " + $scrollHeight + "%;");
 +
$("li.navbar").attr("style", "height: 100%; line-height: " + ($logoHeight * ($scrollHeight/100)) + "px;");
 +
$(".navbar-paragraph").attr("style", "height: " + (100 - $scrollHeight) + "%;");
 +
$("li.navbar-paragraph").attr("style", "line-height: " + ($logoHeight * ((100 - $scrollHeight)/100)) + "px;");
 +
$(".sub-navbar").attr("style", "top: " + ($logoHeight + 16) + "px;");
 +
if ($imgSrc == "https://static.igem.org/mediawiki/2017/4/4a/T--Bielefeld-CeBiTec--expand_monochrome_white_2.svg") {
 +
$(".container").attr("style", "margin-top: " + ($logoHeight + 40) + "px;");
 +
}
 +
if ($scrollHeight >= 80) {
 +
$("li.navbar-paragraph").hide();
 +
} else {
 +
$("li.navbar-paragraph").show();
 +
}
 +
 +
 +
$widthItemsLeft = $("#project").width();
 +
$widthItemsLeft = $widthItemsLeft + $("#results").width();
 +
$widthItemsLeft = $widthItemsLeft + $("#specials").width();
 +
$widthItemsLeft = $widthItemsLeft + $("#hp").width();
 +
 +
$widthItemsRight = $("#collaborations").width();
 +
$widthItemsRight = $widthItemsRight + $("#team").width();
 +
$widthItemsRight = $widthItemsRight + $("#partners").width();
 +
$widthItemsRight = $widthItemsRight + $("#notebook").width();
 +
 +
$widthDiff = ($widthItemsLeft - $widthItemsRight);
 +
$addUp = ($widthDiff / 4);
 +
$("#collaborations").width($("#collaborations").width() + $addUp);
 +
$("#team").width($("#team").width() + $addUp);
 +
$("#partners").width($("#partners").width() + $addUp);
 +
$("#notebook").width($("#notebook").width() + $addUp);
 +
 +
 +
$(".test").html($addUp);
 +
}
 +
 +
$(window).on('resize', function(){
 +
      resizeNavbar();
 
});
 
});
  
 
$(window).on('load', function() {
 
$(window).on('load', function() {
 
hideNavbars();
 
hideNavbars();
 +
if ($(document).scrollTop() == 0) {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/4/4a/T--Bielefeld-CeBiTec--expand_monochrome_white_2.svg");
 +
} else {
 +
$("#logo-img").attr("src", "https://static.igem.org/mediawiki/2017/6/6e/T--Bielefeld-CeBiTec--expand_monochrome_white_2_collapse.svg");
 +
}
 +
resizeNavbar();
 
});
 
});
  
Line 98: Line 177:
 
}
 
}
 
if ($index == 0) {
 
if ($index == 0) {
−
$("#page-switch-prev-li").hide();
+
//$("#page-switch-prev-li").hide();
 
} else {
 
} else {
 
$("#page-switch-prev").attr("href", $story[$index - 1]);
 
$("#page-switch-prev").attr("href", $story[$index - 1]);
Line 114: Line 193:
 
$("#navbar-project").hide();
 
$("#navbar-project").hide();
 
$("#navbar-results").hide();
 
$("#navbar-results").hide();
 +
$("#navbar-specials").hide();
 
$("#navbar-hp").hide();
 
$("#navbar-hp").hide();
 
$("#navbar-team").hide();
 
$("#navbar-team").hide();
Line 134: Line 214:
 
$("#results-translation"), $("#results-toolbox"), $("#results-parts")];
 
$("#results-translation"), $("#results-toolbox"), $("#results-parts")];
 
} else {
 
} else {
−
$objects = [$("#project"), $("#results"), $("#hp"), $("#team"), $("#notebook"), $("#project-ubp"),
+
$objects = [$("#project"), $("#results"), $("#specials"), $("#hp"), $("#team"), $("#notebook"), $("#project-ubp"),
 
$("#project-translation"), $("#project-toolbox"), $("#results-ubp"), $("#results-translation"),
 
$("#project-translation"), $("#project-toolbox"), $("#results-ubp"), $("#results-translation"),
 
$("#results-toolbox"), $("#results-parts")];
 
$("#results-toolbox"), $("#results-parts")];
Line 142: Line 222:
 
if ($object.attr("class") == "navbar active highlighted") {
 
if ($object.attr("class") == "navbar active highlighted") {
 
$object.attr("class", "navbar active");
 
$object.attr("class", "navbar active");
 +
} else if ($object.attr("class") == "navbar item-left active highlighted") {
 +
$object.attr("class", "navbar item-left active");
 +
} else if ($object.attr("class") == "navbar item-right active highlighted") {
 +
$object.attr("class", "navbar item-right active");
 
} else if ($object.attr("class") == "navbar highlighted") {
 
} else if ($object.attr("class") == "navbar highlighted") {
 
$object.attr("class", "navbar");
 
$object.attr("class", "navbar");
 +
} else if ($object.attr("class") == "navbar item-left highlighted") {
 +
$object.attr("class", "navbar item-left");
 +
} else if ($object.attr("class") == "navbar item-right highlighted") {
 +
$object.attr("class", "navbar item-right");
 
} else if ($object.attr("class") == "sub-navbar-item active highlighted"  || $object.attr("class") == "sub-navbar-item navbar active highlighted") {
 
} else if ($object.attr("class") == "sub-navbar-item active highlighted"  || $object.attr("class") == "sub-navbar-item navbar active highlighted") {
 
$object.attr("class", "sub-navbar-item active");
 
$object.attr("class", "sub-navbar-item active");
Line 156: Line 244:
 
$name = this.id;
 
$name = this.id;
 
$class = $(this).attr("class");
 
$class = $(this).attr("class");
 +
$(".sub-navbar").show();
 +
$(".test").html($class);
 
if ($name == "project") {
 
if ($name == "project") {
−
if ($class == "navbar" || $class == "navbar active") {
+
if ($class == "navbar item-left" || $class == "navbar item-left active") {
 
unhighlightTabs(false);
 
unhighlightTabs(false);
 
$(".sub-navbar").show();
 
$(".sub-navbar").show();
Line 169: Line 259:
 
}
 
}
 
} else if ($name == "results") {
 
} else if ($name == "results") {
−
if ($class == "navbar" || $class == "navbar active") {
+
if ($class == "navbar item-left" || $class == "navbar item-left active") {
 
unhighlightTabs(false);
 
unhighlightTabs(false);
 
$(".sub-navbar").show();
 
$(".sub-navbar").show();
 
hideNavbars();
 
hideNavbars();
 
$("#navbar-results").show();
 
$("#navbar-results").show();
 +
$(this).attr("class", $class + " highlighted");
 +
} else {
 +
$(".sub-navbar").hide();
 +
hideNavbars();
 +
unhighlightTabs(false);
 +
}
 +
} else if ($name == "specials") {
 +
if ($class == "navbar item-left" || $class == "navbar item-left active") {
 +
unhighlightTabs(false);
 +
$(".sub-navbar").show();
 +
hideNavbars();
 +
$("#navbar-specials").show();
 
$(this).attr("class", $class + " highlighted");
 
$(this).attr("class", $class + " highlighted");
 
} else {
 
} else {
Line 181: Line 283:
 
}
 
}
 
} else if ($name == "hp") {
 
} else if ($name == "hp") {
−
if ($class == "navbar" || $class == "navbar active") {
+
if ($class == "navbar item-left" || $class == "navbar item-left active") {
 
unhighlightTabs(false);
 
unhighlightTabs(false);
 
$(".sub-navbar").show();
 
$(".sub-navbar").show();
Line 193: Line 295:
 
}
 
}
 
} else if ($name == "team") {
 
} else if ($name == "team") {
−
if ($class == "navbar" || $class == "navbar active") {
+
if ($class == "navbar item-right" || $class == "navbar item-right active") {
 
unhighlightTabs(false);
 
unhighlightTabs(false);
 
$(".sub-navbar").show();
 
$(".sub-navbar").show();
Line 205: Line 307:
 
}
 
}
 
} else if ($name == "notebook") {
 
} else if ($name == "notebook") {
−
if ($class == "navbar" || $class == "navbar active") {
+
if ($class == "navbar item-right" || $class == "navbar item-right active") {
 
unhighlightTabs(false);
 
unhighlightTabs(false);
 
$(".sub-navbar").show();
 
$(".sub-navbar").show();
Line 304: Line 406:
 
     $("body").mousedown(function( event ) {
 
     $("body").mousedown(function( event ) {
 
//$(".test").html($("#project").attr("class"));
 
//$(".test").html($("#project").attr("class"));
−
if (event.pageY - $(document).scrollTop() > 65 + $(".sub-navbar").outerHeight()) {
+
if (event.pageY - $(document).scrollTop() > 16 + $("#logo").outerHeight() + $(".sub-navbar").outerHeight()) {
 
$(".sub-navbar").hide();
 
$(".sub-navbar").hide();
 
hideNavbars();
 
hideNavbars();
Line 311: Line 413:
 
     });
 
     });
 
});
 
});
 +
 +
window.setInterval(function(){
 +
if ($(document).scrollTop() <= 5) {
 +
$("#logo-img").attr("class", "navbar center grow");
 +
} else {
 +
$("#logo-img").attr("class", "navbar center shrink");
 +
}
 +
resizeNavbar();
 +
}, 10);
 +
 +
  
  
 
</script>
 
</script>
 
</html>
 
</html>

Revision as of 14:22, 16 September 2017