From 220320494c60c154e84c579f86d2dfdd8f41be2f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 3 Feb 2015 17:41:36 -0500 Subject: orthographic polyline --- public/assets/javascripts/rectangles/models/vec2.js | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 14d0e6b..290e45e 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -80,6 +80,11 @@ this.a = Math.round(this.a) this.b = Math.round(this.b) } + vec2.prototype.distanceTo = function(v){ + var va = (this.a - v.a) + var vb = (this.b - v.b) + return Math.sqrt( va*va + vb*vb ) + } vec2.prototype.setPosition = function(n){ var len = this.length() this.a = n -- cgit v1.2.3-70-g09d2 From b38b008981ee88c58cfff5c2e2e7820046dde415 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 30 Mar 2015 17:35:30 -0400 Subject: store rotation on wall object --- public/assets/javascripts/rectangles/engine/scenery/move.js | 5 +++-- public/assets/javascripts/rectangles/engine/scenery/resize.js | 2 +- public/assets/javascripts/rectangles/engine/scenery/types/_object.js | 4 ++-- public/assets/javascripts/rectangles/models/wall.js | 5 +++-- 4 files changed, 9 insertions(+), 7 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js index f57ddba..0d26582 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/move.js +++ b/public/assets/javascripts/rectangles/engine/scenery/move.js @@ -75,13 +75,14 @@ Scenery.move = function(base){ switch (base.wall.side) { case FRONT: case BACK: - base.mx.x = position.a + delta.a * cos(wall_rotation[base.wall.side]) + dimension.a / 2 + base.mx.x = position.a + delta.a * cos(base.wall.rotationY) + dimension.a / 2 break case LEFT: case RIGHT: - base.mx.z = position.a + delta.a * sin(wall_rotation[base.wall.side]) + dimension.a / 2 + base.mx.z = position.a + delta.a * sin(base.wall.rotationY) + dimension.a / 2 break } + console.log( sin(base.wall.rotationY), cos(base.wall.rotationY) ) if (editor.permissions.resize) { Scenery.resize.move_dots() } diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index 5af7f3f..73fd82a 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -49,7 +49,7 @@ Scenery.resize = new function(){ // rotate the dots as appropriate base.rotate_dots = function(){ - rotationY = wall_rotation[obj.wall.side] + rotationY = obj.wall.rotationY dots.forEach(function(dot){ dot.rotationY = rotationY }) diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js index cd3f981..e3b9b4d 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js @@ -90,11 +90,11 @@ Scenery.types.base = Fiber.extend(function(base){ switch (this.wall.side) { case FRONT: case BACK: - this.position.a += delta.a * cos(wall_rotation[this.wall.side]) + this.position.a += delta.a * cos(this.wall.rotationY) break case LEFT: case RIGHT: - this.position.a += delta.a * sin(wall_rotation[this.wall.side]) + this.position.a += delta.a * sin(this.wall.rotationY) break } }, diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index a026c3c..13f5cd7 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -18,6 +18,7 @@ this.edge = opt.edge this.side = opt.side this.surface = opt.surface + this.rotationY = ('rotationY' in opt) ? opt.rotationY : wall_rotation[opt.side] this.mx = opt.mx this.background = { src: "none" } } @@ -89,7 +90,7 @@ mx_dot.move(mx_pos) mx_dot.width = 5 mx_dot.height = 5 - mx_dot.rotationY = wall_rotation[base.side] + mx_dot.rotationY = base.rotationY mx_dot.el.style.backgroundColor = "red" scene.add(mx_dot) } @@ -236,7 +237,7 @@ x: x, y: position.b + dimension.b / 2, z: z, - rotationY: wall_rotation[ this.side ], + rotationY: this.rotationY, } } Wall.prototype.mxToPosition = function(mx, dimension) { -- cgit v1.2.3-70-g09d2 From 39f1a7136567ae7e0afbf085732853cc86123393 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 1 Apr 2015 19:30:22 -0400 Subject: stub in 3d object ui --- .../javascripts/rectangles/engine/scenery/undo.js | 65 ++++++++++++++ .../rectangles/engine/sculpture/_sculpture.js | 94 +++++++++++++++++++++ .../rectangles/engine/sculpture/types/image.js | 98 ++++++++++++++++++++++ .../assets/javascripts/rectangles/models/floor.js | 8 +- views/controls/editor/sculpture.ejs | 42 ++++++++++ views/editor.ejs | 1 + views/partials/scripts.ejs | 3 + 7 files changed, 309 insertions(+), 2 deletions(-) create mode 100644 public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js create mode 100644 public/assets/javascripts/rectangles/engine/sculpture/types/image.js create mode 100644 views/controls/editor/sculpture.ejs (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/scenery/undo.js b/public/assets/javascripts/rectangles/engine/scenery/undo.js index 1232780..b976ea2 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/undo.js +++ b/public/assets/javascripts/rectangles/engine/scenery/undo.js @@ -195,5 +195,70 @@ }, }, + // + { + type: "create-sculpture", + undo: function(state){ + Sculpture.remove(state.id) + Sculpture.resize.hide() + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + redo: function(state){ + var scenery = Sculpture.deserialize([ state ]) + Sculpture.resize.show( sculpture ) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + }, + { + type: "update-sculpture", + undo: function(state){ + var sculpture = Sculpture.find(state.id) + + sculpture.deserialize(state) + + if (editor.permissions.resize) { + Sculpture.resize.show(sculpture) + } + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + redo: function(state){ + var sculpture = Sculpture.find(state.id) + + sculpture.deserialize(state) + + if (editor.permissions.resize) { + Sculpture.resize.show(sculpture) + Sculpture.resize.move_dots() + Sculpture.resize.rotate_dots() + } + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + }, + { + type: "destroy-sculpture", + undo: function(state){ + var sculpture = Sculpture.deserialize([ state ]) + Sculpture.resize.show( sculpture ) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + redo: function(state){ + Sculpture.resize.hide() + Sculpture.remove(state.id) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + }, + }, + ]) })() diff --git a/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js new file mode 100644 index 0000000..eb64e92 --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js @@ -0,0 +1,94 @@ + +var Sculpture = new function(){ + + var base = this; + + base.list = {} + base.nextMedia = null + + base.mouse = new mouse ({ use_offset: false, mousedownUsesCapture: true }) + + base.init = function(){ + } + + base.add = function(opt){ + var scene_media + switch (opt.media.type) { + case 'image': + scene_media = new Sculpture.types.image (opt) + break + } + base.list[scene_media.id] = scene_media + return scene_media + } + + base.addNextToWall = function(opt){ + opt.newMedia = true + opt.media = base.nextMedia + opt.index = opt.index || 0 + var scene_media = base.add(opt) + + // test if scenery was placed here + if (! scene_media) { + return null + } + else { + base.nextMedia = null + return scene_media + } + } + + base.find = function(id){ + return base.list[id] || null + } + + base.remove = function(id){ + var scene_media = base.list[id] + delete base.list[id] + scene_media && scene_media.destroy() + } + + base.removeAll = function(){ + base.forEach(function(scene_media){ + base.remove(scene_media.id) + }) + } + + base.uid = new UidGenerator(base.list) + + base.forEach = function(f){ + return base.values().forEach(f) + } + + base.map = function(f){ + return base.values().map(f) + } + + base.values = function(){ + return _.values(base.list) + } + + base.serialize = function(){ + var sculptures = base.map(function(sculpture){ + return sculpture.serialize() + }) + return sculptures + } + + base.deserialize = function(sculpture_data){ + var added = [] + sculpture_data.forEach(function(data){ + var scene_media = base.add({ + id: data.id, + data: data, + media: data.media, + }) + added.push(scene_media) + }) + return added + } + + return base +} + +Sculpture.types = {} diff --git a/public/assets/javascripts/rectangles/engine/sculpture/types/image.js b/public/assets/javascripts/rectangles/engine/sculpture/types/image.js new file mode 100644 index 0000000..af538f7 --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/sculpture/types/image.js @@ -0,0 +1,98 @@ +Scenery.types.base = Fiber.extend(function(base){ + + var exports = { + + init: function(opt){ + _.bindAll(this, 'enter', 'leave') + + this.id = opt.id || Scenery.uid("scenery") + this.move = new Scenery.move (this) + this.media = opt.media + this.naturalDimensions = new vec2(this.media.width, this.media.height) + + this.set_scale( opt.scale || this.media.scale || 1.0 ) + this.position = new vec2(0,0) + }, + + set_scale: function(scale){ + this.scale = scale || 1.0 + if (this.mx) { + this.mx.scale = this.mx.ops.scale = this.scale + } + this.dimensions = this.naturalDimensions.clone().mul(this.scale) + }, + + bind: function(){ + this.move.bind() +// $(this.mx.el).bind({ +// mouseenter: this.enter, +// mouseleave: this.leave, +// }) + }, + + unbind: function(){ + this.move.unbind() +// $(this.mx.el).unbind({ +// mouseenter: this.enter, +// mouseleave: this.leave, +// }) + }, + + remove: function(){ + if (this.removed) return + this.removed = true + + UndoStack.push({ + type: 'destroy-sculpture', + undo: this.serialize(), + redo: { id: this.id }, + }) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + + Scenery.remove(this.id) + + Scenery.resize.hide() + if (app.controller.mediaEditor) { + app.controller.mediaEditor.tainted = false + app.controller.mediaEditor.hide() + } + if (app.controller.textEditor) { + app.controller.textEditor.tainted = false + app.controller.textEditor.hide() + } + }, + + destroy: function(){ + this.unbind() + scene.remove(this.mx) + this.mx.media = null + this.mx.ops = null + this.mx = null + this.move = null + this.media = null + this.dimensions = null + this.naturalDimensions = null + this.wall = null + this.bounds = null + this.center = null + }, + + serialize: function(){ + var data = { + id: this.id, + wall_id: this.wall && this.wall.id, + side: this.wall && this.wall.side, + dimensions: this.dimensions.serialize(), + position: app.position(this.mx), + scale: this.scale, + media: this.media, + } + return data + }, + } + + return exports + +}) diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index ac1f8c9..439c16a 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -68,8 +68,12 @@ } return } - - if (Scenery.nextWallpaper) { + + if (Scenery.nextMedia) { + e.preventDefault() + // + } + else if (Scenery.nextWallpaper) { var oldState = base.serialize() base.wallpaper(Scenery.nextWallpaper) // Scenery.nextWallpaper = null diff --git a/views/controls/editor/sculpture.ejs b/views/controls/editor/sculpture.ejs new file mode 100644 index 0000000..21e5039 --- /dev/null +++ b/views/controls/editor/sculpture.ejs @@ -0,0 +1,42 @@ +
+

3D Object

+ + + + +
+ +
+ +
+ +
+ +
+ + + +
+ +
+ + +
+ +
+ + +
+
+ + +
+
+ + +
+
+ remove object +
+ +
diff --git a/views/editor.ejs b/views/editor.ejs index 74e4d6d..08959a0 100755 --- a/views/editor.ejs +++ b/views/editor.ejs @@ -16,6 +16,7 @@ [[ include controls/builder/info ]] [[ include controls/editor/media-drawer ]] [[ include controls/editor/media-editor ]] + [[ include controls/editor/sculpture ]] [[ include controls/editor/wallpaper ]] [[ include controls/editor/color-control ]] [[ include controls/editor/text-editor ]] diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 72aaa8c..6cc5315 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -73,6 +73,9 @@ + + + -- cgit v1.2.3-70-g09d2 From f9112718b560d4cc8380dd905d6cb60c497230bb Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 1 Apr 2015 21:42:40 -0400 Subject: get x/z position when clicking floor --- .../assets/javascripts/rectangles/models/floor.js | 36 ++++++++++++++++++++-- 1 file changed, 34 insertions(+), 2 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index 439c16a..7b020a9 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -69,9 +69,41 @@ return } + + var offset = offsetFromPoint(e, mx.el) + if (! offset) { return } + + var x = mx.x + mx.width * (offset.left-0.5) + var z = mx.z + mx.height * (0.5-offset.top) + if (Scenery.nextMedia) { e.preventDefault() - // + + var sculpture = Sculpture.addNextToWall({ + index: index, + position: pos, + }) + + // scenery was not placed + if (! sculpture) { + e.stopPropagation() + return + } + + app.controller.toolbar.resetPermissions() + Sculpture.resize.show(sculpture) + Sculpture.hovering = true + + // app.controller.pick(sculpture) + + UndoStack.push({ + type: 'create-sculpture', + undo: { id: sculpture.id }, + redo: sculpture.serialize(), + }) + + // TODO: watch individual sculpture object here + Minotaur.watch( app.router.editorView.settings ) } else if (Scenery.nextWallpaper) { var oldState = base.serialize() @@ -102,7 +134,7 @@ this.mx.reverse() } } - + Floor.prototype.color = function(color){ this.$els.css("background-color", color) } -- cgit v1.2.3-70-g09d2 From c6eea0f4887ba14e5a6ecfff8c9e8480ae6421c1 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Apr 2015 17:05:31 -0400 Subject: placing objects on the floor --- .../rectangles/engine/sculpture/_sculpture.js | 24 +++-- .../rectangles/engine/sculpture/types/_object.js | 91 +++++++++++++++++ .../rectangles/engine/sculpture/types/image.js | 110 ++++++--------------- .../assets/javascripts/rectangles/models/floor.js | 7 +- .../assets/javascripts/rectangles/models/vec3.js | 9 ++ .../assets/javascripts/ui/editor/EditorSettings.js | 3 + server/lib/schemas/Project.js | 1 + views/partials/scripts.ejs | 1 + 8 files changed, 149 insertions(+), 97 deletions(-) create mode 100644 public/assets/javascripts/rectangles/engine/sculpture/types/_object.js (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js index eb64e92..c8c90d3 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js @@ -4,7 +4,6 @@ var Sculpture = new function(){ var base = this; base.list = {} - base.nextMedia = null base.mouse = new mouse ({ use_offset: false, mousedownUsesCapture: true }) @@ -12,29 +11,28 @@ var Sculpture = new function(){ } base.add = function(opt){ - var scene_media + var sculpture switch (opt.media.type) { case 'image': - scene_media = new Sculpture.types.image (opt) + sculpture = new Sculpture.types.image (opt) break } - base.list[scene_media.id] = scene_media - return scene_media + base.list[sculpture.id] = sculpture + return sculpture } - base.addNextToWall = function(opt){ + base.addNext = function(opt){ opt.newMedia = true - opt.media = base.nextMedia - opt.index = opt.index || 0 - var scene_media = base.add(opt) + opt.media = Scenery.nextMedia + var sculpture = base.add(opt) - // test if scenery was placed here - if (! scene_media) { + // test if sculpture was placed here + if (! sculpture) { return null } else { - base.nextMedia = null - return scene_media + Scenery.nextMedia = null + return sculpture } } diff --git a/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js new file mode 100644 index 0000000..fa6b0b1 --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js @@ -0,0 +1,91 @@ +Sculpture.types.base = Fiber.extend(function(base){ + + var exports = { + + init: function(opt){ + this.id = opt.id || Sculpture.uid("sculpture") + // this.move = new Sculpture.move (this) + this.media = opt.media + this.naturalDimensions = new vec2(this.media.width, this.media.height) + + this.set_scale( opt.scale || this.media.scale || 1.0 ) + this.position = new vec2(0,0) + }, + + set_scale: function(scale){ + this.scale = scale || 1.0 + if (this.mx) { + this.mx.scale = this.mx.ops.scale = this.scale + } + this.dimensions = this.naturalDimensions.clone().mul(this.scale) + }, + + place: function(opt){ + if (opt.data) { + this.deserialize(opt.data) + } + else { + this.mx.move(opt.position) + } + }, + + bind: function(){ + // this.move.bind() + }, + + unbind: function(){ + // this.move.unbind() + }, + + remove: function(){ + if (this.removed) return + this.removed = true + + UndoStack.push({ + type: 'destroy-sculpture', + undo: this.serialize(), + redo: { id: this.id }, + }) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + + Sculpture.remove(this.id) + + // Sculpture.resize.hide() + if (app.controller.sculptureEditor) { + app.controller.sculptureEditor.tainted = false + app.controller.sculptureEditor.hide() + } + }, + + destroy: function(){ + this.unbind() + scene.remove(this.mx) + this.mx.media = null + this.mx.ops = null + this.mx = null + this.move = null + this.media = null + this.dimensions = null + this.naturalDimensions = null + this.wall = null + this.bounds = null + this.center = null + }, + + serialize: function(){ + var data = { + id: this.id, + dimensions: this.dimensions.serialize(), + position: app.position(this.mx), + scale: this.scale, + media: this.media, + } + return data + }, + } + + return exports + +}) diff --git a/public/assets/javascripts/rectangles/engine/sculpture/types/image.js b/public/assets/javascripts/rectangles/engine/sculpture/types/image.js index af538f7..ae62133 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/types/image.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/types/image.js @@ -1,98 +1,48 @@ -Scenery.types.base = Fiber.extend(function(base){ - var exports = { +Sculpture.types.image = Sculpture.types.base.extend(function(base){ + var exports = { + + type: 'image', + init: function(opt){ - _.bindAll(this, 'enter', 'leave') - this.id = opt.id || Scenery.uid("scenery") - this.move = new Scenery.move (this) - this.media = opt.media - this.naturalDimensions = new vec2(this.media.width, this.media.height) - - this.set_scale( opt.scale || this.media.scale || 1.0 ) - this.position = new vec2(0,0) - }, + opt.scale = opt.scale || (opt.data && opt.data.scale) || DEFAULT_PICTURE_WIDTH / max(DEFAULT_PICTURE_WIDTH, opt.media.width) - set_scale: function(scale){ - this.scale = scale || 1.0 - if (this.mx) { - this.mx.scale = this.mx.ops.scale = this.scale - } - this.dimensions = this.naturalDimensions.clone().mul(this.scale) - }, - - bind: function(){ - this.move.bind() -// $(this.mx.el).bind({ -// mouseenter: this.enter, -// mouseleave: this.leave, -// }) - }, - - unbind: function(){ - this.move.unbind() -// $(this.mx.el).unbind({ -// mouseenter: this.enter, -// mouseleave: this.leave, -// }) - }, - - remove: function(){ - if (this.removed) return - this.removed = true - - UndoStack.push({ - type: 'destroy-sculpture', - undo: this.serialize(), - redo: { id: this.id }, - }) + base.init.call(this, opt) - // TODO: watch individual scenery object here - Minotaur.watch( app.router.editorView.settings ) + this.build(opt) + this.bind() + this.place(opt) + }, - Scenery.remove(this.id) + build: function(opt){ + this.footprint = new MX.Object3D() + this.mx = new MX.Image({ + src: this.media.url, + scale: this.scale, + media: this.media, + backface: true, + }) - Scenery.resize.hide() - if (app.controller.mediaEditor) { - app.controller.mediaEditor.tainted = false - app.controller.mediaEditor.hide() - } - if (app.controller.textEditor) { - app.controller.textEditor.tainted = false - app.controller.textEditor.hide() - } - }, + opt.position.y = opt.position.y || this.scale * this.media.height/2, + opt.position.rotationY = opt.position.rotationY || scene.camera.rotationY, - destroy: function(){ - this.unbind() - scene.remove(this.mx) - this.mx.media = null - this.mx.ops = null - this.mx = null - this.move = null - this.media = null - this.dimensions = null - this.naturalDimensions = null - this.wall = null - this.bounds = null - this.center = null + scene.add( this.mx ) }, serialize: function(){ - var data = { - id: this.id, - wall_id: this.wall && this.wall.id, - side: this.wall && this.wall.side, - dimensions: this.dimensions.serialize(), - position: app.position(this.mx), - scale: this.scale, - media: this.media, - } + var data = base.serialize.call(this) return data }, + + deserialize: function(data){ + this.mx.move(data.position) + this.mx.ops.width = data.dimensions.a + this.mx.ops.height = data.dimensions.b + this.dimensions.deserialize(data.dimensions) + }, } return exports - }) diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index 7b020a9..530de2b 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -79,9 +79,8 @@ if (Scenery.nextMedia) { e.preventDefault() - var sculpture = Sculpture.addNextToWall({ - index: index, - position: pos, + var sculpture = Sculpture.addNext({ + position: { x: x, y: 0, z: z }, }) // scenery was not placed @@ -91,7 +90,7 @@ } app.controller.toolbar.resetPermissions() - Sculpture.resize.show(sculpture) + // Sculpture.resize.show(sculpture) Sculpture.hovering = true // app.controller.pick(sculpture) diff --git a/public/assets/javascripts/rectangles/models/vec3.js b/public/assets/javascripts/rectangles/models/vec3.js index c44dfe6..97329ed 100644 --- a/public/assets/javascripts/rectangles/models/vec3.js +++ b/public/assets/javascripts/rectangles/models/vec3.js @@ -32,3 +32,12 @@ vec3.prototype.apply_projection = function (m) { return this; } + +vec3.prototype.serialize = function(){ + return [ round(this.a), round(this.b), round(this.c) ] +} +vec3.prototype.deserialize = function(data){ + this.a = data[0] + this.b = data[1] + this.c = data[2] +} \ No newline at end of file diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index b319404..460863e 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -77,6 +77,7 @@ var EditorSettings = FormView.extend({ data.privacy && this.$privacy.find("[value=" + data.privacy + "]").prop("checked", "checked") data.media && Scenery.deserialize(data.media) + data.sculpture && Sculpture.deserialize(data.sculpture) } }, @@ -112,6 +113,7 @@ var EditorSettings = FormView.extend({ clear: function(e){ e.preventDefault() Scenery.removeAll() + Sculpture.removeAll() }, destroy: function(){ @@ -191,6 +193,7 @@ var EditorSettings = FormView.extend({ fd.append( "walls", JSON.stringify( Walls.serialize() ) ) fd.append( "colors", JSON.stringify( Walls.colors ) ) fd.append( "media", JSON.stringify( Scenery.serialize() ) ) + fd.append( "sculpture", JSON.stringify( Sculpture.serialize() ) ) fd.append( "startPosition", JSON.stringify( this.startPosition || false ) ) fd.append( "lastPosition", JSON.stringify( app.position(scene.camera) ) ) diff --git a/server/lib/schemas/Project.js b/server/lib/schemas/Project.js index a923d85..e9501fc 100644 --- a/server/lib/schemas/Project.js +++ b/server/lib/schemas/Project.js @@ -30,6 +30,7 @@ var ProjectSchema = new mongoose.Schema({ rooms: [mongoose.Schema.Types.Mixed], walls: [mongoose.Schema.Types.Mixed], media: [mongoose.Schema.Types.Mixed], + sculpture: [mongoose.Schema.Types.Mixed], colors: mongoose.Schema.Types.Mixed, startPosition: mongoose.Schema.Types.Mixed, lastPosition: mongoose.Schema.Types.Mixed, diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 6cc5315..ca6cc94 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -74,6 +74,7 @@ + -- cgit v1.2.3-70-g09d2 From 0b8b54e26aa7a40065a0be6f7708b7021e4fec13 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 20 Apr 2015 15:03:35 -0400 Subject: resize scenery --- Gruntfile.js | 1 + .../rectangles/engine/scenery/resize.js | 1 + .../rectangles/engine/sculpture/_sculpture.js | 4 + .../rectangles/engine/sculpture/move.js | 6 +- .../rectangles/engine/sculpture/resize.js | 207 +++++++++++++++++++++ .../rectangles/engine/sculpture/types/_object.js | 2 +- .../assets/javascripts/rectangles/models/floor.js | 2 +- public/assets/javascripts/ui/editor/EditorView.js | 1 + .../javascripts/ui/editor/SculptureEditor.js | 3 +- views/partials/scripts.ejs | 1 + 10 files changed, 221 insertions(+), 7 deletions(-) create mode 100644 public/assets/javascripts/rectangles/engine/sculpture/resize.js (limited to 'public/assets/javascripts/rectangles/models') diff --git a/Gruntfile.js b/Gruntfile.js index 026ec6f..789ce6f 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -79,6 +79,7 @@ module.exports = function(grunt) { "public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js", "public/assets/javascripts/rectangles/engine/sculpture/move.js", + "public/assets/javascripts/rectangles/engine/sculpture/resize.js", "public/assets/javascripts/rectangles/engine/sculpture/types/_object.js", "public/assets/javascripts/rectangles/engine/sculpture/types/image.js", diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index 006ff2a..8dac140 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -8,6 +8,7 @@ Scenery.resize = new function(){ var dragging = false var naturalDimension, naturalDimensionCopy, dimension, position, scale var oldState + var rotationY var dots = [], dot, selected_dot diff --git a/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js index 1543def..888b925 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/_sculpture.js @@ -9,6 +9,7 @@ var Sculpture = new function(){ base.init = function(){ app.on("move", base.updateBillboards) + base.resize.init() } base.updateBillboards = function(){ @@ -17,6 +18,9 @@ var Sculpture = new function(){ sculpture.mx.rotationY = cam.rotationY } }) + if (Sculpture.resize.obj && Sculpture.resize.obj.billboard) { + Sculpture.resize.move_dots() + } } base.add = function(opt){ diff --git a/public/assets/javascripts/rectangles/engine/sculpture/move.js b/public/assets/javascripts/rectangles/engine/sculpture/move.js index 28d707e..f968bcf 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/move.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/move.js @@ -66,9 +66,9 @@ Sculpture.move = function(base){ base.mx.x = x + delta.a * cos(cam.rotationY) - delta.b * sin(cam.rotationY) base.mx.z = z + delta.a * sin(cam.rotationY) + delta.b * cos(cam.rotationY) -// if (editor.permissions.resize) { -// Sculpture.resize.move_dots() -// } + if (editor.permissions.resize) { + Sculpture.resize.move_dots() + } } function up (e, cursor){ diff --git a/public/assets/javascripts/rectangles/engine/sculpture/resize.js b/public/assets/javascripts/rectangles/engine/sculpture/resize.js new file mode 100644 index 0000000..53b8b2d --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/sculpture/resize.js @@ -0,0 +1,207 @@ +Sculpture.resize = new function(){ + + var base = this + + var obj + var x, y, z, bounds + var dragging = false + var naturalDimension, naturalDimensionCopy, dimension, position, scale + var oldState + var rotationY + + var dots = [], dot, selected_dot + + base.init = function(){ + base.build() + base.bind() + } + + // create 9 dots at the corners of the div + base.build = function(){ + [ TOP, + TOP_RIGHT, + RIGHT, + BOTTOM_RIGHT, + BOTTOM, + BOTTOM_LEFT, + LEFT, + TOP_LEFT ].forEach(base.build_dot) + } + + // generate a dot element + base.build_dot = function(side) { + var dot = new MX.Object3D('.dot') + dot.width = dot.height = dot_side * 2 + dot.scale = 0.5 + dot.side = side + $(dot.el).on({ + mouseenter: function(){ base.hovering = true }, + mouseleave: function(){ base.hovering = false }, + }) + dots.push(dot) + } + + base.add_dots = function(){ + dots.forEach(function(dot){ + scene.add(dot) + }) + } + + // move all the dots to the object's current position + base.move_dots = function(){ + rotationY = obj.mx.rotationY + + var x = obj.mx.x + sin(rotationY) * dot_distance_from_picture + var y = obj.mx.y + var z = obj.mx.z - cos(rotationY) * dot_distance_from_picture + + dots.forEach(function(dot){ + base.move_dot(dot, { x: x, y: y, z: z, rotationY: rotationY }) + }) + } + + // move a dot .. to the initial position of the image + base.move_dot = function(dot, pos){ + if (dot.side & TOP) { + pos.y += obj.dimensions.b / 2 + } + if (dot.side & BOTTOM) { + pos.y -= obj.dimensions.b / 2 + } + if (dot.side & LEFT) { + pos.x -= cos(rotationY) * (obj.dimensions.a) / 2 + pos.z -= sin(rotationY) * (obj.dimensions.a) / 2 + } + if (dot.side & RIGHT) { + pos.x += cos(rotationY) * (obj.dimensions.a) / 2 + pos.z += sin(rotationY) * (obj.dimensions.a) / 2 + } + dot.move(pos) + } + + // pick a new object to focus on and show the dots + base.show = function(new_object) { + // if (obj === new_object) return + if (! new_object) return + base.obj = obj = new_object + base.add_dots() + base.move_dots() + } + + // dismiss the dots on blur + var dotsHideTimeout; + base.defer_hide = function(){ + clearTimeout(dotsHideTimeout) + + dotsHideTimeout = setTimeout(function(){ + if (Scenery.hovering || Scenery.resize.hovering || Scenery.mouse.down) return + Scenery.resize.hide() + }, dot_hide_delay) + } + + base.hide = function () { + if (! obj) return + base.obj = obj = null + dots.forEach(function(dot){ + scene.remove(dot) + }) + } + + base.bind = function(){ + dots.forEach(function(dot){ + Sculpture.mouse.bind_el(dot.el) + }) + Sculpture.mouse.on("down", down) + Sculpture.mouse.on("drag", drag) + Sculpture.mouse.on("up", up) + } + + base.unbind = function(){ + dots.forEach(function(dot){ + Sculpture.mouse.unbind_el(dot.el) + }) + Sculpture.mouse.off("down", down) + Sculpture.mouse.off("drag", drag) + Sculpture.mouse.off("up", up) + } + + function down (e, cursor){ + var selection = dots.filter(function(dot){return e.target == dot.el}) + if (! selection.length) return + + selected_dot = selection[0] + dragging = true + + naturalDimension = obj.naturalDimensions + dimension = obj.dimensions + position = new vec3(obj.mx.x, obj.mx.y, obj.mx.z) + oldState = obj.serialize() + + if (obj.type == "text") { + naturalDimensionCopy = naturalDimension.clone() + positionCopy = position.clone() + } + + document.body.classList.add("dragging") + } + + function drag (e, cursor){ + if (! dragging) return + + var x_sign = selected_dot.side & LEFT ? -1 : selected_dot.side & RIGHT ? 1 : 0 + var y_sign = selected_dot.side & TOP ? -1 : selected_dot.side & BOTTOM ? 1 : 0 + var width = cursor.x.magnitude() + var height = cursor.y.magnitude() + var mag = cursor.magnitude() + + if (abs(width) > abs(height)) { + mag = x_sign * mag * sign(width) + } + else { + mag = y_sign * mag * sign(height) + } + + if (obj.type == "text") { + obj.mx.width = obj.media.width = naturalDimension.a = naturalDimensionCopy.a + (mag * 2) + obj.mx.height = obj.media.height = naturalDimension.b = naturalDimensionCopy.b + (mag * 2) + dimension.a = naturalDimension.a * obj.scale + dimension.b = naturalDimension.b * obj.scale + } + else { + obj.set_scale( ( dimension.a + mag ) / naturalDimension.a ) + } + + if (selected_dot.side & LEFT_RIGHT) { + obj.mx.x = position.a + cos(rotationY) * mag/2 * (x_sign) + obj.mx.z = position.c + sin(rotationY) * mag/2 * (x_sign) + } + if (selected_dot.side & TOP_BOTTOM) { + obj.mx.y = position.b - mag/2 * y_sign + } + + base.move_dots() + + app.controller.sculptureEditor.setDimensions() + } + + function up (e, cursor){ + if (! dragging) return + dragging = false + if (! editor.permissions.resize) { return } + + obj.scale = obj.mx.ops.scale = obj.mx.scale + obj.dimensions.assign(obj.naturalDimensions).mul(obj.scale) + + UndoStack.push({ + type: 'update-sculpture', + undo: oldState, + redo: obj.serialize(), + }) + + // TODO: watch individual scenery object here + Minotaur.watch( app.router.editorView.settings ) + + document.body.classList.remove("dragging") + selected_dot = null + } +} \ No newline at end of file diff --git a/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js index b903c5b..390c42e 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js @@ -80,7 +80,7 @@ Sculpture.types.base = Fiber.extend(function(base){ Sculpture.remove(this.id) - // Sculpture.resize.hide() + Sculpture.resize.hide() if (app.controller.sculptureEditor) { app.controller.sculptureEditor.tainted = false app.controller.sculptureEditor.hide() diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index 530de2b..799bdc7 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -90,7 +90,7 @@ } app.controller.toolbar.resetPermissions() - // Sculpture.resize.show(sculpture) + Sculpture.resize.show(sculpture) Sculpture.hovering = true // app.controller.pick(sculpture) diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index a7b4f20..a2d84a6 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -84,6 +84,7 @@ var EditorView = View.extend({ this.mediaEditor.hide() this.textEditor.hide() this.share.hide() + Sculpture.resize.hide() Scenery.resize.hide() Scenery.hovering = false } diff --git a/public/assets/javascripts/ui/editor/SculptureEditor.js b/public/assets/javascripts/ui/editor/SculptureEditor.js index ff1e6b9..35abc00 100644 --- a/public/assets/javascripts/ui/editor/SculptureEditor.js +++ b/public/assets/javascripts/ui/editor/SculptureEditor.js @@ -67,7 +67,7 @@ var SculptureEditor = FormView.extend({ // app.controller.toolbar.resetMode() app.controller.toolbar.resetControls() - // Sculpture.resize.show(sculpture) + Sculpture.resize.show(sculpture) Sculpture.hovering = true var media = sculpture.media @@ -149,7 +149,6 @@ var SculptureEditor = FormView.extend({ this.tainted = true }, - setBillboard: function(){ var checked = this.$billboard.prop('checked') this.sculpture.setBillboard(checked) diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 1eda8bd..6dfe912 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -75,6 +75,7 @@ + -- cgit v1.2.3-70-g09d2 From 53695472cfb20b730d04b2d6a6a16c6d281e9180 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 27 Apr 2015 20:47:41 -0400 Subject: outline box --- .../rectangles/engine/sculpture/move.js | 1 + .../rectangles/engine/sculpture/resize.js | 3 +- .../rectangles/engine/sculpture/types/_object.js | 52 +++++++++++++++++++--- .../assets/javascripts/rectangles/models/vec3.js | 18 +++++++- .../javascripts/rectangles/util/measurement.js | 4 ++ .../javascripts/ui/editor/SculptureEditor.js | 11 +++++ public/assets/stylesheets/app.css | 7 +++ views/controls/editor/sculpture.ejs | 2 +- 8 files changed, 90 insertions(+), 8 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/sculpture/move.js b/public/assets/javascripts/rectangles/engine/sculpture/move.js index e571c3b..0cbeccd 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/move.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/move.js @@ -83,6 +83,7 @@ Sculpture.move = function(base){ if (editor.permissions.resize) { Sculpture.resize.move_dots() + base.updateOutline() } } diff --git a/public/assets/javascripts/rectangles/engine/sculpture/resize.js b/public/assets/javascripts/rectangles/engine/sculpture/resize.js index 53b8b2d..5f21d66 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/resize.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/resize.js @@ -180,7 +180,8 @@ Sculpture.resize = new function(){ } base.move_dots() - + obj.updateOutline() + app.controller.sculptureEditor.setDimensions() } diff --git a/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js index 5dd0aae..2f24ae5 100644 --- a/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js +++ b/public/assets/javascripts/rectangles/engine/sculpture/types/_object.js @@ -6,7 +6,8 @@ Sculpture.types.base = Fiber.extend(function(base){ this.id = opt.id || Sculpture.uid("sculpture") // this.move = new Sculpture.move (this) this.media = opt.media - this.naturalDimensions = new vec2(this.media.width, this.media.height) + this.naturalDimensions = new vec3(this.media.width, this.media.height, this.media.width) + this.dimensions = new vec3(this.media.width, this.media.height, this.media.width) this.move = new Sculpture.move (this) this.billboard = true @@ -14,7 +15,7 @@ Sculpture.types.base = Fiber.extend(function(base){ this.set_scale( opt.scale || this.media.scale || 1.0 ) this.position = new vec2(0,0) - + this.isSculpture = true }, @@ -25,6 +26,11 @@ Sculpture.types.base = Fiber.extend(function(base){ } this.dimensions = this.naturalDimensions.clone().mul(this.scale) }, + set_depth: function(depth){ + console.log(this.dimensions.c, this.naturalDimensions.c, depth) + this.dimensions.c = depth + this.naturalDimensions.c = depth / this.scale + }, place: function(opt){ if (opt.data) { @@ -45,11 +51,16 @@ Sculpture.types.base = Fiber.extend(function(base){ setOutline: function(val){ this.outline = val - // show/hide outline + if (val && ! this.outlineEl) { + this.buildOutline() + } + this.outlineEl.el.style.display = val ? "block" : "none" }, setOutlineColor: function(val){ this.outlineColor = val - // set outline color + if (this.outlineEl) { + this.outlineColor = this.outlineEl.el.style.borderColor = val + } }, setBillboard: function(val){ this.billboard = val @@ -65,6 +76,32 @@ Sculpture.types.base = Fiber.extend(function(base){ } Sculpture.resize.move_dots() }, + + buildOutline: function(){ + this.outlineEl = new MX.Object3D(".mx-outline") + this.outlineEl.width = this.naturalDimensions.a + this.outlineEl.height = this.naturalDimensions.c + this.outlineEl.scale = this.mx.scale + this.outlineEl.rotationX = -PI/2 + this.outlineEl.x = this.mx.x + this.outlineEl.y = sculpture_distance_from_floor + this.outlineEl.z = this.mx.z + this.outlineEl.el.style.borderColor = this.outlineColor || "#000000" + scene.add(this.outlineEl) + }, + updateOutline: function(){ + if (! this.outline) { return } + if (! this.outlineEl) { + this.buildOutline() + } + this.outlineEl.x = this.mx.x + this.outlineEl.y = sculpture_distance_from_floor + this.outlineEl.z = this.mx.z + this.outlineEl.width = this.naturalDimensions.a + this.outlineEl.height = this.naturalDimensions.c + + this.outlineEl.scale = this.mx.scale + }, remove: function(){ if (this.removed) return @@ -112,7 +149,7 @@ Sculpture.types.base = Fiber.extend(function(base){ media: this.media, billboard: this.billboard, outline: this.outline, - outlineColor: this.outlineColor, + outlineColor: this.outlineColor || "#000000", backface: this.backface, } return data @@ -123,9 +160,14 @@ Sculpture.types.base = Fiber.extend(function(base){ this.mx.ops.width = data.dimensions.a this.mx.ops.height = data.dimensions.b this.billboard = data.billboard + this.outline = data.outline + this.outlineColor = data.outlineColor || "#000000" this.backface = data.backface if (! this.backface) this.mx.el.classList.remove("backface-visible") this.dimensions.deserialize(data.dimensions) + if (this.outline) { + this.buildOutline() + } }, } diff --git a/public/assets/javascripts/rectangles/models/vec3.js b/public/assets/javascripts/rectangles/models/vec3.js index 97329ed..b3825a9 100644 --- a/public/assets/javascripts/rectangles/models/vec3.js +++ b/public/assets/javascripts/rectangles/models/vec3.js @@ -39,5 +39,21 @@ vec3.prototype.serialize = function(){ vec3.prototype.deserialize = function(data){ this.a = data[0] this.b = data[1] - this.c = data[2] + this.c = data[2] || data[0] + return this +} +vec3.prototype.clone = function(){ + return new vec3(this.a, this.b, this.c) +} +vec3.prototype.assign = function(v){ + this.a = v.a + this.b = v.b + this.c = v.c + return this +} +vec3.prototype.mul = function(n) { + this.a *= n + this.b *= n + this.c *= n + return this } \ No newline at end of file diff --git a/public/assets/javascripts/rectangles/util/measurement.js b/public/assets/javascripts/rectangles/util/measurement.js index d6a0b35..6346eac 100644 --- a/public/assets/javascripts/rectangles/util/measurement.js +++ b/public/assets/javascripts/rectangles/util/measurement.js @@ -28,6 +28,10 @@ function measurementToString( n ) { case 'ft': ft = floor(n / 36) inch = abs(round((n % 36) / 3)) + if (inch == 12) { + inch = 0 + ft += 1 + } s = ft + "'" if (inch > 0) { s += " " + inch + '"' diff --git a/public/assets/javascripts/ui/editor/SculptureEditor.js b/public/assets/javascripts/ui/editor/SculptureEditor.js index 52663e1..953260c 100644 --- a/public/assets/javascripts/ui/editor/SculptureEditor.js +++ b/public/assets/javascripts/ui/editor/SculptureEditor.js @@ -17,6 +17,7 @@ var SculptureEditor = FormView.extend({ "change [name=mute]": "setMute", "change [name=width]": 'changeWidth', "change [name=height]": 'changeHeight', + "change [name=depth]": 'changeDepth', "change [name=units]": 'changeUnits', "click [data-role=destroy-sculpture]": "destroy", }, @@ -35,6 +36,7 @@ var SculptureEditor = FormView.extend({ // image fields this.$width = this.$("[name=width]") this.$height = this.$("[name=height]") + this.$depth = this.$("[name=depth]") this.$units = this.$("[name=units]") // video fields @@ -168,17 +170,26 @@ var SculptureEditor = FormView.extend({ if (! this.sculpture) return this.$width.unitVal( Number(this.sculpture.naturalDimensions.a * this.sculpture.scale) || "" ) this.$height.unitVal( Number(this.sculpture.naturalDimensions.b * this.sculpture.scale) || "" ) + this.$depth.unitVal( Number(this.sculpture.naturalDimensions.c * this.sculpture.scale) || "" ) this.tainted = true }, changeWidth: function(e){ e.stopPropagation() this.sculpture.set_scale( this.$width.unitVal() / this.sculpture.naturalDimensions.a ) this.setDimensions() + this.sculpture.updateOutline() }, changeHeight: function(e){ e.stopPropagation() this.sculpture.set_scale( this.$height.unitVal() / this.sculpture.naturalDimensions.b ) this.setDimensions() + this.sculpture.updateOutline() + }, + changeDepth: function(e){ + e.stopPropagation() + this.sculpture.set_depth( this.$depth.unitVal() ) + this.$depth.unitVal( Number(this.sculpture.naturalDimensions.c * this.sculpture.scale) || "" ) + this.sculpture.updateOutline() }, changeUnits: function(){ app.units = this.$units.val() diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 6e97500..6adb2a0 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1205,6 +1205,13 @@ form .paidPlan label { float: none; font-size: 16px; margin: 0 10px; } -webkit-box-sizing: content-box; box-sizing: content-box; } +.mx-outline { + border-width: 2px; + border-style: dashed; + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; + box-sizing: content-box; +} .destroyActive .mx-scene, .destroyActive .mx-object3d.image { cursor:url(/assets/img/delete-cursor.png), auto; } diff --git a/views/controls/editor/sculpture.ejs b/views/controls/editor/sculpture.ejs index 4b8535a..dfe917f 100644 --- a/views/controls/editor/sculpture.ejs +++ b/views/controls/editor/sculpture.ejs @@ -33,7 +33,7 @@
- +
remove object -- cgit v1.2.3-70-g09d2 From 9ba29a587bf0722db82e5caf1b1cf4e5596003b6 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 12 Aug 2015 18:38:12 -0400 Subject: functioning blueprint scaler --- .../javascripts/rectangles/engine/map/draw.js | 2 +- .../rectangles/engine/map/tools/line.js | 49 ++++++++++++ .../assets/javascripts/rectangles/models/rect.js | 6 ++ .../javascripts/ui/blueprint/BlueprintScaler.js | 91 ++++++++++++++++++++-- .../javascripts/ui/blueprint/BlueprintView.js | 3 + server/lib/schemas/Layout.js | 1 + views/controls/blueprint/editor.ejs | 4 +- views/partials/scripts.ejs | 1 + 8 files changed, 148 insertions(+), 9 deletions(-) create mode 100644 public/assets/javascripts/rectangles/engine/map/tools/line.js (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js index 11ba3f8..cc2f4d8 100644 --- a/public/assets/javascripts/rectangles/engine/map/draw.js +++ b/public/assets/javascripts/rectangles/engine/map/draw.js @@ -198,7 +198,7 @@ Map.Draw = function(map, opt){ // - function line (x,y,a,b,translation){ + var line = draw.line = function (x,y,a,b,translation){ if (translation) { x += translation.a a += translation.a diff --git a/public/assets/javascripts/rectangles/engine/map/tools/line.js b/public/assets/javascripts/rectangles/engine/map/tools/line.js new file mode 100644 index 0000000..8f409a8 --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/map/tools/line.js @@ -0,0 +1,49 @@ +var LineTool = MapTool.extend(function(base){ + var exports = {} + + var selected_point = null + + var line = exports.line = [] + + var can_drag, dragging + + exports.down = function(e, cursor){ + this.cursor = cursor + switch (line.length) { + case 0: + line[0] = cursor.x_component() + can_drag = true + break + case 1: + line[1] = cursor.x_component() + can_drag = false + break + case 2: + line[0] = cursor.x_component() + line.pop() + can_drag = true + break + } + } + + exports.move = function(e, cursor){ + this.cursor = cursor + } + + exports.drag = function(e, cursor){ + if (dragging) { + line[1].a = cursor.x.b + line[1].b = cursor.y.b + } + else if (can_drag && cursor.magnitude() > 10/map.zoom) { + line[1] = cursor.y_component() + dragging = true + } + } + + exports.up = function(e, cursor){ + can_drag = dragging = false + } + + return exports +}) \ No newline at end of file diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js index c667cf5..92c8c9e 100644 --- a/public/assets/javascripts/rectangles/models/rect.js +++ b/public/assets/javascripts/rectangles/models/rect.js @@ -39,6 +39,12 @@ Rect.prototype.clone = function(){ return new Rect( this.x.clone(), this.y.clone() ) } + Rect.prototype.x_component = function(){ + return new vec2( this.x.a, this.y.a ) + } + Rect.prototype.y_component = function(){ + return new vec2( this.x.b, this.y.b ) + } Rect.prototype.assign = function(r) { this.x.assign(r.x) this.y.assign(r.y) diff --git a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js index a81c89b..addf9a9 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintScaler.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintScaler.js @@ -1,10 +1,13 @@ -var BlueprintScaler = ModalView.extend({ +var BlueprintScaler = ModalFormView.extend({ el: ".blueprintScaler", + method: "/api/media/scale", + events: { "change [name=blueprint-dimensions]": "changeDimensions", "change [name=blueprint-units]": "changeUnits", + "click .uploadNewBlueprint": "showBlueprintUpload", "click #saveBlueprint": "save", }, @@ -12,6 +15,7 @@ var BlueprintScaler = ModalView.extend({ this.$blueprintMap = this.$("#blueprintMap") this.$blueprintDimensionsRapper = this.$("#blueprintDimensions") this.$dimensions = this.$("[name=blueprint-dimensions]") + this.$pixels = this.$("[name=blueprint-pixels]") this.$units = this.$("[name=blueprint-units]") this.$save = this.$("#saveBlueprint") @@ -24,23 +28,40 @@ var BlueprintScaler = ModalView.extend({ zoom_min: -6.2, zoom_max: 1, }) - map.ui.add_tool("arrow", new ArrowTool) - map.ui.add_tool("position", new PositionTool) - map.ui.set_tool("position") + this.lineTool = new LineTool + map.ui.add_tool("line", this.lineTool) + map.ui.set_tool("line") scene = scene || { camera: { x: 0, y: 0, z: 0 } } this.floorplan = new MX.Image () - this.animate() + this.animating = false + }, + + showBlueprintUpload: function(){ + this.parent.blueprintUpload.show() }, pick: function(media){ + this.media = media + + if (!! media.scale) { + this.parent.useFloorplan(media) + } + this.floorplan.load({ media: media, keepImage: true }) + + if (! this.animating) { + this.animating = true + this.animate() + } }, animate: function(t){ requestAnimationFrame(this.animate.bind(this)) + + if (! this.animating) return var dt = t - this.last_t this.last_t = t @@ -53,6 +74,27 @@ var BlueprintScaler = ModalView.extend({ this.map.draw.translate() this.floorplan.draw(this.map.draw.ctx, true) + + this.map.draw.ctx.strokeStyle = "#f00" + this.map.draw.ctx.lineWidth = 2/map.zoom + switch (this.lineTool.line.length) { + case 1: + this.map.draw.line( + this.lineTool.line[0].a, + this.lineTool.line[0].b, + this.lineTool.cursor.x.a, + this.lineTool.cursor.y.a + ) + break + case 2: + this.map.draw.line( + this.lineTool.line[0].a, + this.lineTool.line[0].b, + this.lineTool.line[1].a, + this.lineTool.line[1].b + ) + break + } this.map.draw.coords() @@ -62,10 +104,47 @@ var BlueprintScaler = ModalView.extend({ }, changeDimensions: function(){ + app.units = this.$units.val() + this.$dimensions.unitVal() }, changeUnits: function(){ + app.units = this.$units.val() + this.$dimensions.resetUnitVal() + }, + lineLength: function(){ + if (this.lineTool.line.length !== 2) return 0 + var line = this.lineTool.line + return dist( line[0].a, line[0].b, line[1].a, line[1].b ) + } + + validate: function(){ + var val = this.$dimensions.unitVal() + var errors = [] + if (! this.lineLength()) { + errors.push("no line") + alert("Please click two corners of a wall and then specify how long it is in feet or meters.") + } + else if (val == 0) { + errors.push("no measurement") + alert("Please tell us how long the wall is in feet or meters.") + } + return errors }, - save: function(){ + + showErrors: function(){}, + + serialize: function(){ + var fd = new FormData() + fd.append( "_id", this.media._id) + fd.append( "units", this.$units.val() ) + fd.append( "scale", this.$dimensions.unitVal() / this.lineLength() ) + fd.append( "_csrf", $("[name=_csrf]").val()) + return fd + }, + + success: function(){ + this.animating = false + this.parent.useFloorplan(media) }, }) diff --git a/public/assets/javascripts/ui/blueprint/BlueprintView.js b/public/assets/javascripts/ui/blueprint/BlueprintView.js index a803f12..6b204e5 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintView.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintView.js @@ -33,6 +33,9 @@ var BlueprintView = View.extend({ hideExtras: function(){ }, + + useFloorplan: function(media){ + }, pickWall: function(wall, pos){ }, diff --git a/server/lib/schemas/Layout.js b/server/lib/schemas/Layout.js index cff1d78..e15e188 100644 --- a/server/lib/schemas/Layout.js +++ b/server/lib/schemas/Layout.js @@ -23,6 +23,7 @@ var LayoutSchema = new mongoose.Schema({ photo: { type: String, }, + media: mongoose.Schema.Types.Mixed, rooms: [mongoose.Schema.Types.Mixed], startPosition: mongoose.Schema.Types.Mixed, viewHeight: { type: Number }, diff --git a/views/controls/blueprint/editor.ejs b/views/controls/blueprint/editor.ejs index 308b4c8..3e0c097 100644 --- a/views/controls/blueprint/editor.ejs +++ b/views/controls/blueprint/editor.ejs @@ -99,8 +99,8 @@ body {

- - + + - - + +
diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 8a0e0d5..11e995a 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -34,8 +34,8 @@
diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs index 2a3d4f3..225bdc8 100644 --- a/views/controls/editor/media-editor.ejs +++ b/views/controls/editor/media-editor.ejs @@ -49,8 +49,8 @@
--> diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index bc8dacb..865c0f1 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -108,6 +108,7 @@ + -- cgit v1.2.3-70-g09d2 From 0c1864a114a2efe1a3bb8b2b4951e8655712757a Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 21 Aug 2015 15:19:05 -0400 Subject: dedupe new rooms --- .../javascripts/rectangles/engine/map/draw.js | 4 +- .../rectangles/engine/shapes/regionlist.js | 62 +++++++++++++++++----- .../assets/javascripts/rectangles/models/vec2.js | 3 ++ .../javascripts/ui/blueprint/BlueprintEditor.js | 8 +-- 4 files changed, 58 insertions(+), 19 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js index 5824cc8..f47f10c 100644 --- a/public/assets/javascripts/rectangles/engine/map/draw.js +++ b/public/assets/javascripts/rectangles/engine/map/draw.js @@ -189,7 +189,7 @@ Map.Draw = function(map, opt){ var sides = map.sides() var quant = sides.clone().quantize(MAP_GRID_SIZE) for (var x = quant.x.a - MAP_GRID_SIZE; x <= quant.x.b; x += MAP_GRID_SIZE) { - if (Math.round(x) % 10 == 0) { + if (Math.round(x) % 360 == 0) { ctx.strokeStyle = "rgba(0,0,0,0.3)" ctx.lineWidth = 1/map.zoom } @@ -200,7 +200,7 @@ Map.Draw = function(map, opt){ line(x, sides.y.a, x, sides.y.b) } for (var y = quant.y.a - MAP_GRID_SIZE; y <= quant.y.b; y += MAP_GRID_SIZE) { - if (Math.round(y) % 10 == 0) { + if (Math.round(y) % 360 == 0) { ctx.strokeStyle = "rgba(0,0,0,0.3)" ctx.lineWidth = 1/map.zoom } diff --git a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js index f86968f..93a0df7 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js +++ b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js @@ -6,52 +6,86 @@ var RegionList = (function(){ RegionList.build = function(){ var segments = RegionList.getSortedSegments() -// var xx = t % (segments[0].x.a - segments[segments.length-1].x.b) - - // loop over them from left to right -// console.log(segments.map(function(s){ return s.toString() }).join("\n")) - var rooms = [] + var seen_rooms = {} var open_segments = [] var closed_segments = [] - var segment, open_segment, x_segment, y_segments, overlapped + var segment, open_segment, x_segment, y_segments, overlapped, seen_segments for (var i = 0; i < segments.length; i++) { segment = segments[i] if (! segment.isVertical()) { continue } - console.log(segment+"") overlapped = false for (var j = 0; j < open_segments.length; j++) { open_segment = open_segments[j] if (segment.y.overlaps(open_segment.y)) { - // if we have overlap, it means we have made a full room - console.log(segment.y+"", "overlaps", open_segment.y+"") overlapped = true closed_segments.push(open_segments[j]) open_segments.splice(j--, 1) x_segment = new vec2( open_segment.x.a, segment.x.b ) y_segments = open_segment.y.split(segment.y, TOP, BOTTOM) - console.log(y_segments.map(function(s){ return s+"" }).join("\n")) + + seen_segments = {} + y_segments.forEach(function(seg){ - rooms.push(new Rect( x_segment, seg[0] )) + seen_segments[ seg[0]+"" ] = true + var room = new Rect( x_segment, seg[0] ) + + if (seen_rooms[ room+"" ]) return; + + seen_rooms[ room+"" ] = true + rooms.push(room) + var new_seg = new Rect( segment.x, seg[0] ) + open_segments.unshift(new_seg) + j++ + }) + y_segments = segment.y.split(open_segment.y, TOP, BOTTOM) + y_segments.forEach(function(seg){ + if (seen_segments[ seg[0]+"" ]) return; var new_seg = new Rect( segment.x, seg[0] ) open_segments.unshift(new_seg) j++ }) } } - if (! overlapped) { + if (overlapped) { + // sort open segments? + open_segments = open_segments.sort(function(a,b){ + if (a.y.a < b.y.a) { return -1 } + if (a.y.a == b.y.a) { return 0 } + if (a.y.a > b.y.a) { return 1 } + }) + + if (open_segments.length < 2) { continue } + + for (var k = 1; k < open_segments.length; k++) { + if (open_segments[k-1].y.containsVec(open_segments[k].y)) { + open_segments.splice(k--, 1) + } + else if (open_segments[k-1].y.overlaps(open_segments[k].y)) { + open_segments[k].y = open_segments[k].y.clone() + console.log(open_segments[k-1].y+"", open_segments[k].y+"") + open_segments[k].y.a = open_segments[k-1].y.b + } + } + } + else { open_segments.push(segment) } } -// console.log(rooms.map(function(s){ return s.toString() }).join("\n")) - console.log({ rooms: rooms, open_segments: open_segments, segments: segments, closed_segments: closed_segments }) + for (var i = 0; i < segments.length; i++) { + segment = segments[i] + if (! segment.isHorizontal()) { + continue + } + } + return { rooms: rooms, open_segments: open_segments, segments: segments, closed_segments: closed_segments } } diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 90a56c6..d37bc12 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -111,6 +111,9 @@ vec2.prototype.containsDisc = function(n,r){ return this.a <= n-r && n+r <= this.b } + vec2.prototype.containsVec = function(v){ + return this.a <= v.a && v.b <= this.b + } vec2.prototype.clamp = function(n){ return clamp(n, this.a, this.b) } diff --git a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js index cf9dea6..0b27d0c 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js @@ -108,7 +108,7 @@ var BlueprintEditor = View.extend(AnimatedView.prototype).extend({ } shapes.forEach(function(shape){ - shape.draw(map.draw.ctx) +// shape.draw(map.draw.ctx) }) map.draw.ctx.strokeStyle = "#f00"; @@ -117,14 +117,16 @@ var BlueprintEditor = View.extend(AnimatedView.prototype).extend({ map.draw.camera(scene.camera) this.rooms.open_segments.forEach(function(seg,i){ - map.draw.ctx.fillStyle = "#00f" + map.draw.ctx.fillStyle = "rgba(0,0,255,0.2)" map.draw.ctx.fillRect( seg.x.a, seg.y.a, seg.width()+10, seg.height() ) }) this.rooms.closed_segments.forEach(function(seg,i){ - map.draw.ctx.fillStyle = "#0ff" + map.draw.ctx.fillStyle = "rgba(0,255,0,0.2)" map.draw.ctx.fillRect( seg.x.a, seg.y.a, seg.width()+10, seg.height() ) }) + + var colors = ["rgba(0,0,0,0.1)"] this.rooms.rooms.forEach(function(room,i){ map.draw.ctx.fillStyle = colors[i % colors.length] -- cgit v1.2.3-70-g09d2 From 73fdf8d46f10793d210f4369adb8c31afa536d20 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 21 Aug 2015 16:59:48 -0400 Subject: thinking --- .../rectangles/engine/shapes/regionlist.js | 33 +++++++++++++--------- .../assets/javascripts/rectangles/models/vec2.js | 3 ++ 2 files changed, 22 insertions(+), 14 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js index fb2c8e5..b2672ad 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js +++ b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js @@ -106,22 +106,27 @@ var RegionList = (function(){ } } /* - else if ((segment.y.a == room.y.a || segment.y.a == room.y.b) && room.x.containsVec(segment.x)) { - splits = room.x.split(segment.x, LEFT, RIGHT) - for (var k = 0; k < splits.length; k++) { - splitter = splits[k] - var new_room = new Rect( splitter[0], room.y ) - new_room.sides |= splitter[1] - if (segment.x.containsVec(splitter[0])) { - if (segment.y.a == room.y.a) { - room.sides |= FRONT - } - if (segment.y.a == room.y.b) { - room.sides |= BACK + else if (segment.y.a == room.y.a || segment.y.a == room.y.b) { + if (room.x.overlaps(segment.x)) { + splits = room.x.split(segment.x, LEFT, RIGHT) + rooms.splice(r--, 1) + console.log(splits) + for (var k = 0; k < splits.length; k++) { + splitter = splits[k] + var new_room = new Rect( splitter[0], room.y ) + new_room.sides = 0 + new_room.sides |= splitter[1] + if (segment.x.containsVec( splitter[0] )) { + if (segment.y.a == new_room.y.a) { + new_room.sides |= FRONT + } + if (segment.y.a == new_room.y.b) { + new_room.sides |= BACK + } } + rooms.unshift(new_room) + r++ } - rooms.unshift(new_room) - r++ } } */ diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index d37bc12..226e56f 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -114,6 +114,9 @@ vec2.prototype.containsVec = function(v){ return this.a <= v.a && v.b <= this.b } + vec2.prototype.containsCenterVec = function(v){ + return this.a < v.a && v.b < this.b + } vec2.prototype.clamp = function(n){ return clamp(n, this.a, this.b) } -- cgit v1.2.3-70-g09d2 From 48fc9b27a77126da649959c8f74ad8faffcd6e2c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 25 Aug 2015 11:15:50 -0400 Subject: comment the regionlist algorithm --- .../javascripts/rectangles/engine/map/_map.js | 6 +- .../javascripts/rectangles/engine/rooms/builder.js | 1 + .../rectangles/engine/shapes/polyline.js | 4 ++ .../rectangles/engine/shapes/regionlist.js | 83 ++++++++++++++++------ .../rectangles/engine/shapes/shapelist.js | 2 + .../assets/javascripts/rectangles/models/vec2.js | 4 +- .../assets/javascripts/rectangles/models/wall.js | 5 ++ .../javascripts/ui/blueprint/BlueprintEditor.js | 5 +- 8 files changed, 79 insertions(+), 31 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/map/_map.js b/public/assets/javascripts/rectangles/engine/map/_map.js index 2aee962..e27346d 100644 --- a/public/assets/javascripts/rectangles/engine/map/_map.js +++ b/public/assets/javascripts/rectangles/engine/map/_map.js @@ -69,9 +69,9 @@ var Map = function(opt){ break } - base.resize = function(){ - canvas.width = base.dimensions.a = window.innerWidth - canvas.height = base.dimensions.b = window.innerHeight + base.resize = function(w, h){ + canvas.width = base.dimensions.a = w || window.innerWidth + canvas.height = base.dimensions.b = h || window.innerHeight // resize here - esp if 2d-hires } diff --git a/public/assets/javascripts/rectangles/engine/rooms/builder.js b/public/assets/javascripts/rectangles/engine/rooms/builder.js index 5e09fab..f78fb91 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/builder.js +++ b/public/assets/javascripts/rectangles/engine/rooms/builder.js @@ -14,6 +14,7 @@ PI = Math.PI HALF_PI = PI/2 TOP = CEILING, BOTTOM = FLOOR + $ = { browser: { mozilla: false } } function sidesToString(sides){ var s = "" if (sides & FRONT) s += "front " diff --git a/public/assets/javascripts/rectangles/engine/shapes/polyline.js b/public/assets/javascripts/rectangles/engine/shapes/polyline.js index 6c64128..609a2c8 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/polyline.js +++ b/public/assets/javascripts/rectangles/engine/shapes/polyline.js @@ -1,3 +1,7 @@ +// A Polyline is a set of points inputted by the user using the V2 editor to trace a blueprint. +// Additionally, it manages a set of MX objects which correspond to the walls in 3D. +// In this way, it attempts to bridge the 2D (canvas, imperative) and 3D (css, declarative) views. + var Polyline = Fiber.extend(function(base){ var exports = {} exports.init = function(){ diff --git a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js index 71f19d8..663f3fd 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js +++ b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js @@ -1,36 +1,58 @@ +// This algorithm takes the polylines from ShapeList as input and produces +// a set of Rooms which can be used by the existing V1 mover and editor. + +// The algorithm assumes that +// 1) all angles are orthogonal +// 2) all polylines are closed + var RegionList = (function(){ var RegionList = {} var regions = RegionList.regions RegionList.build = function(){ + + // first, get the segments sorted right to left & top to bottom var segments = RegionList.getSortedSegments() var rooms = [] var seen_rooms = {} var open_segments = [] - var closed_segments = [] var segment, open_segment, x_segment, y_segments, overlapped, seen_segments + // first pass: generate rooms from the vertical segments only for (var i = 0; i < segments.length; i++) { segment = segments[i] if (! segment.isVertical()) { continue } + + // check all the "open segments" we know about, i.e. rooms where we've only found + // the right wall. overlapped = false for (var j = 0; j < open_segments.length; j++) { open_segment = open_segments[j] + + // if these two segments overlap each other, then there is a room between them. if (segment.y.overlaps(open_segment.y)) { overlapped = true - closed_segments.push(open_segments[j]) open_segments.splice(j--, 1) + // the X part of the room will be the span between these two vertical segments' + // X components. the Y part of the room is the "split" or subdivision between + // the two horizontal vectors. + + // the split function is non-commutative, + // so we need to call A split B and B split A, + // then dedupe the segments we got back.. x_segment = new vec2( open_segment.x.a, segment.x.b ) y_segments = open_segment.y.split(segment.y, 0, 0) seen_segments = {} + // check each of the splits.. if the two segments overlap, then we definitely + // have a room here. y_segments.forEach(function(seg){ seen_segments[ seg[0]+"" ] = true var room = new Rect( x_segment, seg[0] ) @@ -46,7 +68,8 @@ var RegionList = (function(){ j++ }) - y_segments = segment.y.split(open_segment.y, TOP, BOTTOM) + // splitting the other way.. + y_segments = segment.y.split(open_segment.y, 0, 0) y_segments.forEach(function(seg){ if (seen_segments[ seg[0]+"" ]) return; var new_seg = new Rect( segment.x, seg[0] ) @@ -55,6 +78,9 @@ var RegionList = (function(){ }) } } + + // if we have overlap, then re-sort the open segments Y-wise + // and (again) dedupe.. if (overlapped) { open_segments = open_segments.sort(function(a,b){ if (a.y.a < b.y.a) { return -1 } @@ -74,6 +100,7 @@ var RegionList = (function(){ } } } + // if we don't have any overlap, then this is a new open segment. else { open_segments.push(segment) } @@ -81,11 +108,15 @@ var RegionList = (function(){ var splits, splitter + // second pass: now that we have a bunch of rooms, assign sides to all of them. + // sides are used in the "mover" script to do bounds checking. for (var i = 0; i < segments.length; i++) { segment = segments[i] var horizontal = segment.isHorizontal(), vertical = segment.isVertical() for (var r = 0; r < rooms.length; r++){ room = rooms[r] + + // vertical segments determine the left and right edges of the room, fairly simply. if (vertical) { if (segment.y.containsVec(room.y)) { if (segment.x.a == room.x.a) { @@ -96,6 +127,8 @@ var RegionList = (function(){ } } } + + // horizontal segments determine the front and back edges of the room. if (horizontal) { if (segment.x.containsVec(room.x)) { if (segment.y.a == room.y.a) { @@ -105,28 +138,30 @@ var RegionList = (function(){ room.sides |= BACK } } - - else if (segment.y.a == room.y.a || segment.y.a == room.y.b) { - if (room.x.overlaps(segment.x)) { - splits = room.x.split(segment.x, room.sides & LEFT, room.sides & RIGHT) - rooms.splice(r--, 1) - console.log(splits) - for (var k = 0; k < splits.length; k++) { - splitter = splits[k] - var new_room = new Rect( splitter[0], room.y ) - new_room.sides = 0 - new_room.sides |= splitter[1] | ( room.sides & FRONT_BACK ) - if (segment.x.overlaps( splitter[0] )) { - if (segment.y.a == new_room.y.a) { - new_room.sides |= FRONT - } - if (segment.y.a == new_room.y.b) { - new_room.sides |= BACK - } + + // however, since we did not split on horizontal segments, our rooms may + // only have partial overlap with these segments, in which case we need to + // split the rooms apart. + else if ((segment.y.a == room.y.a || segment.y.a == room.y.b) && room.x.overlaps(segment.x)) { + + // split the room across the segment. preserve whether or not we know the + // room borders a segment on the left or right. + splits = room.x.split(segment.x, room.sides & LEFT, room.sides & RIGHT) + rooms.splice(r--, 1) + for (var k = 0; k < splits.length; k++) { + splitter = splits[k] + var new_room = new Rect( splitter[0], room.y ) + new_room.sides = splitter[1] | ( room.sides & FRONT_BACK ) + if (segment.x.overlaps( splitter[0] )) { + if (segment.y.a == new_room.y.a) { + new_room.sides |= FRONT + } + if (segment.y.a == new_room.y.b) { + new_room.sides |= BACK } - rooms.unshift(new_room) - r++ } + rooms.unshift(new_room) + r++ } } @@ -137,6 +172,8 @@ var RegionList = (function(){ return { rooms: rooms } } + + // Gets a list of polylines from the ShapeList and sorts the segments. RegionList.getSortedSegments = function(){ // get a list of all segments from these polylines var segments = shapes.getAllSegments() diff --git a/public/assets/javascripts/rectangles/engine/shapes/shapelist.js b/public/assets/javascripts/rectangles/engine/shapes/shapelist.js index 4373caf..90714c2 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/shapelist.js +++ b/public/assets/javascripts/rectangles/engine/shapes/shapelist.js @@ -1,3 +1,5 @@ +// The ShapeList manages the list of polylines which form a V2 layout. + var ShapeList = Fiber.extend(function(base){ var exports = {} exports.init = function(){ diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 226e56f..8942d92 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -214,13 +214,13 @@ } vec2.prototype.toString = function(){ - return "[" + round(this.a) + " " + round(this.b) + "]" + return "[" + Math.round(this.a) + " " + Math.round(this.b) + "]" } vec2.prototype.exactString = function(){ return "[" + this.a + " " + this.b + "]" } vec2.prototype.serialize = function(){ - return [ round(this.a), round(this.b) ] + return [ Math.round(this.a), Math.round(this.b) ] } vec2.prototype.deserialize = function(data){ this.a = data[0] diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 13f5cd7..9d4650b 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -10,6 +10,11 @@ vec2 = require('./vec2') Rect = require('./rect') UidGenerator = require('../util/uid') + wall_rotation = {} + wall_rotation[FRONT] = PI + wall_rotation[BACK] = 0 + wall_rotation[LEFT] = HALF_PI + wall_rotation[RIGHT] = -HALF_PI } var Wall = function(opt){ diff --git a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js index 39cf62e..a341a24 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js @@ -62,8 +62,7 @@ var BlueprintEditor = View.extend(AnimatedView.prototype).extend({ if (this.parent.orbiting) { scene.width = window.innerWidth/2 scene.height = window.innerHeight - this.parent.map.canvas.width = this.parent.map.dimensions.a = window.innerWidth/2 - this.parent.map.canvas.height = this.parent.map.dimensions.b = window.innerHeight + this.parent.map.resize( window.innerWidth/2, window.innerHeight ) this.parent.map.canvas.style.display = "block" } else { @@ -119,7 +118,7 @@ var BlueprintEditor = View.extend(AnimatedView.prototype).extend({ // var colors = ["rgba(0,0,0,0.1)"] // var colors = ["rgba(255,255,255,1)"] // -// map.draw.regions(this.rooms.rooms, colors, "#000") + map.draw.regions(this.rooms.rooms, colors, "#000") // this.rooms.rooms.forEach(function(room,i){ // map.draw.ctx.fillStyle = colors[i % colors.length] -- cgit v1.2.3-70-g09d2 From 73b8036e977a21d4b1e327245d02826eade3c843 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 26 Aug 2015 12:24:12 -0400 Subject: loading rooms into editor --- .../assets/javascripts/rectangles/engine/rooms/_rooms.js | 13 ++++++++++--- public/assets/javascripts/rectangles/models/room.js | 4 ++++ public/assets/javascripts/ui/editor/EditorSettings.js | 15 ++++++++++----- public/assets/javascripts/ui/editor/EditorView.js | 2 +- server/index.js | 2 ++ server/lib/api/blueprint.js | 15 +++++++++++++++ 6 files changed, 42 insertions(+), 9 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js index d4281ad..5c9945c 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js +++ b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js @@ -127,14 +127,16 @@ Rooms.rebuild(walls_data) } - base.deserializeFromShapes = function(shapes_data, walls_data) { + base.deserializeFromShapes = function(data, walls_data) { + walls_data = walls_data || Walls.serialize() base.shapesMode = true window.viewHeight = data.viewHeight || app.defaults.viewHeight window.wallHeight = data.wallHeight || app.defaults.wallHeight $(".units").val( data.units ) shapes.deserialize( data.shapes ) - shapes.build() + // shapes.build() + var regions = RegionList.build() regions.forEach(function(region){ var room = new Room({ @@ -142,12 +144,17 @@ regions: [region], height: wallHeight, }) + room.sides = region.sides region.id = Rooms.uid("room_") Rooms.list[ region.id ] = room - Rooms.builder.build(region) + var mx_walls = Rooms.builder.build_walls(region) room.mx_floor = Rooms.builder.make_floor(room, region) room.mx_ceiling = Rooms.builder.make_ceiling(room, region) + + mx_walls.forEach(function(mx){ scene.add(mx) }) + scene.add(room.mx_floor) + scene.add(room.mx_ceiling) }) Rooms.grouper.build() diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js index 26bf055..0ef76e4 100644 --- a/public/assets/javascripts/rectangles/models/room.js +++ b/public/assets/javascripts/rectangles/models/room.js @@ -35,6 +35,10 @@ this.height = opt.height || 200 this.focused = false + + this.mx_walls = [] + this.mx_floor = [] + this.mx_ceiling = [] } Room.prototype.copy = function(){ diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index 000852e..83bc8b7 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -41,11 +41,11 @@ var EditorSettings = FormView.extend({ this.action = data.isNew ? this.createAction : this.updateAction this.parent.data = data - if (data.rooms) { - Rooms.deserialize(data.rooms, data.walls) + if (data.shapes) { + Rooms.deserializeFromShapes(data, data.walls) } - else if (data.shapes) { - Rooms.deserializeFromShapes(data.shapes, data.walls) + else if (data.rooms) { + Rooms.deserialize(data.rooms, data.walls) } if (data.startPosition) { scene.camera.move(data.startPosition) @@ -194,7 +194,12 @@ var EditorSettings = FormView.extend({ fd.append( "description", this.$description.val() ) fd.append( "privacy", this.$privacy.filter(":checked").val() == "private" ) fd.append( "viewHeight", window.viewHeight ) - fd.append( "rooms", JSON.stringify( Rooms.serialize() ) ) + if (Rooms.shapesMode) { + fd.append( "shapes", JSON.stringify( shapes.serialize() ) ) + } + else { + fd.append( "rooms", JSON.stringify( Rooms.serialize() ) ) + } fd.append( "walls", JSON.stringify( Walls.serialize() ) ) fd.append( "colors", JSON.stringify( Walls.colors ) ) fd.append( "media", JSON.stringify( Scenery.serialize() ) ) diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index 879c963..c05b373 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -2,7 +2,7 @@ var EditorView = View.extend({ el: "#editorView", - blueprintAction: "/api/blueprint/", + blueprintAction: "/api/blueprint/user/", projectAction: "/api/project/", layoutAction: "/api/layout/", diff --git a/server/index.js b/server/index.js index 7143da2..224aa86 100644 --- a/server/index.js +++ b/server/index.js @@ -138,6 +138,7 @@ site.route = function () { app.get('/project', middleware.ensureAuthenticated, views.modal) app.get('/project/new', middleware.ensureAuthenticated, views.modal) app.get('/project/new/:layout', middleware.ensureAuthenticated, views.editor_new) + app.get('/project/blueprint/:layout', middleware.ensureAuthenticated, views.editor_new) app.get('/project/:slug', middleware.ensureProject, middleware.ensureIsCollaborator, views.reader) app.get('/project/:slug/view', middleware.ensureProject, middleware.ensureIsCollaborator, views.reader) app.get('/project/:slug/edit', middleware.ensureProject, middleware.ensureIsCollaborator, views.editor) @@ -163,6 +164,7 @@ site.route = function () { app.post('/api/blueprint/new', middleware.ensureAuthenticated, api.blueprint.create) app.post('/api/blueprint/upload', middleware.ensureAuthenticated, api.blueprint.upload) + app.get('/api/blueprint/user/:slug', middleware.ensureAuthenticated, api.blueprint.show) app.get('/api/blueprint/user', middleware.ensureAuthenticated, api.blueprint.user) app.post('/api/blueprint/scale', middleware.ensureAuthenticated, api.blueprint.scale) app.post('/api/blueprint/edit', middleware.ensureAuthenticated, api.blueprint.update) diff --git a/server/lib/api/blueprint.js b/server/lib/api/blueprint.js index 222b466..e780b92 100644 --- a/server/lib/api/blueprint.js +++ b/server/lib/api/blueprint.js @@ -25,6 +25,21 @@ var blueprint = { }) }, + show: function(req, res){ + Blueprint.findOne({ slug: req.params.slug }, function(err, doc){ + if (doc) { + res.json(doc) + return + } + else { + Project.count({}, function(err, count){ + var name = "Project #" + (count || 0) + res.json({ _id: "new", name: name, isNew: true }) + }) + } + }) + }, + create: function(req, res){ var data = util.cleanQuery(req.body) data.user_id = req.user._id -- cgit v1.2.3-70-g09d2 From 977429a9b945e6be0175b1672dd5802e49682c9b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 26 Aug 2015 13:36:53 -0400 Subject: mover working with new layouts --- public/assets/javascripts/rectangles/models/room.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js index 0ef76e4..1abe2ba 100644 --- a/public/assets/javascripts/rectangles/models/room.js +++ b/public/assets/javascripts/rectangles/models/room.js @@ -31,7 +31,7 @@ var Room = function(opt){ this.id = opt.id || Rooms.uid("room_") this.rect = opt.rect - this.regions = [] + this.regions = opt.regions || [] this.height = opt.height || 200 this.focused = false @@ -129,6 +129,7 @@ Room.prototype.collidesDisc = function(src, dest, radius){ var x = dest.x, y = dest.z var collision = 0, wall_collision, contains_x, contains_y + this.regions.forEach(function(r){ if (! r.sides) return -- cgit v1.2.3-70-g09d2 From 0e03cb3c4065e002be50d37e80ddfab1407c8e6b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 26 Aug 2015 16:10:42 -0400 Subject: popup notice to start a project --- public/assets/javascripts/rectangles/models/wall.js | 2 +- .../javascripts/ui/blueprint/BlueprintNotice.js | 20 ++++++++++++++++++++ .../javascripts/ui/blueprint/BlueprintSettings.js | 4 +++- .../javascripts/ui/blueprint/BlueprintToolbar.js | 8 ++++++++ .../assets/javascripts/ui/blueprint/BlueprintView.js | 5 +++++ public/assets/stylesheets/app.css | 6 ++++++ views/blueprint.ejs | 6 +----- views/controls/blueprint/notice.ejs | 3 +++ views/partials/scripts.ejs | 1 + 9 files changed, 48 insertions(+), 7 deletions(-) create mode 100644 public/assets/javascripts/ui/blueprint/BlueprintNotice.js create mode 100644 views/controls/blueprint/notice.ejs (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 9d4650b..5aa8359 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -198,7 +198,7 @@ } Wall.prototype.serialize = function(){ - return { + return { id: this.id, background: this.background, } diff --git a/public/assets/javascripts/ui/blueprint/BlueprintNotice.js b/public/assets/javascripts/ui/blueprint/BlueprintNotice.js new file mode 100644 index 0000000..bced4e1 --- /dev/null +++ b/public/assets/javascripts/ui/blueprint/BlueprintNotice.js @@ -0,0 +1,20 @@ +var BlueprintNotice = View.extend(ToggleableView.prototype).extend({ + + el: "#blueprintNotice", + + initialize: function(opt){ + this.parent = opt.parent + this.$notice = this.$(".notice") + }, + + notice: function(msg){ + this.$notice.html(msg) + }, + + showCreateProjectNotice: function(){ + this.notice("Start a new project with this blueprint.") + this.show() + }, + +}) \ No newline at end of file diff --git a/public/assets/javascripts/ui/blueprint/BlueprintSettings.js b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js index 0870a11..e41962e 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintSettings.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js @@ -37,7 +37,6 @@ var BlueprintSettings = FormView.extend(ToggleableView.prototype).extend({ shapes.deserialize( data.shapes ) shapes.build() } - this.data = data }, clear: function(){ @@ -107,11 +106,14 @@ var BlueprintSettings = FormView.extend(ToggleableView.prototype).extend({ }, success: function(data){ + this.parent.data = data + this.$id.val(data._id) this.$name.val(data.name) this.action = this.updateAction this.hide() + this.parent.notice.showCreateProjectNotice() Minotaur.unwatch(this) Minotaur.hide() diff --git a/public/assets/javascripts/ui/blueprint/BlueprintToolbar.js b/public/assets/javascripts/ui/blueprint/BlueprintToolbar.js index e22535e..88f1d0a 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintToolbar.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintToolbar.js @@ -9,6 +9,7 @@ var BlueprintToolbar = View.extend({ "click [data-role=polyline-mode]": 'polylineMode', "click [data-role=ortho-polyline-mode]": 'orthoPolylineMode', "click [data-role=eraser-mode]": 'eraserMode', + "click [data-role=start-position-mode]": 'startPositionMode', "click [data-role=toggle-layout-settings]": 'toggleSettings', }, @@ -21,6 +22,7 @@ var BlueprintToolbar = View.extend({ this.$polylineMode = this.$('[data-role=polyline-mode]') this.$orthoPolylineMode = this.$('[data-role=ortho-polyline-mode]') this.$eraserMode = this.$('[data-role=eraser-mode]') + this.$startPositionMode = this.$('[data-role=start-position-mode]') this.orthoPolylineMode() }, @@ -52,6 +54,7 @@ var BlueprintToolbar = View.extend({ toggleSettings: function(){ this.parent.settings.toggle() + this.parent.notice.toggle( ! this.parent.data.isNew && ! this.parent.settings.visible() ) }, setActiveMode: function( $el ) { @@ -79,4 +82,9 @@ var BlueprintToolbar = View.extend({ this.parent.map.ui.set_tool("eraser") }, + startPositionMode: function(){ + this.setActiveMode( this.$startPositionMode ) + this.parent.map.ui.set_tool("start-position") + }, + }) \ No newline at end of file diff --git a/public/assets/javascripts/ui/blueprint/BlueprintView.js b/public/assets/javascripts/ui/blueprint/BlueprintView.js index 3095cfe..6f1d2f5 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintView.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintView.js @@ -17,6 +17,7 @@ var BlueprintView = View.extend({ this.scaler = new BlueprintScaler ({ parent: this }) this.info = new BlueprintInfo ({ parent: this }) this.settings = new BlueprintSettings ({ parent: this }) + this.notice = new BlueprintNotice ({ parent: this }) }, load: function(name){ @@ -48,9 +49,13 @@ var BlueprintView = View.extend({ }, ready: function(data){ + this.data = data this.info.load(data) this.settings.load(data) this.editor.loadFloorplan(data) + if (! data.isNew) { + this.notice.showCreateProjectNotice() + } }, hideExtras: function(){ diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 2fef578..3caa063 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -2352,6 +2352,12 @@ input[type="range"]::-webkit-slider-thumb { transition: -webkit-transform 0.2s ease-in-out; width: 210px; } +#blueprintNotice.settings { + width: 230px; +} +#blueprintNotice a { + border-bottom: 1px solid; +} #textEditor.settings { width: 320px; } diff --git a/views/blueprint.ejs b/views/blueprint.ejs index e7f7c48..13e8182 100644 --- a/views/blueprint.ejs +++ b/views/blueprint.ejs @@ -17,11 +17,7 @@ [[ include controls/blueprint/settings ]] [[ include controls/blueprint/editor ]] [[ include controls/blueprint/scaler ]] - - -
-
-
+ [[ include controls/blueprint/notice ]]
diff --git a/views/controls/blueprint/notice.ejs b/views/controls/blueprint/notice.ejs new file mode 100644 index 0000000..1be3f6f --- /dev/null +++ b/views/controls/blueprint/notice.ejs @@ -0,0 +1,3 @@ +
+
+
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 865c0f1..ac08216 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -142,6 +142,7 @@ + -- cgit v1.2.3-70-g09d2 From 9d3c9cb918d03a8a30eb325e1f7e4d55f1765dcc Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 25 Jan 2016 20:31:37 +0100 Subject: remove quotes from css url --- public/assets/javascripts/rectangles/engine/rooms/_walls.js | 2 +- public/assets/javascripts/rectangles/models/floor.js | 2 +- public/assets/javascripts/rectangles/models/wall.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/rooms/_walls.js b/public/assets/javascripts/rectangles/engine/rooms/_walls.js index 04d0594..38dac84 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/_walls.js +++ b/public/assets/javascripts/rectangles/engine/rooms/_walls.js @@ -162,7 +162,7 @@ wall.wallpaper(background, img) }) }.bind(this) - img.src = background.src.replace("url(","").replace(")","") + img.src = background.src.replace(/url\(\"?\'?/,"").replace(/\"?\'?\)/,"") img.complete && img.onload() }, floor: function(background){ diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index 799bdc7..63eebcc 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -153,7 +153,7 @@ background.scale = background.scale || 1 this.background = background - this.background.src = this.background.src.replace("url(","").replace(")","") + this.background.src = this.background.src.replace(/url\(\"?\'?/,"").replace(/\"?\'?\)/,"") if (this.background.src == "none") { this.wallpaperLoad(this.background.src) diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 5aa8359..cf3cea8 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -294,7 +294,7 @@ background.scale = background.scale || 1 this.background = background - this.background.src = this.background.src.replace("url(","").replace(")","") + this.background.src = this.background.src.replace(/url\(\"?\'?/,"").replace(/\"?\'?\)/,"") if (this.background.src == "none") { this.wallpaperLoad(this.background.src) -- cgit v1.2.3-70-g09d2 From d3c355ce07e0d8ec41fedd9cde970f4a7c03dec6 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 10 Jun 2016 15:25:05 -0400 Subject: fix odd bugs that have appeared --- package.json | 29 +++++++++++----------- .../assets/javascripts/rectangles/models/rect.js | 21 ++++++++-------- .../javascripts/ui/blueprint/BlueprintView.js | 9 +++++++ server/index.js | 5 ++-- views/home.ejs | 2 +- 5 files changed, 37 insertions(+), 29 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/package.json b/package.json index ce81cde..b055b9e 100644 --- a/package.json +++ b/package.json @@ -17,18 +17,17 @@ "html-entities": "~1.0.10", "inspect": "0.0.2", "intro.js": "^0.9.0", - "js2xml": "^1.0.0", + "js2xml": "", "knox": "~0.8.10", "lodash": "~2.4.1", "marked": "~0.3.2", + "method-override": "^2.3.6", "moment": "~2.6.0", - "mongoose": "~3.8.8", - "mongoose-lifecycle": "~1.0.0", - "mongoose-unique-validator": "~0.3.0", - "monk": "~0.7.1", + "mongoose": "^4.2.8", + "mongoose-lifecycle": "", + "mongoose-unique-validator": "", "multer": "~0.1.0", "node-recurly": "julescarbon/node-recurly", - "node-restful": "~0.1.14", "passport": "~0.2.0", "passport-facebook": "~1.0.3", "passport-local": "~1.0.0", @@ -36,16 +35,16 @@ "passport.socketio": "~3.0.1", "socket.io": "~0.9.16", "useful-string": "0.0.1", - "xml2js": "^0.4.4" + "xml2js": "" }, "devDependencies": { - "grunt": "~0.4.1", - "grunt-contrib-concat": "~0.3.0", - "grunt-contrib-uglify": "~0.2.5", - "grunt-contrib-watch": "~0.5.3", - "grunt-contrib-clean": "~0.5.0", - "grunt-contrib-copy": "~0.5.0", - "grunt-dentist": "~0.3.4", - "mocha": "~1.20.1" + "grunt": "", + "grunt-contrib-concat": "", + "grunt-contrib-uglify": "", + "grunt-contrib-watch": "", + "grunt-contrib-clean": "", + "grunt-contrib-copy": "", + "grunt-dentist": "", + "mocha": "" } } diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js index a4756ed..4f73bec 100644 --- a/public/assets/javascripts/rectangles/models/rect.js +++ b/public/assets/javascripts/rectangles/models/rect.js @@ -1,4 +1,3 @@ - (function(){ var vec2 if ('window' in this) { @@ -8,17 +7,17 @@ vec2 = require('./vec2') FRONT = 0x1, BACK = 0x2, LEFT = 0x4, RIGHT = 0x8, FLOOR = 0x10, CEILING = 0x20 TOP = CEILING, BOTTOM = FLOOR - function sidesToString(sides){ - var s = "" - if (sides & FRONT) s += "front " - if (sides & BACK) s += "back " - if (sides & LEFT) s += "left " - if (sides & RIGHT) s += "right " - if (sides & TOP) s += "top " - if (sides & BOTTOM) s += "bottom " - return s - } } + function sidesToString(sides){ + var s = "" + if (sides & FRONT) s += "front " + if (sides & BACK) s += "back " + if (sides & LEFT) s += "left " + if (sides & RIGHT) s += "right " + if (sides & TOP) s += "top " + if (sides & BOTTOM) s += "bottom " + return s + } var Rect = function (x0,y0,x1,y1){ if (x0 instanceof vec2) { diff --git a/public/assets/javascripts/ui/blueprint/BlueprintView.js b/public/assets/javascripts/ui/blueprint/BlueprintView.js index e249c91..1858c3d 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintView.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintView.js @@ -40,6 +40,15 @@ var BlueprintView = View.extend({ if (startPositionIsInARoom) { return this.startPosition } + else if (! regions.length) { + return { + x: 0, + y: viewHeight, + z: 0, + rotationX: 0, + rotationY: Math.PI/2, + } + } else { var center = regions[0].center() return { diff --git a/server/index.js b/server/index.js index 224aa86..46f342e 100644 --- a/server/index.js +++ b/server/index.js @@ -16,7 +16,8 @@ var http = require('http'), MongoStore = require('connect-mongo')(express), passport = require('passport'), path = require('path'), - mongoose = require('mongoose'); + mongoose = require('mongoose'), + methodOverride = require('method-override'); var app = express() var server @@ -58,7 +59,7 @@ site.setup = function(){ app.use(multer()); app.use(express.query()); app.use(express.csrf()); - app.use(express.methodOverride()); + app.use(methodOverride('X-HTTP-Method-Override')) app.use(passport.initialize()); app.use(passport.session()); app.use(app.router); diff --git a/views/home.ejs b/views/home.ejs index 14fc0e3..af43f0b 100755 --- a/views/home.ejs +++ b/views/home.ejs @@ -38,7 +38,7 @@

Defy The Status Quo

- There is no platform on the internet quite like VValls. VValls opens up the possibilities of expression online. Go crazy, make otherworldly rooms. + There is no platform on the Internet quite like VValls. VValls opens up the possibilities of expression online. Go crazy, make otherworldly rooms. -- cgit v1.2.3-70-g09d2