Merge pull request #24 from utnapischtim/feature/separate_html_from_js

separate html from js

invenio_theme_tugraz/assets/semantic-ui/js/invenio_theme_tugraz/theme.js

@@ -0,0 +1,8 @@
+export function toggleVisibility(id) {
+    var element = document.getElementById(id);
+    var isHided = element.style.display === "none";
+
+    element.style.display = isHided ? "block" : "none";
+}
+
+window.toggleVisibility = toggleVisibility;

invenio_theme_tugraz/templates/invenio_theme_tugraz/footer.html

@@ -12,6 +12,10 @@
 {{ webpack['invenio-theme-tugraz-theme.css'] }}
 {%- endblock %}
 
+{%- block javascript %}
+  {{ webpack['invenio-theme-tugraz-js.js'] }}
+{%- endblock javascript %}
+
 <footer id="footer" class="footer-bottom">
   <div class="ui grid container">
     <div class="eight wide column left aligned">

invenio_theme_tugraz/templates/invenio_theme_tugraz/header.html

@@ -125,7 +125,7 @@
           </div>
 
           <div class="short-menu-right">
-            <div class="short-menu-right-h" onclick="hide();">
+            <div class="short-menu-right-h" onclick="toggleVisibility('heading');">
 
               <i class="fa fa-bars fa-lg"></i><span style="margin-left:3px;">Menu</span>
 
@@ -220,20 +220,6 @@
     </div>
   </nav>
 
-
-  <script>
-    function hide() {
-      var x = document.getElementById('heading');
-
-      if (x.style.display === "none") {
-        x.style.display = "block";
-      } else {
-        x.style.display = "none";
-      }
-
-    }
-
-  </script>
   {%- block flashmessages %}
   {%- from "invenio_theme/macros/messages.html" import flashed_messages with context -%}
   {{ flashed_messages() }}

invenio_theme_tugraz/webpack.py

@@ -17,6 +17,8 @@ theme = WebpackThemeBundle(
             entry={
                 'invenio-theme-tugraz-theme':
                     './less/invenio_theme_tugraz/theme.less',
+                'invenio-theme-tugraz-js':
+                    './js/invenio_theme_tugraz/theme.js'
             },
             dependencies={}
         )