From 742f4cc410bb04421800d7462f81fc64c59aa0bc Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 30 Sep 2014 12:36:42 -0400 Subject: tracing menu appearing/disappearing logic ; set title from filename --- public/assets/javascripts/rectangles/models/wall.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (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 1a3ef7c..5513a9b 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -64,7 +64,10 @@ e.stopPropagation() return } - + + Scenery.resize.show(scenery) + Scenery.hovering = true + UndoStack.push({ type: 'create-scenery', undo: { id: scenery.id }, -- cgit v1.2.3-70-g09d2 From 385dc017b65cbd7cd94b16e86a8368320d4274ea Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 30 Sep 2014 13:10:08 -0400 Subject: adding prefixfree, bower install --- bower.json | 3 +- .../rectangles/engine/scenery/resize.js | 2 +- .../assets/javascripts/rectangles/models/wall.js | 5 +- .../assets/javascripts/rectangles/util/minotaur.js | 2 +- .../assets/javascripts/ui/editor/EditorToolbar.js | 59 +++++++++++++--------- views/partials/scripts.ejs | 1 + 6 files changed, 44 insertions(+), 28 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/bower.json b/bower.json index ee8f9ba..faffbfb 100644 --- a/bower.json +++ b/bower.json @@ -7,6 +7,7 @@ "momentjs": "~2.5.1", "lodash": "", "fiber": "", - "jquery-jsonview": "1.2.0" + "jquery-jsonview": "1.2.0", + "prefixfree": "" } } diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index ca77525..96817c2 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -122,7 +122,7 @@ Scenery.resize = new function(){ Scenery.mouse.bind_el(dot.el) $(dot.el).bind({ mouseenter: function(e){ - Scenery.resize.hovering = true +// Scenery.resize.hovering = true }, mouseleave: function(e){ // Scenery.resize.hovering = false diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 5513a9b..2bfb258 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -64,9 +64,10 @@ e.stopPropagation() return } - + + app.controller.toolbar.resetPermissions() Scenery.resize.show(scenery) - Scenery.hovering = true + Scenery.hovering = true UndoStack.push({ type: 'create-scenery', diff --git a/public/assets/javascripts/rectangles/util/minotaur.js b/public/assets/javascripts/rectangles/util/minotaur.js index 0fcc766..4d9a795 100644 --- a/public/assets/javascripts/rectangles/util/minotaur.js +++ b/public/assets/javascripts/rectangles/util/minotaur.js @@ -4,7 +4,7 @@ var base = this base.$el = $("#minotaur") base.timeout = null - base.delay = 1000 + base.delay = 5000 base.objects = {} base.init = function () { diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js index 9c74c7c..ec6bb46 100644 --- a/public/assets/javascripts/ui/editor/EditorToolbar.js +++ b/public/assets/javascripts/ui/editor/EditorToolbar.js @@ -6,7 +6,7 @@ var EditorToolbar = View.extend({ "click [data-role='toggle-map-view']": 'toggleMap', "click [data-role='toggle-project-settings']": 'toggleSettings', "click [data-role='open-media-viewer']": 'openMediaViewer', - "click [data-role='resize-media']": 'resizeMedia', +// "click [data-role='resize-media']": 'resizeMedia', "click [data-role='destroy-media']": 'destroyMedia', "click [data-role='toggle-wallpaper-panel']": 'toggleWallpaper', "click [data-role='toggle-light-control']": 'toggleLightControl', @@ -39,9 +39,10 @@ var EditorToolbar = View.extend({ }, resetMode: function(){ - this.resizeMedia(true) + // this.resizeMedia(true) this.destroyMedia(false) app.controller.hideExtras() + base.resetPermissions() }, resetControls: function(){ @@ -51,27 +52,34 @@ var EditorToolbar = View.extend({ this.parent.settings.hide() }, - resizeMedia: function(e, state){ - this.resetControls() - if (! state && typeof e == "boolean") { - state = e - editor.permissions.assign("resize", state) - } - else { - state = editor.permissions.toggle("resize") - } - ! state && editor.permissions.assign("move", true) - $(".inuse").removeClass("inuse") - $("[data-role='resize-media']").toggleClass("inuse", state) - if (state) { - if (this.parent.mediaEditor.scenery) { - Scenery.resize.show( this.parent.mediaEditor.scenery ) - } - } - else { - Scenery.resize.hide() - } + resetPermissions: function(){ + editor.permissions.assign("pick", true) + editor.permissions.assign("move", true) + editor.permissions.assign("resize", true) + editor.permissions.assign("destroy", false) }, + +// resizeMedia: function(e, state){ +// this.resetControls() +// if (! state && typeof e == "boolean") { +// state = e +// editor.permissions.assign("resize", state) +// } +// else { +// state = editor.permissions.toggle("resize") +// } +// ! state && editor.permissions.assign("move", true) +// $(".inuse").removeClass("inuse") +// $("[data-role='resize-media']").toggleClass("inuse", state) +// if (state) { +// if (this.parent.mediaEditor.scenery) { +// Scenery.resize.show( this.parent.mediaEditor.scenery ) +// } +// } +// else { +// Scenery.resize.hide() +// } +// }, destroyMedia: function(e, state){ this.resetControls() @@ -82,7 +90,12 @@ var EditorToolbar = View.extend({ else { state = editor.permissions.toggle("destroy") } - ! state && editor.permissions.assign("move", true) + if (! state) { + this.resetPermissions() + } + else { + app.controller.hideExtras() + } $(".inuse").removeClass("inuse") $("[data-role='destroy-media']").toggleClass("inuse", state) $("body").toggleClass("destroyActive", state) diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 7d56b2e..e0dd0f5 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -2,6 +2,7 @@ + -- cgit v1.2.3-70-g09d2 From c32a6ff52628fbe0a530b4f72fc907a2ef651127 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 30 Sep 2014 13:18:45 -0400 Subject: fixing points not moving bug --- .../assets/javascripts/rectangles/engine/scenery/resize.js | 2 +- public/assets/javascripts/rectangles/models/wall.js | 2 +- public/assets/javascripts/rectangles/util/permissions.js | 2 +- public/assets/javascripts/ui/editor/EditorToolbar.js | 12 ++++++------ public/assets/javascripts/ui/site/LayoutsModal.js | 1 - 5 files changed, 9 insertions(+), 10 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index 96817c2..2ba84a1 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -147,7 +147,7 @@ Scenery.resize = new function(){ 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 diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 2bfb258..1b37aa0 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -64,7 +64,7 @@ e.stopPropagation() return } - + app.controller.toolbar.resetPermissions() Scenery.resize.show(scenery) Scenery.hovering = true diff --git a/public/assets/javascripts/rectangles/util/permissions.js b/public/assets/javascripts/rectangles/util/permissions.js index 1b5a1b5..9e3ef4d 100644 --- a/public/assets/javascripts/rectangles/util/permissions.js +++ b/public/assets/javascripts/rectangles/util/permissions.js @@ -31,7 +31,7 @@ Permissions.prototype.add = function (key) { Permissions.prototype.remove = function (key) { var base = this - base[key] = true + base[key] = false } Permissions.prototype.clear = function () { diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js index ec6bb46..9f439c8 100644 --- a/public/assets/javascripts/ui/editor/EditorToolbar.js +++ b/public/assets/javascripts/ui/editor/EditorToolbar.js @@ -41,8 +41,8 @@ var EditorToolbar = View.extend({ resetMode: function(){ // this.resizeMedia(true) this.destroyMedia(false) - app.controller.hideExtras() - base.resetPermissions() + this.parent.hideExtras() + this.resetPermissions() }, resetControls: function(){ @@ -53,10 +53,10 @@ var EditorToolbar = View.extend({ }, resetPermissions: function(){ - editor.permissions.assign("pick", true) - editor.permissions.assign("move", true) - editor.permissions.assign("resize", true) - editor.permissions.assign("destroy", false) + editor.permissions.add("pick") + editor.permissions.add("move") + editor.permissions.add("resize") + editor.permissions.remove("destroy") }, // resizeMedia: function(e, state){ diff --git a/public/assets/javascripts/ui/site/LayoutsModal.js b/public/assets/javascripts/ui/site/LayoutsModal.js index 2449465..1bfc6cb 100644 --- a/public/assets/javascripts/ui/site/LayoutsModal.js +++ b/public/assets/javascripts/ui/site/LayoutsModal.js @@ -29,7 +29,6 @@ var LayoutsIndex = View.extend({ this.$templates.append($span) }.bind(this)) - console.log(this.$templates.html()) this.show() } -- cgit v1.2.3-70-g09d2 From 7afac43f11d1ccae6f3b8d1febcd293db11bd2b7 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 1 Oct 2014 15:42:21 -0400 Subject: randomly place images on the walls --- .../rectangles/engine/scenery/randomize.js | 77 ++++++++++++++++++++++ .../javascripts/rectangles/models/surface.js | 4 +- public/assets/javascripts/ui/editor/MediaViewer.js | 21 ++++-- public/assets/javascripts/util.js | 5 +- views/partials/scripts.ejs | 1 + 5 files changed, 97 insertions(+), 11 deletions(-) create mode 100644 public/assets/javascripts/rectangles/engine/scenery/randomize.js (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/scenery/randomize.js b/public/assets/javascripts/rectangles/engine/scenery/randomize.js new file mode 100644 index 0000000..4f1144a --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/scenery/randomize.js @@ -0,0 +1,77 @@ +/* + // get the list of media we want to place + var media_data = $(".mediaContainer").toArray().map(function(el){ + return $(el).data("media") + }) + Scenery.randomize( media_data ) +*/ + +Scenery.randomize = function (media_data) { + var media_list = media_data.map(function(media){ + var width, height + if (media.width > media.height) { + width = Math.min(300, media.width) + height = media.height/media.width * width + } + else { + height = Math.min(300, media.height) + width = media.width/media.height * height + } + return { + dimensions: new vec2( width, height ), + media: media, + } + }) + + // get a list of all walls + var walls = {} + Walls.forEach(function(wall){ + walls[wall.id] = wall + }) + + // remove the walls that already have stuff on them + Scenery.forEach(function(scenery){ + delete walls[scenery.wall.id] + }) + + var wall_ids = _.keys(walls) + if (! wall_ids.length) { + return + } + + // randomize walls + shuffle(wall_ids) + + // assign each of the media to the walls, until we run out of either + media_list.some(function(media){ + if (wall_ids.length == 0) { + return true + } + + var i, fits = -1 + + for (i = 0; i < wall_ids.length; i++) { + if (walls[wall_ids[i]].surface.fits(media.dimensions)) { + // walls[wall_ids[i]] + fits = i + break + } + } + + if (fits != -1) { + var wall = walls[wall_ids[fits]] + wall_ids.splice(fits, 1) + + Scenery.add({ + media: media.media, + wall: wall, + index: 0, + }) + } + else { + // artwork won't fit anywhere?? + } + + return false + }) +} \ No newline at end of file diff --git a/public/assets/javascripts/rectangles/models/surface.js b/public/assets/javascripts/rectangles/models/surface.js index 53977c8..c85682a 100644 --- a/public/assets/javascripts/rectangles/models/surface.js +++ b/public/assets/javascripts/rectangles/models/surface.js @@ -36,7 +36,7 @@ Surface.prototype.fits = function(v){ var faces = this.faces var scratch - if (this.bounds.x.b < v.a || this.bounds.y.b < v.b) { + if (this.bounds.width() < v.a || this.bounds.height() < v.b) { return null } for (var i = 0; i < faces.length; i++) { @@ -46,7 +46,7 @@ } scratch = new Rect (0,0,0,0) for (var i = 0; i < faces.length; i++) { - if (faces[i].y.length() < v.b) { + if (faces[i].height() < v.b) { continue } scratch.x.a = faces[i].x.a diff --git a/public/assets/javascripts/ui/editor/MediaViewer.js b/public/assets/javascripts/ui/editor/MediaViewer.js index e2ed341..b51d8f2 100644 --- a/public/assets/javascripts/ui/editor/MediaViewer.js +++ b/public/assets/javascripts/ui/editor/MediaViewer.js @@ -3,6 +3,7 @@ var MediaViewer = ModalView.extend({ el: ".mediaDrawer.mediaViewer", destroyAction: "/api/media/destroy", usesFileUpload: true, + loaded: false, events: { 'click .foundToggle': "foundToggle", @@ -19,7 +20,7 @@ var MediaViewer = ModalView.extend({ this.$foundMedia = this.$(".foundMedia") this.$foundToggle = this.$(".foundToggle") this.$deleteMedia = this.$("#deleteMedia") - }, + }, foundToggle: function(){ this.$foundMedia.addClass("active"); @@ -52,9 +53,7 @@ var MediaViewer = ModalView.extend({ }, load: function(){ - $.get("/api/media/user", function(data){ - this.populate() - }.bind(this)) + $.get("/api/media/user", this.populate.bind(this)) }, loadTrending: function(){ @@ -90,11 +89,20 @@ var MediaViewer = ModalView.extend({ if (img.complete && ! loaded) { img.onload() } }.bind(this)) }, + + randomize: function(){ + var media_data = $(".mediaContainer").toArray().map(function(el){ + return $(el).data("media") + }) + Scenery.randomize( media_data ) + }, populate: function(data){ this.loaded = true if (data && data.length) { - data.forEach(this.add.bind(this)) + data.forEach(function(media){ + this.add(media, this.$myMedia) + }.bind(this)) this.$deleteMedia.show() } else { @@ -104,7 +112,6 @@ var MediaViewer = ModalView.extend({ }, add: function(media, $container){ - $container = $container || this.$myMedia var image = new Image () var $span = $("") $span.addClass("mediaContainer") @@ -131,7 +138,7 @@ var MediaViewer = ModalView.extend({ $span.data("media", media) $span.append(image) - $container.prepend($span) + $container.prepend($span) }, deleteIsArmed: false, diff --git a/public/assets/javascripts/util.js b/public/assets/javascripts/util.js index 5a89c48..76c5c7b 100644 --- a/public/assets/javascripts/util.js +++ b/public/assets/javascripts/util.js @@ -92,9 +92,10 @@ function smoothstep(min,max,n){ } function shuffle(a){ + var r, swap for (var i = a.length; i > 0; i--){ - var r = randint(i) - var swap = a[i-1] + r = randint(i) + swap = a[i-1] a[i-1] = a[r] a[r] = swap } diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 11512b9..349d0d0 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -51,6 +51,7 @@ + -- cgit v1.2.3-70-g09d2 From 6e5dbdeb78b72bf9775ed2ea233db0b2ad8b5e41 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 13:03:24 -0400 Subject: get coordinates for point --- .../assets/javascripts/rectangles/models/wall.js | 8 ++++++ .../assets/javascripts/rectangles/util/coords.js | 33 ++++++++++++++++++++++ views/partials/scripts.ejs | 3 ++ 3 files changed, 44 insertions(+) create mode 100644 public/assets/javascripts/rectangles/util/coords.js (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 1b37aa0..07c3971 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -51,6 +51,14 @@ }) }, mousemove: function(e){ + var offset = offsetFromPoint(e, mx.el) + if (offset) { + console.log([offset.left * mx.width + mx.face.x.a, (1-offset.top) * mx.height + mx.face.y.a].map(Math.round)) +// console.log(mx) + } + else { + console.log("NONE") + } }, mousedown: function(e){ if (Scenery.nextMedia) { diff --git a/public/assets/javascripts/rectangles/util/coords.js b/public/assets/javascripts/rectangles/util/coords.js new file mode 100644 index 0000000..74b7fda --- /dev/null +++ b/public/assets/javascripts/rectangles/util/coords.js @@ -0,0 +1,33 @@ +function offsetFromPoint(event, element) { + function a(width) { + var l = 0, r = 200; + while (r - l > 0.0001) { + var mid = (r + l) / 2; + var a = document.createElement('div'); + a.style.cssText = 'position: absolute;left:0;top:0;background: red;z-index: 1000;'; + a.style[width ? 'width' : 'height'] = mid.toFixed(3) + '%'; + a.style[width ? 'height' : 'width'] = '100%'; + element.appendChild(a); + var x = document.elementFromPoint(event.clientX, event.clientY); + element.removeChild(a); + if (x === a) { + r = mid; + } else { + if (r === 200) { + return null; + } + l = mid; + } + } + return mid; + } + var l = a(1), + t = a(0); + return l && t ? { + left: l / 100, + top: t / 100, + toString: function () { + return 'left: ' + l + '%, top: ' + t + '%'; + } + } : null; +} diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 1ce180a..5ddab2a 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -21,8 +21,10 @@ + + @@ -33,6 +35,7 @@ + -- cgit v1.2.3-70-g09d2 From fa81420e382366ffd0d2262f1af6143399f7a91d Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 14:32:03 -0400 Subject: transform screen coordinates into a 3d point --- .../javascripts/rectangles/engine/scenery/move.js | 2 +- .../assets/javascripts/rectangles/models/vec2.js | 7 ++++++ .../assets/javascripts/rectangles/models/wall.js | 29 +++++++++++++++++----- 3 files changed, 31 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 e7ca4ef..981eb68 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/move.js +++ b/public/assets/javascripts/rectangles/engine/scenery/move.js @@ -102,7 +102,7 @@ Scenery.move = function(base){ // TODO: watch individual scenery object here Minotaur.watch( app.router.editorView.settings ) - + oldState = null } diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 0040435..a5a832e 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -37,6 +37,9 @@ vec2.prototype.midpoint = function(){ return lerp(0.5, this.a, this.b) } + vec2.prototype.lerp = function(n){ + return lerp(n, this.a, this.b) + } vec2.prototype.eq = function(v){ return this.a == v.a && this.b == v.b } @@ -63,6 +66,10 @@ vec2.prototype.zero = function(){ this.a = this.b = 0 } + vec2.prototype.round = function(){ + this.a = Math.round(this.a) + this.b = Math.round(this.b) + } vec2.prototype.setPosition = function(n){ var len = this.length() this.a = n diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 07c3971..fdf54f0 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -50,16 +50,24 @@ index: index, }) }, +/* mousemove: function(e){ var offset = offsetFromPoint(e, mx.el) + var shouldFlip = base.side & (RIGHT | FRONT) if (offset) { - console.log([offset.left * mx.width + mx.face.x.a, (1-offset.top) * mx.height + mx.face.y.a].map(Math.round)) -// console.log(mx) - } - else { - console.log("NONE") + var pos = base.mxOffsetToPosition( offset, index ) + + var mx_pos = base.positionToMx(pos, new vec2(5,5)) + var mx_dot = new MX.Object3D + mx_dot.move(mx_pos) + mx_dot.width = 5 + mx_dot.height = 5 + mx_dot.rotationY = wall_rotation[base.side] + mx_dot.el.style.backgroundColor = "red" + scene.add(mx_dot) } }, +*/ mousedown: function(e){ if (Scenery.nextMedia) { var scenery = Scenery.addNextToWall({ @@ -184,7 +192,16 @@ } return position } - + Wall.prototype.mxOffsetToPosition = function( offset, index ) { + var face = this.surface.faces[index] + var shouldFlip = this.side & (RIGHT | FRONT) + var position = new vec2(0,0) + position.a = face.x.lerp(shouldFlip ? 1-offset.left : offset.left) + position.b = face.y.lerp(1-offset.top) + position.round() + return position + } + Wall.prototype.color = function(color){ this.$walls.css("background-color", color) } -- cgit v1.2.3-70-g09d2 From 55639122a00e77aaca1c6ac2faa5bc9f61ce7124 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 15:17:28 -0400 Subject: fix intro animation --- public/assets/javascripts/rectangles/models/wall.js | 4 +++- public/assets/javascripts/ui/site/EditProfileModal.js | 1 - public/assets/stylesheets/app.css | 2 ++ server/lib/api/profile.js | 2 ++ 4 files changed, 7 insertions(+), 2 deletions(-) (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 fdf54f0..ce958db 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -69,7 +69,9 @@ }, */ mousedown: function(e){ - if (Scenery.nextMedia) { + if (Scenery.nextText) { + } + else if (Scenery.nextMedia) { var scenery = Scenery.addNextToWall({ wall: base, index: index diff --git a/public/assets/javascripts/ui/site/EditProfileModal.js b/public/assets/javascripts/ui/site/EditProfileModal.js index e4e1e10..d0e5d05 100644 --- a/public/assets/javascripts/ui/site/EditProfileModal.js +++ b/public/assets/javascripts/ui/site/EditProfileModal.js @@ -11,7 +11,6 @@ var EditProfileModal = ModalFormView.extend({ load: function(){ this.reset() $.get("/api/profile", function(data){ - console.log(data) for (var i in data) { this.$("[name='" + i + "']").val(data[i]) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 3edad4f..32da0be 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1908,6 +1908,8 @@ form li textarea { -webkit-transition:0.2s all; -moz-transition:0.2s all; transition:0.2s all; + -webkit-transform: translate3d(0,-999px,0); + transform: translate3d(0,-999px,0); } .desktop .hero .circle:hover { diff --git a/server/lib/api/profile.js b/server/lib/api/profile.js index fdd1bde..996505f 100644 --- a/server/lib/api/profile.js +++ b/server/lib/api/profile.js @@ -10,6 +10,8 @@ var _ = require('lodash'), var profile = { show: function(req, res){ User.findOne({ _id: req.user._id }, function(err, user){ + user = user.toObject() + delete user.password res.json(err || user) }) }, -- cgit v1.2.3-70-g09d2 From f7c36f7a3394caa90937c5687f3ac7aeeed82e82 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 16:18:12 -0400 Subject: add media closer to where you clicked --- .../javascripts/rectangles/engine/scenery/move.js | 1 - .../rectangles/engine/scenery/types/_object.js | 26 ++++++++++++++++++++-- .../rectangles/engine/scenery/types/image.js | 9 +++++++- .../rectangles/engine/scenery/types/video.js | 9 +++++++- .../assets/javascripts/rectangles/models/vec2.js | 10 +++++++++ .../assets/javascripts/rectangles/models/wall.js | 9 ++++++-- views/projects/list-projects.ejs | 7 +++--- 7 files changed, 61 insertions(+), 10 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 981eb68..7d148cf 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/move.js +++ b/public/assets/javascripts/rectangles/engine/scenery/move.js @@ -88,7 +88,6 @@ Scenery.move = function(base){ } function up (e, cursor){ - console.log(dragging, oldState) if (! dragging || ! oldState) return dragging = false diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js index 5eed53e..4e5e2c5 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/_object.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/_object.js @@ -33,11 +33,33 @@ Scenery.types.base = Fiber.extend(function(base){ var center = this.bounds.center() center.a -= this.dimensions.a / 2 center.b -= this.dimensions.b / 2 - var mx_position = this.wall.positionToMx( center, this.dimensions ) - this.mx.move(mx_position) this.position.assign(center) }, + translateTo: function (position){ + var flipX = this.wall.side & (FRONT | RIGHT) + var delta = position.clone().subVec(this.position) + delta.a -= this.dimensions.a/2 + delta.b -= this.dimensions.b/2 + + if (flipX) { delta.a *= -1 } + + var new_bounds = this.wall.surface.translate( this.bounds, this.dimensions, this.position, delta ) + + this.position.b += delta.b + + switch (this.wall.side) { + case FRONT: + case BACK: + this.position.a += delta.a * cos(wall_rotation[this.wall.side]) + break + case LEFT: + case RIGHT: + this.position.a += delta.a * sin(wall_rotation[this.wall.side]) + break + } + }, + bind: function(){ this.move.bind() $(this.mx.el).bind({ diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js index d2fa3ab..aa43341 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js @@ -22,7 +22,14 @@ Scenery.types.image = Scenery.types.base.extend(function(base){ } else { this.set_wall(opt) - this.bounds && this.recenter() + if (this.bounds) { + this.recenter() + if (opt.position) { + this.translateTo(opt.position) + } + var mx_position = this.wall.positionToMx( this.position, this.dimensions ) + this.mx.move(mx_position) + } } }, diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js index 76f32ac..2ef6ec3 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js @@ -21,7 +21,14 @@ Scenery.types.video = Scenery.types.base.extend(function(base){ } else { this.set_wall(opt) - this.bounds && this.recenter() + if (this.bounds) { + this.recenter() + if (opt.position) { + this.translateTo(opt.position) + } + var mx_position = this.wall.positionToMx( this.position, this.dimensions ) + this.mx.move(mx_position) + } } }, diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index a5a832e..49613c3 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -63,6 +63,16 @@ this.b /= n return this } + vec2.prototype.addVec = function(v){ + this.a += v.a + this.b += v.b + return this + } + vec2.prototype.subVec = function(v){ + this.a -= v.a + this.b -= v.b + return this + } vec2.prototype.zero = function(){ this.a = this.b = 0 } diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index ce958db..fdc8d8c 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -53,7 +53,6 @@ /* mousemove: function(e){ var offset = offsetFromPoint(e, mx.el) - var shouldFlip = base.side & (RIGHT | FRONT) if (offset) { var pos = base.mxOffsetToPosition( offset, index ) @@ -72,9 +71,15 @@ if (Scenery.nextText) { } else if (Scenery.nextMedia) { + var offset = offsetFromPoint(e, mx.el) + if (! offset) { return } + + var pos = base.mxOffsetToPosition( offset, index ) + var scenery = Scenery.addNextToWall({ wall: base, - index: index + index: index, + position: pos, }) // scenery was not placed diff --git a/views/projects/list-projects.ejs b/views/projects/list-projects.ejs index 5694648..f3332b2 100644 --- a/views/projects/list-projects.ejs +++ b/views/projects/list-projects.ejs @@ -14,11 +14,12 @@ [[ }) ]] - [[ if (String(user._id) == String(project.user_id)) { ]] -
edit
 - [[ } ]]
+ [[ if (String(user._id) == String(project.user_id)) { ]] + + [[ } else { ]] + [[ } ]] [[- project.name ]]
[[- project.date ]] -- cgit v1.2.3-70-g09d2 From c19fbc87676404636a2f5df304ddd7875fc98e66 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 6 Oct 2014 16:01:13 -0400 Subject: new scenery type: text --- public/assets/img/text-cursor.png | Bin 0 -> 1622 bytes public/assets/javascripts/mx/primitives/mx.text.js | 67 +++++++++------- .../rectangles/engine/rooms/projector.js | 30 -------- .../rectangles/engine/scenery/_scenery.js | 4 + .../rectangles/engine/scenery/resize.js | 16 +--- .../rectangles/engine/scenery/types/image.js | 2 + .../rectangles/engine/scenery/types/text.js | 66 ++++++++++++++++ .../rectangles/engine/scenery/types/video.js | 2 + .../assets/javascripts/rectangles/models/mat4.js | 78 ------------------- .../assets/javascripts/rectangles/models/wall.js | 8 +- .../assets/javascripts/ui/editor/EditorToolbar.js | 3 + public/assets/javascripts/ui/editor/EditorView.js | 10 ++- public/assets/javascripts/ui/editor/MediaEditor.js | 5 -- public/assets/javascripts/ui/editor/TextEditor.js | 85 ++++++++++++++++++++- public/assets/stylesheets/app.css | 5 +- views/controls/editor/text-editor.ejs | 4 + views/controls/editor/toolbar.ejs | 2 +- views/partials/scripts.ejs | 13 ++-- 18 files changed, 230 insertions(+), 170 deletions(-) create mode 100644 public/assets/img/text-cursor.png delete mode 100644 public/assets/javascripts/rectangles/engine/rooms/projector.js create mode 100644 public/assets/javascripts/rectangles/engine/scenery/types/text.js delete mode 100644 public/assets/javascripts/rectangles/models/mat4.js (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/img/text-cursor.png b/public/assets/img/text-cursor.png new file mode 100644 index 0000000..66e9e0d Binary files /dev/null and b/public/assets/img/text-cursor.png differ diff --git a/public/assets/javascripts/mx/primitives/mx.text.js b/public/assets/javascripts/mx/primitives/mx.text.js index 9c7af5c..7b8e595 100644 --- a/public/assets/javascripts/mx/primitives/mx.text.js +++ b/public/assets/javascripts/mx/primitives/mx.text.js @@ -3,34 +3,49 @@ MX.Text = MX.Object3D.extend({ init: function (ops) { this.type = "Text" - - var layer = new MX.Object3D('text') - layer.width = ops.width || 100 - layer.height = ops.height || 50 - layer.x = ops.x || 0 - layer.y = ops.y || 0 - layer.z = ops.z || 0 - layer.scale = ops.scale || 1 - layer.el.innerHTML = ops.value || "" - if (ops.id) layer.el.id = ops.id; - if (ops.background) layer.el.style.background = ops.background; - if (ops.color) layer.el.style.color = ops.color; - if (ops.fontSize) layer.el.style.fontSize = ops.fontSize + "px"; - this.add(layer) + this.type = "Image" + this.media = ops.media + this.width = 0 + this.height = 0 + this.x = ops.x || 0 + this.y = ops.y || 0 + this.z = ops.z || 0 + this.scale = ops.scale || 1 + this.backface = ops.backface || false - this.children.forEach(function (c, i) { - if (ops.classname) { - c.el.classList.add(ops.classname) - } - else { - } - c.el.style.backgroundRepeat = 'no-repeat' - }) + this.scale = ops.scale || 1 + this.width = ops.media.width + this.height = ops.media.height + this.x = ops.x || 0 + this.y = ops.y || 0 + this.z = ops.z || 0 + this.rotationX = ops.rotationX || 0 + this.rotationY = ops.rotationY || 0 + this.rotationZ = ops.rotationZ || 0 + + ops.className && this.el.classList.add(ops.className) + this.backface && this.el.classList.add("backface-visible") + this.el.classList.add("text") + this.el.classList.add("mx-scenery") + + this.inner = document.createElement("div") + this.inner.style.width = "100%" + this.el.appendChild(this.inner) + + this.load(ops) + }, + + load: function(ops){ + if (ops.color) this.el.style.color = ops.color; + if (ops.fontFamily) this.el.style.fontFamily = "'" + ops.fontFamily + "',sans-serif"; + if (ops.fontSize) this.el.style.fontSize = ops.fontSize + "px"; - this.dirty = true - this.updateChildren = true - this.update() - } + this.inner.innerHTML = ops.media.description || "" + }, + + setText: function(text){ + this.inner.innerHTML = text + }, }) diff --git a/public/assets/javascripts/rectangles/engine/rooms/projector.js b/public/assets/javascripts/rectangles/engine/rooms/projector.js deleted file mode 100644 index 2eac314..0000000 --- a/public/assets/javascripts/rectangles/engine/rooms/projector.js +++ /dev/null @@ -1,30 +0,0 @@ - -rooms.projector = new function(){ - - projector = new THREE.Projector(); - vector = new THREE.Vector3( mouse.x, mouse.y, 0.5 ); - projector.unprojectVector( vector, camera ); - - raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() ); - intersects = raycaster.intersectObjects( scene.children, true ); - -} - - - -THREE.Projector = function () { - - _viewProjectionMatrix = new THREE.Matrix4(), - - this.unprojectVector = function ( vector, camera ) { - camera.projectionMatrixInverse.getInverse( camera.projectionMatrix ); - - _viewProjectionMatrix.multiplyMatrices( - camera.matrixWorld, - camera.projectionMatrixInverse - ); - - return vector.applyProjection( _viewProjectionMatrix ); - }; - -} diff --git a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js index 69e9ba7..3d3067f 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js +++ b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js @@ -24,6 +24,10 @@ var Scenery = new function(){ case 'vimeo': scene_media = new Scenery.types.video (opt) break + + case 'text': + scene_media = new Scenery.types.text (opt) + break } base.list[scene_media.id] = scene_media return scene_media diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index 893237c..0ce976e 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -117,22 +117,13 @@ Scenery.resize = new function(){ base.bind = function(){ dots.forEach(function(dot){ Scenery.mouse.bind_el(dot.el) - $(dot.el).bind({ - mouseenter: function(e){ -// Scenery.resize.hovering = true - }, - mouseleave: function(e){ -// Scenery.resize.hovering = false -// base.defer_hide() - } - }) }) Scenery.mouse.on("down", down) Scenery.mouse.on("drag", drag) Scenery.mouse.on("up", up) } - this.unbind = function(){ + base.unbind = function(){ dots.forEach(function(dot){ Scenery.mouse.unbind_el(dot.el) }) @@ -151,7 +142,6 @@ Scenery.resize = new function(){ naturalDimension = obj.naturalDimensions dimension = obj.dimensions position = new vec3(obj.mx.x, obj.mx.y, obj.mx.z) - scale = obj.mx.scale oldState = obj.serialize() document.body.classList.add("dragging") @@ -165,7 +155,6 @@ Scenery.resize = new function(){ var width = cursor.x.magnitude() var height = cursor.y.magnitude() var mag = cursor.magnitude() - var old_width = dimension.a * scale if (abs(width) > abs(height)) { mag = x_sign * mag * sign(width) @@ -175,9 +164,6 @@ Scenery.resize = new function(){ } obj.set_scale( ( dimension.a + mag ) / naturalDimension.a ) - // dimension.a // scale * (old_width + mag) / old_width - -// console.log(scale, obj.mx.scale, dimension.a + mag, naturalDimension.a) if (selected_dot.side & LEFT_RIGHT) { obj.mx.x = position.a + cos(rotationY) * mag/2 * (x_sign) diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js index aa43341..bed847b 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js @@ -3,6 +3,8 @@ Scenery.types.image = Scenery.types.base.extend(function(base){ var exports = { + type: 'image', + init: function(opt){ opt.scale = opt.scale || (opt.data && opt.data.scale) || 300 / max(300, opt.media.width) diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/text.js b/public/assets/javascripts/rectangles/engine/scenery/types/text.js new file mode 100644 index 0000000..16c7a5c --- /dev/null +++ b/public/assets/javascripts/rectangles/engine/scenery/types/text.js @@ -0,0 +1,66 @@ + +Scenery.types.text = Scenery.types.base.extend(function(base){ + + var exports = { + + type: 'text', + + init: function(opt){ + + opt.scale = 1 + + base.init.call(this, opt) + + this.build() + this.bind() + + if (opt.data) { + if (opt.wall) { + var position = opt.wall.mxToPosition(opt.data.position) + opt.index = opt.wall.surface.index_for_x( position.a, 0 ) + } + this.set_wall(opt) + this.deserialize(opt.data) + } + else { + this.set_wall(opt) + if (this.bounds) { + this.recenter() + if (opt.position) { + this.translateTo(opt.position) + } + var mx_position = this.wall.positionToMx( this.position, this.dimensions ) + this.mx.move(mx_position) + } + } + }, + + build: function(){ + this.mx = new MX.Text({ + scale: this.scale, + media: this.media, + y: this.scale * this.media.height/2, + backface: false, + }) + scene.add( this.mx ) + }, + + setText: function(text){ + this.media.description = text + this.mx.setText(text) + }, + + serialize: function(){ + 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 + }, + } + + return exports +}) diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js index 2ef6ec3..b723f56 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js @@ -2,6 +2,8 @@ Scenery.types.video = Scenery.types.base.extend(function(base){ var exports = { + + type: 'video', init: function(opt){ opt.scale = opt.scale || (opt.data && opt.data.scale) || 300 / max(300, opt.media.width) diff --git a/public/assets/javascripts/rectangles/models/mat4.js b/public/assets/javascripts/rectangles/models/mat4.js deleted file mode 100644 index b061199..0000000 --- a/public/assets/javascripts/rectangles/models/mat4.js +++ /dev/null @@ -1,78 +0,0 @@ -function mat4(e){ - this.elements = [ 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 ] - return this -} -mat4.prototype.set = function (a) { - var els = this.elements - a.forEach(function(n,i){ els[i] = n }) - return this -} -mat4.prototype.clone = function(){ - return (new mat4).set(this.els) -} -mat4.prototype.identity = function () { - this.set([ - 1, 0, 0, 0, - 0, 1, 0, 0, - 0, 0, 1, 0, - 0, 0, 0, 1 - ]); - return this; -} -mat4.prototype.getInverse = function (m, throwOnInvertible) { - - // based on http://www.euclideanspace.com/maths/algebra/matrix/functions/inverse/fourD/index.htm - var te = this.elements; - var me = m.elements; - - var n11 = me[0], n12 = me[4], n13 = me[8], n14 = me[12]; - var n21 = me[1], n22 = me[5], n23 = me[9], n24 = me[13]; - var n31 = me[2], n32 = me[6], n33 = me[10], n34 = me[14]; - var n41 = me[3], n42 = me[7], n43 = me[11], n44 = me[15]; - - te[0] = n23*n34*n42 - n24*n33*n42 + n24*n32*n43 - n22*n34*n43 - n23*n32*n44 + n22*n33*n44; - te[4] = n14*n33*n42 - n13*n34*n42 - n14*n32*n43 + n12*n34*n43 + n13*n32*n44 - n12*n33*n44; - te[8] = n13*n24*n42 - n14*n23*n42 + n14*n22*n43 - n12*n24*n43 - n13*n22*n44 + n12*n23*n44; - te[12] = n14*n23*n32 - n13*n24*n32 - n14*n22*n33 + n12*n24*n33 + n13*n22*n34 - n12*n23*n34; - te[1] = n24*n33*n41 - n23*n34*n41 - n24*n31*n43 + n21*n34*n43 + n23*n31*n44 - n21*n33*n44; - te[5] = n13*n34*n41 - n14*n33*n41 + n14*n31*n43 - n11*n34*n43 - n13*n31*n44 + n11*n33*n44; - te[9] = n14*n23*n41 - n13*n24*n41 - n14*n21*n43 + n11*n24*n43 + n13*n21*n44 - n11*n23*n44; - te[13] = n13*n24*n31 - n14*n23*n31 + n14*n21*n33 - n11*n24*n33 - n13*n21*n34 + n11*n23*n34; - te[2] = n22*n34*n41 - n24*n32*n41 + n24*n31*n42 - n21*n34*n42 - n22*n31*n44 + n21*n32*n44; - te[6] = n14*n32*n41 - n12*n34*n41 - n14*n31*n42 + n11*n34*n42 + n12*n31*n44 - n11*n32*n44; - te[10] = n12*n24*n41 - n14*n22*n41 + n14*n21*n42 - n11*n24*n42 - n12*n21*n44 + n11*n22*n44; - te[14] = n14*n22*n31 - n12*n24*n31 - n14*n21*n32 + n11*n24*n32 + n12*n21*n34 - n11*n22*n34; - te[3] = n23*n32*n41 - n22*n33*n41 - n23*n31*n42 + n21*n33*n42 + n22*n31*n43 - n21*n32*n43; - te[7] = n12*n33*n41 - n13*n32*n41 + n13*n31*n42 - n11*n33*n42 - n12*n31*n43 + n11*n32*n43; - te[11] = n13*n22*n41 - n12*n23*n41 - n13*n21*n42 + n11*n23*n42 + n12*n21*n43 - n11*n22*n43; - te[15] = n12*n23*n31 - n13*n22*n31 + n13*n21*n32 - n11*n23*n32 - n12*n21*n33 + n11*n22*n33; - - var det = n11 * te[ 0 ] + n21 * te[ 4 ] + n31 * te[ 8 ] + n41 * te[ 12 ]; - - if ( det == 0 ) { - var msg = "Matrix4.getInverse(): can't invert matrix, determinant is 0"; - - if ( throwOnInvertible || false ) { - throw new Error( msg ) - } - else { - console.warn( msg ) - } - this.identity(); - return this - } - this.multiplyScalar( 1 / det ); - return this -} -mat4.prototype.multiplyScalar = function (n) { - var els = this.elements - els[0] *= n; els[4] *= n; els[8] *= n; els[12] *= n - els[1] *= n; els[5] *= n; els[9] *= n; els[13] *= n - els[2] *= n; els[6] *= n; els[10] *= n; els[14] *= n - els[3] *= n; els[7] *= n; els[11] *= n; els[15] *= n - return this -} - diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index fdc8d8c..dc38183 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -68,9 +68,7 @@ }, */ mousedown: function(e){ - if (Scenery.nextText) { - } - else if (Scenery.nextMedia) { + if (Scenery.nextMedia) { var offset = offsetFromPoint(e, mx.el) if (! offset) { return } @@ -91,13 +89,15 @@ app.controller.toolbar.resetPermissions() Scenery.resize.show(scenery) Scenery.hovering = true + + app.controller.pick(scenery) UndoStack.push({ type: 'create-scenery', undo: { id: scenery.id }, redo: scenery.serialize(), }) - + // TODO: watch individual scenery object here Minotaur.watch( app.router.editorView.settings ) } diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js index 513306d..49decc2 100644 --- a/public/assets/javascripts/ui/editor/EditorToolbar.js +++ b/public/assets/javascripts/ui/editor/EditorToolbar.js @@ -3,6 +3,7 @@ var EditorToolbar = View.extend({ el: "#editorToolbar", events: { + "mousedown": 'stopPropagation', "click [data-role='toggle-map-view']": 'toggleMap', "click [data-role='toggle-project-settings']": 'toggleSettings', "click [data-role='open-media-viewer']": 'openMediaViewer', @@ -42,6 +43,7 @@ var EditorToolbar = View.extend({ // this.resizeMedia(true) // this.destroyMedia(false) $(".inuse").removeClass("inuse") + $("body").removeClass("addText") this.parent.hideExtras() this.resetPermissions() }, @@ -131,6 +133,7 @@ var EditorToolbar = View.extend({ $("[data-role='toggle-text-editor']").toggleClass("inuse", state) this.parent.mediaEditor.hide() this.parent.wallpaperPicker.hide() + this.parent.lightControl.hide() this.parent.settings.hide() this.parent.textEditor.toggle(state) }, diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index 83db532..67687fe 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -42,11 +42,19 @@ var EditorView = View.extend({ }, pick: function(scenery){ - this.mediaEditor.pick(scenery) + if (scenery.type == "text") { + this.mediaEditor.hide() + this.textEditor.pick(scenery) + } + else { + this.textEditor.hide() + this.mediaEditor.pick(scenery) + } }, hideExtras: function(){ this.mediaEditor.hide() + this.textEditor.hide() Scenery.resize.hide() Scenery.hovering = false } diff --git a/public/assets/javascripts/ui/editor/MediaEditor.js b/public/assets/javascripts/ui/editor/MediaEditor.js index e4f93df..0a4d894 100644 --- a/public/assets/javascripts/ui/editor/MediaEditor.js +++ b/public/assets/javascripts/ui/editor/MediaEditor.js @@ -76,7 +76,6 @@ var MediaEditor = FormView.extend({ case "image": this.$(".image").show() this.$(".video").hide() - break case "youtube": @@ -90,7 +89,6 @@ var MediaEditor = FormView.extend({ this.$loop.prop('checked', !! media.loop) this.$mute.prop('checked', !! media.mute) this.$keyframe.val( Number(media.keyframe || 0) ) - break } }, @@ -166,7 +164,6 @@ var MediaEditor = FormView.extend({ this.scenery.media.title = this.$name.val() this.scenery.media.description = this.$description.val() Minotaur.watch( app.router.editorView.settings ) - if (this.scenery.mx) { this.scenery.mx.bound = false this.scenery.mx.el.classList.remove("picked") @@ -177,8 +174,6 @@ var MediaEditor = FormView.extend({ }, destroy: function(){ -// ConfirmModal.confirm("Are you sure you want delete this object?", function(){ -// }.bind(this)) var scenery = this.scenery this.hide() Scenery.remove(scenery.id) diff --git a/public/assets/javascripts/ui/editor/TextEditor.js b/public/assets/javascripts/ui/editor/TextEditor.js index 0319a31..0d082ca 100644 --- a/public/assets/javascripts/ui/editor/TextEditor.js +++ b/public/assets/javascripts/ui/editor/TextEditor.js @@ -1,6 +1,8 @@ var TextEditor = FormView.extend({ el: "#textEditor", + tainted: false, + scenery: null, events: { "keydown": 'taint', @@ -9,20 +11,87 @@ var TextEditor = FormView.extend({ "change [name=font-family]": 'changeFontFamily', "change [name=font-size]": 'changeFontSize', "input [name=text-body]": 'changeText', - "click [data-role=destroy-media]": "destroy", + "click [data-role=destroy-text]": "destroy", }, initialize: function(opt){ this.parent = opt.parent this.__super__.initialize.call(this) + this.$settings = this.$(".setting") + this.$noTextMessage = this.$(".no-text") this.$fontFamily = this.$("[name=font-family]") this.$fontSize = this.$("[name=font-size]") this.$textBody = this.$("[name=text-body]") }, toggle: function(state){ - this.$el.toggleClass("active", state); + $("#keyhint").fadeOut(200) + + this.$el.toggleClass("active", state) + if (state) { + Scenery.nextMedia = { type: 'text', width: 300, height: 150 } + this.createMode(true) + } + }, + + hide: function(scenery){ + if (this.scenery) { + this.unbind() + } + this.toggle(false) + }, + + taint: function(e){ + e.stopPropagation() + this.tainted = true + }, + + bind: function(scenery){ + this.tainted = false + this.scenery = scenery + this.scenery.mx.bound = true + this.scenery.mx.el.classList.add("picked") + }, + + unbind: function(){ + if (this.scenery && this.tainted) { + Minotaur.watch( app.router.editorView.settings ) + + if (this.scenery.mx) { + this.scenery.mx.bound = false + this.scenery.mx.el.classList.remove("picked") + } + } + this.tainted = false + this.scenery = null + }, + + createMode: function(state){ + this.$settings.toggle(! state) + this.$noTextMessage.toggle(!! state) + $("body").toggleClass("addText", !! state) + }, + + pick: function(scenery){ + if (this.scenery) { + this.unbind() + } + + Scenery.resize.show(scenery) + Scenery.hovering = true + + this.bind(scenery) + this.$el.toggleClass("active", true) + this.$textBody.val( this.scenery.media.description ) + + this.createMode(false) + + if (! this.scenery.media.description) { + setTimeout(function(){ + this.$textBody.focus() + }.bind(this), 100) + } }, taint: function(e){ @@ -35,7 +104,17 @@ var TextEditor = FormView.extend({ changeFontSize: function(){ }, - changeText: function(){ + changeText: function(e){ + e.stopPropagation() + var text = this.$textBody.val() + this.scenery.setText(text) }, + + destroy: function(){ + var scenery = this.scenery + this.hide() + Scenery.remove(scenery.id) + Scenery.resize.hide() + }, }) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index e626d39..e746cad 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -667,9 +667,12 @@ iframe.embed { -webkit-box-sizing: content-box; box-sizing: content-box; } -.destroyActive .mx-scene, .destroyActive .mx-object3d.image, .menu span.inuse[data-role="destroy-media"] { +.destroyActive .mx-scene, .destroyActive .mx-object3d.image { cursor:url(/assets/img/delete-cursor.png), auto; } +.addText .mx-scene, .menu span.inuse[data-role="toggle-text-editor"] { + cursor:url(/assets/img/text-cursor.png), auto; +} .mx-scenery:active { cursor: pointer; diff --git a/views/controls/editor/text-editor.ejs b/views/controls/editor/text-editor.ejs index 205fbdf..a14c469 100644 --- a/views/controls/editor/text-editor.ejs +++ b/views/controls/editor/text-editor.ejs @@ -1,6 +1,10 @@

Edit Text

+
+ Click a wall to add text. +
+
diff --git a/views/controls/editor/toolbar.ejs b/views/controls/editor/toolbar.ejs index 85800f8..47d7c3c 100644 --- a/views/controls/editor/toolbar.ejs +++ b/views/controls/editor/toolbar.ejs @@ -4,10 +4,10 @@ data-role='open-media-viewer' data-info="add media" class="ion-ios7-photos-outline"> - +
-
- - -
-- cgit v1.2.3-70-g09d2 From a6d479579964014077502db5bc6e3af59c1f317e Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sat, 18 Oct 2014 09:34:46 -0400 Subject: reader adjustments --- public/assets/javascripts/rectangles/models/floor.js | 2 ++ public/assets/javascripts/ui/builder/BuilderInfo.js | 2 ++ public/assets/javascripts/ui/reader/MediaPlayer.js | 2 +- public/assets/stylesheets/app.css | 11 +++++++++-- 4 files changed, 14 insertions(+), 3 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 3f452e1..2fb870f 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -82,6 +82,8 @@ // TODO: watch individual scenery object here Minotaur.watch( app.router.editorView.settings ) + + app.controller.pickWall(base, null) } else { app.controller.pickWall(base, null) diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js index 4408511..4fd145d 100644 --- a/public/assets/javascripts/ui/builder/BuilderInfo.js +++ b/public/assets/javascripts/ui/builder/BuilderInfo.js @@ -96,6 +96,7 @@ var BuilderInfo = View.extend({ this.room.rect.x.setLength( this.$width.unitVal() ) Rooms.rebuild() }, + enterDepth: function(e){ if (e.keyCode == 13) this.changeDepth(e) }, @@ -104,6 +105,7 @@ var BuilderInfo = View.extend({ this.room.rect.y.setLength( this.$depth.unitVal() ) Rooms.rebuild() }, + enterHeight: function(e){ if (e.keyCode == 13) this.changeHeight(e) }, diff --git a/public/assets/javascripts/ui/reader/MediaPlayer.js b/public/assets/javascripts/ui/reader/MediaPlayer.js index 6195ab6..7f73e1b 100644 --- a/public/assets/javascripts/ui/reader/MediaPlayer.js +++ b/public/assets/javascripts/ui/reader/MediaPlayer.js @@ -44,7 +44,7 @@ var MediaPlayer = FormView.extend({ this.unbind() } if (media.type == "image") { - if ((! media.title || ! media.title.length) && (! media.description || ! media.description.length)) { + if ((! media.title || ! media.title.length) && (! media.description || ! media.description.length) || (media.title == filenameFromUrl(media.url)) ) { this.hide() return } diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 9df1573..226fe98 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1930,8 +1930,8 @@ input[type="range"]::-webkit-slider-thumb { } .playButton,.muteButton { - border-radius: 50px; - font-size: 22px; + border-radius: 50%; + font-size: 23px; padding: 5px 0; cursor: pointer; margin-right: 5px; @@ -1942,6 +1942,8 @@ input[type="range"]::-webkit-slider-thumb { } .playButton .on { display: inline; + position: relative; + left: 1px; } .playButton.paused .on { display: none; @@ -1956,6 +1958,8 @@ input[type="range"]::-webkit-slider-thumb { .muteButton .on { display: inline; padding-right: 3px; + position: relative; + left: 2px; } .muteButton.muted .on { display: none; @@ -1966,6 +1970,9 @@ input[type="range"]::-webkit-slider-thumb { .muteButton.muted .off { display: inline; padding-right: 3px; + position: relative; + left: 2px; + top: -1px; } .btn, button { -- cgit v1.2.3-70-g09d2 From b21cb665e3ca296b56d389d3a2f83434f4646f26 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 20 Oct 2014 16:42:08 -0400 Subject: logarithmic wallpaper scale --- public/assets/javascripts/rectangles/models/floor.js | 5 +++-- public/assets/javascripts/rectangles/models/wall.js | 7 ++++--- public/assets/javascripts/ui/editor/WallpaperPicker.js | 10 +++++----- views/controls/editor/wallpaper.ejs | 2 +- 4 files changed, 13 insertions(+), 11 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 2fb870f..ac1f8c9 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -146,8 +146,9 @@ Floor.prototype.wallpaperPosition = function(background){ if (this.background.src == "none") { return } - this.background.x = background.x || this.background.x - this.background.y = background.y || this.background.y + + this.background.x = background.x || this.background.x || 0 + this.background.y = background.y || this.background.y || 0 this.background.scale = background.scale || this.background.scale || 1 var mx, dx, dy diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js index 75814dc..8590de7 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -288,10 +288,11 @@ Wall.prototype.wallpaperPosition = function(background){ if (this.background.src == "none") { return } - this.background.x = background.x || this.background.x - this.background.y = background.y || this.background.y + + this.background.x = background.x || this.background.x || 0 + this.background.y = background.y || this.background.y || 0 this.background.scale = background.scale || this.background.scale || 1 - + var mx, dx, dy var w = Math.round( this.backgroundImage.naturalWidth * this.background.scale ) var h = Math.round( this.backgroundImage.naturalHeight * this.background.scale ) diff --git a/public/assets/javascripts/ui/editor/WallpaperPicker.js b/public/assets/javascripts/ui/editor/WallpaperPicker.js index b26a5dc..8f701b0 100644 --- a/public/assets/javascripts/ui/editor/WallpaperPicker.js +++ b/public/assets/javascripts/ui/editor/WallpaperPicker.js @@ -157,13 +157,13 @@ var WallpaperPicker = UploadView.extend({ return; } this.wall = wall - this.$scale.val( this.wall.background.scale ) + this.$scale.val( Math.log( this.wall.background.scale ) ) }, updateScale: function(){ if (! this.wall) return; - s = parseFloat(this.$scale.val()) - this.wall.wallpaperPosition({ scale: s }) + var scale = Math.exp( parseFloat(this.$scale.val()) ) + this.wall.wallpaperPosition({ scale: scale }) }, tileWalls: function(){ @@ -192,7 +192,7 @@ var WallpaperPicker = UploadView.extend({ down: function(e, cursor){ if (! base.wall) return dragging = true - s = parseFloat( base.$scale.val() ) + // s = parseFloat( base.$scale.val() ) x = base.wall.background.x y = base.wall.background.y }, @@ -203,7 +203,7 @@ var WallpaperPicker = UploadView.extend({ dx = delta.a*s dy = delta.b*s base.wall.wallpaperPosition({ - scale: s, + // scale: s, x: x+dx, y: y+dy, }) diff --git a/views/controls/editor/wallpaper.ejs b/views/controls/editor/wallpaper.ejs index 69a60ec..d2559cc 100644 --- a/views/controls/editor/wallpaper.ejs +++ b/views/controls/editor/wallpaper.ejs @@ -25,7 +25,7 @@
- +
-- cgit v1.2.3-70-g09d2 From de6fa5bf0e7f0a55341d05f5a5b1dfb19330aeb0 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 29 Oct 2014 18:25:12 -0400 Subject: stub in fixes to mover --- .../javascripts/rectangles/engine/rooms/mover.js | 38 +++++++++++++++++++++- .../assets/javascripts/rectangles/models/room.js | 6 ++-- public/assets/javascripts/ui/reader/MediaPlayer.js | 2 +- server/lib/views/index.js | 6 ++-- 4 files changed, 44 insertions(+), 8 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/rooms/mover.js b/public/assets/javascripts/rectangles/engine/rooms/mover.js index fae2ce6..121ecec 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/mover.js +++ b/public/assets/javascripts/rectangles/engine/rooms/mover.js @@ -34,7 +34,43 @@ Rooms.mover = new function(){ } // check if we've breached one of the walls.. clamp position if so - var collision = base.room.collidesDisc(pos.x, pos.z, radius) + var collision = base.room.collidesDisc(cam, pos, radius) + +/* + var dz = new vec2( cam.z, pos.z ) + dz.normalize() + + var dx = new vec2( cam.x, pos.x ) + dx.normalize() + + Walls.list.forEach(function(wall){ + switch (wall.side) { + case FRONT: + break + case BACK: + break + case LEFT: + if (cam.x >= wall.edge + radius && wall.edge + radius >= pos.x && (wall.vec.intersects(dz) ) { + // intersects the wall.. next check if it intersects any of the surface frames + wall.surface.faces.some(function(face, i){ + // if we can pass through the wall at this point, we do not need to clamp + if (face.y.a === 0 && face.x.intersects(dz)) { + dz.a = pos.z = face.x.clamp(pos.z) + dz.b = cam.z + dz.normalize() + return true + } + }) + } + break + case RIGHT: + if (cam.x <= wall.edge - radius && wall.edge - radius <= pos.x && (wall.vec.contains(cam.z) || wall.vec.contains(pos.z)) ) { + // intersects + } + break + } + }) +*/ if (collision && ! base.noclip) { cam.x = (collision & LEFT_RIGHT) ? base.room.rect.x.clampDisc(pos.x, radius) : pos.x diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js index b0344a1..26bf055 100644 --- a/public/assets/javascripts/rectangles/models/room.js +++ b/public/assets/javascripts/rectangles/models/room.js @@ -122,7 +122,8 @@ return collision } - Room.prototype.collidesDisc = function(x,y,radius){ + 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 @@ -152,9 +153,6 @@ if (contains_y) { collision |= wall_collision & LEFT_RIGHT } -// if (bitcount(wall_collision) > 1) { -// collision |= wall_collision -// } }) return collision } diff --git a/public/assets/javascripts/ui/reader/MediaPlayer.js b/public/assets/javascripts/ui/reader/MediaPlayer.js index 7f73e1b..e40c6ff 100644 --- a/public/assets/javascripts/ui/reader/MediaPlayer.js +++ b/public/assets/javascripts/ui/reader/MediaPlayer.js @@ -44,7 +44,7 @@ var MediaPlayer = FormView.extend({ this.unbind() } if (media.type == "image") { - if ((! media.title || ! media.title.length) && (! media.description || ! media.description.length) || (media.title == filenameFromUrl(media.url)) ) { + if ( ! media.description && (! media.title || media.title == filenameFromUrl(media.url)) ) { this.hide() return } diff --git a/server/lib/views/index.js b/server/lib/views/index.js index 0b5a1fe..7ffadb9 100644 --- a/server/lib/views/index.js +++ b/server/lib/views/index.js @@ -38,10 +38,12 @@ var views = module.exports = { } else if (req.isOwner || req.isCollaborator || req.isStaff) { res.locals.opt.editing = true - res.render('editor') + res.render('editor', { + ogUrl: "http://vvalls.com/project/" + req.project.slug + "/", + }) } else { - views.reader(req, res) + res.redirect("/project/" + req.project.slug + "/") } }, -- cgit v1.2.3-70-g09d2 From 2c2c70965efb50b500799ae7966a42e86bbac480 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Fri, 31 Oct 2014 10:18:39 -0400 Subject: fix floating point error :-P --- public/assets/javascripts/rectangles/models/rect.js | 6 ++++++ public/assets/javascripts/rectangles/models/vec2.js | 5 ++++- public/assets/test/intersect.html | 15 +++++++++++---- 3 files changed, 21 insertions(+), 5 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/rect.js b/public/assets/javascripts/rectangles/models/rect.js index 00f2c55..c667cf5 100644 --- a/public/assets/javascripts/rectangles/models/rect.js +++ b/public/assets/javascripts/rectangles/models/rect.js @@ -169,6 +169,12 @@ var s = "[" + this.x.toString() + " " + this.y.toString() + "] " + sides return s } + Rect.prototype.exactString = function(){ + var sides = sidesToString(this.sides) + var s = "[" + this.x.exactString() + " " + this.y.exactString() + "] " + sides + return s + } + Rect.prototype.serialize = function(){ return { x: this.x.serialize(), y: this.y.serialize() } } diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 49613c3..f28df54 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -200,7 +200,10 @@ } vec2.prototype.toString = function(){ - return "[" + ~~this.a + " " + ~~this.b + "]" + return "[" + round(this.a) + " " + round(this.b) + "]" + } + vec2.prototype.exactString = function(){ + return "[" + this.a + " " + this.b + "]" } vec2.prototype.serialize = function(){ return [ ~~this.a, ~~this.b ] diff --git a/public/assets/test/intersect.html b/public/assets/test/intersect.html index 5e16f2e..4e5b0bb 100644 --- a/public/assets/test/intersect.html +++ b/public/assets/test/intersect.html @@ -1,4 +1,5 @@ +
@@ -73,16 +74,21 @@ function draw () { var collinear = is_collinear( intersect, vec_b ) var long_enough_to_intersect = 0 <= t && t <= 1 + var msg if (long_enough_to_intersect && collinear) { ctx.fillStyle = "#f00" + msg = "through" } else if (collinear) { ctx.fillStyle = "#0f0" + msg = "to" } else { ctx.fillStyle = "#000" + msg = "off" } + hud.innerHTML = [intersect.exactString(), vec_b.exactString(), msg].join("
") drawPoint(intersect) } @@ -105,19 +111,20 @@ function perp (va, vb) { } function is_collinear (p, vec) { var on_x, on_y + var pa = round(p.a), pb = round(p.b) if (vec.x.a < vec.y.a) { - on_x = vec.x.a <= p.a && p.a <= vec.y.a + on_x = vec.x.a <= pa && pa <= vec.y.a } else { - on_x = vec.x.a >= p.a && p.a >= vec.y.a + on_x = vec.x.a >= pa && pa >= vec.y.a } if (vec.x.b < vec.y.b) { - on_y = vec.x.b <= p.b && p.b <= vec.y.b + on_y = vec.x.b <= pb && pb <= vec.y.b } else { - on_y = vec.x.b >= p.b && p.b >= vec.y.b + on_y = vec.x.b >= pb && pb >= vec.y.b } return !! (on_x && on_y) -- cgit v1.2.3-70-g09d2 From f599c7edf7e635241e839fc024e4016ae0dcc210 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 31 Oct 2014 16:03:12 -0400 Subject: intersection test 2 - hit-testing on wall structure --- .../javascripts/rectangles/models/surface.js | 9 + public/assets/test/intersect2.html | 218 +++++++++++++++++++++ 2 files changed, 227 insertions(+) create mode 100644 public/assets/test/intersect2.html (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/surface.js b/public/assets/javascripts/rectangles/models/surface.js index 3a6c449..fc4aae4 100644 --- a/public/assets/javascripts/rectangles/models/surface.js +++ b/public/assets/javascripts/rectangles/models/surface.js @@ -154,6 +154,15 @@ } return -1 } + Surface.prototype.face_for_x = function(x, min_i){ + min_i = min_i || 0 + for (var i = min_i; i < this.faces.length; i++) { + if (this.faces[i].x.contains(x)) { + return this.faces[i] + } + } + return null + } Surface.prototype.bounds_at_index_with_dimensions = function(index, dimensions){ var faces = this.faces diff --git a/public/assets/test/intersect2.html b/public/assets/test/intersect2.html new file mode 100644 index 0000000..fade288 --- /dev/null +++ b/public/assets/test/intersect2.html @@ -0,0 +1,218 @@ + + +
+ + + + + + + + + + + + + + + + + + + + + + + + -- cgit v1.2.3-70-g09d2 From f08fd6f6910d6cc774051ef9f85307ac8557d740 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 31 Oct 2014 18:51:20 -0400 Subject: intersect3 putting this to rest --- .../javascripts/rectangles/models/surface.js | 7 + public/assets/test/intersect3.html | 230 +++++++++++++++++++++ 2 files changed, 237 insertions(+) create mode 100644 public/assets/test/intersect3.html (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/models/surface.js b/public/assets/javascripts/rectangles/models/surface.js index fc4aae4..f031665 100644 --- a/public/assets/javascripts/rectangles/models/surface.js +++ b/public/assets/javascripts/rectangles/models/surface.js @@ -12,6 +12,7 @@ var Surface = function (face){ this.bounds = new Rect (new vec2(0, 0), new vec2(0, 0)) + this.vec = new Rect (new vec2(0, 0), new vec2(0, 0)) this.faces = [] if (face) { this.add(face) @@ -161,6 +162,12 @@ return this.faces[i] } } + if (x < this.faces[0].x.a) { + return this.faces[0] + } + else { + return this.faces[this.faces.length-1] + } return null } diff --git a/public/assets/test/intersect3.html b/public/assets/test/intersect3.html new file mode 100644 index 0000000..4fec891 --- /dev/null +++ b/public/assets/test/intersect3.html @@ -0,0 +1,230 @@ + + +
+ + + + + + + + + + + + + + + + + + + + + + + + -- cgit v1.2.3-70-g09d2 From b5c6adb5fbc7225e7b655f02123d7f0995ae3b46 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Mon, 3 Nov 2014 01:20:37 -0500 Subject: extend vec in both directions --- .../assets/javascripts/rectangles/models/wall.js | 28 ++++++++++++ public/assets/test/intersect3.html | 53 ++++++++-------------- 2 files changed, 48 insertions(+), 33 deletions(-) (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 8590de7..a026c3c 100644 --- a/public/assets/javascripts/rectangles/models/wall.js +++ b/public/assets/javascripts/rectangles/models/wall.js @@ -25,6 +25,34 @@ Wall.prototype.toString = function(){ return this.vec.toString() } + Wall.prototype.get_points = function(wall_vec){ + wall_vec = wall_vec || new Rect () + if (this.side & LEFT) { + wall_vec.x.a = this.edge + wall_vec.x.b = this.vec.b + wall_vec.y.a = this.edge + wall_vec.y.b = this.vec.a + } + else if (this.side & RIGHT) { + wall_vec.x.a = this.edge + wall_vec.x.b = this.vec.a + wall_vec.y.a = this.edge + wall_vec.y.b = this.vec.b + } + else if (this.side & FRONT) { + wall_vec.x.a = this.vec.a + wall_vec.x.b = this.edge + wall_vec.y.a = this.vec.b + wall_vec.y.b = this.edge + } + else if (this.side & BACK) { + wall_vec.x.a = this.vec.b + wall_vec.x.b = this.edge + wall_vec.y.a = this.vec.a + wall_vec.y.b = this.edge + } + return wall_vec + } Wall.prototype.reset = function(){ } diff --git a/public/assets/test/intersect3.html b/public/assets/test/intersect3.html index 040dca4..13a8024 100644 --- a/public/assets/test/intersect3.html +++ b/public/assets/test/intersect3.html @@ -101,7 +101,7 @@ var mymouse = new mouse({ }, }) -function draw () { +function draw (time) { ctx.fillStyle = "#fff" ctx.fillRect(0,0,w,h) @@ -115,36 +115,16 @@ function draw () { drawLine(cursor.x, cursor.y, "#f00") // hud.innerHTML = "" - var closest_intersect, cursor_copy = new Rect(0,0,0,0), t, min_t = 1 - var cursor_copy = cursor.plus(scene.camera.radius) + var closest_intersect, t, min_t = 1 + var cursor_copy = cursor.extend_ends(scene.camera.radius) +hud.innerHTML = cursor_copy.x +drawPoint(cursor_copy.x, "#ff0") Walls.list.forEach(function(wall, i){ - if (wall.side & LEFT) { - wall_vec.x.a = wall.edge - wall_vec.x.b = wall.vec.b - wall_vec.y.a = wall.edge - wall_vec.y.b = wall.vec.a - } - else if (wall.side & RIGHT) { - wall_vec.x.a = wall.edge - wall_vec.x.b = wall.vec.a - wall_vec.y.a = wall.edge - wall_vec.y.b = wall.vec.b - } - else if (wall.side & FRONT) { - wall_vec.x.a = wall.vec.a - wall_vec.x.b = wall.edge - wall_vec.y.a = wall.vec.b - wall_vec.y.b = wall.edge - } - else if (wall.side & BACK) { - wall_vec.x.a = wall.vec.b - wall_vec.x.b = wall.edge - wall_vec.y.a = wall.vec.a - wall_vec.y.b = wall.edge - } + wall.get_points(wall_vec) drawLine(wall_vec.x, wall_vec.y, "#088") + origins.x = cursor_copy.x t = perp(origins, wall_vec) / ( perp(cursor_copy, wall_vec) || 0.0000001 ) intersect.a = cursor_copy.x.a + ( cursor_copy.y.a - cursor_copy.x.a ) * t intersect.b = cursor_copy.x.b + ( cursor_copy.y.b - cursor_copy.x.b ) * t @@ -196,6 +176,7 @@ function draw () { drawLine(wall_vec.x, wall_vec.y, "rgba(0,255,255,1.0)") + origins.x = cursor.x var new_t = perp(origins, wall_vec) / ( perp(cursor, wall_vec) || 0.0000001 ) var wall_t = perp(origins, cursor) / ( perp(wall_vec, cursor) || 0.0000001 ) var closest_intersect2 = new vec2() @@ -222,17 +203,21 @@ function draw () { len = clamp(len, 0, (1-min_t) * sqrt(dot(cursor, cursor))) - hud.innerHTML = [ aw ].map(function(n){ return round(deg(n)) }) - hud.innerHTML = " " + (dd > 0 ? "gt": "lt") + " " + round(len) + " " + (1-min_t) + " " + round((1-min_t)*sqrt(dot2(diff(cursor), diff(cursor)))) +// hud.innerHTML = [ aw ].map(function(n){ return round(deg(n)) }) +// hud.innerHTML = " " + (dd > 0 ? "gt": "lt") + " " + round(len) + " " + (1-min_t) + " " + round((1-min_t)*sqrt(dot2(diff(cursor), diff(cursor)))) var end_of_ray = closest_intersect2.clone() end_of_ray.a += len * cos(aw) end_of_ray.b += len * sin(aw) + + end_of_ray.a = clamp(end_of_ray.a, wall_vec.x.a, wall_vec.y.a) + end_of_ray.b = clamp(end_of_ray.b, wall_vec.x.b, wall_vec.y.b) + drawPoint(end_of_ray) drawLine(closest_intersect2, end_of_ray, "#00f") } else { - hud.innerHTML = [ (angle(cursor) + TWO_PI) % TWO_PI ].map(function(n){ return round(deg(n)) }) +// hud.innerHTML = [ (angle(cursor) + TWO_PI) % TWO_PI ].map(function(n){ return round(deg(n)) }) } } @@ -294,17 +279,19 @@ function is_collinear (p, vec) { return !! (on_x && on_y) } -cursor.plus = function(n){ +cursor.extend_ends = function(n){ var a = angle(this) var clone = this.clone() + clone.x.a -= n*cos(a) + clone.x.b -= n*sin(a) clone.y.a += n*cos(a) clone.y.b += n*sin(a) return clone } -function animate(){ +function animate(time){ requestAnimationFrame(animate) - draw() + draw(time) } animate() -- cgit v1.2.3-70-g09d2 From 00778a168b7314039e95e856f6d41e05d0dbc4e4 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 4 Nov 2014 14:44:02 -0500 Subject: fix resize undo --- public/assets/javascripts/app.js | 5 ----- .../assets/javascripts/rectangles/engine/scenery/types/image.js | 1 + .../assets/javascripts/rectangles/engine/scenery/types/text.js | 2 ++ .../assets/javascripts/rectangles/engine/scenery/types/video.js | 1 + public/assets/javascripts/rectangles/engine/scenery/undo.js | 9 ++++++--- public/assets/javascripts/rectangles/models/vec2.js | 6 +++++- public/assets/javascripts/vendor/polyfill.js | 5 +++++ 7 files changed, 20 insertions(+), 9 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js index 5e339ea..0488f11 100644 --- a/public/assets/javascripts/app.js +++ b/public/assets/javascripts/app.js @@ -1,9 +1,4 @@ -var is_iphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)); -var is_ipad = (navigator.userAgent.match(/iPad/i)); -var is_android = (navigator.userAgent.match(/Android/i)) -var is_mobile = is_iphone || is_ipad || is_android; - if (is_mobile) { // window.location.href = "mobile.html" $("html").addClass("mobile"); diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js index 10fc917..848f8d4 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js @@ -55,6 +55,7 @@ Scenery.types.image = Scenery.types.base.extend(function(base){ this.mx.move(data.position) this.mx.ops.width = data.dimensions.a this.mx.ops.height = data.dimensions.b + this.dimensions.deserialize(data.dimensions) }, } diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/text.js b/public/assets/javascripts/rectangles/engine/scenery/types/text.js index a10a332..dd1385f 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/text.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/text.js @@ -68,7 +68,9 @@ Scenery.types.text = Scenery.types.base.extend(function(base){ 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/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js index a669a90..d83cc63 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js @@ -117,6 +117,7 @@ Scenery.types.video = Scenery.types.base.extend(function(base){ this.mx.move(data.position) this.mx.ops.width = data.dimensions.a this.mx.ops.height = data.dimensions.b + this.dimensions.deserialize(data.dimensions) }, } diff --git a/public/assets/javascripts/rectangles/engine/scenery/undo.js b/public/assets/javascripts/rectangles/engine/scenery/undo.js index 998f7c6..6ad9e0d 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/undo.js +++ b/public/assets/javascripts/rectangles/engine/scenery/undo.js @@ -21,9 +21,10 @@ type: "update-scenery", undo: function(state){ var scenery = Scenery.find(state.id) + var wall = Walls.find( state.wall_id ) scenery.deserialize(state) - scenery.set_wall(Walls.find( state.wall_id )) + scenery.set_wall({ wall: wall }) if (editor.permissions.resize) { Scenery.resize.show(scenery) @@ -34,13 +35,15 @@ }, redo: function(state){ var scenery = Scenery.find(state.id) + var wall = Walls.find( state.wall_id ) + scenery.deserialize(state) - scenery.set_wall(Walls.find( state.wall_id )) + scenery.set_wall({ wall: wall }) if (editor.permissions.resize) { Scenery.resize.show(scenery) - Scenery.resize.rotate_dots() Scenery.resize.move_dots() + Scenery.resize.rotate_dots() } // TODO: watch individual scenery object here diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index f28df54..14d0e6b 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -206,7 +206,11 @@ return "[" + this.a + " " + this.b + "]" } vec2.prototype.serialize = function(){ - return [ ~~this.a, ~~this.b ] + return [ round(this.a), round(this.b) ] + } + vec2.prototype.deserialize = function(data){ + this.a = data[0] + this.b = data[1] } vec2.prototype.quantize = function(n){ n = n || 10 diff --git a/public/assets/javascripts/vendor/polyfill.js b/public/assets/javascripts/vendor/polyfill.js index f97e438..8e4b9dc 100644 --- a/public/assets/javascripts/vendor/polyfill.js +++ b/public/assets/javascripts/vendor/polyfill.js @@ -52,6 +52,11 @@ function has3d(){ return browser; })( navigator.userAgent ); +// Naive useragent detection pattern +var is_iphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)); +var is_ipad = (navigator.userAgent.match(/iPad/i)); +var is_android = (navigator.userAgent.match(/Android/i)) +var is_mobile = is_iphone || is_ipad || is_android; // rAF shim (function() { -- cgit v1.2.3-70-g09d2 From 32c2630d6f384f3315b514ddf6d71dd4753dda66 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 11 Nov 2014 15:34:48 -0500 Subject: resize text field without scaling --- .../rectangles/engine/scenery/_scenery.js | 1 + .../rectangles/engine/scenery/resize.js | 55 +++++++++++++++++----- .../rectangles/engine/scenery/types/text.js | 21 +-------- .../assets/javascripts/rectangles/models/vec3.js | 3 ++ public/assets/stylesheets/app.css | 2 + 5 files changed, 49 insertions(+), 33 deletions(-) (limited to 'public/assets/javascripts/rectangles/models') diff --git a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js index 8ca00d3..436712a 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js +++ b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js @@ -29,6 +29,7 @@ var Scenery = new function(){ case 'text': scene_media = new Scenery.types.text (opt) + scene_media.focused = true break } base.list[scene_media.id] = scene_media diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index e424829..5af7f3f 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -6,7 +6,7 @@ Scenery.resize = new function(){ var obj var x, y, z, bounds var dragging = false - var naturalDimension, dimension, position, scale + var naturalDimension, naturalDimensionCopy, dimension, position, scale var oldState var dots = [], dot, selected_dot @@ -143,6 +143,11 @@ Scenery.resize = new function(){ 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") } @@ -163,15 +168,23 @@ Scenery.resize = new function(){ mag = y_sign * mag * sign(height) } - 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 - } + 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() @@ -181,11 +194,26 @@ Scenery.resize = new function(){ function up (e, cursor){ if (! dragging) return dragging = false - selected_dot = null if (! editor.permissions.resize) { return } - obj.scale = obj.mx.ops.scale = obj.mx.scale - obj.dimensions.assign(obj.naturalDimensions).mul(obj.scale) + if (obj.type == "text") { + var newHeight = $(obj.mx.inner).height() + if (selected_dot.side & BOTTOM) { + obj.mx.y = position.b + (naturalDimensionCopy.b - newHeight) / 2 * obj.scale + } + else { + obj.mx.y = dots[0].y - newHeight/2*obj.scale + } + obj.mx.height = obj.media.height = naturalDimension.b = newHeight + dimension.a = naturalDimension.a * obj.scale + dimension.b = naturalDimension.b * obj.scale + base.move_dots() + } + else { + obj.scale = obj.mx.ops.scale = obj.mx.scale + obj.dimensions.assign(obj.naturalDimensions).mul(obj.scale) + } + UndoStack.push({ type: 'update-scenery', undo: oldState, @@ -196,6 +224,7 @@ Scenery.resize = new function(){ Minotaur.watch( app.router.editorView.settings ) document.body.classList.remove("dragging") + selected_dot = null } } diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/text.js b/public/assets/javascripts/rectangles/engine/scenery/types/text.js index dd1385f..6e11da2 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/text.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/text.js @@ -13,26 +13,7 @@ Scenery.types.text = Scenery.types.base.extend(function(base){ this.build() this.bind() - - if (opt.data) { - if (opt.wall) { - var position = opt.wall.mxToPosition(opt.data.position) - opt.index = opt.wall.surface.index_for_x( position.a, 0 ) - } - this.set_wall(opt) - this.deserialize(opt.data) - } - else { - this.set_wall(opt) - if (this.bounds) { - this.recenter() - if (opt.position) { - this.translateTo(opt.position) - } - var mx_position = this.wall.positionToMx( this.position, this.dimensions ) - this.mx.move(mx_position) - } - } + this.place(opt) }, build: function(){ diff --git a/public/assets/javascripts/rectangles/models/vec3.js b/public/assets/javascripts/rectangles/models/vec3.js index 4e00b0c..c44dfe6 100644 --- a/public/assets/javascripts/rectangles/models/vec3.js +++ b/public/assets/javascripts/rectangles/models/vec3.js @@ -15,6 +15,9 @@ vec3.prototype.sub = function(v){ this.c -= v.c return this } +vec3.prototype.clone = function(){ + return new vec3(this.a, this.b, this.c) +} // input: mat4 projection matrix vec3.prototype.apply_projection = function (m) { diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index e97ffa1..7b53cca 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -990,7 +990,9 @@ border-left: 1px solid black; pointer-events: none; } .mx-text { +/* overflow: hidden; + */ } .mx-text .inner { width: 100%; -- cgit v1.2.3-70-g09d2 From 220320494c60c154e84c579f86d2dfdd8f41be2f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 3 Feb 2015 17:41:36 -0500 Subject: orthographic polyline --- .../javascripts/rectangles/engine/map/_map.js | 8 + .../javascripts/rectangles/engine/map/draw.js | 19 +- .../assets/javascripts/rectangles/models/vec2.js | 5 + public/assets/test/ortho.html | 224 +++++++++++++++++++++ 4 files changed, 251 insertions(+), 5 deletions(-) create mode 100644 public/assets/test/ortho.html (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 202803a..d582982 100644 --- a/public/assets/javascripts/rectangles/engine/map/_map.js +++ b/public/assets/javascripts/rectangles/engine/map/_map.js @@ -48,6 +48,13 @@ var Map = function(opt){ base.el.appendChild(canvas) switch (opt.type) { + case "ortho": + base.draw = new Map.Draw (base, { ortho: true }) + base.ui = new Map.UI.Ortho (base) + base.sides = base.sides_for_camera + $(window).resize(base.resize) + break + case "editor": base.draw = new Map.Draw (base) base.ui = new Map.UI.Editor (base) @@ -65,6 +72,7 @@ var Map = function(opt){ base.resize = function(){ canvas.width = base.dimensions.a = window.innerWidth canvas.height = base.dimensions.b = window.innerHeight + // resize here - esp if 2d-hires } base.toggle = function(state){ diff --git a/public/assets/javascripts/rectangles/engine/map/draw.js b/public/assets/javascripts/rectangles/engine/map/draw.js index 5a9b592..b525696 100644 --- a/public/assets/javascripts/rectangles/engine/map/draw.js +++ b/public/assets/javascripts/rectangles/engine/map/draw.js @@ -5,14 +5,16 @@ Map.Draw = function(map, opt){ var draw = this - var ctx = map.canvas.getContext("2d") + var ctx = draw.ctx = map.canvas.getContext("2d") draw.animate = function(){ ctx.save() draw.clear() draw.fill("rgba(255,255,255,0.98)") - if (opt.minimap) { + if (opt.ortho) { + } + else if (opt.minimap) { ctx.translate( map.dimensions.a * 1/2, map.dimensions.b * 1/2) ctx.scale( map.zoom, map.zoom ) ctx.translate( opt.center.x, - opt.center.z ) @@ -22,7 +24,6 @@ Map.Draw = function(map, opt){ draw.regions(Rooms.regions, [ "#fff" ], "#000") draw.camera(scene.camera) } - else { ctx.translate( map.dimensions.a * 1/2, map.dimensions.b * 1/2) ctx.scale( map.zoom, map.zoom ) @@ -31,12 +32,19 @@ Map.Draw = function(map, opt){ draw.regions(Rooms.regions, [ "#f8f8f8" ], "#000") draw.mouse(map.ui.mouse.cursor) + draw.mouse_dimensions(map.ui.mouse.cursor) draw.coords() scene && draw.camera(scene.camera) } ctx.restore() } + draw.translate = function(){ + ctx.translate( map.dimensions.a * 1/2, map.dimensions.b * 1/2) + ctx.scale( map.zoom, map.zoom ) + ctx.translate( map.center.a, map.center.b ) + ctx.scale( -1, 1 ) + } // changes the ctx temporarily draw.render = function(){ @@ -87,7 +95,7 @@ Map.Draw = function(map, opt){ ctx.putImageData(pixelData, 0, 0) // reset the ctx - ctx = map.canvas.getContext("2d") + ctx = draw.ctx return canvas } @@ -123,7 +131,8 @@ Map.Draw = function(map, opt){ ctx.beginPath(); ctx.arc(mouse.x.b, mouse.y.b, radius, 0, 2*Math.PI, false); ctx.fill(); - + } + draw.mouse_dimensions = function(mouse){ if (mouse.width() != 0 && mouse.height() != 0) { if (map.ui.dragging) { stroke_rect(mouse) 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 diff --git a/public/assets/test/ortho.html b/public/assets/test/ortho.html new file mode 100644 index 0000000..8626453 --- /dev/null +++ b/public/assets/test/ortho.html @@ -0,0 +1,224 @@ + + +
+
+ +
+ + + + + + + + + + + + + + + + + + \ No newline at end of file -- 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