hamidbyte / guess-the-word-javascript-game

Try it out https://whatword.netlify.app/

Hamid

👋 Hi there, I'm Hamid
🖤 I love JavaScript and Python
📊 I'm Full Stack Developer
👀️ I'm looking to collaborate on open source.
🌎 You can reach me on LinkedIn.

This is my life's motto:

function wtfjs() {
    /* eslint no-console: "error" */
    console.log("b" + "a" + + "a" + "a")
    // "baNaNa"
}

📞 Phone Number: 127.0.0.1
🏠 Address: localhost:3000

guess-the-word-javascript-game's Issues

Hangman images improvement

In a single game same word should not repeat

As long as user did not refresh the page, user should not be able to see the same random word again.
Store the doneWords in an array and check if the random word is in the array or while acquiring random number it should not consider doneWords from the dataset.
But if the whole dataset is completed then reset the doneWords and start random from entire dataset again.

Add github repo link to index.html footer

• Update footer or other section with Github URL
• Modify text: Built with love in Germany, Developed by Hamid

Using shortcuts also trigger click event in virtual keyboard

Physical keyboard shortcuts should not add event listener on virtual keyboard.
Virtual keyboard should only work if letters are pressed without any other key.

Store highestScore / bestScore in a game and display

At the moment it should be store in one game along with current game score.

• currentScore will be the totalScore before one loses the game then it will be reset.
• highestScore or bestScore will remain there until the website is refreshed.

Best will be to save highestScore in cloud.
When user achieve highestScore, there must be a popup congratulating for achievement.
We can create another ticket for it.

This ticket is dependent on another issue/ticket in which user must be asked to enter a name.

Use better random algorithm

Consider these issues in mind
https://stackoverflow.com/questions/12673691/true-or-better-random-numbers-with-javascript
https://stackoverflow.com/questions/424292/seedable-javascript-random-number-generator

Upper letters are not getting recognized using keyboard.

Convert "Word" to uppercase before using it in the logic.
Same for input values, i.e. UI keyboard buttons and keydown event listeners, and others if used any.
Be consistent in entire application.

Responsive for small devices

UI is not well fit on small devices
e.g. Android/iOS phones

Keyboard takes bit of time to load

Maybe using one of this or think about it and come up with your own solution.
Also loading gif would be great until website loads.

addEventListener('DOMContentLoaded', (event) => {});
onDOMContentLoaded = (event) => { };

Cleanup unwanted libraries

For example plain-modal.min.js is not being used.

Improve gameOver popup UI

Display "Hint not available" message when there is no hint in the data.

Instead of removing heart, display heart with cross

When user makes a mistake don't remove the heart.
Change the heart with crossed heart icon.

Update the dataset

Hints are missing in most of the data

Adding clock and calculate the time spent on a round to solve

• Add timer / clock
• Calculate how much time user took to solve a word

Spaces and hyphens in the WordList should be placed in display

Spaces and hyphens in the WordList of datasets should be displayed.
Therefore also update the datasets - include spaces and hyphens in data.words

Code cleanup refactoring

Datasets might consist of duplicate ids

In a test, category was shown as "Animal" but when the game finished, it said the word as "Apple".
It could be related to

• duplicate entries in datasets
• selecting more than one word and displaying first in the category element while other used in the logic.

Test this issue.

Increase health and new score method

• Increase the Health and change hangman animation accordingly.

e.g. I recommend it should be at least 7

• Score should be calculated based on how much health is used.

e.g. 3 basic score for winning a round + remaining health

Also update index.html with the information

ask for user's name

Ask for user's name to store their highest scores in the database along their name.

There must be three options:

1. Enter name - run validator and trim on it
2. Random Name - app should generate creative and funny names
3. Guest / Anonymous - in this case highest score will not be post to database

Sound effects on correct guess, wrong guess, game start, game over

Take an idea from this repo
https://github.com/vdelariva/Word-Guess-Game

calculate score a new way

Score should be calculated based on how much health is used.
e.g. 3 basic score for winning a round + remaining health

Show current round score on popup
Show 3 + remaining health = current score
Also update index.html with the information

Using keyboard event listener hit key for wrong letter again it keeps reducing the health

Using keyboard event listener for writing letters:
If you type correct guessed letter again and again it won't decrease health.
But if you type wrong letter and then you keep pressing same wrong letter again it keeps reducing the health. Please fix it.

three free hints, win more by winning without using health

3 Free Hints / More can be win by winning without using Health:

• User will be given 3 free Hints in the beginning of every game.
• User can win +1 Hint if they win a round without using any Health.
• Display a message when user wins a Hint.
• Display Hints as notification icon badge with total number of Hints.

Continue playing despite wrong guess or give-up without losing scores by using Lives

User can continue playing despite wrong guess or give-up without losing scores by using Lives

Add Lives feature:

• There must be at least 1 life in the beginning of every game.
• User can win +1 lives if they win 3 or 5 consecutive rounds.
• Display a message when user wins a life
• Display lives as notification icon badge with total number of lives