1 files changed, 76 insertions, 0 deletions
diff --git a/public/assets/javascripts/ui/reader/EmbedView.js b/public/assets/javascripts/ui/reader/EmbedView.js
new file mode 100644
index 0000000..7a75e00
--- /dev/null
+++ b/public/assets/javascripts/ui/reader/EmbedView.js
@@ -0,0 +1,76 @@
+var EmbedView = ModalView.extend({
+  el: ".embedView",
+  
+  events: {
+    "keydown": "stopPropagation",
+    "input [name=width]": "build",
+    "input [name=height]": "build",
+    "click [name=mute]": "build",
+    "click [name=interactive]": "build",
+    "click textarea": "selectAll",
+    "click #testEmbed": "test",
+  },
+  
+  defaultWidth: 600,
+  defaultHeight: 450,
+
+	initialize: function(opt){
+	  this.parent = opt.parent
+    this.$embedCode = this.$("#embedCode")
+    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)
+	},
+	
+	show: function(){
+	  this.build()
+	  this.__super__.show.call(this)
+	},
+
+  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()
+    var embed_link = link
+    embed_link += "?mute=" + mute
+    embed_link += "&embed=1"
+    if (interactive) {
+      embed_link += "&interactive=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>"
+    
+    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(){
+    this.$embedCode[0].select()
+  },
+
+})