Skip to content

Commit 6c7e483

Browse files
marco-pondsmarco-ponds
authored
Merge pull request #185 from MageStudio/spotlights
Spotlights
2 parents a26e0a5 + 111b144 commit 6c7e483

21 files changed

+467
-30
lines changed

‎examples/.DS_Store

0 Bytes
Binary file not shown.

‎examples/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@
4949
<li class='example' data-src='./3d_ui'>3D UI</li>
5050
<li class='example' data-src='./scaleTo'>scaleTo</li>
5151
<li class='example' data-src='./rotateTo'>rotateTo</li>
52+
<li class='example' data-src='./spotlight'>spotlight</li>
5253
</ul>
5354
<iframe class='example-frame'></iframe>
5455

‎examples/spotlight/assets/models/Textures/roof(Clone).png

364 KB
Loading

‎examples/spotlight/assets/models/lamp.mtl

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
# Created by Kenney (www.kenney.nl)
2+
3+
newmtl roof(Clone)
4+
Kd 1 1 1
5+
map_Kd Textures/roof(Clone).png
6+

‎examples/spotlight/assets/models/lamp.obj

+191
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
# Created by Kenney (www.kenney.nl)
2+
3+
mtllib lamp.mtl
4+
5+
g mergedBlocks
6+
7+
v -0.04309988 0.2445543 0.04309988
8+
v 0.04309988 0.2445543 0.04309988
9+
v -0.04309988 0 0.04309988
10+
v 0.04309988 0 0.04309988
11+
v 0.04309988 0 -0.04309988
12+
v 0.04309988 0.2445543 -0.04309988
13+
v -0.04309988 0.2445543 -0.04309988
14+
v -0.04309988 0 -0.04309988
15+
v -0.0230999 0.2445543 0.0230999
16+
v 0.0230999 0.2445543 0.0230999
17+
v 0.0230999 0.2445543 -0.0230999
18+
v -0.0230999 0.2445543 -0.0230999
19+
v -0.0230999 0.9138001 -0.08909989
20+
v -0.0230999 0.96 -0.08909989
21+
v -0.0230999 0.9138001 -0.0230999
22+
v -0.0230999 0.96 -0.0230999
23+
v -0.0230999 0.9138001 0.0230999
24+
v -0.0230999 0.9369 0.01691031
25+
v -0.0230999 0.9538105 0
26+
v 0.0230999 0.9138001 0.0230999
27+
v 0.0230999 0.9369 0.01691031
28+
v 0.0230999 0.9538105 0
29+
v 0.0230999 0.9138001 -0.0230999
30+
v 0.0230999 0.96 -0.0230999
31+
v 0.0230999 0.9138001 -0.08909989
32+
v 0.0230999 0.96 -0.08909989
33+
v 0.03464985 0.96 -0.2046001
34+
v 0 0.96 -0.2211001
35+
v 0.03464985 0.9138001 -0.2046001
36+
v 0 0.9138001 -0.2211001
37+
v -0.03464985 0.96 -0.2046001
38+
v -0.03464985 0.9138001 -0.2046001
39+
v -0.03464985 0.96 -0.1551001
40+
v -0.03464985 0.9138001 -0.1551001
41+
v 0.03464985 0.9138001 -0.1551001
42+
v 0.03464985 0.96 -0.1551001
43+
44+
vn 0 0 1
45+
vn 1 0 0
46+
vn -1 0 0
47+
vn 0 1 0
48+
vn 0 0 -1
49+
vn 0.8455572 0 -0.5338851
50+
vn -0.8455572 0 -0.5338851
51+
vn -0.9850305 0 0.1723803
52+
vn -0.9962506 0 0.08651455
53+
vn 0.9962506 0 0.08651455
54+
vn 0 -1 0
55+
vn 0.9850305 0 0.1723803
56+
vn 0 0.258819 0.9659258
57+
vn 0 0.5 0.8660254
58+
vn 0 0.8660254 0.5
59+
vn 0 0.9659258 0.258819
60+
61+
vt -0.04309988 0.2445543
62+
vt 0.04309988 0.2445543
63+
vt -0.04309988 0
64+
vt 0.04309988 0
65+
vt 0.04309988 -0.04309988
66+
vt 0.0230999 0.0230999
67+
vt 0.04309988 0.04309988
68+
vt -0.0230999 0.0230999
69+
vt -0.04309988 0.04309988
70+
vt -0.0230999 -0.0230999
71+
vt 0.0230999 -0.0230999
72+
vt -0.04309988 -0.04309988
73+
vt -0.08909989 0.9138001
74+
vt -0.08909989 0.96
75+
vt -0.0230999 0.9138001
76+
vt -0.0230999 0.96
77+
vt 0.0230999 0.9138001
78+
vt 0.0230999 0.2445543
79+
vt 0.01691031 0.9369
80+
vt 0 0.9538105
81+
vt -0.0230999 0.2445543
82+
vt -0.01691031 0.9369
83+
vt 0.0230999 0.96
84+
vt 0.08909989 0.9138001
85+
vt 0.08909989 0.96
86+
vt -0.03464985 0.96
87+
vt 0 0.96
88+
vt -0.03464985 0.9138001
89+
vt 0 0.9138001
90+
vt 0.03464985 0.96
91+
vt 0.03464985 0.9138001
92+
vt -0.1551001 0.96
93+
vt -0.1551001 0.9138001
94+
vt -0.2046001 0.96
95+
vt -0.2046001 0.9138001
96+
vt 0.1551001 0.9138001
97+
vt 0.1551001 0.96
98+
vt 0.2046001 0.9138001
99+
vt 0.2046001 0.96
100+
vt -0.0230999 0.08909989
101+
vt 0.0230999 0.08909989
102+
vt 0.03464985 0.1551001
103+
vt 0.03464985 0.2046001
104+
vt 0 0.2211001
105+
vt -0.03464985 0.2046001
106+
vt -0.03464985 0.1551001
107+
vt -0.03464985 -0.2046001
108+
vt -0.03464985 -0.1551001
109+
vt 0 -0.2211001
110+
vt -0.0230999 -0.08909989
111+
vt 0.0230999 -0.08909989
112+
vt 0.03464985 -0.1551001
113+
vt 0.03464985 -0.2046001
114+
vt 0.0230999 0.9369
115+
vt -0.0230999 0.9369
116+
vt -0.0230999 0.9538105
117+
vt 0.0230999 0.9538105
118+
vt 0.0230999 0
119+
vt -0.0230999 0
120+
121+
usemtl roof(Clone)
122+
123+
f 3/3/1 2/2/1 1/1/1
124+
f 2/2/1 3/3/1 4/4/1
125+
f 5/4/2 2/1/2 4/3/2
126+
f 2/1/2 5/4/2 6/2/2
127+
f 7/1/3 3/4/3 1/2/3
128+
f 3/4/3 7/1/3 8/3/3
129+
f 1/7/4 9/6/4 7/5/4
130+
f 1/7/4 10/8/4 9/6/4
131+
f 2/9/4 10/8/4 1/7/4
132+
f 10/8/4 2/9/4 11/10/4
133+
f 12/11/4 7/5/4 9/6/4
134+
f 11/10/4 7/5/4 12/11/4
135+
f 11/10/4 6/12/4 7/5/4
136+
f 6/12/4 11/10/4 2/9/4
137+
f 5/3/5 7/2/5 6/1/5
138+
f 7/2/5 5/3/5 8/4/5
139+
f 15/15/3 14/14/3 13/13/3
140+
f 14/14/3 15/15/3 16/16/3
141+
f 18/19/3 9/18/3 17/17/3
142+
f 19/20/3 9/18/3 18/19/3
143+
f 16/16/3 9/18/3 19/20/3
144+
f 15/15/3 9/18/3 16/16/3
145+
f 9/18/3 15/15/3 12/21/3
146+
f 10/21/2 21/22/2 20/15/2
147+
f 10/21/2 22/20/2 21/22/2
148+
f 11/18/2 22/20/2 10/21/2
149+
f 23/17/2 22/20/2 11/18/2
150+
f 23/17/2 24/23/2 22/20/2
151+
f 25/24/2 24/23/2 23/17/2
152+
f 24/23/2 25/24/2 26/25/2
153+
f 29/28/6 28/27/5 27/26/6
154+
f 28/27/5 29/28/6 30/29/5
155+
f 30/29/5 31/30/7 28/27/5
156+
f 31/30/7 30/29/5 32/31/7
157+
f 33/32/9 13/13/8 14/14/8
158+
f 13/13/8 33/32/9 34/33/9
159+
f 31/34/7 34/33/9 33/32/9
160+
f 34/33/9 31/34/7 32/35/7
161+
f 29/38/6 36/37/10 35/36/10
162+
f 36/37/10 29/38/6 27/39/6
163+
f 5/9/11 3/5/11 8/7/11
164+
f 3/5/11 5/9/11 4/12/11
165+
f 11/21/5 15/17/5 23/15/5
166+
f 15/17/5 11/21/5 12/18/5
167+
f 9/21/1 20/17/1 17/15/1
168+
f 20/17/1 9/21/1 10/18/1
169+
f 15/6/11 25/40/11 23/8/11
170+
f 25/40/11 15/6/11 13/41/11
171+
f 32/43/11 13/41/11 34/42/11
172+
f 30/44/11 13/41/11 32/43/11
173+
f 30/44/11 25/40/11 13/41/11
174+
f 29/45/11 25/40/11 30/44/11
175+
f 25/40/11 29/45/11 35/46/11
176+
f 35/36/10 26/25/12 25/24/12
177+
f 26/25/12 35/36/10 36/37/10
178+
f 28/49/4 36/48/4 27/47/4
179+
f 36/48/4 28/49/4 26/50/4
180+
f 26/50/4 28/49/4 24/10/4
181+
f 24/10/4 28/49/4 16/11/4
182+
f 16/11/4 28/49/4 14/51/4
183+
f 14/51/4 31/53/4 33/52/4
184+
f 31/53/4 14/51/4 28/49/4
185+
f 21/54/14 17/15/13 20/17/13
186+
f 17/15/13 21/54/14 18/55/14
187+
f 21/54/14 19/56/15 18/55/14
188+
f 19/56/15 21/54/14 22/57/15
189+
f 22/59/15 16/11/16 19/58/15
190+
f 16/11/16 22/59/15 24/10/16
191+

