[ Add ] Support Assets encoded in DataURI

[ Optimize ]  Simplify core logic of the loader

package.json

@@ -82,10 +82,5 @@
     "wdio-qunit-framework": "mucaho/wdio-qunit-framework#master",
     "wdio-sauce-service": "^0.3.1",
     "webdriverio": "^4.6.2"
-  },
-  "browserify": {
-    "transform": [
-      "brfs"
-    ]
   }
 }

src/core/loader.js

@@ -1,11 +1,11 @@
-var Crafty = require('../core/core.js');
+var Crafty = require('../core/core.js'), Utility = require('./utility');
 
 module.exports = {
     /**@
      * #Crafty.assets
      * @category Assets
      * @kind Property
-     * 
+     *
      * An object containing every asset used in the current Crafty game.
      * The key is the URL and the value is the `Audio` or `Image` object.
      *
@@ -23,7 +23,7 @@ module.exports = {
      * #Crafty.paths
      * @category Assets
      * @kind Method
-     * 
+     *
      * @sign public void Crafty.paths([Object paths])
      * @param paths - Object containing paths for audio and images folders
      *
@@ -69,7 +69,7 @@ module.exports = {
      * #Crafty.asset
      * @category Assets
      * @kind Method
-     * 
+     *
      * @trigger NewAsset - After setting new asset - Object - key and value of new added asset.
      * @sign public void Crafty.asset(String key, Object asset)
      * @param key - asset url.
@@ -152,7 +152,7 @@ module.exports = {
      * #Crafty.load
      * @category Assets
      * @kind Method
-     * 
+     *
      * @sign public void Crafty.load(Object assets, Function onLoad[, Function onProgress[, Function onError]])
      * @param assets - Object JSON formatted (or JSON string), with assets to load (accepts sounds, images and sprites)
      * @param onLoad - Callback when the assets are loaded
@@ -250,21 +250,31 @@ module.exports = {
                 (data.sprites ? Object.keys(data.sprites).length : 0),
             current, fileUrl, obj, type, asset,
             paths = Crafty.paths(),
-            getExt = function(f) {
-                return f.substr(f.lastIndexOf('.') + 1).toLowerCase();
-            },
             getFilePath = function(type,f) {
                 return (f.search("://") === -1 ? (type === "audio" ? paths.audio + f : paths.images + f) : f);
             },
             // returns null if 'a' is not already a loaded asset, obj otherwise
             isAsset = function(a) {
                 return Crafty.asset(a) || null;
             },
+            // jshint ignore:start
             isSupportedAudio = function(f) {
-                return Crafty.support.audio && Crafty.audio.supports(getExt(f));
+
+                return Crafty.support.audio && Crafty.audio.supports(
+                    Utility.fileTypeOf( f ).type
+                );
             },
+            // jshint ignore:end
             isValidImage = function(f) {
-                return Crafty.imageWhitelist.indexOf(getExt(f)) !== -1;
+
+                return -1 < Crafty.imageWhitelist.indexOf(
+                    Utility.fileTypeOf( f ).type
+                );
+            },
+            shortURLOf = function (URI) {
+
+                return  (Utility.fileTypeOf( URI ).schema === 'data')  ?
+                    URL.createObjectURL( Utility.toBlob( URI ) )  :  URI;
             },
             onImgLoad = function(obj,url) {
                 obj.onload = pro;
@@ -319,36 +329,47 @@ module.exports = {
                 obj = null;
 
                 if (type === "audio") {
-                    if (typeof current === "object") {
-                        var files = [];
-                        for (var i in current) {
-                            fileUrl = getFilePath(type, current[i]);
-                            if (!isAsset(fileUrl) && isSupportedAudio(current[i]) && !Crafty.audio.sounds[asset])
-                                files.push(fileUrl);
-                        }
-                        if (files.length > 0)
-                            obj = Crafty.audio.add(asset, files);
-                    } else if (typeof current === "string") {
-                        fileUrl = getFilePath(type, current);
-                        if (!isAsset(fileUrl) && isSupportedAudio(current) && !Crafty.audio.sounds[asset])
-                            obj = Crafty.audio.add(asset, fileUrl);
-                    }
+
+                    current = (typeof current === "object")  ?
+                        current  :  {'': current + ''};
+                    // jshint ignore:start
+                    var files = Object.keys( current ).filter(function (key) {
+
+                        var fileUrl = getFilePath(type, current[key]);
+
+                        if (
+                            !isAsset( fileUrl )  &&
+                            isSupportedAudio( current[key] )  &&
+                            !Crafty.audio.sounds[asset]
+                        )
+                            return  shortURLOf( fileUrl );
+                    });
+
+                    if ( files[0] )  obj = Crafty.audio.add(asset, files);
+                    // jshint ignore:end
                     //extract actual audio obj if audio creation was successfull
-                    if (obj)
-                        obj = obj.obj;
+                    if ( obj )  obj = obj.obj;
 
                     //addEventListener is supported on IE9 , Audio as well
                     if (obj && obj.addEventListener)
                         obj.addEventListener('canplaythrough', pro, false);
                 } else {
-                    asset = (type === "sprites" ? asset : current);
+                    asset = (type === "sprites")  ?  asset  :  current;
+
                     fileUrl = getFilePath(type, asset);
-                    if (!isAsset(fileUrl) && isValidImage(asset)) {
-                        obj = new Image();
+
+                    if (!isAsset( fileUrl )  &&  isValidImage( asset )) {
+
+                        obj = new Image();  fileUrl = shortURLOf( fileUrl );
+
                         if (type === "sprites")
-                            Crafty.sprite(current.tile, current.tileh, fileUrl, current.map,
-                              current.paddingX, current.paddingY, current.paddingAroundBorder);
+                            Crafty.sprite(
+                                current.tile, current.tileh, fileUrl, current.map,
+                                current.paddingX, current.paddingY, current.paddingAroundBorder
+                            );
+
                         Crafty.asset(fileUrl, obj);
+
                         onImgLoad(obj, fileUrl);
                     }
                 }
@@ -363,7 +384,6 @@ module.exports = {
 
         // If we aren't trying to handle *any* of the files, that's as complete as it gets!
         if (total === 0 && oncomplete) oncomplete();
-
     },
     /**@
      * #Crafty.removeAssets

src/core/utility.js

@@ -0,0 +1,62 @@
+exports.blobOf = function blobOf(URI) {
+
+    var XHR = new XMLHttpRequest();
+
+    XHR.responseType = 'blob';
+
+    XHR.open('GET', URI);
+
+    return  new Promise(function (resolve, reject) {  // jshint ignore:line
+
+        XHR.onload = function () {  resolve( this.response );  };
+
+        XHR.onerror = reject;
+
+        XHR.send();
+    });
+};
+
+var DataURI = /^data:(.+?\/(.+?))?(;base64)?,(\S+)/;
+
+exports.fileTypeOf = function fileTypeOf(URI) {
+
+    var schema = /^(?:(\w+):)?.+?(?:\.(\w+))?$/.exec( URI );
+
+    switch ( schema[1] ) {
+        case 'data':  return {
+            schema: 'data',  type: DataURI.exec( URI )[2]
+        };
+        case 'blob':  return exports.blobOf( URI ).then(function (blob) {
+            return {
+                schema: 'blob',  type: blob.type
+            };
+        });
+        default:      return {
+            schema: schema[1],  type: schema[2]
+        };
+    }
+};
+
+var BlobBuilder = window.WebKitBlobBuilder || window.MozBlobBuilder || window.MSBlobBuilder;
+
+exports.toBlob = function toBlob(dataURI) {
+
+    dataURI = DataURI.exec( dataURI );
+
+    var type = dataURI[1], base64 = dataURI[3], data = dataURI[4];
+
+    data = base64  ?  window.atob( data )  :  data;
+
+    var aBuffer = new ArrayBuffer( data.length );
+
+    var uBuffer = new Uint8Array( aBuffer );
+
+    for (var i = 0;  data[i];  i++)  uBuffer[i] = data.charCodeAt( i );
+
+    if (! BlobBuilder)
+        return  new window.Blob([aBuffer],  {type: type});
+
+    var builder = new BlobBuilder();    builder.append( aBuffer );
+
+    return  builder.getBlob( type );
+};

tests/unit/lib/qunit.css

@@ -1,12 +1,12 @@
 /*!
- * QUnit 2.3.2
+ * QUnit 2.4.1
  * https://qunitjs.com/
  *
  * Copyright jQuery Foundation and other contributors
  * Released under the MIT license
  * https://jquery.org/license
  *
- * Date: 2017-04-18T02:19Z
+ * Date: 2017-10-22T05:12Z
  */
 
 /** Font Family and Sizes */