TJSLoader.ts

namespace TJSLoader {

  const TYPE_ATLAS_JSON = 'atlasJSONArray';
  const TYPE_TEXTURE = 'image';

  export class Loader {
    static instance: Loader = null;
    // for atlases: { key: aKey, type: TYPE_ATLAS_JSON, img: imgFile, json: aJSONFile }
    // for images textures: { key: aKey, type: TYPE_IMAGE, img: imgFile }
    private loadData: any[] = [];

    private total_items = 0;
    private curr_item = 0;

    // {name, data}
    private cache: any[] = [];

    onLoadCompleteSignal = new Phaser.Signal();

    constructor() {
      if (Loader.instance) {
        LogMng.error('Loader class already created!');
      }
    }

    static getInstance(): Loader {
      if (!Loader.instance)
        Loader.instance = new Loader();
      return Loader.instance;
    }

    atlasJSONArray(aKey: string, imgFile: string, aJSONFile: string) {
      this.loadData.push({ type: TYPE_ATLAS_JSON, key: aKey, img: imgFile, json: aJSONFile });
    }

    texture(aKey: string, imgFile: string) {
      this.loadData.push({ type: TYPE_TEXTURE, key: aKey, img: imgFile });
    }

    start() {
      this.curr_item = 0;
      this.total_items = this.loadData.length;
      this.nextLoad();
    }

    private nextLoad() {
      if (this.curr_item >= this.total_items) {
        this.onLoadCompleteSignal.dispatch();
        return;
      }

      var curData = this.loadData[this.curr_item];

      switch (curData.type) {
        case TYPE_ATLAS_JSON:
          this.loadAtlasJSONArray(curData.key, curData.img, curData.json);
          break;

        case TYPE_TEXTURE:
          this.loadTexture(curData.key, curData.img);
          break;

        default:
          LogMng.error('TJSLoader: unknown data type: ' + curData.type);
          break;
      }
    }

    private getAtlasKey(aKey: string, aFrame: string): string {
      return aKey + '.' + aFrame;
    }

    private loadAtlasJSONArray(aKey: string, aImg: string, aJson: string) {
      var cache = this.cache;
      var thisobj = this;
      $.getJSON(aJson, (json: any) => {
        var loader = new THREE.TextureLoader();
        loader.load(aImg, (aTex: THREE.Texture) => {
          /*for (const key in json) {
            if (json.hasOwnProperty(key)) {
              LogMng.debug('key in json: ' + key);
            }
          }*/
          var frames: any[] = json.frames;
          for (var i = 0; i < frames.length; i++) {
            var data: any = frames[i];
            var tex: THREE.Texture = aTex.clone();
            var frame = data.frame;

            LogMng.debug('load frame: ' + data.filename);

            tex.repeat.x = (frame.w / aTex.image.width);
            tex.repeat.y = (frame.h / aTex.image.height);
            tex.offset.x = (Math.abs(frame.x) / aTex.image.width);
            tex.offset.y = (Math.abs(frame.y) / aTex.image.height);
            tex.needsUpdate = true;

            //var material = new THREE.MeshPhongMaterial({ transparent: true, map: tex, side: THREE.DoubleSide });
            //var sprMaterial = new THREE.SpriteMaterial({ map: tex, color: 0xffffff });
            cache.push({ key: this.getAtlasKey(aKey, data.filename), texture: tex }); // mpMat: material, sprMat: sprMaterial });
          }
          thisobj.curr_item++;
          thisobj.nextLoad();
        });
      });
    }

    private loadTexture(aKey: string, aImg: string) {
      var cache = this.cache;
      var thisobj = this;
      var loader = new THREE.TextureLoader();
      loader.load(aImg, (tex: THREE.Texture) => {
        // loaded
        LogMng.debug('loadTexture: load complete key: ' + aKey);
        cache.push({ key: aKey, texture: tex });
        thisobj.curr_item++;
        thisobj.nextLoad();
      },
        undefined,
        (err) => {
          // error
          LogMng.error('loadTexture error: ' + err);
        });
    }

    getTexture(aKey: string, aFrame?: string): THREE.Texture {
      var key = aKey;
      if (aFrame != null && aFrame.length > 0)
        key = this.getAtlasKey(aKey, aFrame);
      for (let i = 0; i < this.cache.length; i++) {
        const element = this.cache[i];
        if (element.key == key) {
          LogMng.debug('getTexture found key: ' + key);
          return element.texture;
        }
      }
    }

  }



}