summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--assets/javascripts/mx/extensions/mx.movements.js14
-rw-r--r--assets/javascripts/rectangles/_env.js2
-rw-r--r--assets/javascripts/rectangles/engine/builder.js95
-rw-r--r--assets/javascripts/rectangles/engine/clipper.js4
-rw-r--r--assets/javascripts/rectangles/engine/mover.js48
-rw-r--r--assets/javascripts/rectangles/models/room.js34
-rw-r--r--assets/javascripts/rectangles/util/keys.js2
-rw-r--r--rectangles.html18
8 files changed, 156 insertions, 61 deletions
diff --git a/assets/javascripts/mx/extensions/mx.movements.js b/assets/javascripts/mx/extensions/mx.movements.js
index a177c1e..35a23d0 100644
--- a/assets/javascripts/mx/extensions/mx.movements.js
+++ b/assets/javascripts/mx/extensions/mx.movements.js
@@ -26,6 +26,8 @@ MX.Movements = function (cam, viewHeight) {
creepFactor = 0.3
var DEFAULT_SCALE = scale = 1.0
+
+ var pos = { x: 0, y: 0, z: 0, rotationX: 0, rotationY: 0 }
return {
@@ -195,6 +197,10 @@ MX.Movements = function (cam, viewHeight) {
var ry = cam.rotationY
var s = creeping ? scale * creepFactor : scale
var vrrrr = creeping ? vr * creepFactor * 5 : vr
+
+ pos.x = cam.x
+ pos.y = cam.y
+ pos.z = cam.z
if (moveForward || moveBackward || moveRight || moveLeft || moveUp || moveDown || turnLeft || turnRight || turnUp || turnDown) {
@@ -236,12 +242,12 @@ MX.Movements = function (cam, viewHeight) {
cam.rotationY -= vrrrr
}
- cam.x += vx
- cam.y += vy
- cam.z += vz
+ pos.x += vx
+ pos.y += vy
+ pos.z += vz
if (vx || vz) {
- app.tube("move", cam)
+ app.tube("move", pos)
}
}
diff --git a/assets/javascripts/rectangles/_env.js b/assets/javascripts/rectangles/_env.js
index be3d931..f014a8e 100644
--- a/assets/javascripts/rectangles/_env.js
+++ b/assets/javascripts/rectangles/_env.js
@@ -38,8 +38,8 @@ environment.init = function(){
}
builder.init()
- mover.init()
clipper.init()
+ mover.init()
window.scene && scene.update()
environment.update()
diff --git a/assets/javascripts/rectangles/engine/builder.js b/assets/javascripts/rectangles/engine/builder.js
index 8e1508a..42ef76b 100644
--- a/assets/javascripts/rectangles/engine/builder.js
+++ b/assets/javascripts/rectangles/engine/builder.js
@@ -19,12 +19,9 @@ var builder = new function(){
}
function build (){
clipper.rooms = sort_rooms_by_id(clipper.rooms)
- clipper.rooms.forEach(function(r){
- r.walls = []
- r.floors = []
- })
+
clipper.regions.forEach(function(r){
- walls(r).forEach(function(el){
+ build_walls(r).forEach(function(el){
els.push(el)
scene.add(el)
})
@@ -32,7 +29,7 @@ var builder = new function(){
clipper.rooms = sort_rooms_by_height(clipper.rooms)
clipper.rooms.forEach(function(r){
- floors(r).forEach(function(el){
+ build_floors(r).forEach(function(el){
els.push(el)
scene.add(el)
})
@@ -45,7 +42,9 @@ var builder = new function(){
els = []
}
- function walls (r){
+ function build_walls (r){
+ var rm = clipper.rooms[ r.id ]
+
var list = [], el = null
var width = r.x.length()
@@ -53,50 +52,54 @@ var builder = new function(){
var height = clipper.rooms[r.id].height
if (r.sides & FRONT) {
- el = wall('.front')
+ el = make_wall('.front')
el.width = width
el.height = height
el.rotationY = PI
el.x = r.x.a + width/2
el.y = height/2
el.z = r.y.a
+ rm.$walls.push(el.el)
list.push(el)
}
if (r.sides & BACK) {
- var el = wall('.back')
+ var el = make_wall('.back')
el.width = width
el.height = height
el.rotationY = 0
el.x = r.x.b - width/2
el.y = height/2
el.z = r.y.b
+ rm.$walls.push(el.el)
list.push(el)
}
if (r.sides & LEFT) {
- el = wall('.left')
+ el = make_wall('.left')
el.rotationY = HALF_PI
el.height = height
el.width = depth
el.x = r.x.a
el.y = height/2
el.z = r.y.a + depth/2
+ rm.$walls.push(el.el)
list.push(el)
}
if (r.sides & RIGHT) {
- el = wall('.right')
+ el = make_wall('.right')
el.rotationY = -HALF_PI
el.height = height
el.width = depth
el.x = r.x.b
el.y = height/2
el.z = r.y.b - depth/2
+ rm.$walls.push(el.el)
list.push(el)
}
return list
}
- function floors(rm){
+ function build_floors(rm){
var list = [], el = null
var already_constructed = rm.intersects.filter(function(rr){ return rr.constructed })
@@ -110,41 +113,52 @@ var builder = new function(){
for (var i = 0; i < already_constructed.length; i++) {
if (already_constructed[i].rect.contains(r)) {
intersected = true
- r.sides = 0xf
+ // r.sides = 0xf
+ // half_sides
}
else if (already_constructed[i].rect.intersects(r)) {
intersected = true
if (rm.height < already_constructed[i].height) {
- list = list.concat( ceiling_walls( rm, already_constructed[i], r ) )
+ list = list.concat( make_ceiling_walls( rm, already_constructed[i], r ) )
}
}
}
if (! intersected) {
- list.push( ground(rm, r) )
- list.push( ceiling(rm, r) )
+ el = make_floor(rm, r)
+ list.push( el )
+ rm.$floor.push(el.el)
+
+ el = make_ceiling(rm, r)
+ list.push( el )
+ rm.$ceiling.push(el.el)
}
})
}
else {
// render floor and ceiling for the entire rectangle
- list.push( ground(rm, rm.rect) )
- list.push( ceiling(rm, rm.rect) )
+ el = make_floor(rm, rm.rect)
+ list.push( el )
+ rm.$floor.push(el.el)
+
+ el = make_ceiling(rm, rm.rect)
+ list.push( el )
+ rm.$ceiling.push(el.el)
}
rm.constructed = true
return list
}
- function ceiling_walls( lo, hi, r ){
+ function make_ceiling_walls( lo, hi, r ){
var list = []
var width = r.x.length()
var depth = r.y.length()
var height = hi.height - lo.height
- if (! (r.sides & LEFT) && r.x.a == hi.rect.x.a) {
- el = wall('.left')
+ if (! (r.half_sides & LEFT) && r.x.a == hi.rect.x.a) {
+ el = make_wall('.left')
el.rotationY = HALF_PI
el.height = height
el.width = depth
@@ -152,12 +166,12 @@ var builder = new function(){
el.y = lo.height + height/2
el.z = r.y.a + depth/2
list.push(el)
- r.sides |= LEFT
- console.log(hi.height, lo.height)
+ hi.$walls.push(el.el)
+ r.half_sides |= LEFT
}
- if (! (r.sides & RIGHT) && r.x.b == hi.rect.x.b) {
- el = wall('.right')
+ if (! (r.half_sides & RIGHT) && r.x.b == hi.rect.x.b) {
+ el = make_wall('.right')
el.rotationY = -HALF_PI
el.height = height
el.width = depth
@@ -165,11 +179,12 @@ var builder = new function(){
el.y = lo.height + height/2
el.z = r.y.b - depth/2
list.push(el)
- r.sides |= RIGHT
+ hi.$walls.push(el.el)
+ r.half_sides |= RIGHT
}
- if (! (r.sides & FRONT) && r.y.a == hi.rect.y.a) {
- el = wall('.front')
+ if (! (r.half_sides & FRONT) && r.y.a == hi.rect.y.a) {
+ el = make_wall('.front')
el.width = width
el.height = height
el.rotationY = PI
@@ -177,11 +192,12 @@ var builder = new function(){
el.y = lo.height + height/2
el.z = r.y.a
list.push(el)
- r.sides |= FRONT
+ hi.$walls.push(el.el)
+ r.half_sides |= FRONT
}
- if (! (r.sides & BACK) && r.y.b == hi.rect.y.b) {
- el = wall('.back')
+ if (! (r.half_sides & BACK) && r.y.b == hi.rect.y.b) {
+ el = make_wall('.back')
el.width = width
el.height = height
el.rotationY = 0
@@ -189,45 +205,42 @@ var builder = new function(){
el.y = lo.height + height/2
el.z = r.y.b
list.push(el)
- r.sides |= BACK
+ hi.$walls.push(el.el)
+ r.half_sides |= BACK
}
return list
}
- function ground(rm, r){
+ function make_floor(rm, r){
var width = r.x.length()
var depth = r.y.length()
- var el = wall('.bottom')
+ var el = make_wall('.floor')
el.height = depth
el.width = width
el.x = r.x.a + width/2
el.y = 0
el.z = r.y.a + depth/2
el.rotationX = PI/2
- el.el.style.backgroundColor = "#f00"
-
- rm.floors.push(el)
return el
}
- function ceiling(rm, r){
+ function make_ceiling(rm, r){
var width = r.x.length()
var depth = r.y.length()
var height = rm.height
- var el = wall('.top')
+ var el = make_wall('.ceiling')
el.height = depth
el.width = width
el.x = r.x.a + width/2
el.y = height
el.z = r.y.a + depth/2
el.rotationX = -PI/2
- el.el.style.backgroundColor = "#00f"
return el
}
- function wall(klass){
+ function make_wall(klass){
var el = new MX.Object3D(".face" + (klass || ""))
el.width = el.height = el.scaleX = el.scaleY = el.scaleZ = 1
el.z = el.y = el.x = 0
diff --git a/assets/javascripts/rectangles/engine/clipper.js b/assets/javascripts/rectangles/engine/clipper.js
index bcd0586..43a1bab 100644
--- a/assets/javascripts/rectangles/engine/clipper.js
+++ b/assets/javascripts/rectangles/engine/clipper.js
@@ -97,10 +97,6 @@ var clipper = new function(){
base.regions = sort_rects_by_position(regions)
}
- // generate floor and ceiling for some regions
- // generate walls from surviving regions
- // generate ceiling-walls where ceiling has discontinuity
-
return base
}
diff --git a/assets/javascripts/rectangles/engine/mover.js b/assets/javascripts/rectangles/engine/mover.js
index ebe4447..5a1f7d9 100644
--- a/assets/javascripts/rectangles/engine/mover.js
+++ b/assets/javascripts/rectangles/engine/mover.js
@@ -1,11 +1,11 @@
var mover = new function(){
var base = this
- var last_room = null
+ base.room = null
base.init = function(){
- last_room = clipper.rooms[0]
base.bind()
+ base.update(scene.camera)
}
base.bind = function(){
@@ -13,19 +13,47 @@ var mover = new function(){
}
base.update = function(pos){
- if (last_room && last_room.rect.contains(pos.x, pos.z)) return;
+ cam.y = pos.y
- var intersects = []
- clipper.rooms.forEach(function(r){
- if (r.rect.contains(pos.x, pos.z)) {
- intersects.push(r)
+ // if we were in a room
+ if (base.room) {
+ // check if we're still in the room
+ if (base.room.rect.contains(pos.x, pos.z)) {
+ cam.x = pos.x
+ cam.z = pos.z
+ return
}
+ // check if we've crossed one of the walls.. clamp position if so
+ var collision = base.room.collides(pos.x, pos.z)
+ if (collision) {
+ if (! (collision & LEFT || collision & RIGHT)) {
+ cam.x = pos.x
+ }
+ if (! (collision & FRONT || collision & BACK)) {
+ cam.z = pos.z
+ }
+ return
+ }
+ }
+
+ // otherwise we've either entered into a new room, or broken free
+ var intersects = clipper.rooms.filter(function(r){
+ return r.rect.contains(pos.x, pos.z)
})
+ $(".face.active").removeClass("active")
if (intersects.length) {
- $(".face.active").removeClass("active")
- last_room = intersects[0]
- }
+ base.room = intersects[0]
+ base.room.$floor.addClass("active")
+ base.room.$ceiling.addClass("active")
+ base.room.$walls.addClass("active")
+ }
+ else {
+ base.room = null
+ }
+
+ cam.x = pos.x
+ cam.z = pos.z
}
}
diff --git a/assets/javascripts/rectangles/models/room.js b/assets/javascripts/rectangles/models/room.js
index 3d512c3..c760174 100644
--- a/assets/javascripts/rectangles/models/room.js
+++ b/assets/javascripts/rectangles/models/room.js
@@ -6,6 +6,9 @@ window.room = (function(){
this.regions = []
this.height = opt.height || 200
this.focused = false
+ this.$walls = $([])
+ this.$floor = $([])
+ this.$ceiling = $([])
}
room.prototype.toString = function(){
@@ -19,6 +22,9 @@ window.room = (function(){
this.regions = [ copy ]
this.intersects = []
this.constructed = false
+ this.$walls = $([])
+ this.$floor = $([])
+ this.$ceiling = $([])
}
room.prototype.clipTo = function(r){
@@ -34,7 +40,35 @@ window.room = (function(){
}
this.regions = regions
}
+
+ room.prototype.collides = function(x,y){
+ var collision = 0
+ this.regions.forEach(function(r){
+ if (! r.sides) return
+
+ if ((r.sides & FRONT) && y < r.y.a && r.x.contains(x)) {
+ collision |= FRONT
+ }
+ if ((r.sides & BACK) && r.y.b < y && r.x.contains(x)) {
+ collision |= BACK
+ }
+ if ((r.sides & LEFT) && x < r.x.a && r.y.contains(y)) {
+ collision |= LEFT
+ }
+ if ((r.sides & RIGHT) && r.x.b < x && r.y.contains(y)) {
+ collision |= RIGHT
+ }
+ })
+ return collision
+ }
return room
})()
+
+function bitcount(v) {
+ v = v - ((v >>> 1) & 0x55555555);
+ v = (v & 0x33333333) + ((v >>> 2) & 0x33333333);
+ return ((v + (v >>> 4) & 0xF0F0F0F) * 0x1010101) >>> 24;
+}
+
diff --git a/assets/javascripts/rectangles/util/keys.js b/assets/javascripts/rectangles/util/keys.js
index 03abe50..e0ab045 100644
--- a/assets/javascripts/rectangles/util/keys.js
+++ b/assets/javascripts/rectangles/util/keys.js
@@ -17,7 +17,7 @@ var keys = (function(){
case undefined:
break;
default:
- console.log(key)
+ // console.log(key)
break;
}
})
diff --git a/rectangles.html b/rectangles.html
index f5d9404..d2b1330 100644
--- a/rectangles.html
+++ b/rectangles.html
@@ -22,6 +22,24 @@ body > div {
.back { background-color: #bbb; }
.left { background-color: #aaa; }
.right { background-color: #888; }
+.floor { background-color: #00f; }
+.ceiling { background-color: #f00; }
+
+
+.active.front { background-color: #ddf; }
+.active.back { background-color: #bbe; }
+.active.left { background-color: #aad; }
+.active.right { background-color: #88b; }
+.active.floor { background-color: #0ff; }
+.active.ceiling { background-color: #ff0; }
+
+/*
+.face {
+ background-image: url(http://i.asdf.us/im/6f/bgdither_1398274442_jules.gif);
+ background-color: transparent;
+}
+ */
+
#map canvas {
border-bottom: 2px solid #ddd;
border-right: 2px solid #ddd;
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-15 17:17:23 +0000