m (renamed highlight to highleighted, to avoid collision with unoverridable class) |
(updated js to make new navbar working) |
||
Line 3: | Line 3: | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
$(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() > | + | 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