recording async update

app/assets/javascripts/channels/recording_update.js

@@ -0,0 +1,26 @@
+(function() {
+
+  var initRooms = function() {
+    App.messages = App.cable.subscriptions.create({
+      channel: 'RecordingUpdatesChannel',
+      username: window.location.pathname.split('/').pop()
+    },
+    {
+      received: function(data) {
+        var btn = $("#recordings").find(".recording-update:disabled");
+        btn.data('published', data.published);
+        btn.find('i').removeClass(getPublishClass(!data.published));
+        btn.find('i').addClass(getPublishClass(data.published));
+        btn.prop("disabled", false);
+      }
+    });
+  };
+
+  $(document).on("turbolinks:load", function() {
+    if ($("body[data-controller=landing]").get(0)) {
+      if ($("body[data-action=rooms]").get(0)) {
+        initRooms();
+      }
+    }
+  });
+}).call(this);

app/assets/javascripts/landing.js

@@ -112,9 +112,9 @@
             if (type === 'display') {
               var roomName = window.location.pathname.split('/').pop();
               var published = row.published;
-              var eye = (published) ? 'eye' : 'eye-slash'
+              var eye = getPublishClass(published);
               return '<button type="button" class="btn btn-default recording-update" data-id="'+data+'" data-room="'+roomName+'" data-published="'+published+'">' +
-                '<i class="fa fa-'+eye+'" aria-hidden="true"></i></button> ' +
+                '<i class="fa '+eye+'" aria-hidden="true"></i></button> ' +
                 '<button type="button" class="btn btn-default recording-delete" data-id="'+data+'" data-room="'+roomName+'">' +
                 '<i class="fa fa-trash-o" aria-hidden="true"></i></button>';
             }
@@ -128,12 +128,15 @@
       var room = $(this).data('room');
       var id = $(this).data('id');
       var published = $(this).data('published');
+      $(this).prop("disabled", true);
       $.ajax({
         method: 'PATCH',
         url: '/rooms/'+room+'/recordings/'+id,
         data: {published: (!published).toString()}
       }).done(function(data) {
-        $(this).prop("disabled", true);
+
+      }).fail(function(data) {
+        $(this).prop("disabled", false);
       });
     });
 

app/assets/javascripts/shared.js

@@ -4,6 +4,12 @@ $.ajaxSetup({
   }
 });
 
+var PUBLISHED_CLASSES = ['fa-eye-slash', 'fa-eye']
+
+var getPublishClass = function(published) {
+  return PUBLISHED_CLASSES[+published];
+}
+
 var meetingInstance = null;
 class Meeting {
   constructor(url, name) {