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
|
Scenery.image.resize = function(base){
var x, y, z, bounds
var dragging = false
var dots = [], dot
this.init = function(){
base.build()
base.bind()
}
// create 9 dots at the corners of the div
this.build = function(){
[ TOP,
TOP_RIGHT,
RIGHT,
BOTTOM_RIGHT,
BOTTOM,
BOTTOM_LEFT,
LEFT,
TOP_LEFT ].forEach(base.build_dot)
}
this.build_dot = function(direction) {
var dot = new MX.Dot ()
dot.direction = direction
switch (wall.side) {
case FRONT:
case BACK:
base.mx_img.x = bounds.x.clamp( x + sin(wall_rotation[wall.side]) * cursor.x.magnitude()*cursor_amp )
break
case LEFT:
case RIGHT:
base.mx_img.z = bounds.x.clamp( z + cos(wall_rotation[wall.side]) * cursor.x.magnitude()*cursor_amp )
break
}
base.dots.push(dot)
}
this.bind = function(){
dots.forEach(function(dot){
Scenery.mouse.bind_el(dot.el)
})
Scenery.mouse.on("drag", drag)
Scenery.mouse.on("up", up)
}
this.unbind = function(){
dots.forEach(function(dot){
Scenery.mouse.unbind_el(dot.el)
})
Scenery.mouse.off("drag", drag)
Scenery.mouse.off("up", up)
}
function down (e, cursor){
dragging = true
x = base.mx_img.x
y = base.mx_img.y
z = base.mx_img.z
bounds = base.wall.bounds_for(img)
document.body.classList.add("dragging")
}
function drag (e, cursor){
if (! dragging) return
base.mx_img.y = bounds.y.clamp( y - cursor.y.magnitude()*cursor_amp )
switch (wall.side) {
case FRONT:
base.mx_img.x = bounds.x.clamp( x - cursor.x.magnitude()*cursor_amp )
break
case BACK:
base.mx_img.x = bounds.x.clamp( x + cursor.x.magnitude()*cursor_amp )
break
case LEFT:
base.mx_img.z = bounds.x.clamp( z + cursor.x.magnitude()*cursor_amp )
break
case RIGHT:
base.mx_img.z = bounds.x.clamp( z - cursor.x.magnitude()*cursor_amp )
break
}
}
function up (e, cursor){
dragging = false
document.body.classList.remove("dragging")
}
}
|
