diff options
| -rw-r--r-- | public/assets/javascripts/rectangles/engine/rooms/_walls.js | 28 | ||||
| -rw-r--r-- | public/assets/javascripts/rectangles/models/floor.js | 5 | ||||
| -rw-r--r-- | public/assets/javascripts/ui/editor/Presets.js | 25 | ||||
| -rw-r--r-- | public/assets/javascripts/util.js | 3 | ||||
| -rwxr-xr-x | public/assets/stylesheets/app.css | 7 | ||||
| -rw-r--r-- | views/controls/editor/presets.ejs | 1 |
6 files changed, 60 insertions, 9 deletions
diff --git a/public/assets/javascripts/rectangles/engine/rooms/_walls.js b/public/assets/javascripts/rectangles/engine/rooms/_walls.js index 5c16ce6..fe5913d 100644 --- a/public/assets/javascripts/rectangles/engine/rooms/_walls.js +++ b/public/assets/javascripts/rectangles/engine/rooms/_walls.js @@ -160,7 +160,19 @@ }.bind(this) img.src = background.src img.complete && img.onload() - } + }, + floor: function(background){ + Walls.floors.forEach(function(floor){ + if (floor.ceiling) return + floor.wallpaper(background) + }) + }, + ceiling: function(background){ + Walls.floors.forEach(function(floor){ + if (! floor.ceiling) return + floor.wallpaper(background) + }) + }, } base.clearWallpaper = { @@ -168,7 +180,19 @@ Walls.list.forEach(function(wall){ wall.wallpaper("none") }) - } + }, + floor: function(){ + Walls.floors.forEach(function(floor){ + if (floor.ceiling) return + wall.wallpaper("none") + }) + }, + ceiling: function(){ + Walls.floors.forEach(function(floor){ + if (! floor.ceiling) return + wall.wallpaper("none") + }) + }, } base.setColor = { diff --git a/public/assets/javascripts/rectangles/models/floor.js b/public/assets/javascripts/rectangles/models/floor.js index 7ed52a1..9838232 100644 --- a/public/assets/javascripts/rectangles/models/floor.js +++ b/public/assets/javascripts/rectangles/models/floor.js @@ -15,6 +15,7 @@ var Floor = function(opt){ this.id = opt.id this.side = opt.side + this.ceiling = opt.side & CEILING this.mx = opt.mx } @@ -114,8 +115,6 @@ this.background.x = background.x || this.background.x this.background.y = background.y || this.background.y this.background.scale = background.scale || this.background.scale || 1 - - var shouldFlip = this.side & (CEILING) var mx, dx, dy var w = Math.round( this.backgroundImage.naturalWidth * this.background.scale ) @@ -125,7 +124,7 @@ var region = mx.rect - if (shouldFlip) { + if (this.ceiling) { dx = Math.round( this.background.x - region.x.a ) dy = Math.round( this.background.y - region.y.a ) } diff --git a/public/assets/javascripts/ui/editor/Presets.js b/public/assets/javascripts/ui/editor/Presets.js index c34c826..cde2fdf 100644 --- a/public/assets/javascripts/ui/editor/Presets.js +++ b/public/assets/javascripts/ui/editor/Presets.js @@ -5,6 +5,8 @@ var Presets = View.extend({ "mousedown": "stopPropagation", "click .presets span": "selectPreset", "click .swatches span": "selectColor", + "change .url": "tileWalls", + "keydown .url": "enterSetUrl", }, presets: { @@ -21,7 +23,7 @@ var Presets = View.extend({ ceiling: [159,163,157], background: [109,116,106], }, - "p.funk": { + "p.Funk": { wall: [255,63,78], outline: [255,246,0], floor: [255,255,0], @@ -34,7 +36,7 @@ var Presets = View.extend({ ceiling: [0,0,0], }, matrix: { - wall: { src: "http://bibleway.biz/images/Matrix1.gif", scale: 4.0, color: [0,0,0] }, + wall: { src: "http://dump.fm/images/20130225/1361818675427-dumpfm-melipone-matrixremixtransfast.gif", scale: 4.0, color: [0,0,0] }, outline: [0,0,0], floor: [10,15,10], ceiling: [0,0,0], @@ -43,7 +45,9 @@ var Presets = View.extend({ initialize: function(opt){ this.parent = opt.parent - + + this.$url = this.$(".url") + this.$presets = this.$(".presets") _.keys(this.presets).forEach(function(name){ var $swatch = $("<span>") @@ -99,4 +103,19 @@ var Presets = View.extend({ this.lastPreset = preset }, + tileWalls: function(){ + var url = this.$url.sanitize() + if (url.length && url.indexOf("http://") == 0) { + Walls.setWallpaper.wall({ src: url }) + Walls.setWallpaper.floor({ src: url }) + Walls.setWallpaper.ceiling({ src: url }) + } + }, + enterSetUrl: function (e) { + e.stopPropagation() + if (e.keyCode == 13) { + setTimeout(this.tileWalls.bind(this), 100) + } + }, + })
\ No newline at end of file diff --git a/public/assets/javascripts/util.js b/public/assets/javascripts/util.js index 76c5c7b..367e20e 100644 --- a/public/assets/javascripts/util.js +++ b/public/assets/javascripts/util.js @@ -4,10 +4,11 @@ if (window.$) { $.fn.string = function() { return trim($(this).val()) } $.fn.enable = function() { return $(this).attr("disabled",null) } $.fn.disable = function() { return $(this).attr("disabled","disabled") } + $.fn.sanitize = function(s) { return trim(sanitize($(this).val())) } $.fn.htmlSafe = function(s) { return $(this).html(sanitize(s)) } } -function trim(s){ return s.replace(/^\s+/,"").replace(/\s+$/,"") } +function trim (s){ return s.replace(/^\s+/,"").replace(/\s+$/,"") } function sanitize (s){ return (s || "").replace(new RegExp("[<>&]", 'g'), "") } function capitalize (s){ return s.split(" ").map(capitalizeWord).join(" ") } function capitalizeWord (s){ return s.charAt(0).toUpperCase() + s.slice(1) } diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index bd2d42c..a711baa 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -1698,6 +1698,13 @@ input[type="range"]::-webkit-slider-thumb { width: 100%; color: #555; } +#presets .url { + margin: 4px 0; + padding: 2px; + font-size: 12px; + border: 1px black solid; + width: 100%; +} .color-swatches span:nth-child(1),.color-swatches span:nth-child(2){ margin-bottom:5px; diff --git a/views/controls/editor/presets.ejs b/views/controls/editor/presets.ejs index 04b1cf1..02e9d42 100644 --- a/views/controls/editor/presets.ejs +++ b/views/controls/editor/presets.ejs @@ -2,4 +2,5 @@ <h4>Preset Styles</h4> <div class="presets"> </div> + <input type="text" class="url" placeholder="enter a url"> </div> |