(Re)Implement live update of corpus and job lists.

app/static/js/CorpusList.js

@@ -46,8 +46,7 @@ class CorpusList extends List {
   }
 
 
-/*
-  corporaUpdateHandler(delta) {
+  updateWithPatch(delta) {
     var corpusElement, key, listItem;
 
     for (key in delta) {
@@ -74,5 +73,4 @@ class CorpusList extends List {
       }
     }
   }
-*/
 }

app/static/js/JobList.js

@@ -49,8 +49,7 @@ class JobList extends List {
   }
 
 
-/*
-  jobsUpdateHandler(delta) {
+  updateWithPatch(delta) {
     var jobElement, jobStatusElement, key, listItem;
 
     for (key in delta) {
@@ -83,7 +82,6 @@ class JobList extends List {
       }
     }
   }
-*/
 }
 
 JobList.SERVICE_COLORS = {"nlp": "blue",

app/templates/base.html.j2

@@ -12,6 +12,8 @@
     <link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/materialize.min.css') }}" media="screen,projection"/>
     <link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/opaque.css') }}" media="screen,projection"/>
     <script src="{{ url_for('static', filename='js/socket.io.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/jsonpatch.min.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/jsondiffpatch.umd.js') }}"></script>
     <script src="{{ url_for('static', filename='js/list.js') }}"></script>
     <script src="{{ url_for('static', filename='js/list.utils.js') }}"></script>
     <script src="{{ url_for('static', filename='js/CorpusList.js') }}"></script>
@@ -21,29 +23,47 @@
       var corporaSubscribers = [];
       var jobs;
       var jobsSubscribers = [];
-    </script>
-    <script>
       var socket = io();
 
       socket.on('init-corpora', function(msg) {
+        var subscriber;
+
         corpora = JSON.parse(msg);
         for (subscriber of corporaSubscribers) {subscriber.init();}
       });
 
 
       socket.on('init-jobs', function(msg) {
+        var subscriber;
+
         jobs = JSON.parse(msg);
         for (subscriber of jobsSubscribers) {subscriber.init();}
       });
 
 
       socket.on('update-corpora', function(msg) {
-        console.log(msg);
+        var patch, patchedCorpora, subscriber;
+
+        patch = JSON.parse(msg);
+        patchedCorpora = jsonpatch.apply_patch(corpora, patch);
+        delta = jsondiffpatch.diff(corpora, patchedCorpora);
+        corpora = patchedCorpora;
+        for (subscriber of corporaSubscribers) {
+          subscriber.updateWithPatch(delta);
+        }
       });
 
 
       socket.on('update-jobs', function(msg) {
-        console.log(msg);
+        var patch, patchedJobs, subscriber;
+
+        patch = JSON.parse(msg);
+        patchedJobs = jsonpatch.apply_patch(jobs, patch);
+        delta = jsondiffpatch.diff(jobs, patchedJobs);
+        jobs = patchedJobs;
+        for (subscriber of jobsSubscribers) {
+          subscriber.updateWithPatch(delta);
+        }
       });