standalone viewer

10 files changed, 111 insertions, 28 deletions

diff --git a/public/assets/javascripts/rectangles/_env.js b/public/assets/javascripts/rectangles/_env.js
index 1e89696..3cfe969 100644
--- a/public/assets/javascripts/rectangles/_env.js
+++ b/public/assets/javascripts/rectangles/_env.js
@@ -17,9 +17,6 @@ environment.init = function(){
 		scene.camera.radius = 20
 	}
 	
-	map.center.a = 0
-	map.center.b = 0
-	
 	app.movements.gravity(true)
 	
 	Rooms.init()
@@ -35,7 +32,7 @@ environment.init = function(){
 			el: document.querySelector("#minimap .el"),
 			width: 130,
 			height: 130,
-			zoom: -4.8
+			zoom: -4.8	
 		})
 	}
 }
diff --git a/public/assets/javascripts/rectangles/engine/map/_map.js b/public/assets/javascripts/rectangles/engine/map/_map.js
index d5a8442..99ede82 100644
--- a/public/assets/javascripts/rectangles/engine/map/_map.js
+++ b/public/assets/javascripts/rectangles/engine/map/_map.js
@@ -65,13 +65,14 @@ var Map = function(opt){
 		canvas.width = base.dimensions.a = window.innerWidth
 		canvas.height = base.dimensions.b = window.innerHeight
 	}
-
-	base.update = function(){
-		base.draw.animate()
-	}
-	
+		
 	base.toggle = function(){
 		$(base.el).toggle()
 	}
 
 }
+
+Map.prototype.update = function(){
+	this.draw && this.draw.animate()
+}
+
diff --git a/public/assets/javascripts/rectangles/engine/rooms/clipper.js b/public/assets/javascripts/rectangles/engine/rooms/clipper.js
index 0854013..eb467cd 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/clipper.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/clipper.js
@@ -8,7 +8,7 @@ Rooms.clipper = new function(){
 	}
 	
 	base.bind = function(){
-		map.ui.mouse.tube.on("up", function(){ base.update() })
+		map.ui && map.ui.mouse.tube.on("up", function(){ base.update() })
 	}
 
 	base.update = function(){
diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js
index f38a740..bad0a55 100644
--- a/public/assets/javascripts/rectangles/engine/scenery/move.js
+++ b/public/assets/javascripts/rectangles/engine/scenery/move.js
@@ -26,6 +26,10 @@ Scenery.move = function(base){
 			Scenery.remove(base.id)
 			return
 		}
+		if (! (editor.permissions.move || editor.permissions.resize) ) {
+			e.clickAccepted = false
+			return
+		}
 		dragging = true
 		x = base.mx.x
 		y = base.mx.y
diff --git a/public/assets/javascripts/rectangles/util/mouse.js b/public/assets/javascripts/rectangles/util/mouse.js
index 2ec35e6..06958af 100644
--- a/public/assets/javascripts/rectangles/util/mouse.js
+++ b/public/assets/javascripts/rectangles/util/mouse.js
@@ -95,8 +95,6 @@ function mouse (opt) {
 	}
 	
 	base.mousedown = function(e){
-		e.stopPropagation()
-
 		if (opt.use_offset) {
 			offset = this.getBoundingClientRect()
 		}
@@ -106,12 +104,18 @@ function mouse (opt) {
 		var x = pos.a, y = pos.b
 		base.cursor = new Rect (x,y, x,y)
 		base.down = true
-
+		e.clickAccepted = true
+		
 		base.tube("down", e, base.cursor)
+
+		if (e.clickAccepted) {
+			e.stopPropagation()
+		}
+		else {
+			base.down = false
+		}
 	}
 	base.mousemove = function(e){
-		e.stopPropagation()
-
 		if (opt.use_offset && ! offset) return
 		
 		var pos = positionFromMouse(e)
@@ -126,10 +130,11 @@ function mouse (opt) {
 			base.cursor.x.b = x
 			base.cursor.y.b = y
 			base.tube("drag", e, base.cursor)
+			e.stopPropagation()
 		}
 		else {
 			base.cursor.x.a = base.cursor.x.b = x
-			base.cursor.y.a = base.cursor.y.b = y		
+			base.cursor.y.a = base.cursor.y.b = y
 			base.tube("move", e, base.cursor)
 		}
 	}
diff --git a/public/assets/javascripts/rectangles/util/permissions.js b/public/assets/javascripts/rectangles/util/permissions.js
index 22a6079..adb2498 100644
--- a/public/assets/javascripts/rectangles/util/permissions.js
+++ b/public/assets/javascripts/rectangles/util/permissions.js
@@ -15,3 +15,18 @@ Permissions.prototype.toggle = function (key) {
 	})
 	return state
 }
