From 6843eb4202f46bfa7a9d07bf132033e34f81f1ad Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Sun, 22 Apr 2018 21:06:01 +0200
Subject: [PATCH 01/10] Added event observer

---
 configurator.py | 64 ++++++++++++++++++++++++++++++++++++++++++++++++-
 dev.html        | 54 +++++++++++++++++++++++++++++++++++++++++
 2 files changed, 117 insertions(+), 1 deletion(-)

diff --git a/configurator.py b/configurator.py
index d161c3e..fe7d4ba 100755
--- a/configurator.py
+++ b/configurator.py
@@ -648,6 +648,7 @@
         <li><a class="modal-trigger" href="#modal_about">About HASS-Configurator</a></li>
         <li class="divider"></li>
         <!--<li><a href="#modal_check_config">Check HASS Configuration</a></li>-->
+        <li><a class="modal-trigger" href="#modal_events">Observe events</a></li>
         <li><a class="modal-trigger" href="#modal_reload_automations">Reload automations</a></li>
         <li><a class="modal-trigger" href="#modal_reload_scripts">Reload scripts</a></li>
         <li><a class="modal-trigger" href="#modal_reload_groups">Reload groups</a></li>
@@ -667,6 +668,7 @@
         <li><a class="modal-trigger" href="#modal_about">About HASS-Configurator</a></li>
         <li class="divider"></li>
         <!--<li><a href="#modal_check_config">Check HASS Configuration</a></li>-->
+        <li><a class="modal-trigger" href="#modal_events">Observe events</a></li>
         <li><a class="modal-trigger" href="#modal_reload_automations">Reload automations</a></li>
         <li><a class="modal-trigger" href="#modal_reload_scripts">Reload scripts</a></li>
         <li><a class="modal-trigger" href="#modal_reload_groups">Reload groups</a></li>
@@ -1211,6 +1213,18 @@
         <a class="modal-action modal-close waves-effect btn-flat light-blue-text">Close</a>
       </div>
     </div>
+    <div id="modal_events" class="modal">
+        <div class="modal-content">
+            <label for="ws_uri">Websocket URI</label><input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
+            <label for="ws_password">API password</label><input type="password" id="ws_password" value="$api_password"/><br />
+            <textarea id="ws_events"></textarea>
+        </div>
+        <div class="modal-footer">
+          <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
+          <a onclick="ws_disconnect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Disconnect</a>
+          <a onclick="ws_disconnect()" class=" modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
+        </div>
+    </div>
     <div id="modal_save" class="modal">
         <div class="modal-content">
             <h4 class="grey-text text-darken-3">Save<i class="grey-text text-darken-3 material-icons right" style="font-size: 2rem;">save</i></h4>
@@ -2077,6 +2091,46 @@
 <!-- Scripts -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
+<script>
+    function ws_connect() {
+        function msg(str) {
+            document.getElementById("ws_events").value = str + "\n\n" + document.getElementById("ws_events").value;
+        }
+
+        try {
+            ws = new WebSocket(document.getElementById("ws_uri").value);
+            ws.addEventListener("open", function(event) {
+                var auth = {
+                    type: "auth",
+                    api_password: document.getElementById("ws_password").value
+                };
+                var data = {
+                    id: 1,
+                    type: "subscribe_events"
+                };
+                ws.send(JSON.stringify(auth));
+                ws.send(JSON.stringify(data));
+            });
+            ws.onmessage = function(event) {
+                msg(event.data);
+            }
+            ws.onclose = function() {msg('Socket closed');};
+            ws.onopen = function() {msg('Socket connected');};
+        }
+        catch(err) {
+            console.log("Error: " + err.message);
+        }
+    }
+
+    function ws_disconnect() {
+        try {
+            ws.close();
+        }
+        catch(err) {
+            console.log("Error: " + err.message);
+        }
+    }
+</script>
 <script type="text/javascript">
     var global_current_filepath = null;
     var global_current_filename = null;
@@ -3653,6 +3707,12 @@ def do_GET(self):
             except Exception as err:
                 LOG.warning("Exception getting release")
                 LOG.warning(err)
