This game is so addictive - it tests your speed, logic and skill - it’s a race against time….
I built this from scratch in 10 days using vanilla JS and CSS. It's really fun to play. Below is a demo and instructions. See if you can finish with just one marble remaining in the centre of the board - there is a 1,000 point bonus if you can do it! 😄
⚡ Solitaire ⚡
How to Play 👉
- Aim of the game
Take away as many marbles as possible in the 100 seconds countdown.
- How to take away marbles
Select a marble by clicking on it so it turns blue, then place it over an adjacent marble into an empty space. The marble you move over will be taken. To deselect a marble, click on it again so it turns from blue to gold. See the demo above ⬆
Each marble removed updates the score by the total marbles taken multiplied by the total seconds remaining. Eg, 20 marbles taken in 40 seconds scores 800. Finish the game at any time to submit your score to the Leader Board.
- Bonus points
If you finish with just one marble remaining, which is 'Solitaire', you get a bonus 500 points, and if your last marble finishes in the centre of the board the bonus is 1,000 points!
- Completely responsive and mobile friendly
- Includes Help section and Leader board
- Scores are saved on the back-end with Google Firebase
I have to mention this thing is really making me hungry after yesterday's earthquake.
There's even sound? I N V E S T
All jokes aside, could you update the code so that when there's no move to make, then to immediately stop?
@rjlevy i think that would greatly improve the game, since it would stop the game immediately, and since your score is based on time, it would present a more accurate kind of score
you could also make some sort of penalty or something if there are no moves available and more than one marble left
Without it Github shows percentages for HTML, JS and CSS for this kind of repo.
More details here: https://github.com/github/linguist#vendored-code
This game doesn't use drag and drop. Instead you have to click on any marble so it turns blue then place it over an adjacent marble into an empty space. The marble you move over will be taken. If you need to deselect a marble, click on it again so it turns from blue to gold.
Please see full instructions in the readme file or in the Help section of the game. Also, there is an animated GIF showing a demo of the game above ⬆
Let me know how you get on! 😀
@rjlevy I dont know if Im just being dumb, but in the beginning I click new game then the board comes up and I click one of the marbles next to the middle were there is no marble, and the marble turns blue, but nothing happens when I click on anything else after that e.x the middle were there is no marbles, what do I do?
Hi @billehb, no you're not being dumb. You have chosen a marble which can't be moved. To move a marble you need to choose one which has a neighbour and an empty space on the other side of the neighbour. For example, below you can move number 2 over it's neighbour, number 3, into the empty space.
(1) (2) (3) (_) (5)
Have you seen the animated demo above? That might help too :D
so here are a few things i learned:
never make things symetrical in this game
you must have a quick reaction
i am bad at this game
Hi @AmazingMech2418, thanks a lot for your help - I think it's much clearer for me now so I made a simple example of what you suggested...
Then I made this HTML repl: https://repl.it/@rjlevy/html-unsplash-search-without-api-keys which can be tested here.
The HTML repl fetches images from Unsplash by sending a request to this Express endpoint using the search input as the query, which is 'trees' in this example: https://node-api-keys.rjlevy.repl.co/json?s=trees
This has been a great learning experience, so thanks again!