【Cocos2d-JS】cc.loader の拡張

リソースデータAに自前のデータBを依存していて、
データAをプリロード時にデータBも一緒にプリロードしたいです。
データAをインスタンス化してからデータBをプリロードしてもいいですが、
処理が複雑になってしまうです。

あるいは、同時時複数リソースを使用するデータが、
毎回パスを構築してプリロードするのもコード量が増える。

どう対処するかと
cc.loaderのソースとにらめっこしたら
cc.loader.register(...) を発覚しました。

cc.loader.register

cc.loader.registerを使って特定の拡張子でカスタムローダーを登録できます

cc.loader.register(['ext'], {
  load: function (realUrl, url, resource, cb) {
    /*....*/
    cb(); // ロードが終わったらコールバックを実行します
  }
});

spine データには json / atlas / png 3つのファイルが必要です。
毎回この3つのファイルを配列して cc.loader.load してもいいですが、

.spine 拡張子を定義して一気にこの3つのファイルをロードする

cc.loader.register(['spine'], {
  load: function (realUrl, url, resource, cb) {
    let urls = [];
    urls.push(url.replace('.spine', '.atlas'));  // atlas
    urls.push(url.replace('.spine', '.png'));  // png
    urls.push(url.replace('.spine', '.json'));  // json
    cc.loader.load(urls , (error, datas)=>{
      // datas を使ってさらに依存しているデータを読み込む
      cb();
    });
  }
});

使い方

cc.loader.load("res/assets/model.spine");

このように *.spine 拡張子をロードする場合、
登録したカスタムローダーが実行され、
必要なデータがロードされます。