+            ws_api = ""
+            if HASS_API:
+                protocol, uri = HASS_API.split("//")
+                ws_api = "%s://%swebsocket" % (
+                    "wss" if protocol == 'https' else 'ws',  uri
+                )
             html = get_html().safe_substitute(services=services,
                                               events=events,
                                               states=states,
@@ -3661,7 +3721,9 @@ def do_GET(self):
                                               separator="\%s" % os.sep if os.sep == "\\" else os.sep,
                                               listening_address="%s://%s:%i" % (
                                                   'https' if SSL_CERTIFICATE else 'http', LISTENIP, LISTENPORT),
-                                              hass_api_address="%s" % (HASS_API, ))
+                                              hass_api_address="%s" % (HASS_API, ),
+                                              hass_ws_address=ws_api,
+                                              api_password=HASS_API_PASSWORD if HASS_API_PASSWORD else "")
             self.wfile.write(bytes(html, "utf8"))
             return
         else:
diff --git a/dev.html b/dev.html
index b8137b8..a493208 100644
--- a/dev.html
+++ b/dev.html
@@ -561,6 +561,7 @@
         <li><a class="modal-trigger" href="#modal_about">About HASS-Configurator</a></li>
         <li class="divider"></li>
         <!--<li><a href="#modal_check_config">Check HASS Configuration</a></li>-->
+        <li><a class="modal-trigger" href="#modal_events">Observe events</a></li>
         <li><a class="modal-trigger" href="#modal_reload_automations">Reload automations</a></li>
         <li><a class="modal-trigger" href="#modal_reload_scripts">Reload scripts</a></li>
         <li><a class="modal-trigger" href="#modal_reload_groups">Reload groups</a></li>
@@ -580,6 +581,7 @@
         <li><a class="modal-trigger" href="#modal_about">About HASS-Configurator</a></li>
         <li class="divider"></li>
         <!--<li><a href="#modal_check_config">Check HASS Configuration</a></li>-->
+        <li><a class="modal-trigger" href="#modal_events">Observe events</a></li>
         <li><a class="modal-trigger" href="#modal_reload_automations">Reload automations</a></li>
         <li><a class="modal-trigger" href="#modal_reload_scripts">Reload scripts</a></li>
         <li><a class="modal-trigger" href="#modal_reload_groups">Reload groups</a></li>
@@ -1124,6 +1126,18 @@ <h4 class="grey-text text-darken-3">Ace Keyboard Shortcuts<i class="mdi mdi-keyb
         <a class="modal-action modal-close waves-effect btn-flat light-blue-text">Close</a>
       </div>
     </div>
+    <div id="modal_events" class="modal">
+        <div class="modal-content">
+            <label for="ws_uri">Websocket URI</label><input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
+            <label for="ws_password">API password</label><input type="password" id="ws_password" value="$api_password"/><br />
+            <textarea id="ws_events"></textarea>
+        </div>
+        <div class="modal-footer">
+          <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
+          <a onclick="ws_disconnect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Disconnect</a>
+          <a onclick="ws_disconnect()" class=" modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
+        </div>
+    </div>
     <div id="modal_save" class="modal">
         <div class="modal-content">
             <h4 class="grey-text text-darken-3">Save<i class="grey-text text-darken-3 material-icons right" style="font-size: 2rem;">save</i></h4>
@@ -1990,6 +2004,46 @@ <h4 class="grey-text text-darken-3"><a class="black-text" href="https://github.c
 <!-- Scripts -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
+<script>
+    function ws_connect() {
+        function msg(str) {
+            document.getElementById("ws_events").value = str + "\n\n" + document.getElementById("ws_events").value;
+        }
+
+        try {
+            ws = new WebSocket(document.getElementById("ws_uri").value);
+            ws.addEventListener("open", function(event) {
+                var auth = {
+                    type: "auth",
+                    api_password: document.getElementById("ws_password").value
+                };
+                var data = {
+                    id: 1,
+                    type: "subscribe_events"
+                };
+                ws.send(JSON.stringify(auth));
+                ws.send(JSON.stringify(data));
+            });
+            ws.onmessage = function(event) {
+                msg(event.data);
+            }
+            ws.onclose = function() {msg('Socket closed');};
+            ws.onopen = function() {msg('Socket connected');};
+        }
+        catch(err) {
+            console.log("Error: " + err.message);
+        }
+    }
+
+    function ws_disconnect() {
+        try {
+            ws.close();
+        }
+        catch(err) {
+            console.log("Error: " + err.message);
+        }
+    }
+</script>
 <script type="text/javascript">
     var global_current_filepath = null;
     var global_current_filename = null;

