juni/junisaber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

reduce sky segments

Browse Source
This commit is contained in:
Kevin Ngo
2018-10-04 16:46:05 -07:00
parent 3e91ac70a3
commit a8f930b686
6 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/beams.js
View File

@@ -1,3 +1,5 @@
const ANIME = AFRAME.ANIME || AFRAME.anime;
AFRAME.registerComponent('beams', {
schema: {
poolSize: {default: 3}
@@ -29,7 +31,7 @@ AFRAME.registerComponent('beams', {
for (var i = 0; i < this.data.poolSize; i++) {
beam = new THREE.Mesh(geo, j === 0 ? redMaterial : blueMaterial);
beam.visible = false;
beam.anim = AFRAME.anime({
beam.anim = ANIME({
targets: beam.scale,
x: 0.00001,
autoplay: false,

3
src/components/song-preview.js
View File

@@ -1,3 +1,4 @@
const ANIME = AFRAME.ANIME || AFRAME.anime;
var utils = require('../utils');
/**
@@ -17,7 +18,7 @@ AFRAME.registerComponent('song-preview-system', {
// anime.js animation to fade in volume.
this.volumeTarget = {volume: 0};
this.animation = AFRAME.anime({
this.animation = ANIME({
targets: this.volumeTarget,
delay: 250,
duration: 1500,

15
src/components/stage-colors.js
View File

@@ -13,8 +13,8 @@ AFRAME.registerComponent('stage-colors', {
red: new THREE.TextureLoader().load('assets/img/mineenviro-red.jpg'),
blue: new THREE.TextureLoader().load('assets/img/mineenviro-blue.jpg')
};
this.mineColor = { red: new THREE.Color(0x070304), blue: new THREE.Color(0x030407) };
this.mineEmission = { red: new THREE.Color(0x090707), blue: new THREE.Color(0x070709) };
this.mineColor = {red: new THREE.Color(0x070304), blue: new THREE.Color(0x030407)};
this.mineEmission = {red: new THREE.Color(0x090707), blue: new THREE.Color(0x070709)};
this.mineMaterial = new THREE.MeshStandardMaterial({
roughness: 0.38,
metalness: 0.48,
@@ -25,10 +25,11 @@ AFRAME.registerComponent('stage-colors', {
},
update: function () {
var red = (this.data == 'red');
document.getElementById('backglow').setAttribute('material', {color: red ? '#f10' : '#00acfc'});
document.getElementById('sky').setAttribute('material', {color: red ? '#770100': '#15252d'});
this.el.sceneEl.setAttribute('fog', {color: red ? '#a00' : '#007cb9'});
const red = this.data === 'red';
document.getElementById('backglow').setAttribute('material', 'color', red ? '#f10' : '#00acfc');
document.getElementById('sky').setAttribute('material', 'color', red ? '#f10' : '#00acfc');
this.el.setAttribute('background', 'color', red ? '#770100': '#15252d');
this.el.sceneEl.setAttribute('fog', 'color', red ? '#a00' : '#007cb9');
this.el.sceneEl.systems.materials.neon.color = red ? this.neonRed : this.neonBlue;
this.el.sceneEl.systems.materials.default.color = red ? this.defaultRed : this.defaultBlue;
this.mineMaterial.color = this.mineColor[this.data];
@@ -36,4 +37,4 @@ AFRAME.registerComponent('stage-colors', {
this.mineMaterial.envMap = this.mineEnvMap[this.data];
}
});
});