 var spriteSheets = (function() {

     var videoAnim;
     var currentShadeHex = 0xffffff;
     var faceMovie;
     var lipsMovie;
     var loader = new PIXI.loaders.Loader();
     var list = {
         "Nuria": {
             "sheets": 26,
             "frames": 228
         },
         "Inga": {
             "sheets": 26,
             "frames": 233
         },
         "Gerogie": {
             "sheets": 34,
             "frames": 304
         }
     };

     // draw spritesheets to canvas
     function animate() {
         videoAnim = requestAnimationFrame(animate);
         renderer.render();
     }

     function init(modelName, hex) {
         var item = list[modelName];

         loadModels(modelName, item.sheets, item.frames);
     }

     function loadModels(modelName, spriteNumber, frameNumber) {
         // PIXI spritesheet shit
         var faceAssetsToLoad = [];
         var lipsAssetsToLoad = [];

         for (var i = 0; i < spriteNumber; i++) {
             faceAssetsToLoad[i] = './spritesheets/' + modelName + '/face/' + modelName + '_' + i + '.json';
             lipsAssetsToLoad[i] = './spritesheets/' + modelName + '/lips/' + modelName + '_' + i + '.json';
         }

         loader.reset();
         loader.add(faceAssetsToLoad).load(onFaceAssetsLoaded);
         loader.add(lipsAssetsToLoad).load(onLipsAssetsLoaded);

         // loader.on('progress', function(loader, loadedResource) {
         //     console.log('Progress:', loader.progress + '%');
         // });

         function onFaceAssetsLoaded() {
             var faceArray = [];

             for (var i = 0; i < frameNumber; i++) {
                 var val = i < 10 ? '0' + i : i;

                 // magically works since the spritesheet was loaded with the pixi loader
                 if (val > 99) {
                     if (modelName == "Nuria") {
                         faceArray.push(PIXI.Texture.fromFrame('' + modelName + '_Face_00' + val + '.jpg'));
                     } else {
                         faceArray.push(PIXI.Texture.fromFrame('' + modelName + '_0' + val + '.jpeg'));
                     }

                 } else {
                     if (modelName == "Nuria") {
                         faceArray.push(PIXI.Texture.fromFrame('' + modelName + '_Face_000' + val + '.jpg'));
                     } else {
                         faceArray.push(PIXI.Texture.fromFrame('' + modelName + '_00' + val + '.jpeg'));
                     }
                 }
             }

             // create a MovieClip (brings back memories from the days of Flash, right ?)
             faceMovie = new PIXI.extras.MovieClip(faceArray);
             /*
              * A MovieClip inherits all the properties of a PIXI sprite
              * so you can change its position, its anchor, mask it, etc
              */
             faceMovie.position.x = 0;
             faceMovie.position.y = 0;

             faceMovie.anchor.set(0);
             faceMovie.animationSpeed = 0.417;

             stage.addChild(faceMovie);

             faceMovie.play();

             animate(stage);
         }

         function onLipsAssetsLoaded() {
             var lipsArray = [];

             for (var i = 0; i < frameNumber; i++) {
                 var val = i < 10 ? '0' + i : i;

                 // magically works since the spritesheet was loaded with the pixi loader
                 if (val > 99) {
                     if (modelName == "Nuria") {
                         lipsArray.push(PIXI.Texture.fromFrame('' + modelName + '_Lips_00' + val + '.png'));
                     } else {
                         lipsArray.push(PIXI.Texture.fromFrame('' + modelName + '_0' + val + '.png'));
                     }

                 } else {
                     if (modelName == "Nuria") {
                         lipsArray.push(PIXI.Texture.fromFrame('' + modelName + '_Lips_000' + val + '.png'));
                     } else {
                         lipsArray.push(PIXI.Texture.fromFrame('' + modelName + '_00' + val + '.png'));
                     }
                 }
             }


             // create a MovieClip (brings back memories from the days of Flash, right ?)
             lipsMovie = new PIXI.extras.MovieClip(lipsArray);
             // lipsMovie.tint = 0xCF5B9C;

             /*
              * A MovieClip inherits all the properties of a PIXI sprite
              * so you can change its position, its anchor, mask it, etc
              */
             lipsMovie.alpha = 0.6;
             lipsMovie.position.x = 0;
             lipsMovie.position.y = 0;
             lipsMovie.anchor.set(0);
             lipsMovie.animationSpeed = 0.417;
             lipsMovie.tint = currentShadeHex;

             stage.addChild(lipsMovie);

             $('#spinnerOverlay').fadeOut();

             lipsMovie.play();

             animate(stage);
         }
     }

     function applyMakeup(shade) {
         if (lipsMovie !== undefined) {
             // lipsMovie.tint = 0xFFFFFF;

             currentShadeHex = "0x" + shade;
             lipsMovie.tint = currentShadeHex;
         }
     }

     function clearMakeup() {
         currentShadeHex = 0xFFFFFF;
         lipsMovie.tint = 0xFFFFFF;
     }

     // Public API
     return {
         load: init,
         apply: applyMakeup,
         clear: clearMakeup
     };
 })();