‎examples/spotlight/index.html

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<link href="https://fonts.googleapis.com/css2?family=Bangers&display=swap" rel="stylesheet">
6+
<link rel="stylesheet" href="../css/M.css" />
7+
<link rel="stylesheet" href="../css/app.css" />
8+
<script type="module" src="index.js"></script>
9+
</head>
10+
11+
<body>
12+
<div id="ui"></div>
13+
<div id="gameContainer" />
14+
</body>
15+
16+
</html>

‎examples/spotlight/index.js

+161
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
import {
2+
Router,
3+
store,
4+
Level,
5+
Box,
6+
Scene,
7+
Cube,
8+
Controls,
9+
Models,
10+
AmbientLight,
11+
PHYSICS_EVENTS,
12+
constants,
13+
Scripts,
14+
PALETTES,
15+
SunLight,
16+
HemisphereLight,
17+
easing,
18+
Sky,
19+
SpotLight,
20+
Cone,
21+
BaseScript
22+
} from '../../dist/mage.js';
23+
24+
class Flicker extends BaseScript {
25+
start(light, { cone }) {
26+
this.light = light;
27+
this.cone = cone;
28+
this.isOn = true;
29+
30+
const flicker = () => {
31+
setTimeout(() => {
32+
this.cone.setVisible(!this.isOn);
33+
this.light.dim(this.isOn ? 0 : 1, Math.random() * 50).then(() => {
34+
this.isOn = !this.isOn;
35+
flicker();
36+
});
37+
}, Math.random() * 1000);
38+
}
39+
40+
flicker();
41+
}
42+
}
43+
44+
45+
export default class Intro extends Level {
46+
47+
addAmbientLight() {
48+
const ambientLight = new AmbientLight({
49+
color: PALETTES.FRENCH_PALETTE.SPRAY,
50+
intensity: .2
51+
});
52+
53+
const hemisphereLight = new HemisphereLight({
54+
color: {
55+
sky: PALETTES.FRENCH_PALETTE.SQUASH_BLOSSOM,
56+
ground: PALETTES.FRENCH_PALETTE.REEF_ENCOUNTER
57+
},
58+
intensity: .2
59+
});
60+
61+
// const sunLight = new SunLight({
62+
// color: PALETTES.FRENCH_PALETTE.MELON_MELODY,
63+
// intensity: .1,
64+
// far: 20,
65+
// mapSize: 2048
66+
// });
67+
// sunLight.setPosition({ y: 4, z: -3, x: -3 });
68+
// sunLight.addHelper();
69+
}
70+
71+
createSky() {
72+
const sky = new Sky();
73+
const inclination = .5;
74+
const azimuth = .1;
75+
const distance = 100;
76+
77+
sky.setSun(
78+
inclination,
79+
azimuth,
80+
distance
81+
);
82+
83+
window.sky = sky;
84+
}
85+
86+
onCreate() {
87+
Scene.getCamera().setPosition({ y: 10 });
88+
Controls.setOrbitControl();
89+
this.addAmbientLight();
90+
this.createSky();
91+
92+
Scripts.register('Flicker', Flicker);
93+
94+
const floor = new Box(100, .5, 100, 0x555555);
95+
floor.setMaterialFromName(constants.MATERIALS.STANDARD, { roughness: .5, metalness: 0 });
96+
const spotlight = new SpotLight({ color: PALETTES.FRENCH.FLAT_FLESH, intensity: 1 });
97+
spotlight.setPosition({ y: 3.5 })
98+
99+
const lamp = Models.get('lamp');
100+
lamp.setPosition({ z: .7 })
101+
lamp.setScale({ x: 3.8, y: 3.8, z: 3.8 })
102+
103+
const lightCone = new Cone(1.5, 5, 0xffffff, { openEnded: true, radialSegments: 20 });
104+
lightCone.setOpacity(.15)
105+
lightCone.setPosition({ y: 1 });
106+
107+
spotlight.addScript('Flicker', { cone: lightCone });
108+
109+
window.spotlight = spotlight;
110+
window.lamp = lamp;
111+
window.lightCone = lightCone;
112+
}
113+
}
114+
115+
const assets = {
116+
models: {
117+
lamp: 'assets/models/lamp.obj'
118+
}
119+
}
120+
121+
const { SHADOW_TYPES } = constants;
122+
123+
const config = {
124+
screen: {
125+
h: window ? window.innerHeight : 800,
126+
w: window ? window.innerWidth : 600,
127+
ratio: window ? window.innerWidth / window.innerHeight : 600 / 800,
128+
frameRate: 60,
129+
alpha: true,
130+
},
131+
132+
lights: {
133+
shadows: true,
134+
shadowType: SHADOW_TYPES.HARD,
135+
textureAnisotropy: 32
136+
},
137+
138+
physics: {
139+
enabled: true,
140+
path: 'dist/ammo.js',
141+
gravity: { x: 0, y: -9.8, z: 0}
142+
},
143+
144+
tween: {
145+
enabled: false,
146+
},
147+
148+
camera: {
149+
fov: 75,
150+
near: 0.1,
151+
far: 3000000,
152+
},
153+
};
154+
155+
window.addEventListener('load', () => {
156+
store.createStore({}, {}, true);
157+
158+
Router.on('/', Intro);
159+
160+
Router.start(config, assets);
161+
});

‎package-lock.json

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)