|
|
|
|
@ -1,8 +1,66 @@ |
|
|
|
|
# Triangles.fun |
|
|
|
|
|
|
|
|
|
A colorful, relaxing HTML5 puzzle game. Play at <https://triangles.fun> |
|
|
|
|
|
|
|
|
|
Consider donating on |
|
|
|
|
[Buy Me a Coffee](https://www.buymeacoffee.com/peterbabic) to sustain |
|
|
|
|
domain costs. |
|
|
|
|
|
|
|
|
|
 |
|
|
|
|
|
|
|
|
|
## Technologies used |
|
|
|
|
|
|
|
|
|
- [Svelte](https://svelte.dev/) |
|
|
|
|
- [TailwindCSS](https://tailwindcss.com/) |
|
|
|
|
- [PWA](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps) |
|
|
|
|
- [NORD theme](https://www.nordtheme.com/docs/colors-and-palettes) |
|
|
|
|
|
|
|
|
|
## Inspiration |
|
|
|
|
|
|
|
|
|
Thanks for my girlfriend Sara for showing me the IRL version, she played it |
|
|
|
|
when she was a little kid. The photo of IRL triangles for the interested in |
|
|
|
|
in my humble blog hosted on this domain (currently running Sapper, so no |
|
|
|
|
Tailwind there yet). |
|
|
|
|
|
|
|
|
|
Thanks also to Carlos Ferreira for the https://squares.fun for showing me |
|
|
|
|
this tech stack is possible and works nicely together. Since I have found |
|
|
|
|
Squares, I wanted to do such project. Now it is a reality. Go play a |
|
|
|
|
version Carlos made too it, it's a lot of fun. |
|
|
|
|
|
|
|
|
|
## Development |
|
|
|
|
|
|
|
|
|
You can clone this repo and run the code yourself. Standard Svelte run |
|
|
|
|
commands apply. |
|
|
|
|
|
|
|
|
|
```bash |
|
|
|
|
npm run build && npm run start |
|
|
|
|
## OR |
|
|
|
|
npm run dev |
|
|
|
|
``` |
|
|
|
|
|
|
|
|
|
Now navigate to <https://localhost:5000> |
|
|
|
|
|
|
|
|
|
## Testing |
|
|
|
|
|
|
|
|
|
A test run can be invoked via Cypress. |
|
|
|
|
|
|
|
|
|
```bash |
|
|
|
|
npx cypress run |
|
|
|
|
# OR |
|
|
|
|
npx cypress open |
|
|
|
|
``` |
|
|
|
|
|
|
|
|
|
The game must be running in a different terminal before that. It requires |
|
|
|
|
the server running beforehand, you can utilize |
|
|
|
|
[start-server-and-test](https://www.npmjs.com/package/start-server-and-test) |
|
|
|
|
to overcome this. Practices vary. |
|
|
|
|
|
|
|
|
|
Please note that there is a problem of clicking to multiple elements, that |
|
|
|
|
I did not find a solution to yet, that happes during test. |
|
|
|
|
|
|
|
|
|
## TODO |
|
|
|
|
|
|
|
|
|
- [x] add gray shades |
|
|
|
|
- [x] ad |
|
|
|
|
- [x] update icons |
|
|
|
|
- [x] manage UI buttons |
|
|
|
|
- [x] fix undo missing animation |
|
|
|
|
@ -10,3 +68,7 @@ |
|
|
|
|
- [x] add about page |
|
|
|
|
- [x] fix victory / gameover modal |
|
|
|
|
- [x] handle U, R and A keypresses |
|
|
|
|
|
|
|
|
|
## License |
|
|
|
|
|
|
|
|
|
All source code is licensed under MIT. |
|
|
|
|
|
