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

victory button fade-ins, remove victory-specific code from text-counter, remove duplicate entities in victory

Browse Source
This commit is contained in:
Kevin Ngo
2018-11-17 03:00:54 -08:00
parent 8cb96231e6
commit a1ca2aee92
2 changed files with 47 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/text-counter.js
View File

@@ -1,3 +1,6 @@
/**
* Animate text number value.
*/
AFRAME.registerComponent('text-counter', {
dependencies: ['text'],
@@ -14,8 +17,6 @@ AFRAME.registerComponent('text-counter', {
this.startTime = null;
this.currentValue = 0;
this.textValue = {value : ''};
this.victoryInfoRank = document.getElementById('victoryInfoRank');
this.victoryButtons = document.getElementById('victoryButtons');
},
decimals: function (n) {
@@ -32,18 +33,26 @@ AFRAME.registerComponent('text-counter', {
tick: function (time) {
if (this.currentValue >= this.data.value) { return; }
if (this.startTime === null) { this.startTime = time; return; };
if (this.startTime === null) {
this.startTime = time;
return;
};
const prevValue = Math.floor(this.currentValue);
this.currentValue = this.data.value * (time - this.startTime) / this.data.dur;
if (Math.floor(this.currentValue) === prevValue) { return; }
if (this.currentValue >= this.data.value) {
this.currentValue = this.data.value;
if (this.data.emit) {
this.victoryInfoRank.emit('textcounterdone', null, false);
this.victoryButtons.emit('textcounterdone', null, false);
this.el.emit('textcounterdone', null, false);
}
}
this.textValue.value = `${this.data.prefix} ${this.decimals(this.currentValue)} ${this.data.suffix}`;
this.textValue.value =
`${this.data.prefix} ${this.decimals(this.currentValue)} ${this.data.suffix}`;
this.el.setAttribute('text', this.textValue);
}
})
})

53
src/templates/victory.html
View File

@@ -1,31 +1,26 @@
<!-- Victory. -->
<a-entity
id="victoryInfoContainer"
class="overlay"
position="0 0.9 -2"
bind__visible="isVictory">
<a-entity
<a-entity
id="victoryAccuracyRing"
bind__victory-accuracy-ring="accuracy: score.accuracy"
animation="property: components.material.material.uniforms.progress.value; from: 0; easing: easeOutQuad; delay: 500; dur: 2000; autoplay: false"
geometry="primitive: plane; width: 0.7; height: 0.7"
material="shader: ring; transparent: true; color: #ABABAB; radiusInner: 0.8; color: #FAFAFA"
position="0 0.48 0"></a-entity>
</a-entity>
<a-entity
id="victoryInfoContainerNoBloom"
class="overlay"
position="0 0.9 -2"
bind__visible="isVictory">
<a-entity
id="victoryInfoRank"
class="accuracyTextCounterSubscribe"
mixin="font"
bind__animation="enabled: isVictory"
bind__victory-rank="rank: score.rank"
scale="0 0 0"
position="0 0.2 0.05"
position="0 0.2 0.1"
animation__rotation="property: object3D.rotation.y; from: 0; to: -360; loop: true; easing: linear; dur: 5000; startEvents: textcounterdone"
animation__scale="property: scale; from: 0 0 0; to: 1 1 1; loop: false; easing: easeOutQuad; dur: 300; startEvents: textcounterdone"
play-sound="sound: #victorySound; event: textcounterdone"
@@ -34,9 +29,10 @@
<a-entity
id="victoryInfoAccuracy"
mixin="font"
bind__text-counter="value: score.accuracy"
text="align: center; color: #FAFAFA; wrapCount: 22; baseline: top; width: 0.81"
text-counter="suffix: %; decimals: 2; emit: true"
bind__text-counter="value: score.accuracy"
proxy-event="event: textcounterdone; to: .accuracyTextCounterSubscribe"
position="0.45 0.75 0"></a-entity>
<a-entity
@@ -56,30 +52,43 @@
<a-entity
id="victoryButtons"
animation="property: visible; from: false; to: true; delay: 1000; startEvents: textcounterdone"
position="0 0.2 0"
play-sound="event: mouseenter; sound: #hoverSound; volume: 0.03"
play-sound__click="event: click; sound: #confirmSound; volume: 0.25"
visible="false">
play-sound__click="event: click; sound: #confirmSound; volume: 0.25">
<a-entity
id="victoryRestartButton"
class="accuracyTextCounterSubscribe"
mixin="gameMenuButton"
position="-0.56 -0.79 0.05"
bind-toggle__raycastable="isVictory"
proxy-event="event: click; to: a-scene; as: gamemenurestart">
<a-entity mixin="gameMenuButtonText" text="value: RESTART SONG"></a-entity>
bind__slice9="opacity: isVictory && 0 || 0"
animation="property: components.slice9.material.opacity; from: 0; to: 1; startEvents: textcounterdone"
position="-0.56 -0.79 0.05"
proxy-event="event: click; to: a-scene; as: gamemenurestart"
slice9="opacity: 0">
<a-entity
class="accuracyTextCounterSubscribe"
mixin="gameMenuButtonText"
bind__text="opacity: isVictory && 0 || 0"
animation="property: components.text.material.uniforms.opacity.value; from: 0; to: 1; startEvents: textcounterdone"
text="opacity: 0; value: RESTART SONG"></a-entity>
</a-entity>
<a-entity
id="victoryExitButton"
class="accuracyTextCounterSubscribe"
mixin="gameMenuButton"
bind-toggle__raycastable="isVictory"
bind__slice9="opacity: isVictory && 0 || 0"
animation="property: components.slice9.material.opacity; from: 0; to: 1; startEvents: textcounterdone"
position="0.56 -0.79 0.05"
proxy-event="event: click; to: a-scene; as: gamemenuexit">
<a-entity mixin="gameMenuButtonText" text="value: EXIT TO MENU"></a-entity>
proxy-event="event: click; to: a-scene; as: gamemenuexit"
slice9="opacity: 0">
<a-entity
class="accuracyTextCounterSubscribe"
mixin="gameMenuButtonText"
bind__text="opacity: isVictory && 0 || 0"
animation="property: components.text.material.uniforms.opacity.value; from: 0; to: 1; startEvents: textcounterdone"
text="opacity: 0; value: EXIT TO MENU"></a-entity>
</a-entity>
</a-entity>
</a-entity>
<a-timeline id="victoryTimeline">
</a-timeline>