diff --git a/assets/img/atlas.png b/assets/img/atlas.png
index 1d3fe33..a6eb0ee 100644
Binary files a/assets/img/atlas.png and b/assets/img/atlas.png differ
diff --git a/assets/models/smoke.obj b/assets/models/smoke.obj
index 13594fa..67fe15e 100644
--- a/assets/models/smoke.obj
+++ b/assets/models/smoke.obj
@@ -1,30 +1,29 @@
# Blender v2.79 (sub 0) OBJ File: 'stage.blend'
# www.blender.org
-o smoke
-v 0.000000 -9.030719 -5.000000
-v 0.000000 9.030719 -5.000000
-v 2.500000 -9.030719 -4.330127
-v 2.500000 9.030719 -4.330127
-v 4.330127 -9.030719 -2.500000
-v 4.330127 9.030719 -2.500000
-v 5.000000 -9.030719 0.000000
-v 5.000000 9.030719 0.000000
-v 4.330127 -9.030719 2.500000
-v 4.330127 9.030719 2.500000
-v 2.500000 -9.030719 4.330127
-v 2.500000 9.030719 4.330127
-v 0.000001 -9.030719 5.000000
-v 0.000001 9.030719 5.000000
-v -2.499999 -9.030719 4.330128
-v -2.499999 9.030719 4.330128
-v -4.330126 -9.030719 2.500001
-v -4.330126 9.030719 2.500001
-v -5.000000 -9.030719 0.000002
-v -5.000000 9.030719 0.000002
-v -4.330129 -9.030719 -2.499997
-v -4.330129 9.030719 -2.499997
-v -2.500003 -9.030719 -4.330125
-v -2.500003 9.030719 -4.330125
+v 0.000000 -9.030719 -3.977880
+v 0.000000 9.030719 -3.977880
+v 1.988940 -9.030719 -3.444945
+v 1.988940 9.030719 -3.444945
+v 3.444945 -9.030719 -1.988940
+v 3.444945 9.030719 -1.988940
+v 3.977880 -9.030719 0.000000
+v 3.977880 9.030719 0.000000
+v 3.444945 -9.030719 1.988940
+v 3.444945 9.030719 1.988940
+v 1.988940 -9.030719 3.444945
+v 1.988940 9.030719 3.444945
+v 0.000001 -9.030719 3.977880
+v 0.000001 9.030719 3.977880
+v -1.988939 -9.030719 3.444946
+v -1.988939 9.030719 3.444946
+v -3.444944 -9.030719 1.988941
+v -3.444944 9.030719 1.988941
+v -3.977880 -9.030719 0.000002
+v -3.977880 9.030719 0.000002
+v -3.444946 -9.030719 -1.988938
+v -3.444946 9.030719 -1.988938
+v -1.988942 -9.030719 -3.444944
+v -1.988942 9.030719 -3.444944
vt 0.750488 0.751420
vt 0.874158 0.792572
vt 0.750488 0.792573
diff --git a/assets/models/stage.obj b/assets/models/stagenormal.obj
similarity index 98%
rename from assets/models/stage.obj
rename to assets/models/stagenormal.obj
index bd1a414..13596a4 100644
--- a/assets/models/stage.obj
+++ b/assets/models/stagenormal.obj
@@ -1010,30 +1010,30 @@ f 174/183 241/4 171/176
f 174/183 14/182 61/5
f 56/193 178/192 242/1
f 178/192 20/191 58/2
-v 25.250380 -68.634323 -67.805519
-v -7.311297 -99.964310 -32.531570
-v 44.684368 -90.595970 -33.472618
-v 79.610504 -63.938412 -32.754875
-v 61.499004 -32.072090 -70.036674
-v 98.332626 -29.744064 -33.095043
-v 51.503872 22.417212 -76.709694
-v 14.304985 -8.711819 -88.150589
-v 105.055351 2.702891 -35.296719
-v 89.332321 48.762192 -34.885387
-v 65.318703 77.625633 -32.835403
-v -16.076511 27.427702 -84.945648
-v 16.332134 97.253868 -30.664419
-v 20.590061 63.521618 -70.832603
-v -53.870377 48.526577 -66.212524
-v -30.491152 -18.268398 -83.639061
-v -70.286758 -22.024078 -63.045624
-v -97.320869 15.491239 -33.894066
-v -95.810577 -29.966383 -34.246368
-v -31.799715 -69.905716 -62.168251
-v -82.204628 -59.143867 -35.069153
-v -27.901575 95.337463 -32.635284
-v -65.497749 74.145546 -33.944809
-v -49.135437 -85.633934 -33.154804
+v 36.568962 -99.399925 -74.112007
+v -10.588614 -144.773712 -34.380539
+v 64.714310 -131.205963 -35.090111
+v 115.296219 -92.599060 -34.548916
+v 89.066177 -46.448528 -75.794334
+v 142.410614 -43.076958 -34.805408
+v 74.590683 32.465813 -80.825912
+v 20.717251 -12.616927 -92.820320
+v 152.146820 3.914473 -36.465511
+v 129.375885 70.620033 -36.155357
+v 94.598068 112.421623 -34.609634
+v -23.282871 39.722275 -90.403732
+v 23.653076 140.848297 -32.972672
+v 29.819637 91.995430 -76.394478
+v -78.017982 70.278809 -72.910858
+v -44.158932 -26.457281 -89.418549
+v -101.793068 -31.896458 -70.522957
+v -140.945328 22.435247 -35.407883
+v -138.758041 -43.398933 -35.673531
+v -46.054062 -101.241234 -69.861404
+v -119.053177 -85.655334 -36.293922
+v -40.408566 138.072861 -34.458740
+v -94.857376 107.381577 -35.446144
+v -71.160591 -124.019684 -34.850471
vt 0.610526 0.513119
vt 0.608613 0.612561
vt 0.550821 0.559857
diff --git a/assets/shaders/stageAdditive.js b/assets/shaders/stageAdditive.js
index 1c290ff..1cb09eb 100644
--- a/assets/shaders/stageAdditive.js
+++ b/assets/shaders/stageAdditive.js
@@ -13,12 +13,14 @@ module.exports = {
fragmentShader: `
varying vec2 uvs;
varying vec3 worldPos;
- uniform vec3 redColor;
- uniform vec3 blueColor;
+ uniform vec3 tunnelNeon;
uniform sampler2D src;
void main() {
vec4 col = texture2D(src, uvs);
+ float mask = min(step(0.87, uvs.x), step(0.5, uvs.y));
+ mask = min(mask, 1.0 - step(0.75, uvs.y));
+ col.xyz = mix(col.xyz, col.xyz * tunnelNeon, mask);
gl_FragColor = col;
}
`
diff --git a/assets/shaders/stageNormal.js b/assets/shaders/stageNormal.js
index 453c36d..45f019a 100644
--- a/assets/shaders/stageNormal.js
+++ b/assets/shaders/stageNormal.js
@@ -11,18 +11,20 @@ module.exports = {
`,
fragmentShader: `
- #define FOG_RADIUS 50.0
- #define FOG_FALLOFF 45.0
+ #define FOG_RADIUS 55.0
+ #define FOG_FALLOFF 50.0
+ #define FOG_COLOR_MULT 0.85
varying vec2 uvs;
varying vec3 worldPos;
- uniform vec3 redColor;
- uniform vec3 blueColor;
- uniform vec3 fogColor;
+ uniform vec3 color;
uniform sampler2D src;
void main() {
vec4 col = texture2D(src, uvs);
- col.xyz = mix(fogColor, col.xyz, clamp(distance(worldPos, vec3(0., 0., -FOG_RADIUS)) / FOG_FALLOFF, 0., 1.));
+ float mask = step(0.5, uvs.x);
+ mask = min(mask, max(step(0.75, uvs.x), 1.0 - step(0.5, uvs.y)));
+ col = mix(col * vec4(color, 1.0), col, mask);
+ col.xyz = mix(color * FOG_COLOR_MULT, col.xyz, clamp(distance(worldPos, vec3(0., 0., -FOG_RADIUS)) / FOG_FALLOFF, 0., 1.));
gl_FragColor = col;
}
`
diff --git a/src/assets.html b/src/assets.html
index 1dc1dbb..e8898bc 100644
--- a/src/assets.html
+++ b/src/assets.html
@@ -20,7 +20,7 @@
-->
-
+
@@ -150,5 +150,22 @@
animation__mouseenter1="property: components.slice9.material.color; type: color; from: #999; to: #FFF; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
animation__mouseleave1="property: components.slice9.material.color; type: color; from: #FFF; to: #999; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
animation__mouseenter2="property: scale; from: 1 1 1; to: 1.1 1.1 1.1; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
- animation__mouseleave2="property: scale; to: 1 1 1; from: 1.1 1.1 1.1; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150">
-
+ animation__mouseleave2="property: scale; to: 1 1 1; from: 1.1 1.1 1.1; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150">
+
+
+
+
+
+
diff --git a/src/components/beat-loader.js b/src/components/beat-loader.js
index 8ffea49..87443d3 100644
--- a/src/components/beat-loader.js
+++ b/src/components/beat-loader.js
@@ -281,38 +281,36 @@ AFRAME.registerComponent('beat-loader', {
generateEvent: function (event) {
switch(event._type) {
case 0:
- this.stageColors.setColor('fog', event._value);
- this.stageColors.setColor('sky', event._value);
- this.stageColors.setColor('backglow', event._value);
+ this.stageColors.setColor('bg', event._value);
break;
case 1:
- this.stageColors.setColor('tunnelNeon', event._value);
+ this.stageColors.setColor('tunnel', event._value);
break;
- case 2:
+ case 200:
this.stageColors.setColor('leftStageLaser0', event._value);
this.stageColors.setColor('leftStageLaser1', event._value);
this.stageColors.setColor('leftStageLaser2', event._value);
break;
- case 3:
+ case 300:
this.stageColors.setColor('rightStageLaser0', event._value);
this.stageColors.setColor('rightStageLaser1', event._value);
this.stageColors.setColor('rightStageLaser2', event._value);
break;
- case 4:
+ case 400:
this.stageColors.setColor('floor', event._value);
this.stageColors.setColor('stageNeon', event._value);
break;
- case 8:
+ case 800:
this.twister.components.twister.pulse(event._value);
break;
- case 9:
+ case 900:
// zoom was a bit disturbing
this.twister.components.twister.pulse(event._value);
break;
- case 12:
+ case 1200:
this.leftStageLasers.components['stage-lasers'].pulse(event._value);
break;
- case 13:
+ case 1300:
this.rightStageLasers.components['stage-lasers'].pulse(event._value);
break;
}
diff --git a/src/components/materials.js b/src/components/materials.js
index 4cc35ba..4393ece 100644
--- a/src/components/materials.js
+++ b/src/components/materials.js
@@ -9,9 +9,7 @@ AFRAME.registerSystem('materials', {
this.stageNormal = new THREE.ShaderMaterial({
uniforms: {
- redColor: {value: new THREE.Vector3(1, 0, 0) },
- blueColor: {value: new THREE.Vector3(0, 0, 1) },
- fogColor: {value: new THREE.Vector3(0, 0.48, 0.72) },
+ color: {value: new THREE.Vector3(0, 0.48, 0.72) },
src: {value: new THREE.TextureLoader().load(document.getElementById('atlasImg').src)},
},
vertexShader: stageNormalShaders.vertexShader,
@@ -22,14 +20,13 @@ AFRAME.registerSystem('materials', {
this.stageAdditive = new THREE.ShaderMaterial({
uniforms: {
- redColor: {value: new THREE.Vector3(1, 0, 0) },
- blueColor: {value: new THREE.Vector3(0, 0, 1) },
+ tunnelNeon: {value: new THREE.Vector3(0, 0, 1) },
src: {value: new THREE.TextureLoader().load(document.getElementById('atlasImg').src)},
},
vertexShader: stageAdditiveShaders.vertexShader,
fragmentShader: stageAdditiveShaders.fragmentShader,
- fog: false,
blending: THREE.AdditiveBlending,
+ fog: false,
transparent: true
});
}
@@ -51,7 +48,6 @@ AFRAME.registerComponent('materials', {
}
mesh = this.el.getObject3D('mesh');
if (!mesh) {
- console.log('not loaded yet');
this.el.addEventListener('model-loaded', this.applyMaterial.bind(this));
} else {
this.applyMaterial(mesh);
diff --git a/src/components/stage-colors.js b/src/components/stage-colors.js
index c4c0706..14a729d 100644
--- a/src/components/stage-colors.js
+++ b/src/components/stage-colors.js
@@ -1,14 +1,35 @@
function $ (id) { return document.getElementById(id); };
AFRAME.registerComponent('stage-colors', {
- dependencies: ['background', 'fog'],
+ dependencies: ['background'],
schema: {
color: {default: 'blue', oneOf: ['blue', 'red']}
},
init: function () {
- /*
+ this.colorCodes = ['off', 'blue', 'blue', 'bluefade', '', 'red', 'red', 'redfade'];
+ this.el.addEventListener('cleargame', this.resetColors.bind(this));
+ },
+
+ update: function (oldData) {
+ this.updateColors(this.data.color);
+ },
+
+ setColor: function (target, code) {
+ this.el.emit(`${target}color${this.colorCodes[code]}`, null, false);
+ },
+
+ resetColors: function () {
+ this.updateColors('blue');
+ this.el.emit('bgcolorblue', null, false);
+ },
+
+ updateColors: function (color) {
+ }
+
+/*
+ init: function () {
this.neonRed = new THREE.Color(0xff9999);
this.neonBlue = new THREE.Color(0x9999ff);
this.defaultRed = new THREE.Color(0xff0000);
@@ -31,13 +52,10 @@ AFRAME.registerComponent('stage-colors', {
envMap: this.mineEnvMap[this.data.color]
});
this.sky = document.getElementById('sky');
- this.backglow = document.getElementById('backglow');
this.auxColor = new THREE.Color();
this.targets = {};
- ['fog',
- 'sky',
- 'backglow',
+ ['stageNormal',
'tunnelNeon',
'leftStageLaser0',
'leftStageLaser1',
@@ -47,48 +65,34 @@ AFRAME.registerComponent('stage-colors', {
'rightStageLaser2',
'floor',
'stageNeon'].forEach(id => {
- this.targets[id] = id == 'fog' ? this.el.sceneEl : document.getElementById(id);
+ this.targets[id] = document.getElementById(id);
});
this.colorCodes = ['off', 'blue', 'blue', 'bluefade', '', 'red', 'red', 'redfade'];
this.el.addEventListener('cleargame', this.resetColors.bind(this));
- */
},
update: function (oldData) {
- // this.updateColors(this.data.color);
+ this.updateColors(this.data.color);
},
setColor: function (target, code) {
- /* const mesh = this.targets[target].getObject3D('mesh');
+ const mesh = this.targets[target].getObject3D('mesh');
if (mesh) { mesh.material.opacity = 1; }
this.targets[target].emit('color' + this.colorCodes[code], null, false);
- */
},
resetColors: function () {
- /*
this.updateColors('blue');
for (let target in this.targets) {
this.targets[target].emit('colorblue', null, false);
}
- */
},
updateColors: function (color) {
- /*
const red = color === 'red';
- // Init or reset.
- try {
- this.backglow.getObject3D('mesh').material.color.set(red ? '#f10' : '#00acfc');
- } catch (e) {
- this.backglow.addEventListener('object3dset', () => {
- this.backglow.getObject3D('mesh').material.color.set(red ? '#f10' : '#00acfc');
- });
- }
-
this.sky.getObject3D('mesh').material.color.set(red ? '#f10' : '#00acfc');
this.el.sceneEl.object3D.background.set(red ? '#770100' : '#15252d');
this.el.sceneEl.object3D.fog.color.set(red ? '#a00' : '#007cb9');
@@ -100,6 +104,7 @@ AFRAME.registerComponent('stage-colors', {
this.mineMaterial.emissive = this.mineEmission[red ? 'red' : 'blue'];
this.mineMaterial.envMap = this.mineEnvMap[red ? 'red' : 'blue'];
this.mineMaterial.needsUpdate = true;
- */
}
+
+ */
});
diff --git a/src/index.html b/src/index.html
index ab1112d..746ad5b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -18,7 +18,7 @@
-
-
-