Fix null thumbnails, setting/removal of iframe codes

mitmedialab · Aug 12, 2016 · 05ba6f7 · 05ba6f7
1 parent d2ea5bc
commit 05ba6f7
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 24 deletions.
diff --git a/lib/unhangout-sockets.js b/lib/unhangout-sockets.js
@@ -432,7 +432,10 @@ _.extend(UnhangoutSocketManager.prototype, events.EventEmitter.prototype, {
                 if (event.get("youtubeEmbed") != args.ytId) {
                     this.clearVideoSync(event.getRoomId());
                 }
-                event.set("youtubeEmbed", args.ytId);
+                event.set({
+                  youtubeEmbed: args.ytId,
+                  iframeEmbedCode: ""
+                });
                 event.save();
                 mgr.writeAck(socket, "embed");
                 event.logAnalytics({action: "embed", user: socket.user, ytId: args.ytId});
@@ -445,13 +448,21 @@ _.extend(UnhangoutSocketManager.prototype, events.EventEmitter.prototype, {
             if (!("iframeCode" in args)) {
                 return mgr.writeErr(socket, "insert-iframe", "Missing Iframe Code");
             }
-            var iframeCode = utils.sanitizeIframe(args.iframeCode);
-            if (iframeCode === null) {
-                return mgr.writeErr(socket, "insert-iframe", "Invalid iframe code");
+            var iframeCode;
+            if (args.iframeCode) {
+                iframeCode = utils.sanitizeIframe(args.iframeCode);
+                if (iframeCode === null) {
+                    return mgr.writeErr(socket, "insert-iframe", "Invalid iframe code");
+                }
+            } else {
+                iframeCode = "";
             }
             var event = this.getEvent(args.roomId);
             if (event && socket.user.isAdminOf(event)) {
-                event.set("iframeEmbedCode", iframeCode);
+                event.set({
+                  "iframeEmbedCode": iframeCode,
+                  "youtubeEmbed": null,
+                });
                 event.save();
                 mgr.writeAck(socket, "embed-iframe");
                 event.logAnalytics({action: "embed-iframe", user: socket.user, iframeCode: iframeCode});

diff --git a/public/js/event-views.js b/public/js/event-views.js
@@ -817,13 +817,14 @@ views.DialogView = Backbone.Marionette.Layout.extend({
 
     setIframeCode: function(event) {
         event.preventDefault();
-        var iframeCode = $(".input-iframe-code").val();
+        var iframeCode = $(".input-iframe-code").val().trim();
         if(!iframeCode) {
             return;
         }
         if(!iframeCode.startsWith('<iframe') && 
             !iframeCode.endsWith('</iframe>') || 
             !iframeCode.endsWith('>')) {
+            alert("Invalid iframe code");
             return;
         };
         var args = {
@@ -1789,7 +1790,7 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
         this.removeIframeEmbed();
     },
     removeVideoEmbed: function(jqevt) {
-        jqevt.preventDefault();
+        jqevt && jqevt.preventDefault();
         this.removeYouTubeEmbed();
         this.removeHoA();
         this.removeIframeEmbed();
@@ -1811,7 +1812,7 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
         }
     },
     removeIframeEmbed: function() {
-        if(this.model.get("iframeEmbedCode").length > 0) {
+        if(this.model.get("iframeEmbedCode")) {
             this.model.set("iframeEmbedCode", "");
             this.options.transport.send("insert-iframe", {
                 iframeCode: "",
@@ -1822,8 +1823,8 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
     embedIframePlayer: function() {
         this.removeYouTubeEmbed();
         this.removeHoA();
-        if(this.model.get("iframeEmbedCode").length == 0) {
-            $("#iframePlayer").remove();
+        if (!this.model.get("iframeEmbedCode")) {
+            this.$("#iframePlayer").remove();
             return;
         }
         setTimeout(_.bind(this.loadIframePlayer, this), 10);
@@ -1862,12 +1863,7 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
         });
     },
     setPlayerVisibility: function() {
-        yt_embed = this.model.get("youtubeEmbed");
-        ls_channel = this.model.get("iframeEmbedCode");
-        visible = true;
-        if(yt_embed == null || ls_channel.length > 0) {
-            visible = false;
-        } 
+        var visible = !!(this.model.get("youtubeEmbed") || this.model.get("iframeEmbedCode"));
         // Display player if it's visible.
         this.ui.player.toggle(visible);
         // Show a placeholder ("video goes here") if video is not visible and
@@ -1891,7 +1887,7 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
 
         this.ui.controls.html(this.controlsTemplate(context));
 
-        if(this.model.get("iframeEmbedCode").length > 0) {
+        if(this.model.get("iframeEmbedCode")) {
             this.$el.find(".play-for-all").addClass('disabled');
         } else {
             this.$el.find(".play-for-all").addClass('enabled');
@@ -1912,8 +1908,8 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
         }, this));
     },
     onRender: function() {
-        youtubeEmbed = this.model.get("youtubeEmbed");
-        lsChannel = this.model.get("iframeEmbedCode");
+        var youtubeEmbed = this.model.get("youtubeEmbed");
+        var lsChannel = this.model.get("iframeEmbedCode");
 
         this.yt = new video.YoutubeVideo({
             ytID: youtubeEmbed,
@@ -1935,8 +1931,8 @@ views.VideoEmbedView = Backbone.Marionette.ItemView.extend({
         this.$(".video-player").html(this.yt.el); 
         this.setPlayerVisibility();
 
-        if(lsChannel.length > 0) {
-            this.embedIframePlayer(this.model.get("iframeEmbedCode"));
+        if(lsChannel) {
+            this.embedIframePlayer();
         } 
 
         if (youtubeEmbed) {

diff --git a/views/event.ejs b/views/event.ejs
@@ -460,7 +460,7 @@
 
 <script type='text/template' id="video-embed-controls-template">
         <div class='row youtube-video-controls'>
-            {{ if (youtubeEmbed || iframeEmbedCode.length > 0) { }}
+            {{ if (youtubeEmbed || iframeEmbedCode) { }}
             <div class="row video-play-trash-row">
                 <div class='col-lg-7 col-xs-6 btn-play-pause'>
                     <div class='current-video-controls'>
@@ -586,14 +586,17 @@
 
 <script type='text/template' id="previous-video-details-template">
     <a tabindex='-1' href='#' class='restore-previous-video'
+       title='{{= title || id }}'
        data-youtube-id='{{= id }}'>
 
         <div class="col-lg-2 col-xs-3">
-            <img src='{{= thumbnail.url }}'>
+            {{ if (thumbnail) { }}
+                <img src='{{= thumbnail.url }}'>
+            {{ } }}
         </div>
 
         <div class="col-lg-8 col-xs-8">
-            <p class='title'>{{= title }}</p>
+            <p class='title'>{{= title || id}}</p>
         </div>
     </a>
 </script>