From 4f8d7778b94484e323bbf36c80a71c2b0e0cf948 Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Sun, 22 Apr 2018 21:08:27 +0200
Subject: [PATCH 02/10] Bumped version, updated changelog

---
 changelog.txt   | 5 +++++
 configurator.py | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/changelog.txt b/changelog.txt
index 9ebcc59..b4c46f9 100644
--- a/changelog.txt
+++ b/changelog.txt
@@ -1,3 +1,8 @@
+Version 0.2.8 (2018-)
+- Updated CDN libraries @jmart518
+- Cosmetic improvements @jmart518
+- Added event observer @danielperna84
+
 Version 0.2.7 (2018-03-30)
 - Setting SO_REUSEADDR on socket for proper restarts
 - Using Threading to handle multiple connections
diff --git a/configurator.py b/configurator.py
index fe7d4ba..6d95a30 100755
--- a/configurator.py
+++ b/configurator.py
@@ -74,7 +74,7 @@
     logging.Formatter('%(levelname)s:%(asctime)s:%(name)s:%(message)s'))
 LOG.addHandler(SO)
 RELEASEURL = "https://api.github.com/repos/danielperna84/hass-configurator/releases/latest"
-VERSION = "0.2.7"
+VERSION = "0.2.8"
 BASEDIR = "."
 DEV = False
 HTTPD = None

From 5ce0d34bd8cfab65794070631811f7c4c1bdc81d Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Sun, 22 Apr 2018 21:12:22 +0200
Subject: [PATCH 03/10] Lint

---
 configurator.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/configurator.py b/configurator.py
index 6d95a30..f505c6b 100755
--- a/configurator.py
+++ b/configurator.py
@@ -3711,7 +3711,7 @@ def do_GET(self):
             if HASS_API:
                 protocol, uri = HASS_API.split("//")
                 ws_api = "%s://%swebsocket" % (
-                    "wss" if protocol == 'https' else 'ws',  uri
+                    "wss" if protocol == 'https' else 'ws', uri
                 )
             html = get_html().safe_substitute(services=services,
                                               events=events,

From 3bb560e5d09b4dededaf12403dea29fcf9655f57 Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Sun, 22 Apr 2018 21:20:06 +0200
Subject: [PATCH 04/10] Only authenticate when password is set

---
 configurator.py | 4 +++-
 dev.html        | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/configurator.py b/configurator.py
index f505c6b..b21287a 100755
--- a/configurator.py
+++ b/configurator.py
@@ -2108,7 +2108,9 @@
                     id: 1,
                     type: "subscribe_events"
                 };
-                ws.send(JSON.stringify(auth));
+                if (document.getElementById("ws_password").value) {
+                    ws.send(JSON.stringify(auth));
+                }
                 ws.send(JSON.stringify(data));
             });
             ws.onmessage = function(event) {
diff --git a/dev.html b/dev.html
index a493208..65c6c8f 100644
--- a/dev.html
+++ b/dev.html
@@ -2021,7 +2021,9 @@ <h4 class="grey-text text-darken-3"><a class="black-text" href="https://github.c
                     id: 1,
                     type: "subscribe_events"
                 };
-                ws.send(JSON.stringify(auth));
+                if (document.getElementById("ws_password").value) {
+                    ws.send(JSON.stringify(auth));
+                }
                 ws.send(JSON.stringify(data));
             });
             ws.onmessage = function(event) {

From ba9a4e9d350a98483fed776f76e8f72242ea339f Mon Sep 17 00:00:00 2001
From: JT Martinez <five1eight@gmail.com>
Date: Sun, 22 Apr 2018 15:13:36 -0600
Subject: [PATCH 05/10] Fixes for Event Observer

Changed label color to match the rest of the theme
Added label and icon
Possible solution #1 for textarea
Changed modal footer to "fixed"
---
 dev.html | 51 +++++++++++++++++++++++++++++++++++++++++++++------
 1 file changed, 45 insertions(+), 6 deletions(-)

diff --git a/dev.html b/dev.html
index 65c6c8f..678a953 100644
--- a/dev.html
+++ b/dev.html
@@ -234,9 +234,27 @@
             box-shadow: 0 1px 0 0 #03a9f4 !important;
         }
 
