From 393791706ecc9d9d4247a8115d8d789f0cb989a4 Mon Sep 17 00:00:00 2001
From: Richard Davey <rdavey@gmail.com>
Date: Wed, 7 Dec 2016 00:04:32 +0000
Subject: [PATCH] Adding in Image parsing.

---
 v3/src/loader/BaseLoader.js          | 23 +++++-----------------
 v3/src/loader/File.js                | 21 ++++++++++----------
 v3/src/loader/filetypes/ImageFile.js | 29 ++++++++++++++--------------
 3 files changed, 31 insertions(+), 42 deletions(-)

diff --git a/v3/src/loader/BaseLoader.js b/v3/src/loader/BaseLoader.js
index b0fb57977..3bf0307aa 100644
--- a/v3/src/loader/BaseLoader.js
+++ b/v3/src/loader/BaseLoader.js
@@ -9,8 +9,6 @@ var BaseLoader = function ()
 {
     //  To finish the loader ...
     //  
-    //  1) Image Tag loader
-    //  2) Events (or Signals?) for the various stages
     //  3) Progress update
     //  4) JSON loader
     //  5) XML Loader
@@ -19,6 +17,8 @@ var BaseLoader = function ()
 
     this.events = new EventDispatcher();
 
+    this.forceImageTags = false;
+
     //  Move to a 'setURL' method?
     this.baseURL = '';
     this.path = '';
@@ -230,22 +230,9 @@ BaseLoader.prototype = {
         this.events.dispatch(new Event.LOADER_COMPLETE_EVENT(this));
     },
 
-    getLoadedFiles (group = '', output = []) {
-
-        var output = [];
-
-        //  Return an array of all files that have state = COMPLETE (which means loaded + processed)
-
-        for (let file of this.storage)
-        {
-            if (file.state === FILE.COMPLETE && file.tag === group && (type !== '' && file.type === type))
-            {
-                output.push(file);
-            }
-        }
-
-        return output;
-
+    getLoadedFiles: function ()
+    {
+        return this.storage.slice();
     },
 
     reset: function ()
diff --git a/v3/src/loader/File.js b/v3/src/loader/File.js
index b9943df64..a4139cc39 100644
--- a/v3/src/loader/File.js
+++ b/v3/src/loader/File.js
@@ -57,11 +57,12 @@ File.prototype = {
     //  ProgressEvent
     onLoad: function (event)
     {
-        console.log('image loaded');
-        console.log(event);
-
+        // console.log('image loaded');
+        // console.log(event);
         // this.onStateChange(LOADING);
 
+        this.process();
+
         this.resetXHR();
 
         this.callback(this, true);
@@ -69,8 +70,8 @@ File.prototype = {
 
     onError: function (event)
     {
-        console.log('image error');
-        console.log(event);
+        // console.log('image error');
+        // console.log(event);
 
         this.resetXHR();
 
@@ -87,14 +88,16 @@ File.prototype = {
         console.log(this.percentComplete + '% (' + this.bytesLoaded + ' bytes)');
     },
 
-    onProcess: function ()
+    process: function ()
     {
-        console.log('process the image');
+        //  Override by an extending class
     },
 
     onComplete: function ()
     {
-        console.log('image completed and added to the loader store');
+        console.log('File completed, ready to add to the Loader store');
+
+        this.state = CONST.FILE_COMPLETE;
     },
 
     //  Called by the Loader, starts the actual file downloading
@@ -106,8 +109,6 @@ File.prototype = {
 
         this.src = GetURL(this, baseURL);
 
-        console.log('LOADING2', this.src);
-
         this.xhrLoader = XHRLoader(this, globalXHR);
     }
 };
diff --git a/v3/src/loader/filetypes/ImageFile.js b/v3/src/loader/filetypes/ImageFile.js
index 9ed1f353e..72240a6e3 100644
--- a/v3/src/loader/filetypes/ImageFile.js
+++ b/v3/src/loader/filetypes/ImageFile.js
@@ -1,22 +1,14 @@
-// var FILE_CONST = require('../const');
 
+var CONST = require('../const');
 var File = require('../File');
 
-//  Different images based on device-pixel ratio
-//  And maybe on screen resolution breakpoints
-
-//  2 options - can either return the File object, so they can listen to it specifically
-//  Or can return the Loader, so they can chain calls?
-
 var ImageFile = function (key, url, path)
 {
     if (path === undefined) { path = ''; }
 
     if (!key)
     {
-        console.warn('Loader: You tried to load an Image, but no key was given');
-
-        return false;
+        throw new Error('Error calling \'Loader.image\' invalid key provided.');
     }
 
     if (!url)
@@ -28,17 +20,26 @@ var ImageFile = function (key, url, path)
         url = path.concat(url);
     }
 
-    var file = new File('image', key, url, 'arraybuffer');
-
-    return file;
+    File.call(this, 'image', key, url, 'blob');
 };
 
 ImageFile.prototype = Object.create(File.prototype);
 ImageFile.prototype.constructor = ImageFile;
 
-ImageFile.prototype.onProcess = function ()
+ImageFile.prototype.process = function ()
 {
+    this.state = CONST.FILE_PROCESSING;
 
+    this.data = new Image();
+
+    this.data.onload = function ()
+    {
+        window.URL.revokeObjectURL(this.src);
+
+        this.onComplete();
+    };
+
+    this.data.src = window.URL.createObjectURL(this.xhrLoader.response);
 };
 
 module.exports = ImageFile;