From e03806615de8fec6204d3a1a4800641b304d5d5f Mon Sep 17 00:00:00 2001
From: Calin Crisan <ccrisan@gmail.com>
Date: Sun, 7 Dec 2014 19:11:55 +0200
Subject: [PATCH] added a shut down ui feedback

---
 src/handlers.py   |  5 ++++-
 static/css/ui.css | 16 ++++++++--------
 static/js/main.js | 25 ++++++++++++++++++++++++-
 3 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/src/handlers.py b/src/handlers.py
index 4b1d2e9..7c6e191 100644
--- a/src/handlers.py
+++ b/src/handlers.py
@@ -1169,7 +1169,10 @@ class PowerHandler(BaseHandler):
     @BaseHandler.auth(admin=True)
     def post(self, op):
         if op == 'shutdown':
-            powerctl.shut_down()
+            self.shut_down()
+    
+    def shut_down(self):
+        IOLoop.instance().add_timeout(datetime.timedelta(seconds=2), powerctl.shut_down)
 
 
 class VersionHandler(BaseHandler):
diff --git a/static/css/ui.css b/static/css/ui.css
index da85d83..e3017d7 100644
--- a/static/css/ui.css
+++ b/static/css/ui.css
@@ -20,7 +20,7 @@ input[type=checkbox].styled {
 a {
     color: #317CAD;
     text-decoration: inherit;
-    transition: color 0.1s linear;
+    transition: color 0.1s ease;
 }
 
 a:HOVER {
@@ -52,7 +52,7 @@ div.button.dialog {
     border: 1px solid #317CAD;
     border-radius: 2px;
     color: white;
-    transition: all 0.1s linear;
+    transition: all 0.1s ease;
 }
 
 div.button.dialog.default {
@@ -61,7 +61,7 @@ div.button.dialog.default {
 
 div.button.mouse-effect {
     opacity: 0.7;
-    transition: opacity 0.1s linear;
+    transition: opacity 0.1s ease;
 }
 
 div.button.mouse-effect:HOVER {
@@ -89,7 +89,7 @@ div.check-box {
     -moz-user-select: none;
     user-select: none;
     margin: 2px;
-    transition: all 0.2s;
+    transition: all 0.2s ease;
 }
 
 div.check-box:FOCUS,
@@ -106,7 +106,7 @@ div.check-box-button {
     position: absolute;
     text-align: center;
     line-height: 1em;
-    transition: all 0.1s;
+    transition: all 0.1s ease;
 }
 
 span.check-box-text {
@@ -140,7 +140,7 @@ input[type=text].styled {
     font-family: inherit;
     font-size: 0.8em;
     margin: 2px;
-    transition: all 0.1s;
+    transition: all 0.1s ease;
 }
 
 input[type=password].styled:FOCUS,
@@ -191,7 +191,7 @@ select.styled {
     background-position: right center;
     cursor: pointer;
     vertical-align: middle;
-    transition: all 0.1s;
+    transition: all 0.1s ease;
 }
 
 select.styled:FOCUS {
@@ -253,7 +253,7 @@ div.slider-bar-inside {
     position: relative;
     top: 3px;
     left: 7px;
-    transition: all 0.1s;
+    transition: all 0.1s ease;
 }
 
 div.slider:HOVER div.slider-bar-inside,
diff --git a/static/js/main.js b/static/js/main.js
index 9e1c3da..61df3d4 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1242,7 +1242,30 @@ function doApply() {
 
 function doShutDown() {
     runConfirmDialog('Really shut down?', function () {
-        ajax('POST', '/power/shutdown/');    
+        ajax('POST', '/power/shutdown/');
+        setTimeout(function () {
+            refreshInterval = 1000000;
+            showModalDialog('<div class="modal-progress"></div>');
+            
+            function checkServer() {
+                $.ajax({
+                    type: 'GET',
+                    url: '/',
+                    cache: false,
+                    success: function () {
+                        setTimeout(checkServer, 1000);
+                    },
+                    error: function () {
+                        showModalDialog('Powered Off');
+                        setTimeout(function () {
+                            $('div.modal-glass').animate({'opacity': '1', 'background-color': '#212121'}, 200);
+                        },100);
+                    }
+                });
+            }
+            
+            checkServer();
+        }, 10);
     });
 }
 
-- 
2.39.5