-        .row .input-field input:focus {
+        .input-field input:focus+label {
+            color: #03a9f4 !important;
+        }
+
+        .input-field input[type=password].valid {
             border-bottom: 1px solid #03a9f4 !important;
-            box-shadow: 0 1px 0 0 #03a9f4 !important
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
+        }
+
+        .input-field input[type=password]:focus {
+            border-bottom: 1px solid #03a9f4 !important;
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
+        }
+
+        .input-field textarea:focus+label {
+            color: #03a9f4 !important;
+        }
+
+        .input-field textarea:focus {
+            border-bottom: 1px solid #03a9f4 !important;
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
         }
 
         #modal_acekeyboard, #modal_components, #modal_icons {
@@ -1126,11 +1144,32 @@ <h4 class="grey-text text-darken-3">Ace Keyboard Shortcuts<i class="mdi mdi-keyb
         <a class="modal-action modal-close waves-effect btn-flat light-blue-text">Close</a>
       </div>
     </div>
-    <div id="modal_events" class="modal">
+    <div id="modal_events" class="modal modal-fixed-footer">
         <div class="modal-content">
-            <label for="ws_uri">Websocket URI</label><input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
-            <label for="ws_password">API password</label><input type="password" id="ws_password" value="$api_password"/><br />
-            <textarea id="ws_events"></textarea>
+            <h4 class="grey-text text-darken-3">Event Observer<i class="grey-text text-darken-3 material-icons right" style="font-size: 2rem;">error_outline</i></h4>
+            <br />
+            <div class="row">
+                <form class="col s12">
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
+                            <label for="ws_uri">Websocket URI</label>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <input type="password" id="ws_password" value="$api_password"/>
+                            <label for="ws_password">API password</label>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <textarea id="ws_events" class="materialize-textarea"></textarea>
+                            <label for="ws_events">Events</label>
+                        </div>
+                    </div>
+                </form>
+            </div>
         </div>
         <div class="modal-footer">
           <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>

From 92a2b432bac65c6c7d22b6168eb610156f324289 Mon Sep 17 00:00:00 2001
From: JT Martinez <five1eight@gmail.com>
Date: Sun, 22 Apr 2018 15:15:13 -0600
Subject: [PATCH 06/10] Fixes for Event Observer

Changed label color to match the rest of the theme
Added label and icon
Possible solution #1 for textarea
Changed modal footer to "fixed"
---
 configurator.py | 54 ++++++++++++++++++++++++++++++++++++++++++-------
 1 file changed, 47 insertions(+), 7 deletions(-)

diff --git a/configurator.py b/configurator.py
index b21287a..6c51c41 100755
--- a/configurator.py
+++ b/configurator.py
@@ -321,9 +321,27 @@
             box-shadow: 0 1px 0 0 #03a9f4 !important;
         }
 
-        .row .input-field input:focus {
+        .input-field input:focus+label {
+            color: #03a9f4 !important;
+        }
+
+        .input-field input[type=password].valid {
             border-bottom: 1px solid #03a9f4 !important;
-            box-shadow: 0 1px 0 0 #03a9f4 !important
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
+        }
+
+        .input-field input[type=password]:focus {
+            border-bottom: 1px solid #03a9f4 !important;
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
+        }
+
+        .input-field textarea:focus+label {
+            color: #03a9f4 !important;
+        }
+
+        .input-field textarea:focus {
+            border-bottom: 1px solid #03a9f4 !important;
+            box-shadow: 0 1px 0 0 #03a9f4 !important;
         }
 
         #modal_acekeyboard, #modal_components, #modal_icons {
@@ -1213,11 +1231,32 @@
         <a class="modal-action modal-close waves-effect btn-flat light-blue-text">Close</a>
       </div>
     </div>
-    <div id="modal_events" class="modal">
+    <div id="modal_events" class="modal modal-fixed-footer">
         <div class="modal-content">
-            <label for="ws_uri">Websocket URI</label><input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
-            <label for="ws_password">API password</label><input type="password" id="ws_password" value="$api_password"/><br />
-            <textarea id="ws_events"></textarea>
+            <h4 class="grey-text text-darken-3">Event Observer<i class="grey-text text-darken-3 material-icons right" style="font-size: 2rem;">error_outline</i></h4>
+            <br />
+            <div class="row">
+                <form class="col s12">
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <input type="text" id="ws_uri" placeholder="ws://127.0.0.1:8123/api/websocket" value="$hass_ws_address"/>
+                            <label for="ws_uri">Websocket URI</label>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <input type="password" id="ws_password" value="$api_password"/>
+                            <label for="ws_password">API password</label>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="input-field col s12">
+                            <textarea id="ws_events" class="materialize-textarea"></textarea>
+                            <label for="ws_events">Events</label>
+                        </div>
+                    </div>
+                </form>
+            </div>
         </div>
         <div class="modal-footer">
           <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
@@ -3273,7 +3312,8 @@
 editor.on('change', queue_lint);
 </script>
 </body>
-</html>""")
+</html>
+""")
 
 def signal_handler(sig, frame):
     global HTTPD

