Bug 1628467 - Button to stop auto-refresh in My dashboard

diff --git a/extensions/MyDashboard/template/en/default/pages/mydashboard.html.tmpl b/extensions/MyDashboard/template/en/default/pages/mydashboard.html.tmpl
index ab4869bb9e62d162996133e140377508d1102600..15886681a033a8c5f0fd77df5b58e02b948be34a 100644 (file)
--- a/extensions/MyDashboard/template/en/default/pages/mydashboard.html.tmpl
+++ b/extensions/MyDashboard/template/en/default/pages/mydashboard.html.tmpl
@@ -81,6 +81,14 @@
 </script>
 
 <div id="mydashboard">
+  <div>
+    <label class="switch">
+      <input id="auto_refresh" type="checkbox">
+      <span class="slider round"></span>
+    </label>
+    Auto-refresh every 10min
+  </div>
+
   <div class="yui3-skin-sam">
     <div id="left">
       <div id="query_list_container">

diff --git a/extensions/MyDashboard/web/js/flags.js b/extensions/MyDashboard/web/js/flags.js
index df301ec30695cbbf577bb18aaa361d473bb19404..bf08437026e11e5fc78fcbfa14d1fdb0d758bdd5 100644 (file)
--- a/extensions/MyDashboard/web/js/flags.js
+++ b/extensions/MyDashboard/web/js/flags.js
@@ -148,18 +148,24 @@ $(function () {
             loadBugList('requester');
         });
 
+        var refresh_interval;
+        Y.one('#auto_refresh').on('click', function(e) {
+            if(auto_refresh.checked == true){
+                refresh_interval = setInterval(function(e) {
+                    updateFlagTable("requester");
+                    updateFlagTable("requestee");
+                },1000*60*10);
+            }else if(auto_refresh.checked == false){
+                clearInterval(refresh_interval);
+            }
+        });
+
         // Initial load
         Y.on("contentready", function (e) {
             updateFlagTable("requestee");
-            setInterval(function(e) {
-                updateFlagTable("requestee");
-            },1000*60*10);
         }, "#requestee_table");
         Y.on("contentready", function (e) {
             updateFlagTable("requester");
-            setInterval(function(e) {
-                updateFlagTable("requester");
-            },1000*60*10);
         }, "#requester_table");
     });
 });

diff --git a/extensions/MyDashboard/web/js/query.js b/extensions/MyDashboard/web/js/query.js
index 8cde495e18f442ab230082d4977194b93c9d0862..f39af33ae887c6bad28d6097a1f8eabf60716490 100644 (file)
--- a/extensions/MyDashboard/web/js/query.js
+++ b/extensions/MyDashboard/web/js/query.js
@@ -157,9 +157,6 @@ $(function() {
         // Initial load
         Y.on("contentready", function (e) {
             updateQueryTable(default_query);
-            setInterval(function(e) {
-                updateQueryTable(default_query);
-            },1000*60*10);
         }, "#query_table");
 
         Y.one('#query').on('change', function(e) {
@@ -176,6 +173,17 @@ $(function() {
             updateQueryTable(selected_value);
         });
 
+        var refresh_interval;
+        Y.one('#auto_refresh').on('click', function(e) {
+            if(auto_refresh.checked == true){
+                refresh_interval = setInterval(function(e) {
+                    updateQueryTable(default_query);
+                },1000*60*10);
+            }else if(auto_refresh.checked == false){
+                clearInterval(refresh_interval);
+            }
+        });
+
         Y.one('#query_markread').on('click', function(e) {
             var data = bugQueryTable.data;
             var bug_ids = [];

diff --git a/extensions/MyDashboard/web/styles/mydashboard.css b/extensions/MyDashboard/web/styles/mydashboard.css
index 98e1b079ab5440ca3697aee82c053d2d7206702b..a0000a47b2ea0aef2ff3d0679083987e9504c3e9 100644 (file)
--- a/extensions/MyDashboard/web/styles/mydashboard.css
+++ b/extensions/MyDashboard/web/styles/mydashboard.css
@@ -104,3 +104,62 @@
   margin: 5px;
   white-space: nowrap;
 }
+
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 30px;
+  height: 17px;
+}
+
+.switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--secondary-label-color);
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 13px;
+  width: 13px;
+  left: 2px;
+  bottom: 2px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #2196F3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(13px);
+  -ms-transform: translateX(13px);
+  transform: translateX(13px);
+}
+
+.slider.round {
+  border-radius: 17px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}