Add endpoint to detect new recordings and update the interface

The endpoint receives events from BigBlueButton via webhooks or scripts
in the record and playback workflow.
For now it only treats the event for when a recording is ready.
When it happens, it uses action cable to update the interface dynamically
with the new recording.

app/assets/javascripts/channels/recording_update.js

@@ -26,23 +26,32 @@
 
         var recordings = Recordings.getInstance();
         var table = recordings.table.api();
-        var row = table.row("#"+data.record_id);
+        var row = table.row("#"+data.id);
 
         if (data.action === 'update') {
           var rowData = row.data();
 
           rowData.published = data.published;
           rowData.listed = data.listed;
-          table.row("#"+data.record_id).data(rowData);
+          table.row("#"+data.id).data(rowData);
           recordings.draw();
 
           var status = data.published ? (data.listed ? 'published' : 'unlisted') : 'unpublished';
           showAlert(I18n['recording_'+status], 4000);
+
         } else if (data.action === 'delete') {
           row.remove();
           recordings.draw();
-
           showAlert(I18n.recording_deleted, 4000);
+
+        } else if (data.action === 'create') {
+          if (row.length == 0) {
+            data.duration = data.length;
+            table.rows.add([data]);
+            recordings.draw();
+            showAlert(I18n.recording_created, 4000);
+          }
+
         }
       }
     });

app/assets/javascripts/recordings.coffee

@@ -166,13 +166,13 @@ class @Recordings
       listed = btn.data('visibility') == "published"
 
       btn.prop('disabled', true)
+
+      data = { published: published.toString() }
+      data["meta_" + GreenLight.META_LISTED] = listed.toString();
       $.ajax({
         method: 'PATCH',
         url: url+'/recordings/'+id,
-        data: {
-          published: published.toString(),
-          "meta_greenlight-listed": listed.toString()
-        }
+        data: data
       }).done((data) ->
 
       ).fail((data) ->

app/assets/javascripts/shared.js

@@ -34,6 +34,7 @@ var loopJoin = function() {
   });
 }
 
+var alertTimeout = null;
 var showAlert = function(html, timeout_delay) {
   if (!html) {
     return;
@@ -43,11 +44,12 @@ var showAlert = function(html, timeout_delay) {
   $('#alerts').html($('.alert-template').html());
 
   if (timeout_delay) {
-    setTimeout(function() {
+    clearTimeout(alertTimeout);
+    alertTimeout = setTimeout(function() {
       $('#alerts > .alert').alert('close');
     }, timeout_delay);
   }
-}
+};
 
 var displayRoomURL = function() {
   $('.meeting-url').val(Meeting.getInstance().getURL());