+
+Permissions.prototype.assign = function (key, state) {	
+	var base = this
+	base.keys.forEach(function(op){
+		base[op] = op == key ? state : false
+	})
+	return state
+}
+
+Permissions.prototype.clear = function () {	
+	var base = this
+	base.keys.forEach(function(op){
+		base[op] = false
+	})
+}
diff --git a/public/assets/javascripts/ui/SiteRouter.js b/public/assets/javascripts/ui/_router.js
index 3a6b589..6d41d5b 100644
--- a/public/assets/javascripts/ui/SiteRouter.js
+++ b/public/assets/javascripts/ui/_router.js
@@ -91,8 +91,14 @@ var SiteRouter = Router.extend({
 		app.mode.editor = true
 		app.launch()
 
-		this.editorView = new EditorView()
-		this.editorView.load(name)
+		if ($(".aboutRoom").length) {
+			this.readerView = new ReaderView()
+			this.readerView.load(name)
+		}
+		else {
+			this.editorView = new EditorView()
+			this.editorView.load(name)
+		}
 	},
 
 	
diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js
index c3589db..210ef6c 100644
--- a/public/assets/javascripts/ui/editor/EditorToolbar.js
+++ b/public/assets/javascripts/ui/editor/EditorToolbar.js
@@ -29,21 +29,46 @@ var EditorToolbar = View.extend({
 	openMediaViewer: function(){
 		this.parent.mediaViewer.show()
 		this.parent.mediaUpload.show()
+		this.resetMode()
 	},
 	
-	resizeMedia: function(e){
-		var state = editor.permissions.toggle("resize")
+	resetMode: function(){
+		this.resizeMedia(false)
+		this.destroyMedia(false)
+	},
+	
+	resetControls: function(){
+		this.parent.wallpaperPicker.hide()
+		this.parent.lightControl.hide()
+	},
+	
+	resizeMedia: function(e, state){
+		if (! state && typeof e == "boolean") {
+			state = e
+			editor.permissions.assign("resize", state)
+		}
+		else {
+			state = editor.permissions.toggle("resize")
+		}
+		! state && editor.permissions.assign("move", true)
 		$(".inuse").removeClass("inuse")
-		$(e.currentTarget).toggleClass("inuse", state)
+		$("[data-role='resize-media']").toggleClass("inuse", state)
 		if (state) {
 			Scenery.resize.hide()
 		}
 	},
 	
-	destroyMedia: function(e){
-		var state = editor.permissions.toggle("destroy")
+	destroyMedia: function(e, state){
+		if (! state && typeof e == "boolean") {
+			state = e
+			editor.permissions.assign("destroy", state)
+		}
+		else {
+			state = editor.permissions.toggle("destroy")
+		}
+		! state && editor.permissions.assign("move", true)
 		$(".inuse").removeClass("inuse")
-		$(e.currentTarget).toggleClass("inuse", state)
+		$("[data-role='destroy-media']").toggleClass("inuse", state)
 		$("body").toggleClass("destroyActive", state)
 	},
 	
@@ -62,6 +87,7 @@ var EditorToolbar = View.extend({
 
 var editor = new function(){
 	this.permissions = new Permissions({
+		'move': true,
 		'resize': false,
 		'destroy': false,
 	})
diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js
new file mode 100644
index 0000000..001d097
--- /dev/null
+++ b/public/assets/javascripts/ui/reader/ReaderView.js
@@ -0,0 +1,28 @@
+
+var ReaderView = View.extend({
+	el: "#readerView",
+	
+	projectAction: "/api/projects/",
+
+	events: {
+	},
+	
+	initialize: function(){
+	},
+
+	load: function(name){
+		name = sanitize(name)
+		$.get(this.projectAction + name, $.proxy(this.ready, this))
+	},
+	
+	ready: function(data){
+		$("#map").hide()
+
+		data.rooms && Rooms.deserialize(data.rooms)
+		data.media && Scenery.deserialize(data.media)
+		data.startPosition && scene.camera.move(data.startPosition)
+		
+		editor.permissions.clear()
+	}
+
+})
diff --git a/public/assets/javascripts/util.js b/public/assets/javascripts/util.js
index ebb1919..b58da1f 100644
--- a/public/assets/javascripts/util.js
+++ b/public/assets/javascripts/util.js
@@ -1,13 +1,14 @@
 if (window.$) {
-  $.fn.int = function(){ return parseInt($(this).val(),10) }
-  $.fn.float = function(){ return parseFloat($(this).val()) }
-  $.fn.string = function(){ return trim($(this).val()) }
+  $.fn.int = function() { return parseInt($(this).val(),10) }
+  $.fn.float = function() { return parseFloat($(this).val()) }
+  $.fn.string = function() { return trim($(this).val()) }
   $.fn.enable = function() { return $(this).attr("disabled",null) }
   $.fn.disable = function() { return $(this).attr("disabled","disabled") }
+  $.fn.htmlSafe = function(s) { return $(this).html(sanitize(s)) }
 }
 
 function trim(s){ return s.replace(/^\s+/,"").replace(/\s+$/,"") }
-function sanitize (s){ return (s || "").replace(new RegExp("[<>&\"\']", 'g'), "") }
+function sanitize (s){ return (s || "").replace(new RegExp("[<>&]", 'g'), "") }
 function capitalize (s){ return s.split(" ").map(capitalizeWord).join(" ") }
 function capitalizeWord (s){ return s.charAt(0).toUpperCase() + s.slice(1) }
 function slugify (s){ return (s || "").toLowerCase().replace(/\s/g,"-").replace(/[^-_a-zA-Z0-9]/g, '-').replace(/-+/g,"-") }