I have made a type to shoot game using HTML5, javascript and ruby on rails. Here is the link for the game http://tweetraitor.herokuapp.com/.

I wanted to make a loader for resources (sounds, images) when the game starts. Currently when the game starts the background image takes time to load and it does not look good. This loader should load all the assets those are used later in the game.

Code for the game is here. https://github.com/rohit-jain/Tweetraitor

In the current version, all the images are loaded using js in an erb file which controls the game logic. Is there a better way to do this?

Thank you...

share|improve this question
feedback

2 Answers

I have to admit I have no idea of Ruby and how it's used together with js, but here is how I'd do it with js:

window.onload = function() {
        var sources = {
            resource1: "img/sprite1.png",
            resource2: "img/sprite2.png",
            resource3: "img/sprite3.png"
        };
        loadImages(sources, initGame);  // calls initGame after *all* images have finished loading
    };

    function loadImages(sources, callback) {
        var images = {};
        var loadedImages = 0;
        var numImages = 0;
        for (var src in sources) {
            numImages++;
        }
        for (var src in sources) {
            images[src] = new Image();
            images[src].onload = function(){
                if (++loadedImages >= numImages) {
                    callback(images);
                }
            };
            images[src].src = sources[src];
        }
    } 

    function initGame(images) {
        // some code here...
    }
share|improve this answer
Thank you. That's definitely better than what i am doing. – s2n Feb 18 at 6:25
feedback

check this out: http://thinkpixellab.com/pxloader/ But its pure JS.

This preloader is used in HTML5 version of Cut the Rope game: http://www.cuttherope.ie/.

share|improve this answer
Thank you. Will check it out. – s2n Feb 18 at 6:22
feedback

Your Answer

 
or
required, but never shown
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.