Load cocos2d.js file dynamically

cocos2d-x JavaScript
#1

Hi,

I want to load the cocos2d.js file in my index.html dynamically after the facebook javascript api has finished loading.

I have tried the following, but it doesn’t work:

window.fbAsyncInit = function() {
        FB.init({
            appId      : appId, // App ID
            channelUrl : 'myUrl', // Channel Url
            status     : false, // check login status
            cookie     : true, // enable cookies to allow the server to access the session
            xfbml      : true,  // parse XFBML
            oauth      : true
        });

        loadCocos2d();

    };
// Load the SDK asynchronously
(function(d){
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
}(document));

function loadCocos2d()
{
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.src = "cocos2d.js";
    head.appendChild(script);
}

I have no idea, how I can do this.
Did anybody has a solution for this issue? I want that the game starts loading, after the facebook api is ready.

Thank you very much :slight_smile:

With best regards, Matthias

#2

Hi, @Matthias

It’s easy to make it work, in cocos2d.js file, you can find this section of code:

var fn;
window.addEventListener('DOMContentLoaded', fn = function() {
    this.removeEventListener('DOMContentLoaded', fn, false);
    //first load engine file if specified
    var s = d.createElement('script');
    /*********Delete this section if you have packed all files into one*******/
    if (c.SingleEngineFile && !c.engineDir) {
        s.src = c.SingleEngineFile;
    }
    else if (c.engineDir && !c.SingleEngineFile) {
        s.src = c.engineDir + 'jsloader.js';
    }
    else {
        alert('You must specify either the single engine file OR the engine directory in "cocos2d.js"');
    }
    /*********Delete this section if you have packed all files into one*******/

        //s.src = 'Packed_Release_File.js'; //IMPORTANT: Un-comment this line if you have packed all files into one

    document.ccConfig = c;
    s.id = 'cocos2d-html5';
    d.body.appendChild(s);
});

Simply remove the DOMContentLoaded event listener then it will work, but you should make sure the dom structure has been loaded in your code.

//first load engine file if specified
var s = d.createElement('script');
/*********Delete this section if you have packed all files into one*******/
if (c.SingleEngineFile && !c.engineDir) {
    s.src = c.SingleEngineFile;
}
else if (c.engineDir && !c.SingleEngineFile) {
    s.src = c.engineDir + 'jsloader.js';
}
else {
    alert('You must specify either the single engine file OR the engine directory in "cocos2d.js"');
}
/*********Delete this section if you have packed all files into one*******/

    //s.src = 'Packed_Release_File.js'; //IMPORTANT: Un-comment this line if you have packed all files into one

document.ccConfig = c;
s.id = 'cocos2d-html5';
d.body.appendChild(s);

Huabin

#3

Hi Huabin,

Thank you very much, it works :slight_smile:
Have a nice day.

Best Regards, Matthias