dennis/codewanderer
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add ov score

Browse source
This commit is contained in:
Dennis Schoepf 2021-08-07 22:44:21 +02:00
parent 2be130aedc
commit 63896d10c8
7 changed files with 55 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

5
index.html
View file

@ -7,6 +7,11 @@
</head>
<body>
<div class="ui">
<div id="ov-score">
<div id="ov-score-found">0</div>
<div id="ov-score-divider">/</div>
<div id="ov-score-total">6</div>
</div>
<div id="score">
<div id="score-found">0</div>
<div id="score-divider">/</div>

2
main.ts
View file

@ -9,6 +9,7 @@ import { Companion, CompanionState } from './src/ui/companion';
import { InfoMessage } from './src/ui/info';
import { Intro } from './src/ui/intro';
import { Score } from './src/ui/score';
import { OvScore } from './src/ui/ov-score';
const sketch = (s: p5) => {
// Scenes
@ -23,6 +24,7 @@ const sketch = (s: p5) => {
new Companion();
new InfoMessage();
new Score();
new OvScore();
overviewScene = new OverviewScene();
detailScene = new DetailScene();

1
package.json
View file

@ -5,7 +5,6 @@
"repository": "git@github.com:dennisschoepf/codewanderer.git",
"author": "Dennis Schoepf <dennis@schoepf.co>",
"license": "MIT",
"type": "module",
"scripts": {
"dev": "parcel index.html",
"build": "parcel build index.html",

4
src/store.ts
View file

@ -23,13 +23,15 @@ export interface State {
finishedGame: boolean;
revealablesFinished: number;
showScore: boolean;
showOvScore: boolean;
uid: string;
}
const store = create<State>((set) => ({
uid: null,
showScore: false,
currentIntroStep: 1,
showOvScore: true,
currentIntroStep: 0,
revealablesFinished: 0,
currentScene: Scenes.OVERVIEW,
currentSubproject: null,

1
src/ui/intro.ts
View file

@ -173,6 +173,7 @@ export class Intro {
if (currentStep === 6) {
this.sendGeneralQuestionAnswers();
window.scrollTo(0);
}
if (currentStep === 5) {

41
src/ui/ov-score.ts Normal file
View file

@ -0,0 +1,41 @@
import store from '../store';
export class OvScore {
showScore: boolean;
scoreFound: number;
scoreTotal: number;
scoreRef: HTMLElement;
scoreFoundRef: HTMLElement;
scoreTotalRef: HTMLElement;
constructor() {
this.scoreRef = document.querySelector('#ov-score');
this.scoreFoundRef = document.querySelector('#ov-score-found');
this.scoreTotalRef = document.querySelector('#ov-score-total');
this.scoreFound = 0;
this.scoreTotal = 3;
this.scoreFoundRef.innerHTML = this.scoreFound.toString();
this.scoreTotalRef.innerHTML = this.scoreTotal.toString();
if (store.getState().showOvScore) {
this.scoreRef.style.display = 'flex';
}
store.subscribe((state) => {
if (state.showOvScore) {
this.scoreRef.style.display = 'flex';
} else {
this.scoreRef.style.display = 'none';
}
this.scoreFound = state.finishedSubProjects.length;
this.scoreFoundRef.innerHTML = this.scoreFound.toString();
this.scoreTotalRef.innerHTML = this.scoreTotal.toString();
});
}
}

3
styles.scss
View file

@ -200,6 +200,7 @@ textarea {
}
}
#ov-score,
#score {
display: none;
position: absolute;
@ -208,11 +209,13 @@ textarea {
color: #b0b7bf;
font-size: 32px;
#ov-score-found,
#score-found {
font-size: 60px;
font-weight: bold;
}
#ov-score-divider,
#score-divider {
font-size: 42px;
align-self: flex-end;