DEV Community

GiandoDev
GiandoDev

Posted on

1 3

Monster Game Vanilla JS Accademy

Monster-Game

In this project I am going to play around method in order to shuffling an array (The monsters).
For this I use:

/**
 * Randomly shuffle an array
 * https://stackoverflow.com/a/2450976/1293256
 * @param  {Array} array The array to shuffle
 * @return {String}      The first item in the shuffled array
 */
var shuffle = function (array) {

    var currentIndex = array.length;
    var temporaryValue, randomIndex;

    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
        // Pick a remaining element...
        randomIndex = Math.floor(Math.random() * currentIndex);
        currentIndex -= 1;

        // And swap it with the current element.
        temporaryValue = array[currentIndex];
        array[currentIndex] = array[randomIndex];
        array[randomIndex] = temporaryValue;
    }

    return array;

};

Don't forget the accessibility and add the alt text to the images. I use the Element.closest() method to get the closest parent up the DOM tree.
I use the simple math (++) to help me in the win or lose function.

๐Ÿฅณ DEMO ๐Ÿฅณ [https://giandomenicoriceputi.github.io/Monster-Game/].

Monster-Game

In this project I am going to play around method in order to shuffling an array (The monsters).

For this I use:

/**
 * Randomly shuffle an array
 * https://stackoverflow.com/a/2450976/1293256
 * @param  {Array} array The array to shuffle
 * @return {String}      The first item in the shuffled array
 */
var shuffle = function (array) {

    var currentIndex = array.length;
    var temporaryValue, randomIndex;

    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
        // Pick a remaining element...
        randomIndex = Math.floor(Math.random() * currentIndex);
        currentIndex -= 1;

        // And swap it with the current element.
        temporaryValue = array[currentIndex];
        array[currentIndex] = array[randomIndex];
        array[randomIndex] = temporaryValue;
    }

    return array;

};
Enter fullscreen mode Exit fullscreen mode

Don't forget the accessibility and add the alt text to the images.
I use the Element.closest() method to get the closest parent up the DOM tree. I use the simple math (++) to help me in the win or lose function.

Top comments (3)

Collapse
 
nickytonline profile image
Nick Taylor โ€ข

Thanks for the post! Consider adding a paragraph or two explaining the game. It will help when people are searching articles.

Also, you can use the liquid tag {%github https://github.com/GiandomenicoRiceputi/Monster-Game %} to embed your repository link. It will look like this

Monster-Game

In this project I am going to play around method in order to shuffling an array (The monsters).
For this I use:

/**
 * Randomly shuffle an array
 * https://stackoverflow.com/a/2450976/1293256
 * @param  {Array} array The array to shuffle
 * @return {String}      The first item in the shuffled array
 */
var shuffle = function (array) {

    var currentIndex = array.length;
    var temporaryValue, randomIndex;

    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
        // Pick a remaining element...
        randomIndex = Math.floor(Math.random() * currentIndex);
        currentIndex -= 1;

        // And swap it with the current element.
        temporaryValue = array[currentIndex];
        array[currentIndex] = array[randomIndex];
        array[randomIndex] = temporaryValue;
    }

    return array;

};

Don't forget the accessibility and add the alt text to the images. I use the Element.closest() method to get the closest parent up the DOM tree.
I use the simple math (++) to help me in the win or lose function.

Collapse
 
saurabhdaware profile image
Saurabh Daware ๐ŸŒป โ€ข

yes and a readme for the github would be a great addition :)

Collapse
 
saurabhdaware profile image
Saurabh Daware ๐ŸŒป โ€ข

Hey this is so much fun! thank you for sharing this ๐ŸŒป๐Ÿฆ„

nextjs tutorial video

Youtube Tutorial Series ๐Ÿ“บ

So you built a Next.js app, but you need a clear view of the entire operation flow to be able to identify performance bottlenecks before you launch. But how do you get started? Get the essentials on tracing for Next.js from @nikolovlazar in this video series ๐Ÿ‘€

Watch the Youtube series

๐Ÿ‘‹ Kindness is contagious

Please leave a โค๏ธ or a friendly comment on this post if you found it helpful!

Okay