1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
var wall_rotation = {}
wall_rotation[FRONT] = PI
wall_rotation[BACK] = 0
wall_rotation[LEFT] = HALF_PI
wall_rotation[RIGHT] = -HALF_PI
var scenery = new function(){
var base = this;
base.init = function(){
var url = "https://s3.amazonaws.com/luckyplop/f5b2c20e602cdfc86383910f294dcf23d91fa956.png"
var img = new Image ()
img.onload = function(){ base.load(img) }
img.src = url
if (img.complete) base.load(img)
}
base.load = function(img){
img.width = 300
img.height = ~~(300 * img.naturalHeight/img.naturalWidth)
clipper.rooms.forEach(function(room){
room.walls.forEach(function(wall){
new_image(wall, img)
})
})
}
function new_image (wall, img) {
var x, z
if (wall.side & FRONT_BACK && wall.rect.x.length() < img.width) {
return
}
if (wall.side & LEFT_RIGHT && wall.rect.y.length() < img.width) {
return
}
switch (wall.side) {
case FRONT:
x = wall.rect.x.a + wall.rect.x.length()/2
z = wall.rect.y.a + 10
break
case BACK:
x = wall.rect.x.b - wall.rect.x.length()/2
z = wall.rect.y.b - 10
break
case LEFT:
x = wall.rect.x.a + 10
z = wall.rect.y.a + wall.rect.y.length()/2
break
case RIGHT:
x = wall.rect.x.b - 10
z = wall.rect.y.b - wall.rect.y.length()/2
break
}
var mx_img = new MX.Image({
src: img.src,
x: x,
y: 70,
z: z,
scale: 300/img.naturalWidth,
rotationY: wall_rotation[ wall.side ],
backface: false,
})
scene.add(mx_img)
// https://s3.amazonaws.com/luckyplop/f5b2c20e602cdfc86383910f294dcf23d91fa956.png
var x = 0, y = 0, z = 0, ry = 3 * PI/4
my_mouse = new mouse ({ el: mx_img.el })
my_mouse.tube.on("down", function(e, cursor){
console.log("down")
x = mx_img.x
y = mx_img.y
z = mx_img.z
})
my_mouse.tube.on("drag", function(e, cursor){
console.log("drag")
mx_img.y = y - cursor.y.magnitude()
switch (wall.side) {
case FRONT:
mx_img.x = x + cursor.x.magnitude()
break
case BACK:
mx_img.x = x - cursor.x.magnitude()
break
case LEFT:
mx_img.z = z - cursor.x.magnitude()
break
case RIGHT:
mx_img.z = z + cursor.x.magnitude()
break
}
})
my_mouse.tube.on("up", function(e, cursor){
})
}
return base
}
|
