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

supermedium brand colors

Browse Source
This commit is contained in:
Diego F. Goberna
2018-12-06 22:17:21 +01:00
committed by Diego Marcos
parent 6d78a80525
commit 09685d7bd8
24 changed files with 2812 additions and 2674 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/beams.js
View File

@@ -23,22 +23,22 @@ AFRAME.registerComponent('beams', {
},
play: function () {
// Material.
const materialOptions = {
color: 0xaa3333,
map: new THREE.TextureLoader().load('assets/img/beam.png'),
transparent: true,
blending: THREE.AdditiveBlending
};
const redMaterial = new THREE.MeshBasicMaterial(materialOptions);
materialOptions.color = 0x4444cc;
const blueMaterial = new THREE.MeshBasicMaterial(materialOptions);
this.texture = materialOptions.map;
// Beam pools.
const geometry = new THREE.PlaneBufferGeometry(0.4, 50).translate(0, 25, 0);
this.redBeams = this.createBeamPool(geometry, redMaterial);
this.blueBeams = this.createBeamPool(geometry, blueMaterial);
//const geometry = new THREE.PlaneBufferGeometry(0.4, 50).translate(0, 25, 0);
var objData;
var loader;
var redGeometry, blueGeometry;
var loader = new THREE.OBJLoader();
objData = document.getElementById('redbeamObj').data;
redGeometry = loader.parse(objData).children[0].geometry;
objData = document.getElementById('bluebeamObj').data;
blueGeometry = loader.parse(objData).children[0].geometry;
this.redBeams = this.createBeamPool(redGeometry, this.el.sceneEl.systems.materials.stageAdditive);
this.blueBeams = this.createBeamPool(blueGeometry, this.el.sceneEl.systems.materials.stageAdditive);
},
/**

3
src/components/beat-loader.js
View File

@@ -292,9 +292,8 @@ AFRAME.registerComponent('beat-loader', {
case 3:
this.stageColors.setColor('rightlaser', event._value);
break;
case 400:
case 4:
this.stageColors.setColor('floor', event._value);
this.stageColors.setColor('stageNeon', event._value);
break;
case 8:
this.twister.components.twister.pulse(event._value);

6
src/components/beat.js
View File

@@ -258,7 +258,7 @@ AFRAME.registerComponent('beat', {
roughness: 0.10,
sphericalEnvMap: '#envmapTexture',
emissive: this.materialColor[this.data.color],
emissiveIntensity: 0.27,
emissiveIntensity: 0.17,
color: this.materialColor[this.data.color]
});
this.setObjModelFromTemplate(blockEl, this.models[this.data.type]);
@@ -372,7 +372,7 @@ AFRAME.registerComponent('beat', {
roughness: 0.12,
sphericalEnvMap: '#envmapTexture',
emissive: this.materialColor[this.data.color],
emissiveIntensity: 0.27,
emissiveIntensity: 0.17,
color: this.materialColor[this.data.color],
side: 'double'
});
@@ -391,7 +391,7 @@ AFRAME.registerComponent('beat', {
roughness: 0.12,
sphericalEnvMap: '#envmapTexture',
emissive: this.materialColor[this.data.color],
emissiveIntensity: 0.27,
emissiveIntensity: 0.17,
color: this.materialColor[this.data.color],
side: 'double'
});

7
src/components/materials.js
View File

@@ -7,7 +7,8 @@ AFRAME.registerSystem('materials', {
init: function () {
this.stageNormal = new THREE.ShaderMaterial({
uniforms: {
color: {value: new THREE.Color(COLORS.BG_BLUE)},
skyColor: {value: new THREE.Color(COLORS.SKY_BLUE)},
backglowColor: {value: new THREE.Color(COLORS.BG_BLUE)},
src: {value: new THREE.TextureLoader().load(document.getElementById('atlasImg').src)},
},
vertexShader: stageNormalShaders.vertexShader,
@@ -18,8 +19,8 @@ AFRAME.registerSystem('materials', {
this.stageAdditive = new THREE.ShaderMaterial({
uniforms: {
tunnelNeon: {value: new THREE.Color(COLORS.NEON_BLUE)},
floorNeon: {value: new THREE.Color(COLORS.NEON_BLUE)},
tunnelNeon: {value: new THREE.Color(COLORS.NEON_RED)},
floorNeon: {value: new THREE.Color(COLORS.NEON_RED)},
leftLaser: {value: new THREE.Color(COLORS.NEON_BLUE)},
rightLaser: {value: new THREE.Color(COLORS.NEON_BLUE)},
textGlow: {value: new THREE.Color(COLORS.TEXT_OFF)},

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

@@ -23,6 +23,10 @@ AFRAME.registerComponent('stage-colors', {
resetColors: function () {
this.updateColors('blue');
this.el.emit('bgcolorblue', null, false);
this.el.emit('tunnelcolorred', null, false);
this.el.emit('floorcolorred', null, false);
this.el.emit('leftlasercolorblue', null, false);
this.el.emit('rightlasercolorblue', null, false);
},
updateColors: function (color) {

13
src/components/wall-shader.js
View File

@@ -1,3 +1,8 @@
const COLORS = require('../constants/colors.js');
const WALL_COLOR = new THREE.Color(COLORS.NEON_RED);
const WALL_BG = new THREE.Color(COLORS.SKY_RED);
AFRAME.registerShader('wallShader', {
schema: {
@@ -63,7 +68,8 @@ AFRAME.registerShader('wallShader', {
return mix(c, f, luvw.z);
}
#define WALL_COLOR vec3(${WALL_COLOR.r}, ${WALL_COLOR.g}, ${WALL_COLOR.b})
#define WALL_BG vec3(${WALL_BG.r}, ${WALL_BG.g}, ${WALL_BG.b})
void main() {
vec2 uv1 = uvs.xy-0.5;
@@ -93,7 +99,10 @@ AFRAME.registerShader('wallShader', {
w *= 0.9;
bg *= 0.5;
vec3 col = vec3(r * 0.8 + w, w + 0.05, w + 0.08);
vec3 COL = WALL_COLOR;
vec3 BG = WALL_BG * 0.1;
vec3 col = vec3(r * COL.r + w + BG.r, r * COL.g + w + BG.g, r * COL.b + w + BG.b);
vec3 hit;
hit = drawCircle(worldPos, hitRight, 0.04, 0.05, vec3(1.0, 0.4, 0.4));