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 ++++++++++++++++++++++ 2 files changed, 41 insertions(+) create mode 100644 public/assets/javascripts/rectangles/util/coords.js (limited to 'public/assets/javascripts/rectangles') 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; +} -- cgit v1.2.3-70-g09d2 From b512bcdfe49e0bce336f848dcf620c3c533e1f8c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 13:12:40 -0400 Subject: saving icon --- public/assets/javascripts/rectangles/engine/scenery/move.js | 1 + public/assets/javascripts/rectangles/util/minotaur.js | 2 +- public/assets/stylesheets/app.css | 6 +++--- 3 files changed, 5 insertions(+), 4 deletions(-) (limited to 'public/assets/javascripts/rectangles') diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js index 55d6ef1..e7ca4ef 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/move.js +++ b/public/assets/javascripts/rectangles/engine/scenery/move.js @@ -88,6 +88,7 @@ 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/util/minotaur.js b/public/assets/javascripts/rectangles/util/minotaur.js index 4d9a795..d165ccc 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 = 5000 + base.delay = 2500 base.objects = {} base.init = function () { diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index e278fab..57ca3c6 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -757,8 +757,8 @@ iframe.embed { #minotaur { position: absolute; - top: 0; - right: 230px; + top: 0px; + right: 0px; opacity: 0; } #minotaur .label:after { @@ -771,9 +771,9 @@ iframe.embed { color: white; background: black; font-weight: 300; - float: right; text-decoration: none; z-index: 33; + opacity: 1; } #minotaur.saving .label:after { content: 'SAVING'; -- 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') 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') 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') 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 0a060fc9c9c3b4f93a79e7ee350cbaeac14ba589 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 16:26:04 -0400 Subject: fix clear button --- public/assets/javascripts/rectangles/engine/scenery/_scenery.js | 2 +- public/assets/javascripts/ui/editor/EditorSettings.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'public/assets/javascripts/rectangles') diff --git a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js index d34e299..69e9ba7 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/_scenery.js +++ b/public/assets/javascripts/rectangles/engine/scenery/_scenery.js @@ -48,7 +48,7 @@ var Scenery = new function(){ base.find = function(id){ return base.list[id] || null } - + base.remove = function(id){ var scene_media = base.list[id] delete base.list[id] diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index eb0d044..fd251b7 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -93,7 +93,7 @@ var EditorSettings = FormView.extend({ }, clear: function(){ - Rooms.removeAll() + Scenery.removeAll() }, destroy: function(){ -- cgit v1.2.3-70-g09d2 From c996ec3c93316b7a28b6707c9f7f595488d05cb9 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 2 Oct 2014 16:30:53 -0400 Subject: fix dot positioning --- .../rectangles/engine/scenery/resize.js | 27 ++++++++++------------ 1 file changed, 12 insertions(+), 15 deletions(-) (limited to 'public/assets/javascripts/rectangles') diff --git a/public/assets/javascripts/rectangles/engine/scenery/resize.js b/public/assets/javascripts/rectangles/engine/scenery/resize.js index 2ba84a1..893237c 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/resize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/resize.js @@ -57,35 +57,32 @@ Scenery.resize = new function(){ // move all the dots to the object's current position base.move_dots = function(){ - x = obj.mx.x + sin(rotationY) * dot_distance_from_picture - y = obj.mx.y - z = obj.mx.z - cos(rotationY) * dot_distance_from_picture + 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) + base.move_dot(dot, { x: x, y: y, z: z }) }) } // move a dot .. to the initial position of the image - base.move_dot = function(dot){ - dot.x = x - dot.y = y - dot.z = z - + base.move_dot = function(dot, pos){ if (dot.side & TOP) { - dot.y += obj.mx.height * obj.mx.scale / 2 + pos.y += obj.dimensions.b / 2 } if (dot.side & BOTTOM) { - dot.y -= obj.mx.height * obj.mx.scale / 2 + pos.y -= obj.dimensions.b / 2 } if (dot.side & LEFT) { - dot.x -= cos(rotationY) * (obj.mx.width * obj.mx.scale) / 2 - dot.z -= sin(rotationY) * (obj.mx.width * obj.mx.scale) / 2 + pos.x -= cos(rotationY) * (obj.dimensions.a) / 2 + pos.z -= sin(rotationY) * (obj.dimensions.a) / 2 } if (dot.side & RIGHT) { - dot.x += cos(rotationY) * (obj.mx.width * obj.mx.scale) / 2 - dot.z += sin(rotationY) * (obj.mx.width * obj.mx.scale) / 2 + 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 -- cgit v1.2.3-70-g09d2