implemented command to fetch list of languages

1 files changed, 17 insertions, 6 deletions

diff --git a/cmd/dolmetschctld/web-static/socket.html b/cmd/dolmetschctld/web-static/socket.html
index b9bebbb..0dd88c5 100644
--- a/cmd/dolmetschctld/web-static/socket.html
+++ b/cmd/dolmetschctld/web-static/socket.html
@@ -26,13 +26,25 @@
       function Controller(url) {
         this.sock = new WebSocket(url);
         this.sock_onmessage = function (event) {
-          $('#rawmsg').text(event.data);
+          data = JSON.parse(event.data)
+          if(data.type == 'languages') {
+            sel = $('#selectlang');
+            sel.empty();
+            for (var i=0; i < data.languages.length; i++) {
+              sel.append('<option>' + data.languages[i] + '</option>')
+            }
+          } else {
+            $('#rawmsg').text(event.data);
+          }
           $('#buttonstate').removeAttr('disabled','disabled');
+          $('#buttonlang').removeAttr('disabled','disabled');
         }
         this.sock.onmessage = this.sock_onmessage.bind(this);
 
         this.sock_onopen = function() {
+          this.send({ command: "languages" });
           $('#buttonstate').removeAttr('disabled','disabled');
+          $('#buttonlang').removeAttr('disabled','disabled');
         }
         this.sock.onopen = this.sock_onopen.bind(this);
 
@@ -45,17 +57,16 @@
       var ctrl = new Controller("ws://localhost:8234/api/v1/socket");
 
       function state() {
-        req = { command: "state" };
-        ctrl.send(req);
+        ctrl.send({ command: "state" });
       }
 
       function set_language() {
-        req = { command: "language", arguments: [ $('#inputlang').val() ] };
-        ctrl.send(req);
+        ctrl.send({ command: "language", arguments: [ $('#selectlang').val() ] });
       }
 
       function init() {
         $('#buttonstate').attr('disabled','disabled')
+        $('#buttonslang').attr('disabled','disabled')
       }
     </script>
   </head>
@@ -66,7 +77,7 @@
     <div>
       <button id="buttonstate" onclick="state()">get state</button>
       <button id="buttonlang" onclick="set_language()">set language</button>
-      <input type="text" id="inputlang" length="10">
+      <select id="selectlang"></select>
       <div id="rawmsg" class="data"></div>
     </div>