merge

4 files changed, 162 insertions, 14 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()
+  },
+
+})
diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js
index c132609..aea681a 100644
--- a/public/assets/javascripts/ui/reader/ReaderView.js
+++ b/public/assets/javascripts/ui/reader/ReaderView.js
@@ -13,22 +13,64 @@ var ReaderView = View.extend({
 	},
 
 	load: function(name){
-		if (window.location.search.indexOf("noui") !== -1) {
-			$(".logo,.topLinks,#editorView").hide()
+	  var opt = this.getQS()
+	  var mode = "default"
+		var name = sanitize(name)
+
+		if (opt.noui) {
+			$(".logo, .topLinks, #editorView, #keyhint").hide()
+      mode = "noui"
 		}
-		else {
-		  this.tracker = new Tracker ()
+		if (opt.embed) {
+			$(".topLinks, .share, #edit-room-link, #keyhint").hide()
+      mode = "embed"
 		}
-		if (window.location.search.indexOf("mute") !== -1) {
+		if (opt.mute) {
 			app.muted = true
 		}
-		name = sanitize(name)
-		$.get(this.projectAction + name, this.ready.bind(this))
+
+    this.tracker = new Tracker ({ mode: mode })
+
+    $.get(this.projectAction + name, this.ready.bind(this))
+	},
+	
+	getQS: function(){
+	  var qs = {}
+	  window.location.search.replace(/^\?/,"").split("&").forEach(function(s){
+	    var pair = s.split("=")
+	    if (pair.length < 2) {
+        qs[pair[0]] = true
+	    }
+	    else {
+        qs[pair[0]] = pair[1]
+	    }
+	  })
+	  return qs
 	},
 	
 	ready: function(data){
 		$("#map").hide()
+    this.data = data
+    var is_landscape = window.innerWidth > window.innerHeight
 
+		if (is_desktop || (is_mobile && is_landscape)) {
+		  this.build(data)
+		  return
+		}
+		
+		// don't build anything until we're in landscape mode, otherwise ios might crash
+		var orientationFn = orientationchange.bind(this)
+    window.addEventListener('orientationchange', orientationFn)
+    function orientationchange (e) {
+      var is_landscape = window.innerWidth > window.innerHeight
+      if (is_landscape) {
+        window.removeEventListener('orientationchange', orientationFn)
+        this.build(data)
+      }
+    }
+  },
+  
+  build: function(data){
 		data.rooms && Rooms.deserialize(data.rooms)
 		data.walls && Walls.deserialize(data.walls)
 		data.media && Scenery.deserialize(data.media)
diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js
index 4e5f832..dbe6f64 100644
--- a/public/assets/javascripts/ui/reader/ShareView.js
+++ b/public/assets/javascripts/ui/reader/ShareView.js
@@ -2,31 +2,61 @@ var ShareView = View.extend({
   el: ".share",
   
   events: {
+    "keydown": "stopPropagation",
     "click #share_facebook": "facebook",
     "click #share_twitter": "twitter",
+    "click #share_embed": "embed",
   },
 
 	initialize: function(opt){
 	  this.parent = opt.parent
+	  this.embedView = new EmbedView ({ parent: this })
+	  this.$link = this.$("#share_link")
+	},
+	
+	toggle: function(state){
+	  if (typeof state == "boolean") {
+	    this.$el.toggleClass("active", state)
+	  }
+	  else {
+	    this.$el.toggleClass("active")
+	  }
+	},
+	show: function(){
+	  this.toggle(true)
+	},
+	hide: function(){
+	  this.toggle(false)
+	},
+	
+	setLink: function(url){
+		this.$link.val( url )
+	},
+	getLink: function(){
+    var link = window.location.origin + window.location.pathname
+	  link = link.replace(/\/edit\/?$/, "")
+	  return link
 	},
 
 	facebook: function (e) {
 	  e.preventDefault()
-	  var msg = $(".roomName").html() + " on VValls"
-		var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(window.location.origin + window.location.pathname) + "&t=" + encodeURIComponent(msg);
+	  var link = this.getLink()
+	  var msg = app.controller.data.name + " on VValls"
+		var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(link) + "&t=" + encodeURIComponent(msg)
 		window.open(url, "_blank")
 	},
 
 	twitter: function (e) {
 	  e.preventDefault()
-	  var msg = $(".roomName").html() + " on VValls"
-		var url = "https://twitter.com/home?status=" + encodeURIComponent(window.location.origin + window.location.pathname + " " + msg);
+	  var link = this.getLink()
+	  var msg = app.controller.data.name + " on VValls"
+    var url = "https://twitter.com/home?status=" + encodeURIComponent(link + " " + msg)
 		window.open(url, "_blank")
 	},
 	
 	embed: function (e) {
 	  e.preventDefault()
-	  
+	  this.embedView.show()
 	},
 
 })
diff --git a/public/assets/javascripts/ui/reader/Tracker.js b/public/assets/javascripts/ui/reader/Tracker.js
index beef071..bad42a8 100644
--- a/public/assets/javascripts/ui/reader/Tracker.js
+++ b/public/assets/javascripts/ui/reader/Tracker.js
@@ -13,7 +13,7 @@ var Tracker = Fiber.extend(function(base){
 		  this.events = []
 		  
 		  this.bind()
-		  this.trackPageview()
+		  this.trackPageview(opt)
 		},
 		
 		bind: function () {
@@ -29,7 +29,7 @@ var Tracker = Fiber.extend(function(base){
 		},
 		
 		trackPageview: function(opt){
-      this.pushEvent([ "view" ])
+      this.pushEvent([ "view", opt.mode ])
 		},
 
     //