diff --git a/public/less/admin/general/dashboard.less b/public/less/admin/general/dashboard.less index cf44ceb176..099717efc5 100644 --- a/public/less/admin/general/dashboard.less +++ b/public/less/admin/general/dashboard.less @@ -132,4 +132,16 @@ .motd textarea { width: 100%; } + + #toggle-realtime { + text-align: center; + .fa { + font-size: 21px; + vertical-align: -2px; + } + + .fa-toggle-on { + color: @brand-success; + } + } } \ No newline at end of file diff --git a/public/src/admin/general/dashboard.js b/public/src/admin/general/dashboard.js index 8e82b33058..ea3c9527f7 100644 --- a/public/src/admin/general/dashboard.js +++ b/public/src/admin/general/dashboard.js @@ -9,6 +9,12 @@ define('admin/general/dashboard', ['semver'], function(semver) { }, isMobile = false; + var DEFAULTS = { + roomInterval: 10000, + graphInterval: 15000, + realtimeInterval: 1500 + }; + Admin.init = function() { app.enterRoom('admin'); @@ -16,12 +22,6 @@ define('admin/general/dashboard', ['semver'], function(semver) { isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); - intervals.rooms = setInterval(function() { - if (app.isFocused && app.isConnected) { - socket.emit('meta.rooms.getAll', Admin.updateRoomUsage); - } - }, 10000); - $(window).on('action:ajaxify.start', function(ev, data) { clearInterval(intervals.rooms); clearInterval(intervals.graphs); @@ -57,8 +57,11 @@ define('admin/general/dashboard', ['semver'], function(semver) { } }); - setupGraphs(); $('[data-toggle="tooltip"]').tooltip(); + + setupRealtimeButton(); + setupGraphs(); + initiateDashboard(); }; Admin.updateRoomUsage = function(err, data) { @@ -238,7 +241,6 @@ define('admin/general/dashboard', ['semver'], function(semver) { } }; - intervals.graphs = setInterval(updateTrafficGraph, 15000); updateTrafficGraph(); $(window).on('resize', adjustPieCharts); @@ -390,5 +392,33 @@ define('admin/general/dashboard', ['semver'], function(semver) { graphs.topics.update(); } + function setupRealtimeButton() { + $('#toggle-realtime .fa').on('click', function() { + var $this = $(this); + if ($this.hasClass('fa-toggle-on')) { + $this.removeClass('fa-toggle-on').addClass('fa-toggle-off'); + $this.parent().find('strong').html('OFF'); + initiateDashboard(false); + } else { + $this.removeClass('fa-toggle-off').addClass('fa-toggle-on'); + $this.parent().find('strong').html('ON'); + initiateDashboard(true); + } + }); + } + + function initiateDashboard(realtime) { + clearInterval(intervals.rooms); + clearInterval(intervals.graphs); + + intervals.rooms = setInterval(function() { + if (app.isFocused && app.isConnected) { + socket.emit('meta.rooms.getAll', Admin.updateRoomUsage); + } + }, realtime ? DEFAULTS.realtimeInterval : DEFAULTS.roomInterval); + + intervals.graphs = setInterval(updateTrafficGraph, realtime ? DEFAULTS.realtimeInterval : DEFAULTS.graphInterval); + } + return Admin; }); diff --git a/src/views/admin/general/dashboard.tpl b/src/views/admin/general/dashboard.tpl index a3eeb464bb..c08e64dbb5 100644 --- a/src/views/admin/general/dashboard.tpl +++ b/src/views/admin/general/dashboard.tpl @@ -93,14 +93,17 @@
+