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

leaderboard tweaks

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/leaderboard.js
View File

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

4
src/components/super-keyboard.js
View File

@@ -76,6 +76,8 @@ AFRAME.registerComponent('super-keyboard', {
font: this.data.font, font: this.data.font,
baseline: 'bottom', baseline: 'bottom',
lineHeight: 40, lineHeight: 40,
shader: 'msdf',
negate: true,
value: this.data.label, value: this.data.label,
color: this.data.labelColor, color: this.data.labelColor,
width: this.data.width, width: this.data.width,
@@ -161,7 +163,7 @@ AFRAME.registerComponent('super-keyboard', {
this.data.width !== oldData.width) { this.data.width !== oldData.width) {
this.label.setAttribute('text', { this.label.setAttribute('text', {
value: this.data.label, color: this.data.labelColor, width: this.data.width}); 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 || if (this.data.width !== oldData.width ||

18
src/state/index.js
View File

@@ -61,7 +61,8 @@ AFRAME.registerState({
leaderboard: [], leaderboard: [],
leaderboardFetched: false, leaderboardFetched: false,
leaderboardQualified: false, leaderboardQualified: false,
leaderboardText: '', leaderboardNames: '',
leaderboardScores: '',
menuActive: true, // Main menu active. menuActive: true, // Main menu active.
menuDifficulties: [], // List of strings of available difficulties for selected. menuDifficulties: [], // List of strings of available difficulties for selected.
menuSelectedChallenge: { // Currently selected challenge in the main menu. menuSelectedChallenge: { // Currently selected challenge in the main menu.
@@ -275,11 +276,13 @@ AFRAME.registerState({
leaderboard: (state, payload) => { leaderboard: (state, payload) => {
state.leaderboard.length = 0; state.leaderboard.length = 0;
state.leaderboardFetched = true; state.leaderboardFetched = true;
state.leaderboardText = ''; state.leaderboardNames = '';
state.leaderboardScores = '';
for (let i = 0; i < payload.scores.length; i++) { for (let i = 0; i < payload.scores.length; i++) {
let score = payload.scores[i]; let score = payload.scores[i];
state.leaderboard.push(score); 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) => { leaderboardscoreadded: (state, payload) => {
state.leaderboard.splice(payload.index, 0, payload.scoreData); state.leaderboard.splice(payload.index, 0, payload.scoreData);
state.leaderboardText = ''; state.leaderboardNames = '';
state.leaderboardScores = '';
for (let i = 0; i < NUM_LEADERBOARD_DISPLAY; i++) { for (let i = 0; i < NUM_LEADERBOARD_DISPLAY; i++) {
let score = state.leaderboard[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) { function clearLeaderboard (state) {
state.leaderboard.length = 0; state.leaderboard.length = 0;
state.leaderboard.__dirty = true; state.leaderboard.__dirty = true;
state.leaderboardText = ''; state.leaderboardNames = '';
state.leaderboardScores = '';
state.leaderboardFetched = false; state.leaderboardFetched = false;
} }

53
src/templates/leaderboard.html
View File

@@ -1,62 +1,73 @@
<a-entity <a-entity
id="leaderboard" id="leaderboard"
class="overlay" class="overlay"
position="2.44 1.1 -1.24" position="2 1.1 -1.27"
rotation="0 -30 0" rotation="0 -50 0"
bind__visible="leaderboardFetched && menuActive || isPaused || isVictory"> 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 <a-entity
mixin="slice" mixin="slice"
id="leaderboardBackground" id="leaderboardBackground"
position="0 -0.07 0" slice9="left: 70; width: 1.3; height: 1.55; opacity: 0.9"></a-entity>
slice9="left: 70; width: 1.5; height: 1.79; 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 <a-entity
id="leaderboardTitle" id="leaderboardTitle"
mixin="font" mixin="font"
bind__leaderboard-title="leaderboardQualified: leaderboardQualified" bind__leaderboard-title="leaderboardQualified: leaderboardQualified"
text="align: center; width: 2.5; value: LEADERBOARD" 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 <a-entity
id="leaderboardText" id="leaderboardNames"
mixin="font" mixin="font"
bind__text="value: leaderboardText" bind__text="value: leaderboardNames"
bind__visible="!leaderboardQualified && !leaderboardEmpty" bind__visible="!leaderboardQualified && !leaderboardEmpty"
text="baseline: top; width: 1; anchor: left; color: #00acfc; wrapCount: 20" text="baseline: center; width: 0.9; anchor: left; color: #00acfc; wrapCount: 20; lineHeight: 53;"
position="-0.6 0.35 0.001"></a-entity> position="-0.53 -0.16 0.001"></a-entity>
<a-entity <a-entity
id="leaderboardScores" id="leaderboardScores"
mixin="font" mixin="font"
bind__text="value: leaderboardText" bind__text="value: leaderboardScores"
bind__visible="!leaderboardQualified && !leaderboardEmpty" bind__visible="!leaderboardQualified && !leaderboardEmpty"
text="baseline: top; align: right; width: 1; anchor: right; color: #fff; wrapCount: 20" text="baseline: center; align: right; width: 0.9; anchor: right; color: #fff; wrapCount: 20; lineHeight: 53;"
position="0.6 0.35 0.001"></a-entity> position="0.53 -0.16 0.001"></a-entity>
<a-entity <a-entity
id="leaderboardEmpty" id="leaderboardEmpty"
mixin="font" mixin="font"
bind__visible="leaderboard.length === 0" bind__visible="leaderboard.length === 0"
text="align: center; baseline: top; width: 1.6; value: No high scores yet, be the first!" text="align: center; color: #777; baseline: center; width: 1.6; value: No high scores. Be the first!"
position="0 0.47 0.001"></a-entity> position="0 0 0.001"></a-entity>
<a-entity <a-entity
id="leaderboardKeyboard" id="leaderboardKeyboard"
bind__super-keyboard="{% if not DEBUG_KEYBOARD %}hand: activeHand === 'left' && '#leftHand' || '#rightHand'; {% endif %}show: leaderboardQualified" 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" 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.160 0.001" position="0 -0.1 0.02"
proxy-event__change="event: superkeyboardchange; to: a-scene; as: leaderboardusername" proxy-event__change="event: superkeyboardchange; to: a-scene; as: leaderboardusername"
keyboard-raycastable="condition: leaderboardQualified"> keyboard-raycastable="condition: leaderboardQualified">
</a-entity> </a-entity>
<a-entity id="leaderboardSubmit" <a-entity id="leaderboardSubmit"
position="0 -0.730 0.002" position="0 -0.59 0.002"
mixin="bigMenuButton" mixin="bigMenuButton"
bind__visible-raycastable="leaderboardQualified" bind__visible-raycastable="leaderboardQualified"
slice9="width: 1" slice9="width: 0.8; height: 0.16"
proxy-event="event: click; to: a-scene; as: leaderboardsubmit"> 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>
</a-entity> </a-entity>