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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
var environment = (function(){
var environment = {}
var width = 400
var height = 600
var grid_side = 50
var grid_stroke = 2
var sph
var left, right, top, bottom
var done_animating = false
environment.init = function(){
environment.ready()
app.resize = function () {
scene.width = window.innerWidth
scene.height = window.innerHeight
scene.perspective = Math.min(window.innerWidth, scene.height)
scene.el.style[MX.perspectiveProp] = 200 + 'px'
scene.update()
}
}
environment.ready = function(){
controls = new MX.FollowingOrbitCamera({
center: { x: 0, y: 0, z: 0 },
radius: 1250,
radiusRange: [ 300, 2000 ],
rotationXRange: [ -0.05, 0.05 ],
rotationYRange: [ -0.05, 0.05 ],
wheelEase: 20,
ease: 10
})
controls.init()
controls.wheel.lock()
top = environment.make_side()
top.mx.rotationY = Math.PI/2
top.mx.x = -width/2
bottom = environment.make_side()
bottom.mx.rotationY = -Math.PI/2
bottom.mx.x = width/2
left = environment.make_side()
left.mx.rotationX = Math.PI
left.mx.z = -width/2
right = environment.make_side()
right.mx.rotationX = 0 // Math.PI/2
right.mx.z = width/2
var sphere = new Image
sphere.src = "http://dumpfm.s3.amazonaws.com/images/20101115/1289880948498-dumpfm-lolumad-wireframesphere.gif"
var mx = new MX.Object3D (sphere)
mx.width = 600
mx.height = 400
mx.y = 100
mx.rotationY = Math.PI
mx.rotationX = Math.PI/2
mx.rotationZ = Math.PI/2
scene.add(mx)
sph = mx
}
environment.make_side = function(){
var g = new Grid ({
side: grid_side - grid_stroke,
strokeWidth: grid_stroke,
bg: "#ffffff",
stroke: [ "#000000" ],
duration: 1000,
delay: [ 0, 500 ],
width: width,
height: height,
draw_sides: true,
})
var mx = new MX.Object3D (g.snap.node)
mx.width = width
mx.height = height
scene.add(mx)
return { g: g, mx: mx }
}
environment.update = function(t){
scene.update()
controls.update()
// if (! done_animating) return
t *= 0.05
top.g.animate({
h: "right",
v: "down",
duration: 0,
v_offset: -t,
})
bottom.g.animate({
h: "left",
v: "down",
duration: 0,
v_offset: -t,
})
left.g.animate({
h: "left",
v: "up",
duration: 0,
v_offset: t,
})
right.g.animate({
h: "left",
v: "down",
duration: 0,
v_offset: -t,
})
}
return environment
})()
|
