Math Sprint Game with Javascript

 

Features:

countdown to show game

the math equations generated with Math()

seperate wrong and correct equations and added boolean 

compare the equationArray with PlayerGuessArray 

store bestscore to localStorage and compare when start next round again

CODE Github

DEMO

HTML


four radio input in the e form.

Bestscore show in the span.

when submit the selection,go to countdown page.


All the math equations created in the item-container with JS.

And the right ang wrong selection with onclick event.


After finish ,go to score page.

the times calculated within JS.

When click theh playAgain,go back to splash page but the best score will be strored in the localStorage.

CSS

basic center the container



center header















Javascript


select DOM


When click the input,change the style of selected-label.

click start game button,load the startTimer interval.

reset all the time display .timePlay accumulates.


if array lengths are same,the countdown stop and check if need penaltyTime. 
After getting finalTime,go to sscoresToDOM()

the time transform to one decimal. And display in scorePage.then go to updateBestScore() showScorePage()

loop the bestscore array and save the bigger one.

And store in localStorage

countdown show 3.2.1.go!with setInterval().

create equations with DOM and class.

then go to equtionsToDOM to append to html.


create equations with shuffle js. 


select question amount from input radio value

Popular posts from this blog

Fancyapps — easily build overlay windows with carousel

Thoughts about Progressive Web App

Meet Mantine: A TS-Based Open-Source React Components Library