From 221a14315b09946db2485036bbf4a80295dc4889 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 2 Jul 2014 16:22:51 -0400 Subject: password reset / username dupe stuff from PH --- views/controls/editor/media-editor.ejs | 30 ++++++++++++++++++++++++++++++ views/controls/editor/settings.ejs | 4 +--- 2 files changed, 31 insertions(+), 3 deletions(-) create mode 100644 views/controls/editor/media-editor.ejs (limited to 'views/controls') diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs new file mode 100644 index 0000000..93405fc --- /dev/null +++ b/views/controls/editor/media-editor.ejs @@ -0,0 +1,30 @@ +
+ + + +
+ +
+ +
+ +
+ +
+
+ + + + +
+
+ +
+ +
+ +
diff --git a/views/controls/editor/settings.ejs b/views/controls/editor/settings.ejs index a7d6213..867d5f3 100644 --- a/views/controls/editor/settings.ejs +++ b/views/controls/editor/settings.ejs @@ -16,9 +16,7 @@
-
- -
+
-- cgit v1.2.3-70-g09d2 From bce442242f167b70be1f7b24190f9e59d3c24e37 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 10 Jul 2014 18:21:06 -0400 Subject: media editor --- public/assets/javascripts/ui/reader/ReaderView.js | 2 +- public/assets/javascripts/ui/site/ProfileView.js | 7 ++-- views/controls/editor/media-editor.ejs | 43 ++++++++++++++++------- views/controls/editor/settings.ejs | 2 +- views/controls/editor/video-toolbar.ejs | 7 ---- views/controls/reader/about-media.ejs | 16 +++++++++ 6 files changed, 51 insertions(+), 26 deletions(-) delete mode 100644 views/controls/editor/video-toolbar.ejs create mode 100644 views/controls/reader/about-media.ejs (limited to 'views/controls') diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js index e86856c..add1ea1 100644 --- a/public/assets/javascripts/ui/reader/ReaderView.js +++ b/public/assets/javascripts/ui/reader/ReaderView.js @@ -32,7 +32,7 @@ var ReaderView = View.extend({ var base = this $(window).on('message', function(event){ - if (event.origin !== window.location.origin) { + if (event.originalEvent.origin !== window.location.origin) { return } var message = event.originalEvent.data diff --git a/public/assets/javascripts/ui/site/ProfileView.js b/public/assets/javascripts/ui/site/ProfileView.js index 41f04ef..8661bcd 100644 --- a/public/assets/javascripts/ui/site/ProfileView.js +++ b/public/assets/javascripts/ui/site/ProfileView.js @@ -1,20 +1,19 @@ var ProfileView = View.extend({ - initialize: function(){ + initialize: function() { }, - load: function(){ + load: function() { var classes = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen']; $(".bio").addClass(choice(classes)); - $("td.border").each(function(){ + $("td.border").each(function() { var iframe = $(this).find("iframe").get('0') if (! iframe) return - console.log(iframe) $(this).on({ mouseenter: function(e){ iframe.contentWindow.postMessage("spin-on", window.location.origin) diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs index 93405fc..95aabb5 100644 --- a/views/controls/editor/media-editor.ejs +++ b/views/controls/editor/media-editor.ejs @@ -3,28 +3,45 @@
- +
+ +
+ + + + + + + + Autoplay + Loop + Mute + Initial Still +
-
-
- - - - -
+
+ Dimensions + Width + Height +
- + +
+ Delete +
diff --git a/views/controls/editor/settings.ejs b/views/controls/editor/settings.ejs index 867d5f3..6f46be3 100644 --- a/views/controls/editor/settings.ejs +++ b/views/controls/editor/settings.ejs @@ -10,7 +10,7 @@
- +
diff --git a/views/controls/editor/video-toolbar.ejs b/views/controls/editor/video-toolbar.ejs deleted file mode 100644 index d4364a2..0000000 --- a/views/controls/editor/video-toolbar.ejs +++ /dev/null @@ -1,7 +0,0 @@ -
- - - - - -
diff --git a/views/controls/reader/about-media.ejs b/views/controls/reader/about-media.ejs new file mode 100644 index 0000000..c6365ad --- /dev/null +++ b/views/controls/reader/about-media.ejs @@ -0,0 +1,16 @@ +
+ +
+
+
+
+ +
+ + + + + +
+ +
-- cgit v1.2.3-70-g09d2 From 9a2cfe7da6808a04b7c668075e9e9598ddb5ae04 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 11 Jul 2014 17:07:05 -0400 Subject: basic media editor --- .../javascripts/rectangles/engine/scenery/move.js | 6 ++ .../assets/javascripts/ui/editor/EditorToolbar.js | 2 +- public/assets/javascripts/ui/editor/EditorView.js | 2 +- public/assets/javascripts/ui/editor/MediaEditor.js | 69 ++++++++++++++++++++++ public/assets/stylesheets/app.css | 23 +++++--- views/controls/editor/media-editor.ejs | 30 ++++++---- views/editor.ejs | 2 +- views/partials/scripts.ejs | 3 +- 8 files changed, 115 insertions(+), 22 deletions(-) create mode 100644 public/assets/javascripts/ui/editor/MediaEditor.js (limited to 'views/controls') diff --git a/public/assets/javascripts/rectangles/engine/scenery/move.js b/public/assets/javascripts/rectangles/engine/scenery/move.js index bad0a55..aa7ddd1 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/move.js +++ b/public/assets/javascripts/rectangles/engine/scenery/move.js @@ -26,6 +26,12 @@ Scenery.move = function(base){ Scenery.remove(base.id) return } + + if (editor.permissions.pick) { + // load the modal + app.router.editorView.mediaEditor.pick(base) + } + if (! (editor.permissions.move || editor.permissions.resize) ) { e.clickAccepted = false return diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js index 4a7c3e8..a3abc5a 100644 --- a/public/assets/javascripts/ui/editor/EditorToolbar.js +++ b/public/assets/javascripts/ui/editor/EditorToolbar.js @@ -87,7 +87,7 @@ var EditorToolbar = View.extend({ var editor = new function(){ this.permissions = new Permissions({ - 'pick': false, + 'pick': true, 'move': true, 'resize': false, 'destroy': false, diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js index 2bb2d61..017e241 100644 --- a/public/assets/javascripts/ui/editor/EditorView.js +++ b/public/assets/javascripts/ui/editor/EditorView.js @@ -13,6 +13,7 @@ var EditorView = View.extend({ this.settings = new EditorSettings ({ parent: this }) this.mediaViewer = new MediaViewer ({ parent: this }) this.mediaUpload = new MediaUpload ({ parent: this }) + this.mediaEditor = new MediaEditor ({ parent: this }) this.wallpaperPicker = new WallpaperPicker ({ parent: this }) this.lightControl = new LightControl ({ parent: this }) }, @@ -39,4 +40,3 @@ var EditorView = View.extend({ } }) - diff --git a/public/assets/javascripts/ui/editor/MediaEditor.js b/public/assets/javascripts/ui/editor/MediaEditor.js new file mode 100644 index 0000000..8d6d517 --- /dev/null +++ b/public/assets/javascripts/ui/editor/MediaEditor.js @@ -0,0 +1,69 @@ + +var MediaEditor = FormView.extend({ + el: "#mediaEditor", + + events: { + }, + + initialize: function(opt){ + this.parent = opt.parent + this.__super__.initialize.call(this) + + this.$name = this.$("[name=name]") + this.$description = this.$("[name=description]") + this.$autoplay = this.$("[name=autoplay]") + + // image fields + this.$widthDimension = this.$("[name=width]") + this.$heightDimension = this.$("[name=height]") + this.$units = this.$("[name=units]") + + // video fields + this.$playButton = this.$(".play") + this.$loop = this.$("[name=loop]") + this.$mute = this.$("[name=mute]") + this.$keyframe = this.$("[name=keyframe]") + }, + + toggle: function(state) { + this.$el.toggleClass("active", state); + }, + + pick: function(scenery) { + this.$el.addClass("active") + + var media = scenery.media + + this.$name.val(media.title) + this.$description.val(media.description) + + switch (media.type) { + case "image": + this.$(".image").show() + this.$(".video").hide() + /* + this.$widthDimension + this.$heightDimension + this.$units + */ + + break + + case "youtube": + case "vimeo": + case "video": + this.$(".video").show() + this.$(".image").hide() + + /* + this.$loop + this.$mute + this.$keyframe + */ + + + break + } + }, + +}) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 684761c..7389810 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1106,7 +1106,7 @@ input[type=range] { -webkit-appearance: none; -moz-appearance: none; background-color: black; - width: 200px; + width: 180px; height:3px; } @@ -1176,13 +1176,15 @@ input[type="range"]::-webkit-slider-thumb { #startpoint.active:hover { text-decoration:none; } -.settings input[type="text"], textarea{ +.settings input[type="text"] { border: 1px solid #000; font-size: 15px; padding: 5px; } .settings textarea { + border: 1px solid #000; + padding: 5px; font-size: 12px; width: 100%; max-height: 200px; @@ -1193,7 +1195,7 @@ input[type="range"]::-webkit-slider-thumb { border: 1px solid #000; } -.settings .setting{ +.settings .setting { margin-bottom:10px; } .setting.subButtons { @@ -1210,6 +1212,13 @@ input[type="range"]::-webkit-slider-thumb { .settings .setting:last-child{ margin-bottom:0px; } +.settings input[type="text"].number { + width: 60px; +} + +.setting label { + padding-right: 5px; +} button { padding: 8px; @@ -1372,23 +1381,23 @@ form li textarea { margin-top: 20px; } -.video { +.demo .video { height:80vh; min-height:300px; } -.video span { +.demo .video span { font-size:100px; color:white; cursor:pointer; } -.video span.videoTitle { +.demo .video span.videoTitle { font-size: 29px; font-weight: 300; padding: 3px 7px; } -.video span.icon-ios7-play-outline:hover { +.demo .video span.icon-ios7-play-outline:hover { color:lightgreen; } diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs index 95aabb5..483fa72 100644 --- a/views/controls/editor/media-editor.ejs +++ b/views/controls/editor/media-editor.ejs @@ -1,4 +1,4 @@ -
+
@@ -15,24 +15,32 @@ - - - Autoplay - Loop - Mute - Initial Still +
+
+ + + + + + +
+ +
+ Initial Still +
+
- Dimensions - Width - Height + Dimensions
+ +
diff --git a/views/editor.ejs b/views/editor.ejs index a79eb9a..5d1e052 100755 --- a/views/editor.ejs +++ b/views/editor.ejs @@ -13,8 +13,8 @@
[[ include controls/editor/toolbar ]] - [[ include controls/editor/video-toolbar ]] [[ include controls/editor/media-drawer ]] + [[ include controls/editor/media-editor ]] [[ include controls/editor/wallpaper ]] [[ include controls/editor/light-control ]] [[ include controls/editor/settings ]] diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 6dd4480..40bb306 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -78,13 +78,14 @@ + + - -- cgit v1.2.3-70-g09d2 From 1826bed806b079c6e44703a4e5f424b7aed7bd96 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 11 Jul 2014 17:29:41 -0400 Subject: play button --- .../rectangles/engine/scenery/types/video.js | 3 --- .../rectangles/engine/scenery/types/vimeo.js | 14 +++++++++++++- public/assets/javascripts/ui/editor/MediaEditor.js | 5 +++++ public/assets/stylesheets/app.css | 20 ++++++++++++++++++++ views/controls/editor/media-editor.ejs | 5 ++--- 5 files changed, 40 insertions(+), 7 deletions(-) (limited to 'views/controls') diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js index 2f6dc01..a9fce4a 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js @@ -15,10 +15,7 @@ Scenery.types.video = Scenery.types.base.extend(function(base){ build: function(){ this.mx = new MX.Video({ - src: this.media.url, media: this.media, - width: this.media.width, - height: this.media.height, scale: this.scale, y: this.scale * this.media.height/2, backface: false, diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/vimeo.js b/public/assets/javascripts/rectangles/engine/scenery/types/vimeo.js index 697c66a..ded5f87 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/vimeo.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/vimeo.js @@ -22,7 +22,19 @@ Scenery.types.vimeo = Scenery.types.base.extend(function(base){ }) scene.add( this.mx ) }, - + + play: function(){ + this.mx.play() + }, + + pause: function(){ + this.mx.pause() + }, + + seek: function(n){ + this.mx.seek(n) + }, + serialize: function(){ var data = base.serialize.call(this) return data diff --git a/public/assets/javascripts/ui/editor/MediaEditor.js b/public/assets/javascripts/ui/editor/MediaEditor.js index 8d6d517..1ccb5cf 100644 --- a/public/assets/javascripts/ui/editor/MediaEditor.js +++ b/public/assets/javascripts/ui/editor/MediaEditor.js @@ -3,6 +3,7 @@ var MediaEditor = FormView.extend({ el: "#mediaEditor", events: { + "click .play": "togglePlaying", }, initialize: function(opt){ @@ -29,7 +30,11 @@ var MediaEditor = FormView.extend({ this.$el.toggleClass("active", state); }, + togglePlaying: function(){ + }, + pick: function(scenery) { + this.scenery = scenery this.$el.addClass("active") var media = scenery.media diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 7389810..4296223 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1220,6 +1220,26 @@ input[type="range"]::-webkit-slider-thumb { padding-right: 5px; } +.setting .play { + color: white; + background: black; + border-radius: 50px; + padding: 6px 7px 5px; + cursor: pointer; +} +.setting .play .icon-play { + display: inline; +} +.setting .play.playing .icon-play { + display: none; +} +.setting .play .icon-pause { + display: none; +} +.setting .play.playing .icon-pause { + display: inline; +} + button { padding: 8px; border: 1px solid; diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs index 483fa72..12ab2b4 100644 --- a/views/controls/editor/media-editor.ejs +++ b/views/controls/editor/media-editor.ejs @@ -12,8 +12,8 @@
- - + + + -->
diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs new file mode 100644 index 0000000..af0a76d --- /dev/null +++ b/views/controls/builder/info.ejs @@ -0,0 +1,35 @@ +
+
+ + +
+
+ + +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + + +
+ +
diff --git a/views/controls/editor/media-editor.ejs b/views/controls/editor/media-editor.ejs index 65db3ce..5db1fb2 100644 --- a/views/controls/editor/media-editor.ejs +++ b/views/controls/editor/media-editor.ejs @@ -29,9 +29,9 @@
- Initial Still +
- +
diff --git a/views/partials/sign-in.ejs b/views/partials/sign-in.ejs index 3f05fff..8268b2a 100644 --- a/views/partials/sign-in.ejs +++ b/views/partials/sign-in.ejs @@ -6,7 +6,7 @@
- – or the ol' fashion way – +
  • @@ -39,7 +39,7 @@ - – or the ol' fashion way – +
  • diff --git a/views/projects/layouts-modal.ejs b/views/projects/layouts-modal.ejs index 75b2641..97f1e61 100644 --- a/views/projects/layouts-modal.ejs +++ b/views/projects/layouts-modal.ejs @@ -5,6 +5,9 @@

    Edit Room Layouts

    +
    + There are no room layouts available. Please create a new one. +
    @@ -18,6 +21,8 @@

    Your Projects

    +
    +
    @@ -31,6 +36,9 @@

    Choose Room Template

    +
    + There are no room layouts available. Please create a new one. +
    diff --git a/views/projects/list-projects.ejs b/views/projects/list-projects.ejs index 42387ba..2c12af0 100644 --- a/views/projects/list-projects.ejs +++ b/views/projects/list-projects.ejs @@ -6,7 +6,7 @@ [[ projects.forEach(function(project, i) { ]] - + [[ if (profile._id == project.user_id) { ]]
    edit
    [[ } ]] -- cgit v1.2.3-70-g09d2 From d81c96616859a57d5d5d63a6ae7b1492a5c4974a Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 16 Jul 2014 16:30:33 -0400 Subject: display room dimensions --- .../javascripts/rectangles/engine/map/ui_editor.js | 8 ++- .../javascripts/rectangles/engine/rooms/_rooms.js | 1 + .../assets/javascripts/ui/builder/BuilderInfo.js | 70 ++++++++++++++++++++++ .../javascripts/ui/builder/BuilderSettings.js | 5 +- .../assets/javascripts/ui/builder/BuilderView.js | 4 ++ .../assets/javascripts/ui/editor/EditorSettings.js | 1 + public/assets/javascripts/ui/editor/MediaEditor.js | 1 + public/assets/stylesheets/app.css | 11 ++++ server/lib/schemas/Layout.js | 1 + views/controls/builder/info.ejs | 7 ++- views/partials/scripts.ejs | 3 +- 11 files changed, 107 insertions(+), 5 deletions(-) create mode 100644 public/assets/javascripts/ui/builder/BuilderInfo.js (limited to 'views/controls') diff --git a/public/assets/javascripts/rectangles/engine/map/ui_editor.js b/public/assets/javascripts/rectangles/engine/map/ui_editor.js index ea7a356..577ea32 100644 --- a/public/assets/javascripts/rectangles/engine/map/ui_editor.js +++ b/public/assets/javascripts/rectangles/engine/map/ui_editor.js @@ -53,16 +53,21 @@ Map.UI.Editor = function(map){ if (intersects.length && base.permissions.destroy) { base.mouse.down = false Rooms.remove(intersects[0]) + app.tube("builder-destroy-room", intersects[0]) return } else if (intersects.length && (base.permissions.move || base.permissions.resize)) { base.dragging = intersects[0] base.resizing = base.permissions.resize && base.dragging.rect.nearEdge(cursor.x.a, cursor.y.a, resize_margin / map.zoom) base.dragging.rect.translation.sides = base.resizing + app.tube("builder-pick-room", intersects[0]) } else if (base.permissions.create) { base.creating = true } + else if (intersects.length) { + app.tube("builder-pick-room", intersects[0]) + } if (e.shiftKey && base.dragging) { base.dragging.rect.quantize(10/map.zoom) @@ -109,7 +114,8 @@ Map.UI.Editor = function(map){ if (cursor.height() > side_min && cursor.width() > side_min) { cursor.x.abs().quantize(1) cursor.y.abs().quantize(1) - Rooms.add_with_rect( cursor ) + var room = Rooms.add_with_rect( cursor ) + app.tube("builder-pick-room", room) } } diff --git a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js index 48931e9..e0033e3 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js +++ b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js @@ -26,6 +26,7 @@ var Rooms = new function(){ height: 500 }) base.add(room) + return room } base.remove = function(room){ diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js new file mode 100644 index 0000000..53a122d --- /dev/null +++ b/public/assets/javascripts/ui/builder/BuilderInfo.js @@ -0,0 +1,70 @@ + +var BuilderInfo = View.extend({ + el: "#builderInfo", + + events: { + "keydown": 'stopPropagation', + "change [name=x]": 'changePosition', + "change [name=z]": 'changePosition', + "change [name=width]": 'changeDimensions', + "change [name=depth]": 'changeDimensions', + "change [name=height]": 'changeDimensions', + "change [name=units]": 'changeUnits', + "change [name=resolution]": 'changeResolution', + "change [name=camera-height]": 'changeCameraHeight', + }, + + initialize: function(opt){ + this.parent = opt.parent + this.$x = this.$("[name=x]") + this.$z = this.$("[name=z]") + this.$width = this.$("[name=width]") + this.$depth = this.$("[name=depth]") + this.$height = this.$("[name=height]") + this.$units = this.$("[name=units]") + this.$resolution = this.$("[name=resolution]") + this.$cameraHeight = this.$("[name=camera-height]") + app.on("builder-pick-room", this.pick.bind(this)) + app.on("builder-destroy-room", this.destroy.bind(this)) + }, + + toggle: function(state){ + this.$el.toggleClass("active", state) + }, + + show: function(){ + this.toggle(true) + }, + + hide: function(){ + this.toggle(false) + }, + + room: null, + + pick: function(room){ + this.room = room + this.$width.val( room.rect.x.length() ) + this.$depth.val( room.rect.y.length() ) + this.$height.val( room.height ) + this.$x.val( room.rect.x.a ) + this.$z.val( room.rect.y.a ) + + console.log(room) + }, + + destroy: function(room){ + this.room = null + this.hide() + }, + + changeDimensions: function(){ + }, + + changeUnits: function(){ + }, + + changeCameraHeight: function(){ + }, + +}) diff --git a/public/assets/javascripts/ui/builder/BuilderSettings.js b/public/assets/javascripts/ui/builder/BuilderSettings.js index 6006868..c551f95 100644 --- a/public/assets/javascripts/ui/builder/BuilderSettings.js +++ b/public/assets/javascripts/ui/builder/BuilderSettings.js @@ -7,6 +7,7 @@ var BuilderSettings = FormView.extend({ destroyAction: "/api/layout/destroy", events: { + "keydown": 'stopPropagation', "keydown [name=name]": 'enterSubmit', "click [data-role='save-layout']": 'save', "click [data-role='clone-layout']": 'clone', @@ -69,8 +70,8 @@ var BuilderSettings = FormView.extend({ }.bind(this)) }, - toggle: function(){ - this.$el.toggleClass("active") + toggle: function(state){ + this.$el.toggleClass("active", state) }, enterSubmit: function (e) { diff --git a/public/assets/javascripts/ui/builder/BuilderView.js b/public/assets/javascripts/ui/builder/BuilderView.js index a83bf43..7a92738 100644 --- a/public/assets/javascripts/ui/builder/BuilderView.js +++ b/public/assets/javascripts/ui/builder/BuilderView.js @@ -8,6 +8,7 @@ var BuilderView = View.extend({ }, initialize: function(){ + this.info = new BuilderInfo ({ parent: this }) this.toolbar = new BuilderToolbar ({ parent: this }) this.settings = new BuilderSettings ({ parent: this }) }, @@ -26,5 +27,8 @@ var BuilderView = View.extend({ ready: function(data){ this.settings.load(data) }, + + hideExtras: function(){ + } }) diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index 887c894..13a6f60 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -7,6 +7,7 @@ var EditorSettings = FormView.extend({ destroyAction: "/api/project/destroy", events: { + "keydown": 'stopPropagation', "keydown [name=name]": 'enterSubmit', "click [data-role='save-project']": 'save', "click [data-role='clone-project']": 'clone', diff --git a/public/assets/javascripts/ui/editor/MediaEditor.js b/public/assets/javascripts/ui/editor/MediaEditor.js index f9eaad5..a075e6b 100644 --- a/public/assets/javascripts/ui/editor/MediaEditor.js +++ b/public/assets/javascripts/ui/editor/MediaEditor.js @@ -3,6 +3,7 @@ var MediaEditor = FormView.extend({ el: "#mediaEditor", events: { + "keydown": 'stopPropagation', "click [data-role=play-media]": "togglePaused", "mousedown [name=keyframe]": "stopPropagation", "mousedown": "stopPropagation", diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 2e3358a..3e6dced 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1247,6 +1247,17 @@ input[type="range"]::-webkit-slider-thumb { position: relative; top: 5px; } +.setting.number.halflines { + height: 30px; +} +.setting.number.halflines input[type=text] { + float: left; + width: 50px; +} +.setting.number.halflines label:nth-of-type(2) { + text-align: center; +} + .setting.number input[type=text] { width: 150px; } diff --git a/server/lib/schemas/Layout.js b/server/lib/schemas/Layout.js index b096b85..33a5262 100644 --- a/server/lib/schemas/Layout.js +++ b/server/lib/schemas/Layout.js @@ -25,6 +25,7 @@ var LayoutSchema = new mongoose.Schema({ }, rooms: [mongoose.Schema.Types.Mixed], startPosition: mongoose.Schema.Types.Mixed, + cameraHeight: { type: Number, default: 180 }, user_id: { type: mongoose.Schema.ObjectId, index: true }, created_at: { type: Date }, updated_at: { type: Date }, diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index af0a76d..2cc8132 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -11,6 +11,12 @@
    +
    + + + + +
    @@ -29,7 +35,6 @@
    -
    diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs index 47a027e..2173cd5 100644 --- a/views/partials/scripts.ejs +++ b/views/partials/scripts.ejs @@ -72,9 +72,10 @@ + - + -- cgit v1.2.3-70-g09d2 From f20841988ccd27780d3801e4a6c32bf9afcc9368 Mon Sep 17 00:00:00 2001 From: Julie Lala Date: Thu, 17 Jul 2014 03:04:28 -0400 Subject: conversions between feet/meters/pixels --- public/assets/javascripts/app.js | 9 +- .../javascripts/mx/extensions/mx.movements.js | 2 +- .../assets/javascripts/ui/builder/BuilderInfo.js | 112 +++++++++++++++++++-- .../assets/javascripts/ui/builder/BuilderView.js | 1 + public/assets/javascripts/util.js | 1 - public/assets/stylesheets/app.css | 3 +- server/lib/schemas/Layout.js | 2 +- views/controls/builder/info.ejs | 25 ++--- 8 files changed, 123 insertions(+), 32 deletions(-) (limited to 'views/controls') diff --git a/public/assets/javascripts/app.js b/public/assets/javascripts/app.js index 0b441c7..1419d1d 100644 --- a/public/assets/javascripts/app.js +++ b/public/assets/javascripts/app.js @@ -17,8 +17,6 @@ else { var scene, cam, map; -var viewHeight = window.viewHeight || 186 - var app = new function(){} app.mode = { editor: false, builder: false } @@ -99,4 +97,11 @@ app.position = function(obj){ return pos } +app.defaults = { + viewHeight: window.viewHeight = 186, + units: app.units = "ft", + footResolution: 36, + meterResolution: 100, +} + document.addEventListener('DOMContentLoaded', app.init) diff --git a/public/assets/javascripts/mx/extensions/mx.movements.js b/public/assets/javascripts/mx/extensions/mx.movements.js index f176e8b..191088f 100644 --- a/public/assets/javascripts/mx/extensions/mx.movements.js +++ b/public/assets/javascripts/mx/extensions/mx.movements.js @@ -1,6 +1,6 @@ -MX.Movements = function (cam, viewHeight) { +MX.Movements = function (cam) { var moveForward, moveLeft, diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js index 53a122d..9bbd385 100644 --- a/public/assets/javascripts/ui/builder/BuilderInfo.js +++ b/public/assets/javascripts/ui/builder/BuilderInfo.js @@ -5,28 +5,35 @@ var BuilderInfo = View.extend({ events: { "keydown": 'stopPropagation', "change [name=x]": 'changePosition', - "change [name=z]": 'changePosition', + "change [name=y]": 'changePosition', "change [name=width]": 'changeDimensions', "change [name=depth]": 'changeDimensions', "change [name=height]": 'changeDimensions', "change [name=units]": 'changeUnits', "change [name=resolution]": 'changeResolution', - "change [name=camera-height]": 'changeCameraHeight', + "change [name=viewHeight]": 'changeViewHeight', }, initialize: function(opt){ this.parent = opt.parent this.$x = this.$("[name=x]") - this.$z = this.$("[name=z]") + this.$y = this.$("[name=y]") this.$width = this.$("[name=width]") this.$depth = this.$("[name=depth]") this.$height = this.$("[name=height]") this.$units = this.$("[name=units]") - this.$resolution = this.$("[name=resolution]") - this.$cameraHeight = this.$("[name=camera-height]") + this.$viewHeight = this.$("[name=viewHeight]") + this.$unitName = this.$(".unitName") app.on("builder-pick-room", this.pick.bind(this)) app.on("builder-destroy-room", this.destroy.bind(this)) }, + + load: function(data){ + this.$viewHeight.unitVal( data.viewHeight || app.defaults.viewHeight ) + this.$units.val( "ft" ) + this.$unitName.html( "ft" ) + this.$resolution.val( app.defaults.footResolution ) + }, toggle: function(state){ this.$el.toggleClass("active", state) @@ -44,11 +51,11 @@ var BuilderInfo = View.extend({ pick: function(room){ this.room = room - this.$width.val( room.rect.x.length() ) - this.$depth.val( room.rect.y.length() ) - this.$height.val( room.height ) - this.$x.val( room.rect.x.a ) - this.$z.val( room.rect.y.a ) + this.$width.unitVal( room.rect.x.length() ) + this.$depth.unitVal( room.rect.y.length() ) + this.$height.unitVal( room.height ) + this.$x.unitVal( room.rect.x.a ) + this.$y.unitVal( room.rect.y.a ) console.log(room) }, @@ -59,12 +66,95 @@ var BuilderInfo = View.extend({ }, changeDimensions: function(){ +// this.$width.unitVal( room.rect.x.length() ) +// this.$depth.unitVal( room.rect.y.length() ) +// this.$height.unitVal( room.height ) }, changeUnits: function(){ + app.units = this.$units.val() + this.$('.units').resetUnitVal() }, - changeCameraHeight: function(){ + changeViewHeight: function(){ + window.viewHeight = this.$viewHeight.unitVal( ) }, }) + +$.fn.resetUnitVal = function(){ + this.each(function(){ + var n = $(this).data("px") + $(this).unitVal(n) + }); +} + +$.fn.unitVal = function(n){ + var s + if (typeof n === "undefined") { + s = $(this).val() + n = stringToMeasurement( s ) + } + s = measurementToString( n ) + $(this).val( s ).data("px", n) + return n +} + +function measurementToString( n ) { + var s, ft, inch + switch (app.units) { + case 'm': + s = round(n/36 * 0.3048 * 100) / 100 + " m" + break + case 'ft': + ft = floor(n / 36) + inch = abs(round((n % 36) / 3)) + s = ft + "'" + if (inch > 0) { + s += " " + inch + '"' + } + break + case 'px': + default: + s = round(n) + " px" + break + } + return s +} +function stringToMeasurement( s ) { + var ft, inch, ft_in, type + if (s.indexOf("'") !== -1 || s.indexOf('"') !== -1 || s.indexOf('ft') !== -1) { + ft_in = s.match(/[0-9.]+/g) + if (ft_in.length >= 2) { + ft = parseFloat( ft_in[0] ) + inch = parseFloat( ft_in[1] ) + } + else if (ft_in.length == 1) { + if (s.indexOf('"') !== -1) { + ft = 0 + inch = parseFloat( ft_in[0] ) + } + else { + ft = parseFloat( ft_in[0] ) + inch = 0 + } + } + else { + ft = inch = 0 + } + n = ft * 36 + inch * 3 + } + else if (type === "m") { + n = parseFloat(s.match(/[0-9.]+/)) * 36 / 0.3048 + } + else if (s.indexOf("px") !== -1) { + n = parseFloat(s.match(/[0-9.]+/)) + } + else { + n = abs( stringToMeasurement( s + app.units ) ) + } + if (s.indexOf('-') !== -1) { + n *= -1 + } + return n +} \ No newline at end of file diff --git a/public/assets/javascripts/ui/builder/BuilderView.js b/public/assets/javascripts/ui/builder/BuilderView.js index 7a92738..555cd58 100644 --- a/public/assets/javascripts/ui/builder/BuilderView.js +++ b/public/assets/javascripts/ui/builder/BuilderView.js @@ -26,6 +26,7 @@ var BuilderView = View.extend({ ready: function(data){ this.settings.load(data) + this.info.load(data) }, hideExtras: function(){ diff --git a/public/assets/javascripts/util.js b/public/assets/javascripts/util.js index b58da1f..58dcc3a 100644 --- a/public/assets/javascripts/util.js +++ b/public/assets/javascripts/util.js @@ -176,4 +176,3 @@ function bitcount(v) { v = (v & 0x33333333) + ((v >>> 2) & 0x33333333); return ((v + (v >>> 4) & 0xF0F0F0F) * 0x1010101) >>> 24; } - diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 3e6dced..61a4fa9 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1252,10 +1252,11 @@ input[type="range"]::-webkit-slider-thumb { } .setting.number.halflines input[type=text] { float: left; - width: 50px; + width: 60px; } .setting.number.halflines label:nth-of-type(2) { text-align: center; + width: 30px; } .setting.number input[type=text] { diff --git a/server/lib/schemas/Layout.js b/server/lib/schemas/Layout.js index 33a5262..e3f2616 100644 --- a/server/lib/schemas/Layout.js +++ b/server/lib/schemas/Layout.js @@ -25,7 +25,7 @@ var LayoutSchema = new mongoose.Schema({ }, rooms: [mongoose.Schema.Types.Mixed], startPosition: mongoose.Schema.Types.Mixed, - cameraHeight: { type: Number, default: 180 }, + viewHeight: { type: Number }, user_id: { type: mongoose.Schema.ObjectId, index: true }, created_at: { type: Date }, updated_at: { type: Date }, diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 2cc8132..d92d34c 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -1,40 +1,35 @@
    - +
    - +
    - +
    - - - + + +
    -
    - - -
    -
    - - + +
    -- cgit v1.2.3-70-g09d2