Description: Right now, player can click letters using their mouse.

Desired behaviour: Player can use keyboard to choose letters.

Nice to have's:

• Alert users when they click a letter that was already clicked
• Suggest and implement a keyboard combination that clicking it reveals the answer (e.g: Shift + R)

Now that we're deploying to netlify 🎉 we can add user authentication and use netlify serverless functions to serve the user data.

This will allow us to:

• Prevent a user from getting the same film a second time
• Persist user wins and losses
• Allow user to pause a game and continue later

Before we start storing game data, we need to decide which fields would be useful and in which structure to store them.

Any suggestions are welcome, I'm still trying to figure out what data might be useful, so feel free to suggest

When you click the poster hint, a small square of the poster is revealed.

If the revealed section is on the bottom of the poster, the user won't be able to see it.

We need to probably remove the hint banner so it doesn't hide the poster OR assure that the revealed poster section is not in the bottom section of the poster.

While both solutions solve the problem, the first one seems easier to maintain. I think the latter feels like adding unnecessary logic that will probably be confusing for people looking at the code.

Happy to discuss other solutions, if someone wants to suggest

Purpose

We currently don't save the user's previous attempts anywhere. This means that a user can get the same move more than once.

As a long term solution, we should:

• Add ability to login and authentication (netlify identity seems to be a nice direction, but it's totally up to whoever picks this up),
• Save the user's previous attempts in a db, and
• Prevent the user from getting the same movie a second time

As a short term solution, we can do this using local storage: #19

In order to use Netlify authentication feature at some point (see issue #20), we should deploy to netlify rather than using gh-pages.

Another cool feature: seeing a preview of PRs and having these available for future reference.

Purpose

We currently don't save the user's previous attempts anywhere. This means that a user can get the same move more than once.

As a short term solution, we should:

• Save the user's previous attempts in local storage, and
• Prevent the user from getting the same movie a second time

Purpose

Improve how the game looks.

This is how the game currently look:

There are a lot of ways to improve this, and it's really up to whoever takes this to make these decisions.

I'm happy to add a list of things that could be improved (e.g color theme, letters layout), but any change for the better would be greatly appreciated

Description:
The api gives us the film poster, and it would be nice to add the ability to get a hint - and reveal a section of the film poster.

Here's a section of the pulp fiction poster:

Granted, if the film title is somehow displayed - it would be a lot more than a hint, but this is something to think about and maybe resolve as part 2 of this ticket.

Purpose

Right now, the remaining guesses are indicated by hearts:

To make the game more like hangman, we would like the guesses indicator to be a drawing of something cinematic. For example, a clapper board, a director's chair. The idea is to have the drawing reveal itself using css/ svg.

As you make your guesses, lines are added to the guesses section to draw something. Here are a few drawings for inspiration. Any other ideas are welcome

Description:
Currently, all guessed letters are displayed identically the same (as seen below).

It would be nice to mark the letters that are actually in the phrase in a different colour.

Purpose

We want to allow the user to get different types of hints.

Description

A fun one could be revealing the release year of the film, which should be available on the API.
I think this should cost 3 guesses (but happy to get someone else's opinion as this is fairly arbitrary 😂)

This would require:

• adding a button Reveal release year to the game
• on click, revealing the release year of the film and updating the counter

The poster hint functionality should be a good reference as it's very similar.

Just a thought, since state machines puts all the logic in one place, it might work nicely here.

Possible states:

• Idle
• choose genre
• Fetch film
• Game ongoing
• Win
• Loss
• config

Purpose

Improve Hint feature

Current behaviour:

When you click the hint button, you get a part of the movie poster displayed in the UI. If the movie poster hint isn't helpful, we should allow the user to get another movie poster for 1 guess.

First suggestion:

So, if getting the hint (movie poster) "costs" the user 2 guesses,
then getting another movie poster should "cost" one guess.

Once the user requested another hint, we need to randomly select and display another section of the movie poster.

Second suggestion:

Right now the movie poster hint always show the top left corner of the poster. We should randomally choose a section of the poster to improve the users chances

• Change hint location so it doesn't always get the top left corner
• Add ability to get a second hint

Feel free to create a PR for either of these suggestions, or two PR for each (you don't have to do both).

We've disabled snapshot testing for the purpose of adding a new style to the project. In order to keep the issues and PRs small in scope, we've removed the snapshot testing from the project temporarily.

We should add them back to CI at some point. This is a reminder TODO issues

Purpose

Improve UX by adding some description/s about the game and how to play.

The problem

This is the page you currently get when opening the game for the first time:

This might be self explanatory, but I would love it if we could add a little guidance to the user. Maybe things like how to play the game, and/or where the data is coming from, how many tries do you get, what does "Hint" do, etc.

Suggested solutions

This can be resolved in any number of ways, and I'll leave it up to whoever picks it up.

Some solutions might be adding a description paragraph before the game starts, a 'Help' tab with some details about the game, and/or i icons around the ui that show explanations on hover.

Whoever picks this up can really approach this how they like, but at a minimum - a paragraph with instructions on how to play the game should be enough.

Bug

When you win a game, ideally, we want the page to indicate that. We had this functionality and lost it a long the way.

A few possible solutions:

• Show movie poster
• Show movie description
• Disable all letters
• Add a 'You won! 🎉' message

Purpose

These next two display issues make the game harder to play on mobile:

(1) allow for movie title to wrap when it's too long for the container
(2) display poster and description below one another on mobile (rather than next to each other, which looks good on desktop)

(1)

(2)

As every single web interface today this one also deserves a dark theme.

If you want, I can implemente that too.

It would be nice to have a config menu where you can set the game difficulty (number of lives), and in the future many other configurations, like dark mode for example.

I can solve this one if you want the feature

Purpose

Add testing

Description

We currently have formatting, linting and snapshot testing, but no proper testing for the logic and functionality. Let's add tests