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

broken neon effect on logo

Browse Source
This commit is contained in:
Diego F. Goberna
2018-09-21 01:44:25 +02:00
parent 33f84734ca
commit bea3ab72f9
7 changed files with 55 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/models/logosparks.json Normal file
View File

File diff suppressed because one or more lines are too long

5
package-lock.json generated
View File

@@ -143,6 +143,11 @@
"resolved": "https://registry.npmjs.org/aframe-particle-system-component/-/aframe-particle-system-component-1.0.11.tgz",
"integrity": "sha1-rB86vvIweyON9YyTWJgsmH+xABY="
},
"aframe-particleplayer-component": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/aframe-particleplayer-component/-/aframe-particleplayer-component-1.0.0.tgz",
"integrity": "sha512-UBVaGkMOBZD8cipbl1vb8786eVOeU0q88tkbVTQhOaa6T1NscXETusfyT+59YqOqNtKo4YsCMIJloy2cZjUa+A=="
},
"aframe-proxy-event-component": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/aframe-proxy-event-component/-/aframe-proxy-event-component-1.1.1.tgz",

1
package.json
View File

@@ -17,6 +17,7 @@
"aframe-layout-component": "^5.2.0",
"aframe-orbit-controls": "^1.2.0",
"aframe-particle-system-component": "^1.0.11",
"aframe-particleplayer-component": "^1.0.0",
"aframe-proxy-event-component": "^1.1.1",
"aframe-slice9-component": "^1.0.0",
"aframe-state-component": "^5.0.0-beta5",

29
src/components/logoflickr.js Normal file
View File

@@ -0,0 +1,29 @@
AFRAME.registerComponent('logoflicker', {
dependencies: ['text'],
schema: {
default: 1000.0,
},
init: function () {
this.defaultColor = this.el.components['text'].data.color;
this.sparks = document.getElementById('logosparks');
this.sparkPositions = [
{ position: new THREE.Vector3(0, 0.1, 0) },
{ position: new THREE.Vector3(0.5, 1.2, 0) },
{ position: new THREE.Vector3(0, 1.2, 0) }
];
this.setOn();
},
setOff: function () {
this.el.setAttribute('text', {color: '#0a0228'});
this.sparks.emit('flicker',
this.sparkPositions[Math.floor(Math.random() * this.sparkPositions.length)]);
setTimeout(this.setOn.bind(this),
50 + Math.floor(Math.random() * 100));
},
setOn: function () {
this.el.setAttribute('text', {color: this.defaultColor});
setTimeout(this.setOff.bind(this),
Math.floor((this.data * 3 / 10) + Math.random() * this.data));
}
});

5
src/index.html
View File

@@ -13,7 +13,7 @@
bind-toggle__overlay="menu.active"
console-shortcuts
debug-controller
effect-bloom="strength: 0.7"
effect-bloom="strength: 1"
proxy-event="event: menuchallengeselect; to: #searchResultsContainer, #menuDifficultiesGroup"
overlay="object: #menu, #keyboard, #rightHand, #leftHand"
search
@@ -36,6 +36,9 @@
<img id="playImg" src="assets/img/play.png">
<img id="sliceImg" src="assets/img/slice.png">
<img id="downIconImg" src="assets/img/downIcon.png">
<a-asset-item src="assets/models/logosparks.json" id="logoSparks"></a-asset-item>
<a-mixin id="slice" slice9="color: #050505; transparent: true; opacity: 0.7; src: #sliceImg; left: 50; right: 52; top: 50; bottom: 52; padding: 0.18"></a-mixin>
<a-mixin id="font" text="font: assets/fonts/Teko-Bold.json; shader: msdf; letterSpacing: 1"></a-mixin>
<a-mixin id="textFont" text="font: assets/fonts/Teko-Bold.json; shader: msdf; letterSpacing: 1"></a-mixin>

1
src/index.js
View File

@@ -14,6 +14,7 @@ require('aframe-proxy-event-component');
require('aframe-state-component');
require('aframe-slice9-component');
require('aframe-super-keyboard');
require('aframe-particleplayer-component');
requireAll(require.context('./components/', true, /\.js$/));
requireAll(require.context('./state/', true, /\.js$/));

17
src/templates/stage.html
View File

@@ -45,9 +45,20 @@
</a-entity>
<a-entity id="logo" position="0 5.0 -7.5">
<a-entity mixin="font" text="width: 35; value: SUPER SABER; align: center; color: #ff666a"></a-entity>
<a-entity mixin="font" text="width: 35; value: SUPER SABER; align: center; color: #ff1a1f" position="0 0 -0.1"></a-entity>
<a-entity mixin="font" text="width: 35; value: SUPER SABER; align: center; color: #0a0228" position="0 0 -0.2"></a-entity>
<a-entity id="logosparks" particleplayer="src:#logoSparks; scale: 1.4; pscale: 0.4; count: 10; dur: 600; on:flicker" position="-3.8 0.5 0.05"></a-entity>
<a-entity mixin="font" text="width: 35; value: PER SABER; align: center; color: #ff666a" position="0.974 0 0"></a-entity>
<a-entity mixin="font" text="width: 35; value: PER SABER; align: center; color: #ff1a1f" position="0.974 0 -0.1"></a-entity>
<a-entity mixin="font" text="width: 35; value: PER SABER; align: center; color: #0a0228" position="0.974 0 -0.2"></a-entity>
<a-entity mixin="font" text="width: 35; value: S; align: center; color: #ff666a" position="-4.601 0 0"></a-entity>
<a-entity mixin="font" text="width: 35; value: U; align: center; color: #ff666a" position="-3.632 0 0" logoflicker="1200"></a-entity>
<a-entity mixin="font" text="width: 35; value: S; align: center; color: #ff1a1f" position="-4.601 0 -0.1"></a-entity>
<a-entity mixin="font" text="width: 35; value: U; align: center; color: #ff1a1f" position="-3.632 0 -0.1"></a-entity>
<a-entity mixin="font" text="width: 35; value: S; align: center; color: #0a0228" position="-4.601 0 -0.2"></a-entity>
<a-entity mixin="font" text="width: 35; value: U; align: center; color: #0a0228" position="-3.632 0 -0.2"></a-entity>
</a-entity>
<a-entity geometry="primitive: plane; width: 3; height: 3" material="shader: flat; src: #floor" position="0 0 0" rotation="-90 0 0"></a-entity>