From 86153d1221e38615d0a7dea8a8029a184fb25ece Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 10 Oct 2014 20:32:31 -0400 Subject: rooms editor in builder --- views/controls/builder/info.ejs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'views/controls/builder/info.ejs') diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index d92d34c..7ef0b6a 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -1,4 +1,4 @@ -
+
-- cgit v1.2.3-70-g09d2 From dbaf1b362e775f0923e3910d06de510369811802 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 13 Oct 2014 11:43:56 -0400 Subject: click background to deselect room in blueprint editor --- .../javascripts/rectangles/engine/map/ui_editor.js | 11 +++++++-- .../assets/javascripts/ui/builder/BuilderInfo.js | 27 +++++++++++++++++++--- views/controls/builder/info.ejs | 11 +++++++++ 3 files changed, 44 insertions(+), 5 deletions(-) (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/rectangles/engine/map/ui_editor.js b/public/assets/javascripts/rectangles/engine/map/ui_editor.js index 3c3347b..6dc6c90 100644 --- a/public/assets/javascripts/rectangles/engine/map/ui_editor.js +++ b/public/assets/javascripts/rectangles/engine/map/ui_editor.js @@ -167,12 +167,11 @@ Map.UI.Editor = function(map){ redo: room.copy() }) + Rooms.rebuild() app.tube("builder-pick-room", room) } } - if (base.resizing || base.dragging) { - var oldState = base.dragging.copy() if (base.resizing) { @@ -187,7 +186,15 @@ Map.UI.Editor = function(map){ undo: oldState, redo: base.dragging.copy() }) + Rooms.rebuild() } + + var intersects = Rooms.filter(function(r){ + return r.focused = r.rect.contains(cursor.x.a, cursor.y.a) + }) + if (! intersects.length) { + app.tube("builder-pick-nothing") + } base.creating = base.dragging = base.resizing = false } diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js index 0bf2338..196eca6 100644 --- a/public/assets/javascripts/ui/builder/BuilderInfo.js +++ b/public/assets/javascripts/ui/builder/BuilderInfo.js @@ -13,6 +13,7 @@ var BuilderInfo = View.extend({ "change [name=units]": 'changeUnits', "change [name=resolution]": 'changeResolution', "change [name=viewHeight]": 'changeViewHeight', + "click [data-role=destroy-room]": 'destroy', }, initialize: function(opt){ @@ -25,8 +26,11 @@ var BuilderInfo = View.extend({ this.$units = this.$("[name=units]") this.$viewHeight = this.$("[name=viewHeight]") this.$unitName = this.$(".unitName") + this.$noSelection = this.$(".no-selection") + this.$settings = this.$(".setting") app.on("builder-pick-room", this.pick.bind(this)) - app.on("builder-destroy-room", this.destroy.bind(this)) + app.on("builder-destroy-room", this.hide.bind(this)) + app.on("builder-pick-nothing", this.deselect.bind(this)) }, load: function(data){ @@ -36,6 +40,8 @@ var BuilderInfo = View.extend({ }, toggle: function(state){ + this.$settings.toggle( !! this.room ) + this.$noSelection.toggle( ! this.room ) this.$el.toggleClass("active", state) }, @@ -43,7 +49,8 @@ var BuilderInfo = View.extend({ this.toggle(true) }, - hide: function(){ + hide: function(){ + this.room = null this.toggle(false) }, @@ -58,8 +65,22 @@ var BuilderInfo = View.extend({ this.$y.unitVal( room.rect.y.a ) this.show() }, + + deselect: function(){ + this.room = null + this.toggle(true) + }, + + destroy: function(){ + UndoStack.push({ + type: "destroy-room", + undo: this.room.copy(), + redo: { id: this.room.id }, + }) + + Rooms.remove(this.room) + app.tube("builder-destroy-room", this.room) - destroy: function(room){ this.room = null this.hide() }, diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 7ef0b6a..3c5d4b7 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -1,4 +1,11 @@
+

Map Editor

+ +
+ Click a room to select it, or click and drag to make a new room. +
+ +
@@ -32,4 +39,8 @@
+ +
-- cgit v1.2.3-70-g09d2 From 10a98d58fcba585dc13d251497c6028d04de0031 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 13 Oct 2014 13:34:52 -0400 Subject: larger default size --- public/assets/javascripts/rectangles/engine/scenery/randomize.js | 4 ++-- public/assets/javascripts/rectangles/engine/scenery/types/image.js | 2 +- public/assets/javascripts/rectangles/engine/scenery/types/video.js | 2 +- public/assets/javascripts/rectangles/util/constants.js | 3 ++- views/controls/builder/info.ejs | 2 +- 5 files changed, 7 insertions(+), 6 deletions(-) (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/rectangles/engine/scenery/randomize.js b/public/assets/javascripts/rectangles/engine/scenery/randomize.js index 4f1144a..82b6bf9 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/randomize.js +++ b/public/assets/javascripts/rectangles/engine/scenery/randomize.js @@ -10,11 +10,11 @@ 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) + width = Math.min(DEFAULT_PICTURE_WIDTH, media.width) height = media.height/media.width * width } else { - height = Math.min(300, media.height) + height = Math.min(DEFAULT_PICTURE_WIDTH, media.height) width = media.width/media.height * height } return { diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/image.js b/public/assets/javascripts/rectangles/engine/scenery/types/image.js index bed847b..10fc917 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/image.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/image.js @@ -7,7 +7,7 @@ Scenery.types.image = Scenery.types.base.extend(function(base){ init: function(opt){ - opt.scale = opt.scale || (opt.data && opt.data.scale) || 300 / max(300, opt.media.width) + opt.scale = opt.scale || (opt.data && opt.data.scale) || DEFAULT_PICTURE_WIDTH / max(DEFAULT_PICTURE_WIDTH, opt.media.width) base.init.call(this, opt) diff --git a/public/assets/javascripts/rectangles/engine/scenery/types/video.js b/public/assets/javascripts/rectangles/engine/scenery/types/video.js index b723f56..a669a90 100644 --- a/public/assets/javascripts/rectangles/engine/scenery/types/video.js +++ b/public/assets/javascripts/rectangles/engine/scenery/types/video.js @@ -6,7 +6,7 @@ Scenery.types.video = Scenery.types.base.extend(function(base){ type: 'video', init: function(opt){ - opt.scale = opt.scale || (opt.data && opt.data.scale) || 300 / max(300, opt.media.width) + opt.scale = opt.scale || (opt.data && opt.data.scale) || DEFAULT_PICTURE_WIDTH / max(DEFAULT_PICTURE_WIDTH, opt.media.width) base.init.call(this, opt) diff --git a/public/assets/javascripts/rectangles/util/constants.js b/public/assets/javascripts/rectangles/util/constants.js index 198cc41..a38325e 100644 --- a/public/assets/javascripts/rectangles/util/constants.js +++ b/public/assets/javascripts/rectangles/util/constants.js @@ -20,7 +20,8 @@ var height_min = 200, side_min = 10, side_max = 5000, resize_margin = 8, - cursor_amp = 1.5 + cursor_amp = 1.5, + DEFAULT_PICTURE_WIDTH = 400 var painting_distance_from_wall = 10, dot_distance_from_picture = 3 diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 3c5d4b7..205938f 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -40,7 +40,7 @@
-- cgit v1.2.3-70-g09d2 From dd6b2cc2cdd97b6163d115e5415736bccbffa831 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 15 Oct 2014 12:36:52 -0400 Subject: get rid of menu options --- public/assets/javascripts/rectangles/engine/map/ui_editor.js | 5 +++-- public/assets/javascripts/ui/editor/EditorToolbar.js | 10 +++++----- public/assets/javascripts/ui/editor/HelpCursor.js | 8 ++++++-- views/controls/builder/info.ejs | 5 ++++- views/controls/editor/light-control.ejs | 7 ++++++- views/controls/editor/presets.ejs | 12 ++++-------- views/controls/editor/toolbar.ejs | 4 ++++ views/controls/editor/wallpaper.ejs | 3 +++ 8 files changed, 35 insertions(+), 19 deletions(-) (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/rectangles/engine/map/ui_editor.js b/public/assets/javascripts/rectangles/engine/map/ui_editor.js index 072ff7e..44e416d 100644 --- a/public/assets/javascripts/rectangles/engine/map/ui_editor.js +++ b/public/assets/javascripts/rectangles/engine/map/ui_editor.js @@ -213,7 +213,8 @@ Map.UI.Editor = function(map){ if (intersects.length) { wheelState = wheelState || intersects[0].copy() - intersects[0].height = clamp( ~~(intersects[0].height - deltaY), height_min, height_max ) + intersects[0].height = clamp( ~~(intersects[0].height + deltaY * 2), height_min, height_max ) + app.tube("builder-pick-room", intersects[0]) clearTimeout(wheelTimeout) wheelTimeout = setTimeout(function(){ @@ -224,7 +225,7 @@ Map.UI.Editor = function(map){ }) Rooms.rebuild() wheelState = null - }, 500) + }, 250) } else { map.set_zoom(map.zoom_exponent - deltaY/20) diff --git a/public/assets/javascripts/ui/editor/EditorToolbar.js b/public/assets/javascripts/ui/editor/EditorToolbar.js index 4f07d1f..9c2f3d3 100644 --- a/public/assets/javascripts/ui/editor/EditorToolbar.js +++ b/public/assets/javascripts/ui/editor/EditorToolbar.js @@ -30,11 +30,11 @@ var EditorToolbar = View.extend({ }, toggleMap: function(state){ - if (typeof state != "boolean") { - state = ! $("[data-role='toggle-map-view']").hasClass("inuse") - this.resetControls() - } - $("[data-role='toggle-map-view']").toggleClass("inuse", state) +// if (typeof state != "boolean") { +// state = ! $("[data-role='toggle-map-view']").hasClass("inuse") +// this.resetControls() +// } +// $("[data-role='toggle-map-view']").toggleClass("inuse", state) map.toggle(state) $("#minimap").toggleClass("hide", state) this.parent.info.toggle(state) diff --git a/public/assets/javascripts/ui/editor/HelpCursor.js b/public/assets/javascripts/ui/editor/HelpCursor.js index 842e871..b2f411d 100644 --- a/public/assets/javascripts/ui/editor/HelpCursor.js +++ b/public/assets/javascripts/ui/editor/HelpCursor.js @@ -3,8 +3,12 @@ var HelpCursor = View.extend({ el: "#helpCursor", messages: { - start: "Welcome to Vvalls!", - move: "Use the up and down keys to move around. Use left and right to pivot. WASD works too.", + start: "Welcome to Vvalls! Click one of the tools at right to learn how it works.", + media: "This is where you pick media to go on the walls. You can upload media, paste links, or use some of the found media.", + presets: "These presets will affect on all the walls. Click some of them to see the walls change.", + wallpaper: "Drag the wallpaper onto the walls, floor, and ceiling.", + colors: "", + settings: "This is where you publish your project.", }, shown: {}, diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 205938f..54bb38e 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -2,7 +2,10 @@

Map Editor

- Click a room to select it, or click and drag to make a new room. + Click and drag to make a new room. + Click a room to select it. +

+ Press ESC to toggle the map.
diff --git a/views/controls/editor/light-control.ejs b/views/controls/editor/light-control.ejs index 8b20464..4604a7a 100644 --- a/views/controls/editor/light-control.ejs +++ b/views/controls/editor/light-control.ejs @@ -1,6 +1,11 @@

Edit Room Colors

-
+ +

Preset Colors

+
+
+ +
diff --git a/views/controls/editor/presets.ejs b/views/controls/editor/presets.ejs index 70e48e3..8dd1986 100644 --- a/views/controls/editor/presets.ejs +++ b/views/controls/editor/presets.ejs @@ -1,18 +1,14 @@
-

Preset Colors

-
-
-

Preset Styles

- - Wireframe + + Inverse Shaded - - Inverse + + Wireframe P.Funk diff --git a/views/controls/editor/toolbar.ejs b/views/controls/editor/toolbar.ejs index 57a98b9..1bb31b8 100644 --- a/views/controls/editor/toolbar.ejs +++ b/views/controls/editor/toolbar.ejs @@ -1,9 +1,11 @@ +
+
-- cgit v1.2.3-70-g09d2 From 7089dded0589d45b00a6d4f2a3d1eb2adcf11d1b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 15 Oct 2014 12:56:50 -0400 Subject: more help text --- .../assets/javascripts/ui/editor/EditorSettings.js | 3 ++ public/assets/javascripts/ui/editor/HelpCursor.js | 6 ++-- .../assets/javascripts/ui/editor/LightControl.js | 32 +++++++++++++++++++--- public/assets/javascripts/ui/editor/MediaViewer.js | 2 ++ public/assets/javascripts/ui/editor/Presets.js | 24 +--------------- .../javascripts/ui/editor/WallpaperPicker.js | 1 + public/assets/stylesheets/app.css | 7 +++-- views/controls/builder/info.ejs | 2 +- views/controls/editor/light-control.ejs | 1 - 9 files changed, 43 insertions(+), 35 deletions(-) (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index ac361a7..e47739b 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -121,6 +121,9 @@ var EditorSettings = FormView.extend({ $(".inuse").removeClass("inuse") $("[data-role='toggle-project-settings']").toggleClass("inuse", state) + if (state) { + this.parent.cursor.show("settings") + } }, enterSubmit: function (e) { diff --git a/public/assets/javascripts/ui/editor/HelpCursor.js b/public/assets/javascripts/ui/editor/HelpCursor.js index b2f411d..4a6e616 100644 --- a/public/assets/javascripts/ui/editor/HelpCursor.js +++ b/public/assets/javascripts/ui/editor/HelpCursor.js @@ -7,8 +7,8 @@ var HelpCursor = View.extend({ media: "This is where you pick media to go on the walls. You can upload media, paste links, or use some of the found media.", presets: "These presets will affect on all the walls. Click some of them to see the walls change.", wallpaper: "Drag the wallpaper onto the walls, floor, and ceiling.", - colors: "", - settings: "This is where you publish your project.", + colors: "Use these colors to change the color of the walls, floor, and ceiling.", + settings: "This is where you publish your project. Give it a name, hit save, and you'll have a URL you can share with your friends.", }, shown: {}, @@ -21,7 +21,7 @@ var HelpCursor = View.extend({ }, show: function(name){ - if (name) this.showMessage(name) + this.showMessage(name) this.$el.show() }, diff --git a/public/assets/javascripts/ui/editor/LightControl.js b/public/assets/javascripts/ui/editor/LightControl.js index 34a5a51..bb4454a 100644 --- a/public/assets/javascripts/ui/editor/LightControl.js +++ b/public/assets/javascripts/ui/editor/LightControl.js @@ -5,14 +5,28 @@ var LightControl = View.extend({ events: { "mousedown": "stopPropagation", "click .color-swatches span": "select", - "input #shadow-control": "updateShadow", "mousedown #brightness-control": "beginBrightness", "input #brightness-control": "updateBrightness", - "input #outline-hue": "updateShadow", - "input #wall-hue": "updateShadow", }, + + colors: [ + [255,94,58], + [255,149,0], + [255,219,76], + [76,217,100], + [52,170,220], + [29,98,240], + [198,68,252], + [0,0,0], + [74,74,74], + [125,126,127], + [209,211,212], + [235,235,235], + [255,255,255], + ], - initialize: function(){ + initialize: function(opt){ + this.parent = opt.parent this.colorPicker = new LabColorPicker(this, 180, 180) this.$("#color-picker").append( this.colorPicker.canvas ) @@ -27,6 +41,15 @@ var LightControl = View.extend({ ceiling: this.$("#ceiling-color"), } this.$brightnessControl = this.$("#brightness-control") + + this.$colors = this.$(".colors") + this.colors.forEach(function(color){ + var $swatch = $("") + $swatch.css("background-color","rgb(" + color + ")") + $swatch.data('color', color) + this.$colors.append($swatch) + }.bind(this)) + }, modes: [ "wall", "outline", "floor", "ceiling" ], @@ -54,6 +77,7 @@ var LightControl = View.extend({ }, show: function(){ + this.parent.cursor.show("colors") this.toggle(true) }, diff --git a/public/assets/javascripts/ui/editor/MediaViewer.js b/public/assets/javascripts/ui/editor/MediaViewer.js index b270be5..df77fb1 100644 --- a/public/assets/javascripts/ui/editor/MediaViewer.js +++ b/public/assets/javascripts/ui/editor/MediaViewer.js @@ -68,6 +68,7 @@ var MediaViewer = ModalView.extend({ this.loadTrending() } else { + this.parent.cursor.show("media") this.__super__.show.call(this) } }, @@ -146,6 +147,7 @@ var MediaViewer = ModalView.extend({ } else { this.loaded = true + this.parent.cursor.show("media") this.__super__.show.call(this) } }, diff --git a/public/assets/javascripts/ui/editor/Presets.js b/public/assets/javascripts/ui/editor/Presets.js index 1e70aa2..6222e33 100644 --- a/public/assets/javascripts/ui/editor/Presets.js +++ b/public/assets/javascripts/ui/editor/Presets.js @@ -7,22 +7,6 @@ var Presets = View.extend({ "click .swatches span": "selectColor", }, - colors: [ - [255,94,58], - [255,149,0], - [255,219,76], - [76,217,100], - [52,170,220], - [29,98,240], - [198,68,252], - [0,0,0], - [74,74,74], - [125,126,127], - [209,211,212], - [235,235,235], - [255,255,255], - ], - presets: { wireframe: { wall: [255,255,255], @@ -52,13 +36,6 @@ var Presets = View.extend({ initialize: function(opt){ this.parent = opt.parent - this.$colors = this.$(".colors") - this.colors.forEach(function(color){ - var $swatch = $("") - $swatch.css("background-color","rgb(" + color + ")") - $swatch.data('color', color) - this.$colors.append($swatch) - }.bind(this)) }, toggle: function(state){ @@ -66,6 +43,7 @@ var Presets = View.extend({ }, show: function(){ + this.parent.cursor.show("presets") this.toggle(true) }, diff --git a/public/assets/javascripts/ui/editor/WallpaperPicker.js b/public/assets/javascripts/ui/editor/WallpaperPicker.js index 6bf2542..541ab31 100644 --- a/public/assets/javascripts/ui/editor/WallpaperPicker.js +++ b/public/assets/javascripts/ui/editor/WallpaperPicker.js @@ -28,6 +28,7 @@ var WallpaperPicker = UploadView.extend({ loaded: false, show: function(){ if (! this.loaded) { + this.parent.cursor.show("wallpaper") this.load() } else { diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 0140dc6..250ae67 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1485,10 +1485,11 @@ border-left: 1px solid black; padding-bottom: 6px; } -#presets .colors { +.vvbox .colors { + max-width: 170px; margin-bottom: 5px; } -#presets .colors span { +.vvbox .colors span { display: inline-block; font-size: 0; width: 20px; @@ -1498,7 +1499,7 @@ border-left: 1px solid black; cursor: pointer; transition: transform 0.2s; } -#presets .colors span:hover { +.vvbox .colors span:hover { transform: translateX(3px) translateY(-3px); } diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 54bb38e..2762207 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -3,7 +3,7 @@
Click and drag to make a new room. - Click a room to select it. + Click a room to select, move or resize it.

Press ESC to toggle the map.
diff --git a/views/controls/editor/light-control.ejs b/views/controls/editor/light-control.ejs index 4604a7a..99d68f5 100644 --- a/views/controls/editor/light-control.ejs +++ b/views/controls/editor/light-control.ejs @@ -1,7 +1,6 @@

Edit Room Colors

-

Preset Colors

-- cgit v1.2.3-70-g09d2 From bc4517c6b09e03f52161dc38ca591ed0cc227d5d Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 13 Nov 2014 18:33:39 -0500 Subject: toggle global height --- .../javascripts/rectangles/engine/map/ui_editor.js | 1 + .../javascripts/rectangles/engine/rooms/_rooms.js | 4 ++++ .../assets/javascripts/ui/builder/BuilderInfo.js | 22 ++++++++++++++++++++++ public/assets/stylesheets/app.css | 14 +++++++++++++- views/controls/builder/info.ejs | 2 ++ 5 files changed, 42 insertions(+), 1 deletion(-) (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/rectangles/engine/map/ui_editor.js b/public/assets/javascripts/rectangles/engine/map/ui_editor.js index c838b8b..44ca91d 100644 --- a/public/assets/javascripts/rectangles/engine/map/ui_editor.js +++ b/public/assets/javascripts/rectangles/engine/map/ui_editor.js @@ -42,6 +42,7 @@ Map.UI.Editor = function(map){ cursor.y.div(map.dimensions.b).sub(0.5).mul(map.dimensions.b / map.zoom).sub(map.center.b) if (e.ctrlKey || e.which === 3) { + if (Rooms.regions.length == 0) return cursor.quantize(1/map.zoom) map.center.a = cursor.x.a map.center.b = -cursor.y.a diff --git a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js index 5686aba..46c1d7f 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/_rooms.js +++ b/public/assets/javascripts/rectangles/engine/rooms/_rooms.js @@ -81,6 +81,10 @@ base.forEach = function(f){ return base.values().forEach(f) } + + base.some = function(f){ + return base.values().some(f) + } base.map = function(f){ return base.values().map(f) diff --git a/public/assets/javascripts/ui/builder/BuilderInfo.js b/public/assets/javascripts/ui/builder/BuilderInfo.js index 7606361..c25f03c 100644 --- a/public/assets/javascripts/ui/builder/BuilderInfo.js +++ b/public/assets/javascripts/ui/builder/BuilderInfo.js @@ -16,6 +16,7 @@ var BuilderInfo = View.extend({ "change [name=units]": 'changeUnits', "keydown [name=viewHeight]": 'enterViewHeight', "change [name=viewHeight]": 'changeViewHeight', + "change [name=heightGlobal]": 'changeHeightGlobal', "click [data-role=destroy-room]": 'destroy', }, @@ -31,6 +32,7 @@ var BuilderInfo = View.extend({ this.$unitName = this.$(".unitName") this.$noSelection = this.$(".no-selection") this.$settings = this.$(".setting") + this.$heightGlobalCheckbox = this.$("[name=heightGlobal]") app.on("builder-pick-room", this.pick.bind(this)) app.on("builder-destroy-room", this.hide.bind(this)) app.on("builder-pick-nothing", this.deselect.bind(this)) @@ -40,6 +42,18 @@ var BuilderInfo = View.extend({ this.$viewHeight.unitVal( window.viewHeight = data.viewHeight || app.defaults.viewHeight ) this.$units.val( "ft" ) this.$unitName.html( "ft" ) + + if (Rooms.regions.length == 0) { + this.changeHeightGlobal(true) + } + else { + var rooms = Rooms.values() + var height = rooms[0].height + var differentHeights = Rooms.some(function(room){ + return room.height != height + }) + this.changeHeightGlobal( ! differentHeights ) + } }, toggle: function(state){ @@ -141,5 +155,13 @@ var BuilderInfo = View.extend({ changeViewHeight: function(){ window.viewHeight = this.$viewHeight.unitVal( ) }, + changeHeightGlobal: function(state){ + if (typeof state == "boolean") { + this.$heightGlobalCheckbox.prop("checked", state) + window.heightIsGlobal = state + return + } + window.heightIsGlobal = this.$heightGlobalCheckbox.prop("checked") + }, }) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 814df90..55f3219 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1582,7 +1582,8 @@ border-left: 1px solid black; transition:opacity 0.3s ease-in-out; } .reader #minimap { - right: 20px; + right: 10px; + bottom: 10px; left: auto; -webkit-transform:translateX(180px); -moz-transform:translateX(180px); @@ -2141,6 +2142,17 @@ input[type="range"]::-webkit-slider-thumb { top: 0px; } +.setting.number #room-height { + width: 60px; +} +.setting.number #room-height-global-label { + float: none; + margin-left: 6px; +} +.setting.number #room-height-global-label:after { + content: ''; +} + #mediaEditor .setting.number label { width: 40px; } diff --git a/views/controls/builder/info.ejs b/views/controls/builder/info.ejs index 2762207..8a0e0d5 100644 --- a/views/controls/builder/info.ejs +++ b/views/controls/builder/info.ejs @@ -20,6 +20,8 @@
+ +
-- cgit v1.2.3-70-g09d2 From 272474767b6ed1f419843c7a205c16f934eeb84f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 20 Aug 2015 23:33:36 -0400 Subject: turn segments into rects --- .../rectangles/engine/shapes/regionlist.js | 54 ++++++++-------------- .../assets/javascripts/rectangles/models/rect.js | 6 +++ .../assets/javascripts/rectangles/models/vec2.js | 3 ++ .../javascripts/ui/blueprint/BlueprintEditor.js | 2 +- .../javascripts/ui/blueprint/BlueprintSettings.js | 16 ++++--- public/assets/javascripts/ui/lib/ToggleableView.js | 19 ++++++++ views/controls/blueprint/info.ejs | 4 +- views/controls/builder/info.ejs | 4 +- views/controls/editor/media-editor.ejs | 4 +- views/partials/scripts.ejs | 1 + 10 files changed, 65 insertions(+), 48 deletions(-) create mode 100644 public/assets/javascripts/ui/lib/ToggleableView.js (limited to 'views/controls/builder/info.ejs') diff --git a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js index 94b902a..42519cf 100644 --- a/public/assets/javascripts/rectangles/engine/shapes/regionlist.js +++ b/public/assets/javascripts/rectangles/engine/shapes/regionlist.js @@ -12,7 +12,7 @@ var RegionList = (function(){ var rooms = [] var open_segments = [] - var segment, open_segment, vertical, other_side + var segment, open_segment, y_segments for (var i = 0; i < segments.length; i++) { segment = segments[i] @@ -21,12 +21,20 @@ var RegionList = (function(){ } for (var j = 0; j < open_segments.length; j++) { open_segment = open_segments[j] - if (overlaps(segment, open_segment)) { + if (segment.y.overlaps(open_segment.y)) { // if we have overlap, it means we have made a full room - other_side = clone_segment(open_segment) - other_side[0].a = segment[0].a - other_side[1].a = segment[1].a - rooms.push([open_segment, other_side]) + + y_segments = open_segment.y.split(segment.y) + + if (y_segments.length == 1) { + open_segment.x.b = segment.x.b + rooms.push(open_segment) + } + +// other_side = clone_segment(open_segment) +// other_side[0].a = segment[0].a +// other_side[1].a = segment[1].a +// rooms.push([open_segment, other_side]) open_segments.splice(j, 1) j-- } @@ -43,8 +51,8 @@ var RegionList = (function(){ // get a list of all segments from these polylines var segments = shapes.getAllSegments() - // re-orientate them so they're either facing up or right - segments.forEach(function(segment){ + // re-orient them so they're either facing up or right and make them into rects + segments = segments.map(function(segment){ // vertical if (segment[0].a == segment[1].a) { if (segment[0].b > segment[1].b) { @@ -57,36 +65,12 @@ var RegionList = (function(){ segment.push(segment.shift()) } } + return new Rect( segment[0].a, segment[0].b, segment[1].a, segment[1].b ) }) - // sort them from top to bottom, left to right - segments = segments.sort(function(a,b){ - if (a[0].a < b[0].a) { - return -1 - } - else if (a[0].a == b[0].a) { - if (a[0].b < b[0].b) { - return -1 - } - else if (a[0].b == b[0].b) { - return 0 - } - else { - return 1 - } - } - else { - return 1 - } - }) - - return segments + return sort.rects_by_position(segments) } - - function isVertical (segment) { return segment[0].a == segment[1].a } - function isHorizontal (segment) { return segment[0].b == segment[1].b } - function overlaps (a,b) { return (a[0].b > b[0].b || a[1].b < b[1].b) } - function clone_segment(a){ return [a[0].clone(), a[1].clone()] } + return RegionList })() \ 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 92c8c9e..a4756ed 100644 --- a/public/assets/javascripts/rectangles/models/rect.js +++ b/public/assets/javascripts/rectangles/models/rect.js @@ -62,6 +62,12 @@ Rect.prototype.maxDimension = function(){ return abs(this.width) > abs(this.height) ? this.width : this.height } + Rect.prototype.isVertical = function(){ + return this.x.isPoint() + } + Rect.prototype.isHorizontal = function(){ + return this.y.isPoint() + } Rect.prototype.mul = function(n){ this.x.mul(n) diff --git a/public/assets/javascripts/rectangles/models/vec2.js b/public/assets/javascripts/rectangles/models/vec2.js index 290e45e..90a56c6 100644 --- a/public/assets/javascripts/rectangles/models/vec2.js +++ b/public/assets/javascripts/rectangles/models/vec2.js @@ -43,6 +43,9 @@ vec2.prototype.eq = function(v){ return this.a == v.a && this.b == v.b } + vec2.prototype.isPoint = function(){ + return this.a == this.b + } vec2.prototype.add = function(n){ this.a += n this.b += n diff --git a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js index 8fe66ca..18ecf5f 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintEditor.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintEditor.js @@ -93,7 +93,7 @@ var BlueprintEditor = View.extend(AnimatedView.prototype).extend({ map.draw.ctx.save() map.draw.translate() - // this.floorplan.draw(map.draw.ctx, true) + this.floorplan.draw(map.draw.ctx, true) map.draw.coords() diff --git a/public/assets/javascripts/ui/blueprint/BlueprintSettings.js b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js index acd8dcc..252e3f1 100644 --- a/public/assets/javascripts/ui/blueprint/BlueprintSettings.js +++ b/public/assets/javascripts/ui/blueprint/BlueprintSettings.js @@ -1,5 +1,5 @@ -var BlueprintSettings = FormView.extend({ +var BlueprintSettings = FormView.extend(ToggleableView.prototype).extend({ el: "#blueprintSettings", action: "/api/blueprint/edit", @@ -25,7 +25,13 @@ var BlueprintSettings = FormView.extend({ load: function(data){ this.$id.val(data._id) - this.$name.val(data.name) + if (data.name) { + this.$name.val(data.name) + this.hide() + } + else { + this.$name.val("") + } if (data.shapes) { shapes.destroy() shapes.deserialize( data.shapes ) @@ -51,10 +57,6 @@ var BlueprintSettings = FormView.extend({ }.bind(this)) }, - toggle: function(state){ - this.$el.toggleClass("active", state) - }, - enterSubmit: function (e) { e.stopPropagation() var base = this @@ -105,6 +107,8 @@ var BlueprintSettings = FormView.extend({ this.$name.val(data.name) this.action = this.updateAction + this.hide() + Minotaur.unwatch(this) Minotaur.hide() diff --git a/public/assets/javascripts/ui/lib/ToggleableView.js b/public/assets/javascripts/ui/lib/ToggleableView.js new file mode 100644 index 0000000..371629f --- /dev/null +++ b/public/assets/javascripts/ui/lib/ToggleableView.js @@ -0,0 +1,19 @@ +var ToggleableView = View.extend({ + + toggle: function(state){ + this.$el.toggleClass("active", state) + }, + + show: function(){ + this.toggle(true) + }, + + hide: function(){ + this.toggle(false) + }, + + visible: function(){ + return this.$el.hasClass("active") + } + +}) \ No newline at end of file diff --git a/views/controls/blueprint/info.ejs b/views/controls/blueprint/info.ejs index 9f7d708..4e2316f 100644 --- a/views/controls/blueprint/info.ejs +++ b/views/controls/blueprint/info.ejs @@ -15,8 +15,8 @@
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