non-interactive embed

1 files changed, 30 insertions, 7 deletions

diff --git a/public/assets/javascripts/ui/reader/EmbedView.js b/public/assets/javascripts/ui/reader/EmbedView.js
index a0b3c6f..21e351c 100644
--- a/public/assets/javascripts/ui/reader/EmbedView.js
+++ b/public/assets/javascripts/ui/reader/EmbedView.js
@@ -6,7 +6,9 @@ var EmbedView = ModalView.extend({
     "input [name=width]": "build",
     "input [name=height]": "build",
     "click [name=mute]": "build",
+    "click [name=interactive]": "build",
     "click textarea": "selectAll",
+    "click #test": "test",
   },
   
   defaultWidth: 600,
@@ -18,6 +20,7 @@ var EmbedView = ModalView.extend({
     this.$width = this.$("[name=width]")
     this.$height = this.$("[name=height]")
     this.$mute = this.$("[name=mute]")
+    this.$interactive = this.$("[name=interactive]")
     
     this.$width.val(this.defaultWidth)
     this.$height.val(this.defaultHeight)
@@ -29,18 +32,38 @@ var EmbedView = ModalView.extend({
 	},
 
   build: function(){
+    var kode = this.getEmbedCode()
+    this.$embedCode.val( kode )
+  },
+  
+  getEmbedCode: function(){
     var mute = this.$mute.prop('checked') ? 1 : 0
+    var interactive = this.$interactive.prop('checked') ? 1 : 0
     var width = clamp( this.$width.int(), 0, 2000) || this.defaultWidth
     var height = clamp( this.$height.int(), 0, 2000) || this.defaultHeight
     var link = this.parent.getLink()
-    link += "?mute=" + mute
-//    link += "&noui=1"
-    var kode = "<iframe src='" + encodeURI(link) + "' width='" + width + "' height='" + height + "'"
-             + " seamless scrolling='no' style='border: 0'"
-             + " webkitAllowFullScreen mozallowfullscreen allowfullscreen"
-             + "></iframe>"
+    var embed_link = link
+    embed_link += "?mute=" + mute
+    embed_link += "&embed=1"
+
+    var kode = "<iframe src='" + encodeURI(embed_link) + "' width='" + width + "' height='" + height + "'"
+    kode += " seamless scrolling='no' style='border: 0'"
+    kode += " webkitAllowFullScreen mozallowfullscreen allowfullscreen"
+    if (! interactive) {
+      kode += " style='pointer-events:none;'"
+    }
+    kode += "></iframe>"
     
-    this.$embedCode.val( kode )
+    if (! interactive) {
+      kode = "<div style='position:relative'>" + kode + "<a href='" + encodeURI(link) + "' style='display:block;position:absolute;top:0;left:0;width:" + width + "px;height:" + height + "px;'></a></div>"
+    }
+    
+    return kode
+  },
+  
+  test: function(){
+    var kode = this.getEmbedCode()
+    window.open("data:text/html," + kode, "_blank")
   },
   
   selectAll: function(){