Difference between revisions of "Template:Cologne-Duesseldorf/footer"

Line 7: Line 7:
 
   <a href="mailto:iGEM_DUS_CGN@hhu.de"><i class="fa fa-envelope" aria-hidden="true"></i></a>
 
   <a href="mailto:iGEM_DUS_CGN@hhu.de"><i class="fa fa-envelope" aria-hidden="true"></i></a>
 
   <a href="http://www.igem.hhu.de/"><i class="fa fa-university" aria-hidden="true"></i><a>
 
   <a href="http://www.igem.hhu.de/"><i class="fa fa-university" aria-hidden="true"></i><a>
−
</section> <a id="back-to-top" href="#ToC"><i class="fa fa-chevron-circle-up"></i></a>
+
</section>
−
  <!-- Scripts -->
+
<a id="back-to-top" href="#ToC"><i class="fa fa-chevron-circle-up"></i></a>
−
  <script type="text/javascript" src="https://2017.igem.org/Template:Cologne-Duesseldorf/js-hammer?action=raw&ctype=text/javascript"></script>
+
−
  <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
+
−
  <script type="text/x-mathjax-config">
+
−
    MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
+
−
    MathJax.Ajax.config.path["mhchem"] ="https://cdnjs.cloudflare.com/ajax/libs/mathjax-mhchem/3.1.0";
+
−
    MathJax.Hub.Config({
+
−
      TeX: {
+
−
      extensions: ["[mhchem]/mhchem.js"]
+
−
      },
+
−
      messageStyle: "none",
+
−
      scale: 100,
+
−
      "HTML-CSS": {
+
−
        showMathMenu: false,
+
−
        linebreaks: { automatic: true, width: "container" } ,
+
−
        preferredFont: "STIX",
+
−
        availableFonts: ["STIX","TeX"]
+
−
      },
+
−
      SVG: { linebreaks: { automatic: true, width: "container" } }
+
−
    });
+
−
    MathJax.Hub.Configured();
+
−
  </script>
+
−
  <script>
+
−
    // ===== Table of contents ====
+
−
    var ToC =
+
−
      "<nav role='navigation' class='table-of-contents'>" +
+
−
      "<h2>On this page</h2>" +
+
−
      "<ul>";
+
−
    var newLine, el, title, link;
+
−
    $("section#article h3").each(function() {
+
−
      el = $(this);
+
−
      title = el.text();
+
−
      link = "#" + el.attr("id");
+
−
      newLine =
+
−
      "<li>" +
+
−
        "<a href='" + link + "'>" +
+
−
        title +
+
−
        "</a>" +
+
−
      "</li>";
+
−
      ToC += newLine;
+
−
    });
+
−
 
+
−
    ToC +=
+
−
      "</ul>" +
+
−
      "</nav>";
+
−
    $("section#article #ToC").prepend(ToC);
+
−
 
+
−
    // ===== Scroll to Top ====
+
−
    $(window).scroll(function() {
+
−
      if ($(this).scrollTop() >= 50) {        // If page is scrolled more than 50px
+
−
        $('#return-to-top').fadeIn(200);    // Fade in the arrow
+
−
      } else {
+
−
        $('#return-to-top').fadeOut(200);  // Else fade out the arrow
+
−
      }
+
−
    });
+
−
    $('#return-to-top').click(function() {      // When arrow is clicked
+
−
      $('body,html').animate({
+
−
        scrollTop : 0                      // Scroll to top of body
+
−
      }, 500);
+
−
    });
+
−
 
+
−
    // ===== Responsive Tables ====
+
−
    var headertext = [],
+
−
    headers = document.querySelectorAll("th"),
+
−
    tablerows = document.querySelectorAll("th"),
+
−
    tablebody = document.querySelector("tbody");
+
−
 
+
−
    for(var i = 0; i < headers.length; i++) {
+
−
      var current = headers[i];
+
−
      headertext.push(current.textContent.replace(/\r?\n|\r/,""));
+
−
    }
+
−
    for (var i = 0, row; row = tablebody.rows[i]; i++) {
+
−
      for (var j = 0, col; col = row.cells[j]; j++) {
+
−
      col.setAttribute("data-th", headertext[j]);
+
−
      }
+
−
    }
+
−
    // ===== Accordion ====
+
−
var acc = document.getElementsByClassName("accordion");
+
−
var i;
+
−
 
+
−
for (i = 0; i < acc.length; i++) {
+
−
  acc[i].onclick = function() {
+
−
this.classList.toggle("active");
+
−
var panel = this.nextElementSibling;
+
−
if (panel.style.maxHeight){
+
−
  panel.style.maxHeight = null;
+
−
} else {
+
−
  panel.style.maxHeight = panel.scrollHeight + "px";
+
−
}
+
−
  }
+
−
}
+
−
 
+
−
    // ===== Navigation ====
+
−
  $(document).ready(function(){
+
−
  $('#sidebar-btn').click(function(){
+
−
  $('#sidebar').toggleClass('visible');
+
−
  $('#overlay').toggleClass('active');
+
−
  $('#container').toggleClass('inactive');
+
−
  $('#sidebar-btn').toggleClass('inactive');
+
−
  });
+
−
  $('#overlay').click(function(){
+
−
  $('#sidebar').toggleClass('visible');
+
−
  $('#overlay').toggleClass('active');
+
−
  $('#container').toggleClass('inactive');
+
−
  $('#sidebar-btn').toggleClass('inactive');
+
−
  });
+
−
 
+
−
  $('#sidebar ul ul.sub').click(function(){
+
−
  $(this).children().toggleClass('active');
+
−
  });
+
−
  });
+
−
 
+
−
    // ===== Hammerjs ====
+
−
  delete Hammer.defaults.cssProps.userSelect;
+
−
  var hammerPaper = new Hammer(document.getElementById('paper'));
+
−
  var hammerOverlay = new Hammer(document.getElementById('overlay'));
+
−
  hammerPaper.get('swipe').set({velocity:1})
+
−
    hammerOverlay.get('swipe').set({velocity:1})
+
−
  hammerPaper.on("swiperight", function(ev) {
+
−
  $('#sidebar').addClass('visible');
+
−
  $('#overlay').addClass('active');
+
−
  $('#container').addClass('inactive');
+
−
  $('#sidebar-btn').addClass('inactive');
+
−
  });
+
−
  hammerOverlay.on("swipeleft", function(ev) {
+
−
  $('#sidebar').removeClass('visible');
+
−
  $('#overlay').removeClass('active');
+
−
  $('#container').removeClass('inactive');
+
−
  $('#sidebar-btn').removeClass('inactive');
+
−
  });
+
−
</script>
+
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 15:38, 19 September 2017