corridor, laser neons
This commit is contained in:
Diego F. Goberna
committed by
Diego Marcos
Diego Marcos
parent
f1e9765e5e
commit
28bae66b20
@@ -8,7 +8,7 @@
|
||||
<a-asset-item id="logobackObj" src="assets/models/logoback.obj"></a-asset-item>
|
||||
<a-asset-item id="logofrontUObj" src="assets/models/logofront-u.obj"></a-asset-item>
|
||||
<a-asset-item id="laserObj" src="assets/models/laser/laser.obj"></a-asset-item>
|
||||
<a-asset-item id="laserNeonObj" src="assets/models/laserneon.obj"></a-asset-item>
|
||||
<!--<a-asset-item id="laserNeonObj" src="assets/models/laserneon.obj"></a-asset-item>-->
|
||||
<a-asset-item id="logoSparksJSON" src="assets/models/logosparks.json"></a-asset-item>
|
||||
<a-asset-item id="sparksJSON" src="assets/models/sparks.json"></a-asset-item>
|
||||
<a-asset-item id="mineObj" src="assets/models/mine.obj"></a-asset-item>
|
||||
@@ -27,6 +27,9 @@
|
||||
<a-asset-item id="wrongObj" src="assets/models/wrong.obj"></a-asset-item>
|
||||
<a-asset-item id="smokeObj" src="assets/models/smoke.obj"></a-asset-item>
|
||||
<a-asset-item id="audiocolumnObj" src="assets/models/audiocolumn.obj"></a-asset-item>
|
||||
<a-asset-item id="leftLaserObj" src="assets/models/leftlaser.obj"></a-asset-item>
|
||||
<a-asset-item id="rightLaserObj" src="assets/models/rightlaser.obj"></a-asset-item>
|
||||
|
||||
<!--<a-asset-item id="wallglowObj" src="assets/models/wallglow.obj"></a-asset-item>-->
|
||||
|
||||
<a-asset-item id="tutorial1Obj" src="assets/models/tutorial1.obj"></a-asset-item>
|
||||
@@ -153,6 +156,8 @@
|
||||
animation__mouseleave2="property: scale; to: 1 1 1; from: 1.1 1.1 1.1; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"></a-mixin>
|
||||
|
||||
|
||||
<!-- stage, neons, etc animations launched from beat-loader events -->
|
||||
|
||||
<a-mixin id="bgColorAnimation"
|
||||
animation__bgcoloroff="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; to: #111; dur: 500; easing: linear; startEvents: bgcoloroff"
|
||||
animation__bgcolorblue="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; to: #00acfc; dur: 5; easing: linear; startEvents: bgcolorblue"
|
||||
@@ -161,7 +166,6 @@
|
||||
animation__bgcolorredfade="isRawProperty: true; property: systems.materials.stageNormal.uniforms.color.value; type: color; from: #FF4343; to: #fc0000; dur: 500; easing: linear; startEvents: bgcolorredfade"
|
||||
></a-mixin>
|
||||
|
||||
|
||||
<a-mixin id="tunnelColorAnimation"
|
||||
animation__tunnelcoloroff="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.tunnelNeon.value; type: color; to: #111; dur: 500; easing: linear; startEvents: tunnelcoloroff"
|
||||
animation__tunnelcolorblue="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.tunnelNeon.value; type: color; to: #00acfc; dur: 5; easing: linear; startEvents: tunnelcolorblue"
|
||||
@@ -169,3 +173,19 @@
|
||||
animation__tunnelcolorred="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.tunnelNeon.value; type: color; to: #fc0000; dur: 5; easing: linear; startEvents: tunnelcolorred"
|
||||
animation__tunnelcolorredfade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.tunnelNeon.value; type: color; from: #FF4343; to: #fc0000; dur: 500; easing: linear; startEvents: tunnelcolorredfade"
|
||||
></a-mixin>
|
||||
|
||||
<a-mixin id="leftLaserColorAnimation"
|
||||
animation__leftlasercoloroff="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; to: #000; dur: 500; easing: linear; startEvents: leftlasercoloroff"
|
||||
animation__leftlasercolorblue="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; to: #00f; dur: 5; easing: linear; startEvents: leftlasercolorblue"
|
||||
animation__leftlasercolorbluefade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; from: #aaf; to: #00f; dur: 500; easing: linear; startEvents: leftlasercolorbluefade"
|
||||
animation__leftlasercolorred="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; to: #f00; dur: 5; easing: linear; startEvents: leftlasercolorred"
|
||||
animation__leftlasercolorredfade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.leftLaser.value; type: color; from: #faa; to: #f00; dur: 500; easing: linear; startEvents: leftlasercolorredfade"
|
||||
></a-mixin>
|
||||
|
||||
<a-mixin id="rightLaserColorAnimation"
|
||||
animation__rightlasercoloroff="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.rightLaser.value; type: color; to: #000; dur: 500; easing: linear; startEvents: rightlasercoloroff"
|
||||
animation__rightlasercolorblue="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.rightLaser.value; type: color; to: #00f; dur: 5; easing: linear; startEvents: rightlasercolorblue"
|
||||
animation__rightlasercolorbluefade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.rightLaser.value; type: color; from: #aaf; to: #00f; dur: 500; easing: linear; startEvents: rightlasercolorbluefade"
|
||||
animation__rightlasercolorred="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.rightLaser.value; type: color; to: #f00; dur: 5; easing: linear; startEvents: rightlasercolorred"
|
||||
animation__rightlasercolorredfade="isRawProperty: true; property: systems.materials.stageAdditive.uniforms.rightLaser.value; type: color; from: #faa; to: #f00; dur: 500; easing: linear; startEvents: rightlasercolorredfade"
|
||||
></a-mixin>
|
||||
|
||||
@@ -286,31 +286,27 @@ AFRAME.registerComponent('beat-loader', {
|
||||
case 1:
|
||||
this.stageColors.setColor('tunnel', event._value);
|
||||
break;
|
||||
case 200:
|
||||
this.stageColors.setColor('leftStageLaser0', event._value);
|
||||
this.stageColors.setColor('leftStageLaser1', event._value);
|
||||
this.stageColors.setColor('leftStageLaser2', event._value);
|
||||
case 2:
|
||||
this.stageColors.setColor('leftlaser', event._value);
|
||||
break;
|
||||
case 300:
|
||||
this.stageColors.setColor('rightStageLaser0', event._value);
|
||||
this.stageColors.setColor('rightStageLaser1', event._value);
|
||||
this.stageColors.setColor('rightStageLaser2', event._value);
|
||||
case 3:
|
||||
this.stageColors.setColor('rightlaser', event._value);
|
||||
break;
|
||||
case 400:
|
||||
this.stageColors.setColor('floor', event._value);
|
||||
this.stageColors.setColor('stageNeon', event._value);
|
||||
break;
|
||||
case 800:
|
||||
case 8:
|
||||
this.twister.components.twister.pulse(event._value);
|
||||
break;
|
||||
case 900:
|
||||
case 9:
|
||||
// zoom was a bit disturbing
|
||||
this.twister.components.twister.pulse(event._value);
|
||||
break;
|
||||
case 1200:
|
||||
case 12:
|
||||
this.leftStageLasers.components['stage-lasers'].pulse(event._value);
|
||||
break;
|
||||
case 1300:
|
||||
case 13:
|
||||
this.rightStageLasers.components['stage-lasers'].pulse(event._value);
|
||||
break;
|
||||
}
|
||||
|
||||
@@ -629,7 +629,6 @@ AFRAME.registerComponent('beat', {
|
||||
|
||||
returnToPool: function (force) {
|
||||
if (!this.backToPool && !force) { return; }
|
||||
console.log('returning ' + this.poolName + ' to pool');
|
||||
this.el.sceneEl.components[this.poolName].returnEntity(this.el);
|
||||
},
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ AFRAME.registerSystem('materials', {
|
||||
|
||||
this.stageNormal = new THREE.ShaderMaterial({
|
||||
uniforms: {
|
||||
color: {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,
|
||||
@@ -20,7 +20,10 @@ AFRAME.registerSystem('materials', {
|
||||
|
||||
this.stageAdditive = new THREE.ShaderMaterial({
|
||||
uniforms: {
|
||||
tunnelNeon: {value: new THREE.Vector3(0, 0, 1) },
|
||||
tunnelNeon: {value: new THREE.Vector3(0, 0, 1)},
|
||||
floorNeon: {value: new THREE.Vector3(0, 0, 1)},
|
||||
leftLaser: {value: new THREE.Vector3(0, 0, 1)},
|
||||
rightLaser: {value: new THREE.Vector3(0, 0, 1)},
|
||||
src: {value: new THREE.TextureLoader().load(document.getElementById('atlasImg').src)},
|
||||
},
|
||||
vertexShader: stageAdditiveShaders.vertexShader,
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
|
||||
<a-scene
|
||||
stats
|
||||
mixin="gameoverAnimation fogAnimation bgColorAnimation tunnelColorAnimation"
|
||||
mixin="gameoverAnimation fogAnimation bgColorAnimation tunnelColorAnimation leftLaserColorAnimation rightLaserColorAnimation"
|
||||
bind__beat-loader="challengeId: challenge.id; difficulty: menuSelectedChallenge.difficulty; isPlaying: isPlaying; menuSelectedChallengeId: menuSelectedChallenge.id"
|
||||
bind__gameover="isGameOver: isGameOver"
|
||||
bind__intro-song="isPlaying: menuActive && !menuSelectedChallenge.id; isSearching: isSearching"
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
<!--
|
||||
<a-mixin id="stageLaser" obj-model="obj:#laserNeonObj" material="depthWrite: false; transparent: true; shader: flat; fog: false; color: #00a; src: #neonImg;"></a-mixin>
|
||||
|
||||
<a-mixin id="neonAnimation"
|
||||
@@ -8,7 +9,6 @@
|
||||
animation__colorred="property: components.material.material.color; type: color; to: #FFAAAA; dur: 5; easing: linear; startEvents: colorred"
|
||||
animation__colorredfade="property: components.material.material.color; type: color; from: #FEE; to: #ffAAAA; dur: 500; easing: linear; startEvents: colorredfade"></a-mixin>
|
||||
|
||||
<!--
|
||||
|
||||
<a-sky
|
||||
id="sky"
|
||||
@@ -36,12 +36,6 @@
|
||||
position="0 0 -60"
|
||||
scale="20 20 20"></a-entity>
|
||||
-->
|
||||
<a-entity id="twister" position="0 0 -35" rotation="90 0 0" bind__twister="enabled: isPlaying"></a-entity>
|
||||
|
||||
<a-entity
|
||||
id="audioColumns"
|
||||
audio-columns="analyser: #audioAnalyser; height: 28; mirror: 18; scale: 9; thickness: 0.6; separation: 0.55"
|
||||
position="0 -19 5"></a-entity>
|
||||
|
||||
<!--
|
||||
<a-mixin id="corridor" geometry="skipCache: true" vertex-colors-buffer="baseColor: #010101" visible="false"></a-mixin>
|
||||
@@ -71,32 +65,39 @@
|
||||
mixin="neonAnimation"
|
||||
obj-model="obj: #stageNeonObj"></a-entity>
|
||||
-->
|
||||
|
||||
<a-entity
|
||||
id="audioColumns"
|
||||
audio-columns="analyser: #audioAnalyser; height: 28; mirror: 18; scale: 9; thickness: 0.6; separation: 0.55"
|
||||
position="0 -19 5"></a-entity>
|
||||
|
||||
<a-entity
|
||||
id="stageobj"
|
||||
mixin="gameoverAnimation"
|
||||
obj-model="obj: #stageNormalObj"
|
||||
materials="name: stageNormal"></a-entity>
|
||||
<a-entity
|
||||
id="stageadditiveobj"
|
||||
obj-model="obj: #stageAdditiveObj"
|
||||
materials="name: stageAdditive"></a-entity>
|
||||
|
||||
|
||||
<!-- Lasers left. -->
|
||||
<a-entity id="leftStageLasers" bind__stage-lasers="enabled: isPlaying">
|
||||
<a-entity id="leftStageLaser0" mixin="stageLaser neonAnimation" position=" -6 2.3 -40"></a-entity>
|
||||
<a-entity id="leftStageLaser1" mixin="stageLaser neonAnimation" position="-10 0 -38"></a-entity>
|
||||
<a-entity id="leftStageLaser2" mixin="stageLaser neonAnimation" position="-14 -3 -36"></a-entity>
|
||||
<a-entity obj-model="obj: #leftLaserObj" materials="name: stageAdditive" position="-6 2.3 -41"></a-entity>
|
||||
<a-entity obj-model="obj: #leftLaserObj" materials="name: stageAdditive" position="-10 0 -40"></a-entity>
|
||||
<a-entity obj-model="obj: #leftLaserObj" materials="name: stageAdditive" position="-14 -3 -39"></a-entity>
|
||||
</a-entity>
|
||||
|
||||
<!-- Lasers right. -->
|
||||
<a-entity id="rightStageLasers" bind__stage-lasers="enabled: isPlaying">
|
||||
<a-entity id="rightStageLaser0" mixin="stageLaser neonAnimation" position=" 6 4 -40"></a-entity>
|
||||
<a-entity id="rightStageLaser1" mixin="stageLaser neonAnimation" position="10 2 -38"></a-entity>
|
||||
<a-entity id="rightStageLaser2" mixin="stageLaser neonAnimation" position="14 -1.5 -36"></a-entity>
|
||||
<a-entity obj-model="obj: #rightLaserObj" materials="name: stageAdditive" position="6 4 -38"></a-entity>
|
||||
<a-entity obj-model="obj: #rightLaserObj" materials="name: stageAdditive" position="10 2 -37"></a-entity>
|
||||
<a-entity obj-model="obj: #rightLaserObj" materials="name: stageAdditive" position="14 -1.5 -36"></a-entity>
|
||||
</a-entity>
|
||||
|
||||
<a-entity id="beams" bind__beams="isPlaying: isPlaying"></a-entity>
|
||||
<a-entity id="twister" position="0 0 -35" rotation="90 0 0" bind__twister="enabled: isPlaying"></a-entity>
|
||||
|
||||
<a-entity
|
||||
id="stageadditiveobj"
|
||||
obj-model="obj: #stageAdditiveObj"
|
||||
materials="name: stageAdditive"></a-entity>
|
||||
|
||||
<a-mixin
|
||||
id="smoke"
|
||||
@@ -104,7 +105,7 @@
|
||||
animation__gameover="property: components.material.material.opacity; to: 0; startEvents: gameover"
|
||||
animation__rotate="property: rotation; to: 0 360 0; easing: linear; loop: true"
|
||||
obj-model="obj:#smokeObj"
|
||||
material="src: #atlasImg; fog: false; shader: flat; transparent: true"></a-mixin>
|
||||
material="src: #atlasImg; fog: false; shader: flat; transparent: true;"></a-mixin>
|
||||
<a-entity id="smoke1" mixin="smoke" position="0 1.4 0" animation__rotate="dur: 200000"></a-entity>
|
||||
<a-entity id="smoke2" mixin="smoke" position="0 1.8 0" scale="1.25 0.8 1.25" animation__rotate="dur: 243000"></a-entity>
|
||||
|
||||
@@ -145,3 +146,4 @@
|
||||
rotation="-45 0 0">
|
||||
</a-entity>
|
||||
</a-entity>
|
||||
f
|
||||
Reference in New Issue
Block a user