use webstomp

2 files changed, 40 insertions, 36 deletions

diff --git a/index.html b/index.html
index 350cf8a..edc6fdc 100644
--- a/index.html
+++ b/index.html
@@ -10,51 +10,52 @@
         </form>
 
         <ul id="updates"></ul>
-        <!--        <script src="/socket.io/socket.io.js"></script> -->
+        <script src="https://cdn.jsdelivr.net/sockjs/1/sockjs.min.js"></script>
+        <script type="text/javascript" src="/js/webstomp.min.js"></script>
         <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
         <script>
-            //var socket = io();
+            // fallback (TODO)
+            //var sock = SockJS("http://localhost:15674/stomp");
+            //var client = webstomp.over(sock);
+            let client = webstomp.client("ws://localhost:15674/ws");
+            client.connect("web", "web", () => {
+                $("#updates").append(
+                    $("<li>")
+                    .text("connected to socket")
+                    .css("color", "purple")
+                );
+            }, (err) => {
+                $("#updates").append(
+                    $("<li>")
+                    .text("error connecting to socket: " + err)
+                    .css("color", "red")
+                );
+            });
             $("#update-form").submit(function(e) {
-                var name = $("input:first").val();
+                let name = $("input:first").val();
                 $.get("/api/player/name/" + name).done(function() {
                     $("#updates").append(
                         $("<li>")
                         .text(name + ": found")
-                        .css("color", "black")
+                        .css("color", "green")
                     );
-                    /* subscribe to socket notifications */
-                    /*
-                    socket.on(name, function(msg) {
-                        if (msg == "grab_failed")  {
-                            $("#updates").append(
-                                $("<li>")
-                                .text(name + ": no new data")
-                                .css("color", "red")
-                            );
-                        }
-                        if (msg == "process_finished")  {
-                            $("#updates").append(
-                                $("<li>")
-                                .text(name + ": processed")
-                                .css("color", "green")
-                            );
-                        }
-                        if (msg == "compile_finished")  {
+                    client.subscribe("/topic/" + name, (msg) => {
+                        $("#updates").append(
+                            $("<li>")
+                            .text(msg.body)
+                            .css("color", "grey")
+                        );
+
+                        if (msg.body == "process_commit")  {
                             $("#updates").append(
                                 $("<li>")
-                                .text(name + ": compiled")
+                                .text(name + ": new match(es) available")
                                 .css("color", "orange")
                             );
                         }
-                        if (msg == "done")  {
-                            $("#updates").append(
-                                $("<li>")
-                                .text(name + ": done")
-                                .css("color", "red")
-                            );
-                        }
-                    });
-                    */
+
+                        msg.ack();
+                    }, {"ack": "client"});
                 }).fail(function() {
                     $("#updates").append(
                         $("<li>")
diff --git a/server.js b/server.js
index 1f5b126..1f9f410 100644
--- a/server.js
+++ b/server.js
@@ -3,8 +3,8 @@
 
 var amqp = require("amqplib"),
     request = require("request-promise"),
-    app = require("express")(),
-    http = require("http").Server(app),
+    express = require("express"),
+    http = require("http"),
     sleep = require("sleep-promise");
 
 var MADGLORY_TOKEN = process.env.MADGLORY_TOKEN,
@@ -14,9 +14,12 @@ if (MADGLORY_TOKEN == undefined) throw "Need an API token";
 
 (async () => {
     var rabbit = await amqp.connect(RABBITMQ_URI),
-        ch = await rabbit.createChannel();
+        ch = await rabbit.createChannel(),
+        app = express(),
+        server = http.Server(app);
 
-    http.listen(8880);
+    server.listen(8880);
+    app.use(express.static("assets"));
 
 
     /* API helper */