leaderboard tweaks

This commit is contained in:
Diego F. Goberna
2018-11-19 21:35:38 +01:00
committed by Kevin Ngo
parent fdd625c4ab
commit a2288eaee1
4 changed files with 48 additions and 29 deletions

View File

@@ -135,7 +135,7 @@ AFRAME.registerComponent('leaderboard-title', {
update: function () {
const value = this.data.leaderboardQualified
? 'NEW HIGH SCORE'
? 'NEW HIGH SCORE!'
: 'LEADERBOARD';
this.el.setAttribute('text', 'value', value);
}

View File

@@ -76,6 +76,8 @@ AFRAME.registerComponent('super-keyboard', {
font: this.data.font,
baseline: 'bottom',
lineHeight: 40,
shader: 'msdf',
negate: true,
value: this.data.label,
color: this.data.labelColor,
width: this.data.width,
@@ -161,7 +163,7 @@ AFRAME.registerComponent('super-keyboard', {
this.data.width !== oldData.width) {
this.label.setAttribute('text', {
value: this.data.label, color: this.data.labelColor, width: this.data.width});
this.label.object3D.position.set(0, 0.3 * w, -0.02);
this.label.object3D.position.set(0, 0.35 * w, -0.02);
}
if (this.data.width !== oldData.width ||

View File

@@ -61,7 +61,8 @@ AFRAME.registerState({
leaderboard: [],
leaderboardFetched: false,
leaderboardQualified: false,
leaderboardText: '',
leaderboardNames: '',
leaderboardScores: '',
menuActive: true, // Main menu active.
menuDifficulties: [], // List of strings of available difficulties for selected.
menuSelectedChallenge: { // Currently selected challenge in the main menu.
@@ -275,11 +276,13 @@ AFRAME.registerState({
leaderboard: (state, payload) => {
state.leaderboard.length = 0;
state.leaderboardFetched = true;
state.leaderboardText = '';
state.leaderboardNames = '';
state.leaderboardScores = '';
for (let i = 0; i < payload.scores.length; i++) {
let score = payload.scores[i];
state.leaderboard.push(score);
state.leaderboardText += `${score.username}\t${score.score}\n`;
state.leaderboardNames += `${score.username}\n`;
state.leaderboardScores += `${score.score}\n`;
}
},
@@ -292,10 +295,12 @@ AFRAME.registerState({
*/
leaderboardscoreadded: (state, payload) => {
state.leaderboard.splice(payload.index, 0, payload.scoreData);
state.leaderboardText = '';
state.leaderboardNames = '';
state.leaderboardScores = '';
for (let i = 0; i < NUM_LEADERBOARD_DISPLAY; i++) {
let score = state.leaderboard[i];
state.leaderboardText += `${score.username}\t${score.score}\n`;
state.leaderboardNames += `${score.username}\n`;
state.leaderboardScores += `${score.score}\n`;
}
},
@@ -601,6 +606,7 @@ function computeBeatsText (state) {
function clearLeaderboard (state) {
state.leaderboard.length = 0;
state.leaderboard.__dirty = true;
state.leaderboardText = '';
state.leaderboardNames = '';
state.leaderboardScores = '';
state.leaderboardFetched = false;
}

View File

@@ -1,62 +1,73 @@
<a-entity
id="leaderboard"
class="overlay"
position="2.44 1.1 -1.24"
rotation="0 -30 0"
bind__visible="leaderboardFetched && menuActive || isPaused || isVictory">
position="2 1.1 -1.27"
rotation="0 -50 0"
bind__visible="leaderboardFetched && menuActive || isPaused || isVictory"
bind__animation="enabled: isVictory"
animation="property: scale; from: 0 0 0; to: 1 1 1; easing: easeOutBack"
>
<!-- animation="property: scale; from: 0 0 0; to: 1 1 1; easing: easeOutBack" -->
<a-entity
mixin="slice"
id="leaderboardBackground"
position="0 -0.07 0"
slice9="left: 70; width: 1.5; height: 1.79; opacity: 0.9"></a-entity>
slice9="left: 70; width: 1.3; height: 1.55; opacity: 0.9"></a-entity>
<a-entity
id="leaderboardChallengeImage"
bind__menu-selected-challenge-image="selectedChallengeId: menuSelectedChallenge.id"
bind__visible="!isVictory"
geometry="primitive: plane; height: 0.12; width: 0.12"
material="shader: flat"
position="-0.44 0.63 0.001"></a-entity>
<a-entity
id="leaderboardTitle"
mixin="font"
bind__leaderboard-title="leaderboardQualified: leaderboardQualified"
text="align: center; width: 2.5; value: LEADERBOARD"
position="0 0.540 0.001"></a-entity>
position="0.04 0.540 0.001"></a-entity>
<a-entity
id="leaderboardText"
id="leaderboardNames"
mixin="font"
bind__text="value: leaderboardText"
bind__text="value: leaderboardNames"
bind__visible="!leaderboardQualified && !leaderboardEmpty"
text="baseline: top; width: 1; anchor: left; color: #00acfc; wrapCount: 20"
position="-0.6 0.35 0.001"></a-entity>
text="baseline: center; width: 0.9; anchor: left; color: #00acfc; wrapCount: 20; lineHeight: 53;"
position="-0.53 -0.16 0.001"></a-entity>
<a-entity
id="leaderboardScores"
mixin="font"
bind__text="value: leaderboardText"
bind__text="value: leaderboardScores"
bind__visible="!leaderboardQualified && !leaderboardEmpty"
text="baseline: top; align: right; width: 1; anchor: right; color: #fff; wrapCount: 20"
position="0.6 0.35 0.001"></a-entity>
text="baseline: center; align: right; width: 0.9; anchor: right; color: #fff; wrapCount: 20; lineHeight: 53;"
position="0.53 -0.16 0.001"></a-entity>
<a-entity
id="leaderboardEmpty"
mixin="font"
bind__visible="leaderboard.length === 0"
text="align: center; baseline: top; width: 1.6; value: No high scores yet, be the first!"
position="0 0.47 0.001"></a-entity>
text="align: center; color: #777; baseline: center; width: 1.6; value: No high scores. Be the first!"
position="0 0 0.001"></a-entity>
<a-entity
id="leaderboardKeyboard"
bind__super-keyboard="{% if not DEBUG_KEYBOARD %}hand: activeHand === 'left' && '#leftHand' || '#rightHand'; {% endif %}show: leaderboardQualified"
super-keyboard="label: Enter yourself to the leaderboard!; inputColor: #00acfc; labelColor: #FFF; width: 1.36; hand: {{ DEBUG_KEYBOARD and '#mouseCursor' or '#rightHand' }}; imagePath: assets/img/keyboard/; font: assets/fonts/Teko-Bold.json; align: center; model: supersaber; keyColor: #fff; injectToRaycasterObjects: false; filters: allupper; keyHoverColor: #fff; maxLength: 15"
position="0 -0.160 0.001"
super-keyboard="label: Enter yourself to the leaderboard!; inputColor: #00acfc; labelColor: #575757; width: 1.1; hand: {{ DEBUG_KEYBOARD and '#mouseCursor' or '#rightHand' }}; imagePath: assets/img/keyboard/; font: assets/fonts/Teko-Bold.json; align: center; model: supersaber; keyColor: #fff; injectToRaycasterObjects: false; filters: allupper; keyHoverColor: #fff; maxLength: 15"
position="0 -0.1 0.02"
proxy-event__change="event: superkeyboardchange; to: a-scene; as: leaderboardusername"
keyboard-raycastable="condition: leaderboardQualified">
</a-entity>
<a-entity id="leaderboardSubmit"
position="0 -0.730 0.002"
position="0 -0.59 0.002"
mixin="bigMenuButton"
bind__visible-raycastable="leaderboardQualified"
slice9="width: 1"
slice9="width: 0.8; height: 0.16"
proxy-event="event: click; to: a-scene; as: leaderboardsubmit">
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 20; value: SUBMIT HIGH SCORE" position="0 -0.07 0.01"></a-entity>
<a-entity mixin="font" text="align: center; color: #AAA; wrapCount: 26; value: SUBMIT HIGH SCORE" position="0 -0.055 0.01"></a-entity>
</a-entity>
</a-entity>