summaryrefslogtreecommitdiff
path: root/public/assets/javascripts/rectangles/models/wall.js
diff options
context:
space:
mode:
Diffstat (limited to 'public/assets/javascripts/rectangles/models/wall.js')
-rw-r--r--public/assets/javascripts/rectangles/models/wall.js274
1 files changed, 167 insertions, 107 deletions
diff --git a/public/assets/javascripts/rectangles/models/wall.js b/public/assets/javascripts/rectangles/models/wall.js
index 6e2c728..8723c3c 100644
--- a/public/assets/javascripts/rectangles/models/wall.js
+++ b/public/assets/javascripts/rectangles/models/wall.js
@@ -1,21 +1,28 @@
-window.Wall = (function(){
+(function(){
+ var vec2, Rect, sort
+ if ('window' in this) {
+ vec2 = window.vec2
+ Rect = window.Rect
+ sort = window.sort
+ }
+ else {
+ vec2 = require('./vec2')
+ Rect = require('./rect')
+ UidGenerator = require('../util/uid')
+ }
+
var Wall = function(opt){
this.id = opt.id
- this.uid = Uid()
- this.room = opt.room
- this.rect = opt.rect || new Rect (0,0,0,0)
- this.rect.sides = opt.side
+ this.vec = opt.vec
+ this.edge = opt.edge
this.side = opt.side
- this.mx = []
- this.els = []
- if (opt.el) {
- this.mx.push(opt.el)
- }
+ this.surface = opt.surface
+ this.mx = opt.mx
}
Wall.prototype.toString = function(){
- return this.rect.toString()
+ return this.vec.toString()
}
Wall.prototype.reset = function(){
@@ -25,42 +32,118 @@ window.Wall = (function(){
this.mx.forEach(function(mx){
mx.destroy && mx.destroy()
})
- this.room = this.rect = this.mx = this.els = null
+ this.room = this.vec = this.mx = null
}
Wall.prototype.bind = function(){
var base = this
base.$walls = $( this.mx.map(function(mx){ return mx.el }) )
- base.$walls.bind({
- mouseover: function(){
- },
- mouseenter: function(e){
- Scenery.mouse.mouseenter(e, base)
- },
- mousemove: function(e){
- },
- mousedown: function(){
- // base.randomize_colors()
- // console.log(sidesToString(base.side))
- if (Scenery.nextMedia) {
- var scenery = Scenery.addNextToWall(base)
-
- UndoStack.push({
- type: 'create-scenery',
- undo: { id: scenery.id },
- redo: scenery.serialize(),
+
+ this.mx.forEach(function(mx, index){
+ $(mx.el).bind({
+ mouseover: function(){
+ },
+ mouseenter: function(e){
+ Scenery.mouse.mouseenter(e, {
+ wall: base,
+ index: index,
})
+ },
+ mousemove: function(e){
+ },
+ mousedown: function(e){
+ if (Scenery.nextMedia) {
+ var scenery = Scenery.addNextToWall({
+ wall: base,
+ index: index
+ })
+
+ // scenery was not placed
+ if (! scenery) {
+ e.stopPropagation()
+ return
+ }
+
+ UndoStack.push({
+ type: 'create-scenery',
+ undo: { id: scenery.id },
+ redo: scenery.serialize(),
+ })
+
+ // TODO: watch individual scenery object here
+ Minotaur.watch( app.router.editorView.settings )
+ }
+ else if (Scenery.nextWallpaper) {
+ base.wallpaper()
+ }
+ else {
+ app.controller.hideExtras()
+ }
}
- else if (Scenery.nextWallpaper) {
- base.wallpaper()
- }
- else {
- app.controller.hideExtras()
- }
- }
+ })
})
this.outline()
}
+
+
+ // wall
+ // side: corresponds to the orientation of this wall
+ // vec: equivalent to the bounds of the Surface
+ // edge: the coordinate of the normal of this surface
+ // var useX = side & LEFT_RIGHT
+ // var useA = side & (FRONT | LEFT)
+ // edge = mx.rect[useX ? 'x': 'y'][ useA ? 'a': 'b']
+ // surface: an ordered set of contiguous wall regions, corresponding to mx objects
+
+ Wall.prototype.positionToMx = function(position, dimension) {
+ var x, z
+ switch (this.side) {
+ case FRONT:
+ x = position.a + dimension.a / 2
+ z = this.edge + painting_distance_from_wall
+ break
+ case BACK:
+ x = position.a + dimension.a / 2
+ z = this.edge - painting_distance_from_wall
+ break
+ case LEFT:
+ x = this.edge + painting_distance_from_wall
+ z = position.a + dimension.a / 2
+ break
+ case RIGHT:
+ x = this.edge - painting_distance_from_wall
+ z = position.a + dimension.a / 2
+ break
+ }
+ return {
+ x: x,
+ y: position.b + dimension.b / 2,
+ z: z,
+ rotationY: wall_rotation[ this.side ],
+ }
+ }
+ Wall.prototype.mxToPosition = function(mx, dimension) {
+ var position = new vec2(0,0)
+ switch (this.side) {
+ case FRONT:
+ case BACK:
+ position.a = mx.x
+ position.b = mx.y
+ break
+ case LEFT:
+ case RIGHT:
+ position.a = mx.z
+ position.b = mx.y
+ break
+ }
+ if (dimension) {
+ position.a -= dimension.a / 2
+ position.b -= dimension.b / 2
+ }
+// if (mx.width) { position.a -= mx.width / 2 }
+// if (mx.height) { position.b -= mx.height / 2 }
+ return position
+ }
Wall.prototype.bounds_for = function(img, scale) {
scale = scale || 1
@@ -84,37 +167,25 @@ window.Wall = (function(){
Wall.prototype.center = function(offset){
- offset = offset || 0
-
- var major_axis, minor_axis
- if (this.side & FRONT_BACK) {
- major_axis = this.rect.x
- minor_axis = this.rect.y
- }
- else {
- major_axis = this.rect.y
- minor_axis = this.rect.x
- }
-
switch (this.side) {
case FRONT:
- x = major_axis.midpoint()
- z = minor_axis.a + painting_distance_from_wall + offset
+ x = this.vec.midpoint()
+ z = this.edge + painting_distance_from_wall
break
case BACK:
- x = major_axis.midpoint()
- z = minor_axis.b - painting_distance_from_wall + offset
+ x = this.vec.midpoint()
+ z = this.edge - painting_distance_from_wall
break
case LEFT:
- x = minor_axis.a + painting_distance_from_wall + offset
- z = major_axis.midpoint()
+ x = this.edge + painting_distance_from_wall
+ z = this.vec.midpoint()
break
case RIGHT:
- x = minor_axis.b - painting_distance_from_wall + offset
- z = major_axis.midpoint()
+ x = this.edge - painting_distance_from_wall
+ z = this.vec.midpoint()
break
}
-
+
return new vec2 (x, z)
}
@@ -125,88 +196,71 @@ window.Wall = (function(){
Wall.prototype.wallpaper = function(){
var useX = this.side & FRONT_BACK
var shouldFlip = this.side & (LEFT | BACK)
- this.siblings().forEach(function(w){
- w.mx.forEach(function(mx){
-
- var partitionOffset = useX ? mx.x : mx.z
- if (shouldFlip) partitionOffset *= -1
- partitionOffset += mx.width/2
- var floorOffset = mx.y + mx.height/2
+ this.mx.forEach(function(mx){
+ var partitionOffset = useX ? mx.x : mx.z
+ if (shouldFlip) partitionOffset *= -1
+ partitionOffset += mx.width/2
+ var floorOffset = mx.y + mx.height/2
- mx.el.style.backgroundImage = Scenery.nextWallpaper
- mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
- })
- })
+ mx.el.style.backgroundImage = Scenery.nextWallpaper
+ mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
+ })
}
Wall.prototype.outline = function(){
- var canvas = document.createElement("canvas")
- var ctx = canvas.getContext('2d')
var useX = this.side & FRONT_BACK
var shouldFlip = this.side & (LEFT | BACK)
+ var mx = this.mx
- var sortedWalls = this.siblings().reduce(function(a,w){
- return a.concat(w.mx)
- }, []).sort( useX ? sort.compare_x : sort.compare_z )
-
- if (shouldFlip) {
- sortedWalls = sortedWalls.reverse()
+ if (! shouldFlip) {
+ mx = mx.reverse()
}
- var len = sortedWalls.length
+ var len = this.mx.length
+ var backgroundColor = "rgba(255,255,255,0.95)"
+ var borderColor = "rgba(0,0,0,1.0)"
+
zz = window.zz || 0
- sortedWalls.forEach(function(mx, i){
+ mx.forEach(function(mx, i){
if (mx.outlined) return
mx.outlined = true
- canvas.width = mx.width
- canvas.height = mx.height
- ctx.fillStyle = "rgba(255,255,255,0.9)"
- ctx.fillRect(0, 0, canvas.width, canvas.height)
- ctx.fillStyle = "rgba(0,0,0,1.0)"
+ mx.el.style.backgroundColor = backgroundColor
- // all walls except top-half walls get bottom lines
- ctx.fillRect(0, 0, canvas.width, 1)
+ // all walls get bottom lines
+ mx.el.style.borderBottom = "1px solid " + borderColor
- // all walls except bottom-half walls get top lines
- ctx.fillRect(0, canvas.height-1, canvas.width, 1)
+ // all walls get top lines
+ mx.el.style.borderTop = "1px solid " + borderColor
// walls on initial sides get left lines
// if their left edge lines up with the rect edge
if (i == 0) {
- ctx.fillRect(0, 0, 1, canvas.height)
+ mx.el.style.borderLeft = "1px solid " + borderColor
}
// walls on terminal sides get right lines....
// if their right edge lines up with the rect edge
if (i == len-1) {
- // ctx.fillStyle = "rgba(255,0,0,1.0)"
- ctx.fillRect(canvas.width-1, 0, 1, canvas.height)
+ mx.el.style.borderRight = "1px solid " + borderColor
}
- var dataUrl = canvas.toDataURL()
-
- mx.el.style.backgroundImage = "url(" + dataUrl + ")"
})
- window.zz += 1
}
Wall.prototype.siblings = function(){
- var base = this
- var match = base.side | base.half_side
- var walls = Rooms.list[this.room].walls.filter(function(w){
- return (w.side | w.half_side) & match && w.$walls
- })
- return walls
+ return this
+// var base = this
+// var match = base.side | base.half_side
+// var walls = Rooms.list[this.room].walls.filter(function(w){
+// return (w.side | w.half_side) & match && w.$walls
+// })
+// return walls
}
Wall.prototype.randomize_colors = function(){
var color = window.grayColors[ this.side | this.half_side ]
- var siblings = this.siblings()
- siblings.forEach(function(w, i){
- if (! w.$walls) return
- w.color(color)
- })
+ // this.color(color)
}
Wall.prototype.stroke_colors = function(){
@@ -226,6 +280,12 @@ window.Wall = (function(){
})
}
- return Wall
+ if ('window' in this) {
+ window.Wall = Wall
+ }
+ else {
+ module.exports = Wall
+ }
+
})()
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-17 22:26:59 +0000