Done some refactorings again : isolated the pictures loading code from the main script.

3 files changed, 56 insertions, 34 deletions

diff --git a/js/activity.js b/js/activity.js
index 2078c17..6c69bfb 100644
--- a/js/activity.js
+++ b/js/activity.js
@@ -8,10 +8,12 @@ define(function (require) {
         $ = require('jquery'),
         prototype = require('prototype'),
         GraphicalBoard = require('graphical_board'),
-        TextZone = require('textzone');
+        TextZone = require('textzone'),
+        PiecesBitmapsManager = require('pieces_bitmaps_manager');
     
     var graphicalBoard,
         textZone,
+        piecesBitmapsManager,
         minDimisHeight;
 
     // Manipulate the DOM only when it is ready.
@@ -46,7 +48,6 @@ define(function (require) {
         var textZoneMinDim = (minDim - 2*boardOffset) * 0.37;
         var gap = (minDim - 2*boardOffset) * 0.03;
         var cellDim = boardDim/8;
-        var picturesSizeRatio = cellDim/1000.0;
         graphicalBoard = new GraphicalBoard([boardOffset, boardOffset], cellDim, stage);
         if (minDimisHeight) {
             textZone = new TextZone(boardOffset, boardOffset + cellDim * 8 + gap, 8 * cellDim, textZoneMinDim, 20 * cellDim / 50,  "#2211CC", "#FFF", stage);
@@ -55,34 +56,7 @@ define(function (require) {
             textZone = new TextZone(boardOffset + cellDim * 8 + gap, boardOffset, textZoneMinDim, 8 * cellDim, 20 * cellDim / 50,  "#2211CC", "#FFF", stage);
         }
         
-        // Load images asynchronously
-        var piecesImages = {};
-        var loadingQueue = new createjs.LoadQueue(false);
-        loadingQueue.on("fileload", handleFileLoaded);
-        loadingQueue.on("complete", handleLoadingComplete);
-        loadingQueue.loadManifest([
-            {id:"wp", src:"../pictures/wp.png"},
-            {id:"wn", src:"../pictures/wn.png"},
-            {id:"wb", src:"../pictures/wb.png"},
-            {id:"wr", src:"../pictures/wr.png"},
-            {id:"wq", src:"../pictures/wq.png"},
-            {id:"wk", src:"../pictures/wk.png"},
-            {id:"bp", src:"../pictures/bp.png"},
-            {id:"bn", src:"../pictures/bn.png"},
-            {id:"bb", src:"../pictures/bb.png"},
-            {id:"br", src:"../pictures/br.png"},
-            {id:"bq", src:"../pictures/bq.png"},
-            {id:"bk", src:"../pictures/bk.png"}
-        ]);
-        
-        function handleFileLoaded(file){
-            var image = new createjs.Bitmap(file.item.src);
-            image.scaleX = picturesSizeRatio;
-            image.scaleY = picturesSizeRatio;
-            piecesImages[file.item.id] = image;
-        }
-        
-        function handleLoadingComplete(){
+        function main(){
             
             graphicalBoard.addToStage();
             textZone.addToStage();
@@ -91,12 +65,12 @@ define(function (require) {
                                   "queen, because the black queen is on the bishop diagonal !");
             textZone.changeTextTo("Done !");
             
-            var img1 = piecesImages.wb.clone();
+            var img1 = piecesBitmapsManager.getPicture('wb').clone();
             img1.x = graphicalBoard.getFileX(2);
             img1.y = graphicalBoard.getRankY(3);
             stage.addChild(img1);
             
-            var img2 = piecesImages.bq.clone();
+            var img2 = piecesBitmapsManager.getPicture('bq').clone();
             img2.x = graphicalBoard.getFileX(6);
             img2.y = graphicalBoard.getRankY(7);
             stage.addChild(img2);
@@ -104,6 +78,10 @@ define(function (require) {
             stage.update();
         }
         
+        // Load images asynchronously
+        piecesBitmapsManager = new PiecesBitmapsManager(cellDim, main);
+        piecesBitmapsManager.loadPictures();
+        
     });
-
+        
 });
diff --git a/js/loader.js b/js/loader.js
index a3799c4..f3ac741 100644
--- a/js/loader.js
+++ b/js/loader.js
@@ -25,6 +25,10 @@ requirejs.config({
         textzone : {
             deps: ['easel', 'prototype'],
             exports: 'TextZone'
+        },
+        pieces_bitmaps_manager : {
+            deps: ['easel', 'preload', 'prototype'],
+            exports: 'PiecesBitmapsManager'
         }
     },
     paths: {
@@ -35,7 +39,8 @@ requirejs.config({
         jquery: 'jquery',
         prototype: 'prototype',
         graphical_board: 'customs/graphical_board',
-        textzone: 'customs/textzone'
+        textzone: 'customs/textzone',
+        pieces_bitmaps_manager: 'customs/pieces_bitmaps_manager'
     }
 });
 
diff --git a/lib/customs/pieces_bitmaps_manager.js b/lib/customs/pieces_bitmaps_manager.js
new file mode 100644
index 0000000..c109b70
--- /dev/null
+++ b/lib/customs/pieces_bitmaps_manager.js
@@ -0,0 +1,39 @@
+var PiecesBitmapsManager = Class.create();
+PiecesBitmapsManager.prototype = {
+    // pictures_size : pictures size px
+    // loadingCompleteHandler : a function without any argument and returning nothing.
+    initialize: function(pictures_size, loadingCompleteHandler){
+        this.picturesSize = pictures_size;
+        this.piecesImages = {};
+        this.loadingQueue = new createjs.LoadQueue(false);
+        this.loadingQueue.on("fileload", this.handleFileLoaded, this);
+        this.loadingQueue.on("complete", loadingCompleteHandler, this);
+    },
+    handleFileLoaded : function(file){
+        var image = new createjs.Bitmap(file.item.src);
+        image.scaleX = this.picturesSize/1000.0;
+        image.scaleY = this.picturesSize/1000.0;
+        this.piecesImages[file.item.id] = image;
+    },
+    loadPictures: function() {
+        this.loadingQueue.loadManifest([
+            {id:"wp", src:"../pictures/wp.png"},
+            {id:"wn", src:"../pictures/wn.png"},
+            {id:"wb", src:"../pictures/wb.png"},
+            {id:"wr", src:"../pictures/wr.png"},
+            {id:"wq", src:"../pictures/wq.png"},
+            {id:"wk", src:"../pictures/wk.png"},
+            {id:"bp", src:"../pictures/bp.png"},
+            {id:"bn", src:"../pictures/bn.png"},
+            {id:"bb", src:"../pictures/bb.png"},
+            {id:"br", src:"../pictures/br.png"},
+            {id:"bq", src:"../pictures/bq.png"},
+            {id:"bk", src:"../pictures/bk.png"}
+        ]);
+    },
+    
+    // e.g wb for white bishop, bn for black knight.
+    getPicture: function(id){
+        return this.piecesImages[id];
+    }
+};
\ No newline at end of file