Make minor tweaks to #121

kittoframework · Feb 11, 2018 · 60f0235 · 60f0235
1 parent 57f97a9
commit 60f0235
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 16 deletions.
diff --git a/installer/templates/new/assets/javascripts/application.js b/installer/templates/new/assets/javascripts/application.js
@@ -2,20 +2,7 @@ import '../stylesheets/application.scss';
 
 import $ from 'jquery';
 import {Kitto} from 'kitto';
-import fscreen from 'fscreen';
 
 window.jQuery = window.$ = $;
 
 Kitto.start();
-
-var i = null;
-$("body").mousemove(function() {
-    clearTimeout(i);
-    $(".fullscreen-button").addClass("active");
-    i = setTimeout('$(".fullscreen-button").removeClass("active");', 1000);
-})
-
-$(".fullscreen-button").click(function() {
-  var ele = document.getElementById("container");
-  fscreen.requestFullscreen(ele);
-})
diff --git a/installer/templates/new/dashboards/layout.html.eex b/installer/templates/new/dashboards/layout.html.eex
@@ -12,12 +12,12 @@
   </head>
 
   <body>
+    <i class="fullscreen-button fa fa-arrows-alt"></i>
+
     <div id="container">
       <%= @template %>
     </div>
 
-    <i class="fullscreen-button fa fa-arrows-alt"></i>
-
     <script type="text/javascript" src="/assets/application.js"></script>
     <script type="text/javascript" src="/assets/widgets.js"></script>
   </body>

diff --git a/priv/static/kitto.js b/priv/static/kitto.js
@@ -1,11 +1,15 @@
 import $ from 'jquery';
 import Gridster from 'jquery.gridster';
+import fscreen from 'fscreen';
 
 window.jQuery = window.$ = $;
 
 class Kitto {
   static start() {
-    Kitto.initializeGridster().initializeRotator();
+    Kitto
+      .initializeGridster()
+      .initializeRotator()
+      .initializeFullScreenButton();
   }
 
   static config(config) {
@@ -78,6 +82,23 @@ class Kitto {
 
     return this;
   }
+
+  static initializeFullScreenButton() {
+    var timer;
+    var $button = $('.fullscreen-button');
+
+    $('body').on('mousemove', function() {
+      clearTimeout(timer);
+      if (!$button.hasClass('active')) { $button.addClass('active') }
+      timer = setTimeout(function() { $button.removeClass('active') }, 1000);
+    })
+
+    $button.on('click', function() {
+      fscreen.requestFullscreen(document.getElementById('container'));
+    })
+
+    return this;
+  }
 }
 
 let Widget = require('./widget').default;