Difference between revisions of "Template:TU Dresden/JS"

Line 177: Line 177:
 
});
 
});
  
$('.dropbtn span').on('click', function(){
+
$('.dropbtn span').on('touchend', function(){
 
     console.log("Hey there");
 
     console.log("Hey there");
 
     if ($(this).closest('.dropbtn').closest('li').hasClass("show")) {
 
     if ($(this).closest('.dropbtn').closest('li').hasClass("show")) {

Revision as of 00:15, 16 December 2017

var bouncing = 0;

$(document).ready(function() {

   $("#HQ_page").attr('id',);
   resizeDiv();
   setNavigation();
   ufoLinks();
   $('.back-to-top').click(function () {
       $('body,html').animate({scrollTop: 0}, 1000);

return false;

   });
   $(".at-a-glance").on("click", ".hashlink", function(event) {
       fixPagePosition(event.target.getAttribute('href'));
   });
   $(".team").on("click", ".teamlink", function(event) {
       console.log(event.currentTarget.getAttribute('xlink:href'));
       fixPagePosition(event.currentTarget.getAttribute('xlink:href'));
   });

});

function bounceUfo() {

   bouncing = 1;
   $('#ufo').animate({"bottom": -150}, 800, function(){
       $('#ufo').animate({"bottom": -253}, 700);
       if((window.pageYOffset || document.documentElement.scrollTop) < 20){
           bounceUfo();
       }
   });

}

$(window).on("load", function() {

   fixPagePosition(window.location.hash); 
   if((window.location.href === "https://2017.igem.org/Team:TU_Dresden")||(window.location.href === "https://2017.igem.org/Team:TU_Dresden/Results")){
       setTimeout(function(){
           bounceUfo();
       } ,2000);
   }

});

function fixPagePosition(hash) {

       console.log(hash);
       var hash = hash;
       if(hash.length > 1) {
          $('body,html').animate({scrollTop: $(hash).offset().top-120}, 1000);
       }

}

function ufoLinks() {

   if (window.location.href.includes("Team:TU_Dresden/Team")){
       ufo = "<a href='#nina'>Student Members</a>
<a href='#thorsten'>Supervisors</a>
"; } else { var ufo = ; for (var i = 1; i <= $("h1").length - 1; i++) { if($("h1")[i].id == ) { $("h1")[i].setAttribute("id","section"+i); } ufo += "<a href='#" + $("h1")[i].id + "'>" + $("h1")[i].innerHTML + "</a>
"; } } $(".ufo-links").html(ufo); $(".ufo-links").on("click", "a", function(event) { fixPagePosition(event.target.getAttribute('href')); });

}

function toggleNav() {

   var x = document.getElementById("nav-toggle");
   if (x.className === "closed") {
   	x.className = "open";
   }else{
   	x.className = "closed";
   }
   $(".navbar").slideToggle();

}

window.onresize = function(event) {

   resizeDiv();

}

function resizeDiv() {

   if(window.innerHeight > 0.55 * window.innerWidth) {
       if(150 > 0.55 * window.innerWidth - 210) {
           var divHeight =  150;
       }else{
           var divHeight = 0.55 * window.innerWidth - 210;
       }
   }else{
       var divHeight = window.innerHeight - 210;
   }
   $("#bannerspace").css({"height": divHeight});
   $("#pagebanner").css({"min-height": window.innerWidth});
   setFullscreenValues();

}

function setNavigation() {

   var path = $(location).attr('href');
   $("nav a").each(function () {
       var href = $(this).attr('href');
       if (path === href) {
           $(this).addClass('active');
           var section = $(this).closest('nav > div > ul > li');
           if (section){
           section.addClass('active');
           }
       }
   });

}

document.onscroll = function() {

       if (bouncing) { $("#ufo").stop(); bouncing=0; $("#ufo").stop();}
       pos = window.pageYOffset || document.documentElement.scrollTop;
       if (pos < 263) {
           $("#ufo").css({"bottom": -253+pos});
       }else{
           if (pos >= ($('.footerbar').offset().top-window.innerHeight)){
               $("#ufo").animate({"bottom": pos-($('.footerbar').offset().top-window.innerHeight)+10},10);
           }else{
               $("#ufo").animate({"bottom": 10},10);
           }
       }

};

function setFullscreenValues(){

   if ((window.innerWidth / window.innerHeight) < 1.75) {
       $('#fullscreen').parent().css({"flex-wrap": "wrap"});
       $('#fullscreen').parent().css({"align-items": "center"});
       document.getElementById("fullscreen-caption").style.minHeight = "20vh";
       document.getElementById("fullscreen").style.maxHeight = "80vh";
       document.getElementById("fullscreen-caption").style.minWidth = "0";
       document.getElementById("fullscreen").style.maxWidth = "100%";
   } else {
       $('#fullscreen').parent().css({"flex-wrap": "nowrap"});
       $('#fullscreen').parent().css({"align-items": "flex-end"});
       document.getElementById("fullscreen-caption").style.minWidth = "30%";
       document.getElementById("fullscreen").style.maxWidth = "70%";
       document.getElementById("fullscreen-caption").style.minHeight = "0";
       document.getElementById("fullscreen").style.maxHeight = "90vh";
   }

}

var fullscreen = false;

$('.zoom').on('click', function (){

   document.getElementById("fullscreen").setAttribute("src", $(this).attr('src'));
   if ($(this).next().is('figcaption')) {
       setFullscreenValues();
       document.getElementById("fullscreen-caption").innerHTML = $(this).next().html();
   }else{
       document.getElementById("fullscreen-caption").innerHTML = ;
       document.getElementById("fullscreen-caption").style.minWidth = 0;
       document.getElementById("fullscreen").style.maxWidth = "100%";
       document.getElementById("fullscreen-caption").style.minHeight = "0";
       document.getElementById("fullscreen").style.maxHeight = "90vh";
   }
   $('#modal').slideToggle();
   fullscreen = true;

});

$(document).on('keyup',function(evt) {

   if (evt.keyCode == 27) {
       if (fullscreen) {
           $('#modal').slideToggle();
           fullscreen = false;
       }
   }

});

$('#fullscreen').on('click', function (){

   $('#modal').slideToggle();
   fullscreen = false;

});

$('#close-fullscreen').on('click', function (){

   $('#modal').slideToggle();
   fullscreen = false;

});

$('.dropbtn span').on('touchend', function(){

   console.log("Hey there");
   if ($(this).closest('.dropbtn').closest('li').hasClass("show")) {
       console.log("removing");
       $(this).closest('.dropbtn').closest('li').removeClass("show");
   }else{
       console.log("adding");
       $(this).closest('.dropbtn').closest('li').addClass("show");
   }

});