CreateJSのプリロードと適用周りをむりやりModelっぽくしてみたりウーン...

models_createjs.js

/**
 * CreatejsModel
 *
 * 大雑把にこんな???
 * var scene01 = new CreatejsModel({animationName: 'scene01'});
 * scene01.apply($('canvas#sceneStage'));
 */
define(['backbone', 'anim', 'createjs'], function(Backbone, Anim, createjs) {
  return Backbone.model.extend({
    url: 'resource-manifests.json',
    preloaded: false,
    options: {
      animationName: '__default__'
    },
    initialize:function () {
      window.images  = window.images || {};
      _.bindAll(this);
      this.fetch({
        success: this.preload
      });
    },
    ready: function(callback) {
      if (this.preloaded) {
        callback();
      } else {
        this.on('preloaded', callback);
      }
    },
    preload: function() {
      var loader = new createjs.PreloadJS(false);
      loader.onFileLoad = this._handleFileLoad;
      loader.onComplete = this._handleComplete;
      loader.loadManifest(this.get('manifests'));
    },
    _handleFileLoad: function(o) {
      if (o.type === 'image') { images[o.id] = o.result; }
    },
    _handleComplete: function() {
      this.preloaded = true;
      this.trigger('preloaded');
      this.off('preloaded');
    },
    apply: function($canvases) {
      var that = this;
      // ready?
      this.ready(function() {
        $canvases.each(function() {
          var exportRoot, stage, mask, canvas;

          canvas = this;
          exportRoot = new Anim[that.options.animationName]();
          stage = new createjs.Stage(canvas);
          stage.addChild(exportRoot);
          stage.update();

          createjs.Ticker.addListener(stage);
          createjs.Ticker.setFPS(30);
        });
      });
    }
  });
});

resource-manifests.json

{
  "manifests": [
    {"src":"img/aaa.png", "id":"aaa", "type":"image"},
    {"src":"img/bbb.png", "id":"bbb", "type":"image"},
    {"src":"img/ccc.png", "id":"ccc", "type":"image"},
  ]
}