From f7d810eedbd88fc8529d5a8e11efbe68ac2aa67b Mon Sep 17 00:00:00 2001
From: JT Martinez <five1eight@gmail.com>
Date: Mon, 23 Apr 2018 13:33:13 -0600
Subject: [PATCH 07/10] Event fix

Also removed Events label
---
 dev.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/dev.html b/dev.html
index 678a953..385f4f4 100644
--- a/dev.html
+++ b/dev.html
@@ -1165,7 +1165,6 @@ <h4 class="grey-text text-darken-3">Event Observer<i class="grey-text text-darke
                     <div class="row">
                         <div class="input-field col s12">
                             <textarea id="ws_events" class="materialize-textarea"></textarea>
-                            <label for="ws_events">Events</label>
                         </div>
                     </div>
                 </form>
@@ -2047,6 +2046,7 @@ <h4 class="grey-text text-darken-3"><a class="black-text" href="https://github.c
     function ws_connect() {
         function msg(str) {
             document.getElementById("ws_events").value = str + "\n\n" + document.getElementById("ws_events").value;
+            $('#ws_events').trigger('autoresize');
         }
 
         try {

From d3ea0f5e76d9efa1f44dc3cf1b86fb5c08c9c647 Mon Sep 17 00:00:00 2001
From: JT Martinez <five1eight@gmail.com>
Date: Mon, 23 Apr 2018 13:34:25 -0600
Subject: [PATCH 08/10] Fix for event observer

Removed Events label
---
 configurator.py | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/configurator.py b/configurator.py
index 6c51c41..679d39a 100755
--- a/configurator.py
+++ b/configurator.py
@@ -1252,7 +1252,6 @@
                     <div class="row">
                         <div class="input-field col s12">
                             <textarea id="ws_events" class="materialize-textarea"></textarea>
-                            <label for="ws_events">Events</label>
                         </div>
                     </div>
                 </form>
@@ -2134,6 +2133,7 @@
     function ws_connect() {
         function msg(str) {
             document.getElementById("ws_events").value = str + "\n\n" + document.getElementById("ws_events").value;
+            $('#ws_events').trigger('autoresize');
         }
 
         try {
@@ -3312,8 +3312,7 @@
 editor.on('change', queue_lint);
 </script>
 </body>
-</html>
-""")
+</html>""")
 
 def signal_handler(sig, frame):
     global HTTPD

From f7b8555c45d5c7b32fa12ff0106aac180706e5cd Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Mon, 23 Apr 2018 21:48:25 +0200
Subject: [PATCH 09/10] En/Dis-abeling buttons

---
 configurator.py | 18 +++++++++++++-----
 dev.html        | 18 +++++++++++++-----
 2 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/configurator.py b/configurator.py
index 679d39a..eb0ef24 100755
--- a/configurator.py
+++ b/configurator.py
@@ -1258,9 +1258,9 @@
             </div>
         </div>
         <div class="modal-footer">
-          <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
-          <a onclick="ws_disconnect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Disconnect</a>
-          <a onclick="ws_disconnect()" class=" modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
+          <a onclick="ws_connect()" id="ws_b_c" class="modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
+          <a onclick="ws_disconnect()" id="ws_b_d" class="modal-action waves-effect waves-green btn-flat light-blue-text disabled">Disconnect</a>
+          <a class="modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
         </div>
     </div>
     <div id="modal_save" class="modal">
@@ -2155,8 +2155,16 @@
             ws.onmessage = function(event) {
                 msg(event.data);
             }
-            ws.onclose = function() {msg('Socket closed');};
-            ws.onopen = function() {msg('Socket connected');};
+            ws.onclose = function() {
+                msg('Socket closed');
+                document.getElementById('ws_b_c').classList.remove('disabled');
+                document.getElementById('ws_b_d').classList.add('disabled');
+            };
+            ws.onopen = function() {
+                msg('Socket connected');
+                document.getElementById('ws_b_c').classList.add('disabled');
+                document.getElementById('ws_b_d').classList.remove('disabled');
+            };
         }
         catch(err) {
             console.log("Error: " + err.message);
diff --git a/dev.html b/dev.html
index 385f4f4..fbbe943 100644
--- a/dev.html
+++ b/dev.html
@@ -1171,9 +1171,9 @@ <h4 class="grey-text text-darken-3">Event Observer<i class="grey-text text-darke
             </div>
         </div>
         <div class="modal-footer">
-          <a onclick="ws_connect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
-          <a onclick="ws_disconnect()" class=" modal-action waves-effect waves-green btn-flat light-blue-text">Disconnect</a>
-          <a onclick="ws_disconnect()" class=" modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
+          <a onclick="ws_connect()" id="ws_b_c" class="modal-action waves-effect waves-green btn-flat light-blue-text">Connect</a>
+          <a onclick="ws_disconnect()" id="ws_b_d" class="modal-action waves-effect waves-green btn-flat light-blue-text disabled">Disconnect</a>
+          <a class="modal-action modal-close waves-effect waves-red btn-flat light-blue-text">Close</a>
         </div>
     </div>
     <div id="modal_save" class="modal">
@@ -2068,8 +2068,16 @@ <h4 class="grey-text text-darken-3"><a class="black-text" href="https://github.c
             ws.onmessage = function(event) {
                 msg(event.data);
             }
-            ws.onclose = function() {msg('Socket closed');};
-            ws.onopen = function() {msg('Socket connected');};
+            ws.onclose = function() {
+                msg('Socket closed');
+                document.getElementById('ws_b_c').classList.remove('disabled');
+                document.getElementById('ws_b_d').classList.add('disabled');
+            };
+            ws.onopen = function() {
+                msg('Socket connected');
+                document.getElementById('ws_b_c').classList.add('disabled');
+                document.getElementById('ws_b_d').classList.remove('disabled');
+            };
         }
         catch(err) {
             console.log("Error: " + err.message);

From acf86b41e8e8607747eadd7fdc3bb5f2241a332c Mon Sep 17 00:00:00 2001
From: Daniel Perna <danielperna84@gmail.com>
Date: Mon, 23 Apr 2018 21:55:19 +0200
Subject: [PATCH 10/10] Updated readme

---
 README.md     | 7 ++++---
 changelog.txt | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 17521df..3f49770 100644
--- a/README.md
+++ b/README.md
@@ -9,13 +9,14 @@ While the configuration UI of [Home Assistant](https://home-assistant.io/) is st
 
 - Web-Based editor to modify your files with syntax highlighting and automatic yaml-linting
 - Upload and download files
-- Stage and commit changes in Git repositories, create and switch between branches, push to remotes
 - Lists of available triggers, events, entities, conditions and services. Selected element gets inserted into the editor at the last cursor position.
-- Restart HASS directly with the click of a button (API-password required)
+- Home Assistant event observer (connect to HASS via WebSocket and see all the events that happen)
+- Restart HASS directly with the click of a button
 - SSL support
 - Optional authentication and IP filtering for added security
-- Direct links to HASS documentation and icons
+- Direct links to Home Assistant documentation and icons
 - Execute shell commands
+- Stage and commit changes in Git repositories, create and switch between branches, push to SSH remotes
 - Customizable editor settings (saved using [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage))
 
 #### Screenshot HASS Configurator:
diff --git a/changelog.txt b/changelog.txt
index b4c46f9..e8652bc 100644
--- a/changelog.txt
+++ b/changelog.txt
@@ -1,4 +1,4 @@
-Version 0.2.8 (2018-)
+Version 0.2.8 (2018-04-23)
 - Updated CDN libraries @jmart518
 - Cosmetic improvements @jmart518
 - Added event observer @danielperna84