My first javascript game ever

Beat Tibo – my first Javascript Game.

Type: Private/Free
Skills: JavaScript, HTML, CSS</p>

Year: 2010

So yeah as Beat Tibo is my first JavaScript game ever it is pretty noobish with all the confirm() and prompt() and especially the setTimeout() that might seem a bit spammy but hey, first javascript game ever.

Here's the code for you to understand, it is pretty simple:

<script>
    function story(){
        var display = document.getElementById("display");
        var button = document.getElementById("button");
        var ready = confirm("Are you ready mah' nigg' ?");
        var age = prompt("How old are you ? (18+ game bro')");
        if ((ready === true) &amp; (age >= 18)){
            button.style.visibility="hidden";
            display.innerHTML = "<span style="color: grey;">1 | </span>All fine dude! <span style="color: #deb887;">Ready &amp; "+age+"</span>.";
            setTimeout(function(){
                display.innerHTML = "<span style="color: grey;">1 | </span>Now read <span style="color: #deb887;">carefully</span>:";
                setTimeout(function(){
                    display.innerHTML = "<span style="color: grey;">1 | </span><span style="color: #deb887;">Tibo</span> was hanging out at the bus stop.<span style="color: grey;">2 | </span>There was a sale on and he needed new shoes.<span style="color: grey;">3 | </span>You've never really liked <span style="color: #deb887;">Tibo</span>.<span style="color: grey;">4 | </span>You walk up to him..";
                    setTimeout(function(){
                        display.innerHTML = "<span style="color: grey;">1 | </span><span style="color: #deb887;">Tibo</span> glares at you...";
                        setTimeout(function(){
                            var userAnswer = prompt("Are you feeling lucky, punk?");
                            if(userAnswer === "yes"){
                                display.innerHTML = "<span style="color: grey;">1 | </span><span style="color: #deb887;">Tibo</span> hits you very hard.<span style="color: grey;">2 | </span>It's <span style="color: #deb887;">Tibo</span> and you're you! Of course <span style="color: #deb887;">Tibo</span> wins!";
                            } else {
                                display.innerHTML = "<span style="color: grey;">1 | </span>You did not say "yes".<span style="color: grey;">2 | </span>Good choice!<span style="color: grey;">3 | </span>You are a winner of not getting beaten up by <span style="color: #deb887;">Tibo</span>.";
                                }
                            setTimeout(function(){
                                var feedback = prompt("Please rate my game from 1-10. Where 10 is the highest rating.");
                                if(feedback > 8){
                                    display.innerHTML = "<span style="color: grey;">1 | </span>This is just the beginning of my game empire.<span style="color: grey;">2 | </span><a href="http://creativemate.net/" target="_blank">Stay tuned</a> for more!";
                                    button.style.visibility="visible";
                                }else{
                                    display.innerHTML = "<span style="color: grey;">1 | </span>What?!<span style="color: grey;">2 | </span>The nerve!<span style="color: grey;">3 | </span>Just you wait!<span style="color: grey;">4 | </span>Ok ok ok ok ok I got it..<span style="color: grey;">5 | </span>I'll train harder to come up with some real shit.<span style="color: grey;">6 | </span>So you should definitely <a href="http://creativemate.net/" target="_blank">stay tuned</a>!";
                                    button.style.visibility="visible";
                                }
                            },5000);
                        },2000);
                    },10000);
                },3000);
            },3000);
        }else{
            display.innerHTML = "<span style="color: grey;">1 | </span>Guy something is wrong here.<span style="color: grey;">2 | </span><span style="color: #deb887;">Ready = "+ready+"</span> and <span style="color: #deb887;">Age = "+age+"</span>?<span style="color: grey;">3 | </span>Ok man. You can't play. So get out of here creep!";
        }
    };
</script>

 

Yah so the code is basically like: question - if true - text - wait - then next question - if else - other text - wait - other question.

you can check out the html and css on page. At least the design rocks ;)

Ok enough talking go to the game.

4 Great Posts

Comments