vanilla JS >>> jQuery

content/assets/scripts/gamification.coffee

@@ -1,4 +1,3 @@
-$ ->
   $.getJSON 'https://zeus.ugent.be/game/top4/show.json', (data) ->
     str = "<table>"
     for x in data

content/assets/scripts/search.coffee

@@ -1,9 +1,16 @@
-$('#tipue_search_input_field').on 'focusin', ->
+input_field = document.getElementById('tipue_search_input_field')
-  $('#tipue_search_input').addClass("focused")
+input = document.getElementById('tipue_search_input')
 
-$('#tipue_search_input_field').on 'focusout', ->
+input_field.addEventListener 'focusin', ->
-  $('#tipue_search_input').removeClass("focused")
+  input.classList.add('focused')
 
-$('.navbar-burger').on 'click', ->
+input_field.addEventListener 'focusout', ->
-  $('.navbar-menu').toggleClass('is-active')
+  input.classList.remove('focused')
-  $('.navbar-burger').toggleClass('is-active')
+
+burger = document.getElementsByClassName('navbar-burger')[0]
+menu = document.getElementsByClassName('navbar-menu')[0]
+
+burger.addEventListener 'click', ->
+  s = 'is-active'
+  if menu.classList.contains(s) then menu.classList.remove(s) else menu.classList.add(s)
+  if burger.classList.contains(s) then burger.classList.remove(s) else burger.classList.add(s)

content/blog/17-18/eet-en-drankgewoonten-in-zeus.md

@@ -130,6 +130,8 @@ Hier kunnen we verschillende statistieken van Haldis en Tap met elkaar vergelijk
 </div>
 
 <% content_for :scripts do %>
+<script src="https://code.jquery.com/jquery-3.0.0.min.js" charset="utf-8"></script>
+
 <!-- CDNS -->
 <script src="https://d3js.org/d3.v5.min.js"></script>
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.css" integrity="sha256-iYUgmrapfDGvBrePJPrMWQZDcObdAcStKBpjP3Az+3s=" crossorigin="anonymous" />

content/index.erb

@@ -5,6 +5,7 @@
 <% end %>
 
 <% content_for :scripts do %>
+<script src="https://code.jquery.com/jquery-3.0.0.min.js" charset="utf-8"></script>
 <%= asset :js, :gamification %>
 <% end %>
 

content/search.erb

@@ -18,6 +18,8 @@ title: Search
 </div>
 
 <% content_for :scripts do %>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Tipue-Search/5.0.0/tipuesearch_set.js"></script>
+<%= asset :js, :tipuesearch %>
 <script>
 $(document).ready(function() {
   $('#tipue_search_input_field').tipuesearch({

layouts/default.erb

@@ -52,10 +52,7 @@
       </div>
     <%= render '/partials/_footer.*' %>
 
-  <script src="https://code.jquery.com/jquery-3.0.0.min.js" charset="utf-8"></script>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/Tipue-Search/5.0.0/tipuesearch_set.js"></script>
-  <%= asset :js, :tipuesearch %>
-  <%= asset :js, :search %>
   <%= content_for(@item, :scripts) %>
+  <%= asset :js, :search %>
   </body>
 </html>