From 098a330fab261885a86c7ae9a5b2ed294987dc6b Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 27 Aug 2014 12:47:05 -0400 Subject: fix tests --- public/assets/javascripts/ui/editor/LightControl.js | 1 - 1 file changed, 1 deletion(-) (limited to 'public/assets/javascripts/ui/editor/LightControl.js') diff --git a/public/assets/javascripts/ui/editor/LightControl.js b/public/assets/javascripts/ui/editor/LightControl.js index 1bd660e..f35b19e 100644 --- a/public/assets/javascripts/ui/editor/LightControl.js +++ b/public/assets/javascripts/ui/editor/LightControl.js @@ -170,7 +170,6 @@ var LabColorPicker = function (parent, w, h) { var y = mix( norm(Lab[2], b_range[0], b_range[1]), 0, hh ) // move the cursor this.setLab(Lab) - console.log(rgba) return Lab } this.paint = function() { -- cgit v1.2.3-70-g09d2 From 63b0e94e3e36838240c2d86e780a641c2255ed89 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Wed, 27 Aug 2014 13:03:46 -0400 Subject: floor/ceiling colors --- .../assets/javascripts/rectangles/models/room.js | 12 +++++ .../assets/javascripts/ui/editor/LightControl.js | 63 ++++++++++++++++++++-- public/assets/stylesheets/app.css | 9 +++- views/controls/editor/light-control.ejs | 7 ++- 4 files changed, 83 insertions(+), 8 deletions(-) (limited to 'public/assets/javascripts/ui/editor/LightControl.js') diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js index 33a94d0..1cc929f 100644 --- a/public/assets/javascripts/rectangles/models/room.js +++ b/public/assets/javascripts/rectangles/models/room.js @@ -182,6 +182,18 @@ return collision } + Room.prototype.setFloorColor = function(rgbColor) { + this.mx_floor.map(function(mx){ + mx.el.style.backgroundColor = rgbColor + }) + } + + Room.prototype.setCeilingColor = function(rgbColor) { + this.mx_ceiling.map(function(mx){ + mx.el.style.backgroundColor = rgbColor + }) + } + if ('window' in this) { window.Room = Room } diff --git a/public/assets/javascripts/ui/editor/LightControl.js b/public/assets/javascripts/ui/editor/LightControl.js index f35b19e..a3a19c7 100644 --- a/public/assets/javascripts/ui/editor/LightControl.js +++ b/public/assets/javascripts/ui/editor/LightControl.js @@ -6,6 +6,8 @@ var LightControl = View.extend({ "mousedown": "stopPropagation", "click #wall-color": "editWallColor", "click #outline-color": "editOutlineColor", + "click #floor-color": "editFloorColor", + "click #ceiling-color": "editCeilingColor", "click label": "clickLabel", "input #shadow-control": "updateShadow", "input #brightness-control": "updateBrightness", @@ -17,14 +19,20 @@ var LightControl = View.extend({ this.colorPicker = new LabColorPicker(this, 180, 180) this.$el.prepend( this.colorPicker.canvas ) + this.$swatches = this.$(".swatch") + this.$labels = this.$(".swatch + label") this.$wallSwatch = this.$("#wall-color") this.$outlineSwatch = this.$("#outline-color") + this.$floorSwatch = this.$("#floor-color") + this.$ceilingSwatch = this.$("#ceiling-color") this.$brightnessControl = this.$("#brightness-control") this.setMode("wall") - this.setWallColor([255,255,255], false) - this.setOutlineColor([0,0,0]) + this.setWallColor(this.wallColor, false) + this.setOutlineColor(this.outlineColor) + this.setFloorColor(this.floorColor) + this.setCeilingColor(this.ceilingColor) }, toggle: function(state){ @@ -48,27 +56,44 @@ var LightControl = View.extend({ case "outline": this.setOutlineColor(rgb) break + case "floor": + this.setFloorColor(rgb) + break + case "ceiling": + this.setCeilingColor(rgb) + break } }, wallColor: [255,255,255], outlineColor: [0,0,0], + floorColor: [246,246,246], + ceilingColor: [255,255,255], setMode: function (mode) { var color, brightness this.mode = mode + this.$swatches.removeClass("selected") + this.$labels.removeClass("selected") switch (mode) { case "wall": this.$wallSwatch.addClass("selected") - this.$outlineSwatch.removeClass("selected") color = this.wallColor break case "outline": this.$outlineSwatch.addClass("selected") - this.$wallSwatch.removeClass("selected") color = this.outlineColor break + case "floor": + this.$floorSwatch.addClass("selected") + color = this.floorColor + break + case "ceiling": + this.$ceilingSwatch.addClass("selected") + color = this.ceilingColor + break } + this.$(".swatch.selected").next("label").addClass("selected") this.labColor = this.colorPicker.load(color) this.$brightnessControl.val( this.labColor[0] ) }, @@ -83,7 +108,15 @@ var LightControl = View.extend({ this.setMode("outline") }, - setWallColor: function(rgb, repaint){ + editFloorColor: function(){ + this.setMode("floor") + }, + + editCeilingColor: function(){ + this.setMode("ceiling") + }, + + setWallColor: function(rgb, repaint){ repaint = typeof repaint != "undefined" ? repaint : true var rgbColor = rgb_string(rgb) var rgbaColor = rgba_string(rgb, 0.95) @@ -94,6 +127,26 @@ var LightControl = View.extend({ }) }, + setFloorColor: function(rgb, repaint){ + repaint = typeof repaint != "undefined" ? repaint : true + var rgbColor = rgb_string(rgb) + this.floorColor = rgb + this.$floorSwatch.css("background-color", rgbColor) + Rooms.forEach(function(room){ + room.setFloorColor(rgbColor) + }) + }, + + setCeilingColor: function(rgb, repaint){ + repaint = typeof repaint != "undefined" ? repaint : true + var rgbColor = rgb_string(rgb) + this.ceilingColor = rgb + this.$ceilingSwatch.css("background-color", rgbColor) + Rooms.forEach(function(room){ + room.setCeilingColor(rgbColor) + }) + }, + setOutlineColor: function(rgb){ repaint = typeof repaint != "undefined" ? repaint : true var rgbColor = rgb_string(rgb) diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index ff35ca4..6f6a192 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1201,6 +1201,7 @@ input[type="range"]::-webkit-slider-thumb { height: 20px; border: 1px solid black; display: inline-block; + cursor: pointer; } .swatch.selected { border-width: 2px; @@ -1213,7 +1214,13 @@ input[type="range"]::-webkit-slider-thumb { font-weight: 300; position: relative; top: -6px; - margin-right: 15px; + padding-left: 5px; + display: inline-block; + width: 60px; + cursor: pointer; +} +.color-swatches label.selected { + font-weight: 500; } diff --git a/views/controls/editor/light-control.ejs b/views/controls/editor/light-control.ejs index 4324087..02a78b6 100644 --- a/views/controls/editor/light-control.ejs +++ b/views/controls/editor/light-control.ejs @@ -6,8 +6,11 @@
-
-
+
+
+
+
+
-- cgit v1.2.3-70-g09d2 From e35e2f338ee7b14d8396485e58cb5593060add8e Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Thu, 28 Aug 2014 17:55:31 -0400 Subject: persisting wall colors in db --- public/assets/javascripts/ui/editor/EditorSettings.js | 7 ++++--- public/assets/javascripts/ui/editor/LightControl.js | 16 ++++++++-------- server/lib/api/projects.js | 3 +++ server/lib/schemas/Project.js | 1 + 4 files changed, 16 insertions(+), 11 deletions(-) (limited to 'public/assets/javascripts/ui/editor/LightControl.js') diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js index 2d3201e..2a3929a 100644 --- a/public/assets/javascripts/ui/editor/EditorSettings.js +++ b/public/assets/javascripts/ui/editor/EditorSettings.js @@ -35,8 +35,8 @@ var EditorSettings = FormView.extend({ data.walls && Walls.deserialize(data.walls) data.startPosition && scene.camera.move(data.startPosition) - if (data.colors) { - this.parent.lightControl.load() + if (data.colors && data.colors.wall) { + this.parent.lightControl.load(data.colors) } else { this.parent.lightControl.loadDefaults() @@ -136,7 +136,8 @@ var EditorSettings = FormView.extend({ fd.append( "description", this.$description.val() ) fd.append( "privacy", this.$privacy.filter(":checked").val() == "private" ) fd.append( "rooms", JSON.stringify( Rooms.serialize() ) ) - fd.append( "walls", JSON.stringify( Rooms.serializeWalls() ) ) + fd.append( "walls", JSON.stringify( Walls.serialize() ) ) + fd.append( "colors", JSON.stringify( Walls.colors ) ) fd.append( "media", JSON.stringify( Scenery.serialize() ) ) fd.append( "startPosition", JSON.stringify( app.position(scene.camera) ) ) diff --git a/public/assets/javascripts/ui/editor/LightControl.js b/public/assets/javascripts/ui/editor/LightControl.js index 5133de2..84f2e58 100644 --- a/public/assets/javascripts/ui/editor/LightControl.js +++ b/public/assets/javascripts/ui/editor/LightControl.js @@ -29,19 +29,19 @@ var LightControl = View.extend({ }, load: function(data){ - this.setWallColor(data.wallColor, false) - this.setOutlineColor(data.outlineColor) - this.setFloorColor(data.floorColor) - this.setCeilingColor(data.ceilingColor) + this.setWallColor(data.wall, false) + this.setOutlineColor(data.outline) + this.setFloorColor(data.floor) + this.setCeilingColor(data.ceiling) this.setMode("wall") }, loadDefaults: function(){ var colors = { - wallColor: app.defaults.wallColor.slice(), - outlineColor: app.defaults.outlineColor.slice(), - floorColor: app.defaults.floorColor.slice(), - ceilingColor: app.defaults.ceilingColor.slice(), + wall: app.defaults.wallColor.slice(), + outline: app.defaults.outlineColor.slice(), + floor: app.defaults.floorColor.slice(), + ceiling: app.defaults.ceilingColor.slice(), } this.load(colors) }, diff --git a/server/lib/api/projects.js b/server/lib/api/projects.js index bd3cb81..2a5beff 100644 --- a/server/lib/api/projects.js +++ b/server/lib/api/projects.js @@ -39,6 +39,7 @@ var projects = { data.rooms = JSON.parse(data.rooms) data.walls = JSON.parse(data.walls) data.media = JSON.parse(data.media) + data.colors = JSON.parse(data.colors) data.startPosition = JSON.parse(data.startPosition) upload.put("projects", req.files.thumbnail, { @@ -91,8 +92,10 @@ var projects = { Project.findOne({ _id: _id }, function(err, doc){ if (err || ! doc) { return res.json({ error: err }) } _.extend(doc, data) + doc.rooms = JSON.parse(data.rooms) doc.walls = JSON.parse(data.walls) + doc.colors = JSON.parse(data.colors) doc.media = JSON.parse(data.media) doc.startPosition = JSON.parse(data.startPosition) diff --git a/server/lib/schemas/Project.js b/server/lib/schemas/Project.js index 0f54eaa..abf34fb 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], + colors: mongoose.Schema.Types.Mixed, startPosition: mongoose.Schema.Types.Mixed, user_id: { type: mongoose.Schema.ObjectId, index: true }, created_at: { type: Date }, -- cgit v1.2.3-70-g09d2