2.1.0 - see changelog

Author: chrisben

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## master ##
 
+## 2.1.0 ##
+
+### NEW ###
+* Add ImgCache.getCachedFileBase64Data (#107 thanks begrossi)
+
+### FIXED ###
+* Fix spaces in src URLs (#201 thanks henkkelder)
+
 ## 2.0.0 ##
 
 ### NEW ###

LICENSE.md

@@ -1,6 +1,6 @@
 # Apache License
 
-Copyright 2012-2016 (c) Christophe BENOIT
+Copyright 2012-2018 (c) Christophe BENOIT
 
 *Version 2.0, January 2004*
 

README.md

@@ -20,6 +20,8 @@ This library works with Phonegap/Cordova (v >= 1.7), the supported platforms bei
 
 Most methods are **ASYNCHRONOUS** : use callbacks if required.
 
+This library uses plain old ES5 JavaScript with no transpiler and has no dependency.
+
 Using imgcache.js
 =================
 
@@ -173,6 +175,7 @@ High level API
 * ImgCache.**isCached**() *-- checks if a the given image exists in the cache - does not check if the latest version of that file is cached*
 * ImgCache.**getCachedFile**() *-- returns the cached file*
 * ImgCache.**getCachedFileURL**() *-- returns the URL of the cached version of a file*
+* ImgCache.**getCachedFileBase64Data**() *-- returns the base64 data of a cached file*
 * ImgCache.**useCachedFile**() *-- replaces the img src with the cached version*
 * ImgCache.**useCachedFileWithSource**() *-- similar to useCachedFile but with the image source url as extra parameter*
 * ImgCache.**useOnlineFile**() *-- replaces back the img src with the original (online) version // synchronous method*
@@ -276,9 +279,13 @@ Wrapper for Ionic Framework:
 
 * [ionic-img-cache](https://github.com/vitaliy-bobrov/ionic-img-cache)
 
+Ionic example:
+
+* [offline-ionic](https://github.com/mahcr/offline-ionic)
+
 License
 -------
-Copyright 2012-2017 (c) Christophe BENOIT
+Copyright 2012-2018 (c) Christophe BENOIT
 
 Apache License - see LICENSE.md
 

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "imgcache.js",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "homepage": "https://github.com/chrisben/imgcache.js",
   "authors": [
 	{

index.html

@@ -175,6 +175,28 @@
                         }
                     }
                 },
+                {
+                    name: 'getCachedFileBase64Data',
+                    test: function (ok, nok) {
+                        var img_src = getBackgroundImageUrl($test_div);
+                        if (img_src) {
+                            ImgCache.getCachedFileBase64Data(img_src, function (src, base64) {
+                                if (base64) {
+                                    logger('Cached File base64 data: ' + base64.slice(0, 80) + '[...]', LOG_LEVEL_INFO);
+                                    ok();
+                                } else {
+                                    nok();
+                                }
+                            }, function (img_src) {
+                                logger('Failed to retrieve cache base64 data for file: ' + img_src, LOG_LEVEL_ERROR);
+                                nok();
+                            });
+                        }
+                        else {
+                            nok();
+                        }
+                    }
+                },
                 {
                     name: 'useCachedFile',
                     test: function (ok, nok) {

lib/imgcache-promise.js

@@ -91,6 +91,24 @@ var ImgCachePromise = {};
     });
   };
 
+  ImgCachePromise.getCachedFileBase64Data = function (url) {
+    return initCheck()
+    .then(function () {
+      return new Promise(function (resolve, reject) {
+        ImgCache.getCachedFileBase64Data(
+          url,
+          function(img_src, file_url) {
+            if (file_url === null) {
+              reject();
+            } else {
+              resolve(file_url);
+            }
+          }
+        );
+      });
+    });
+  };
+
   // $img: jQuery or DOM element for the <img/> element
   ImgCachePromise.useCachedFile = function ($img) {
     return initCheck()

lib/imgcache.js

@@ -1,5 +1,5 @@
 /*! imgcache.js
-  Copyright 2012-2017 Christophe BENOIT
+  Copyright 2012-2018 Christophe BENOIT
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -18,7 +18,7 @@
 /*global console,LocalFileSystem,device,FileTransfer,define,module,cordova,phonegap*/
 
 var ImgCache = {
-  version: '2.0.0',
+  version: '2.1.0',
   // options to override before using the library (but after loading this script!)
   options: {
     debug: false,                           /* call the log method ? */
@@ -485,40 +485,49 @@ LOG_LEVEL_ERROR = 3;
     return img_src.replace(/(['"])/g, '');
   };
 
+  Private.getBase64DataFromEntry = function (entry, filename, success_callback, error_callback) {
+    var _success = function (file) {
+      var reader = new FileReader();
+      reader.onloadend = function (e) {
+        var base64content = e.target.result;
+        if (base64content) {
+          ImgCache.overridables.log('File ' + filename + ' loaded from cache', LOG_LEVEL_INFO);
+          if (success_callback) { success_callback(base64content); }
+        } else {
+          ImgCache.overridables.log('File in cache ' + filename + ' is empty', LOG_LEVEL_WARNING);
+          if (error_callback) { error_callback(filename); }
+        }
+      };
+      reader.readAsDataURL(file);
+    };
+    var _failure = function (error) {
+      ImgCache.overridables.log('Failed to read file ' + error.code, LOG_LEVEL_ERROR);
+      if (error_callback) { error_callback(filename); }
+    };
+
+    entry.file(_success, _failure);
+  };
+
   Private.loadCachedFile = function ($element, img_src, set_path_callback, success_callback, error_callback) {
     if (!Private.isImgCacheLoaded()) {
       return;
     }
 
     if (!$element) {
+      ImgCache.overridables.log('First parameter of loadCachedFile is empty, should be a DOM element', LOG_LEVEL_ERROR);
       return;
     }
 
     var filename = Helpers.URIGetFileName(img_src);
 
     var _gotFileEntry = function (entry) {
       if (ImgCache.options.useDataURI) {
-        var _win = function (file) {
-          var reader = new FileReader();
-          reader.onloadend = function (e) {
-            var base64content = e.target.result;
-            if (!base64content) {
-              ImgCache.overridables.log('File in cache ' + filename + ' is empty', LOG_LEVEL_WARNING);
-              if (error_callback) { error_callback($element); }
-              return;
-            }
-            set_path_callback($element, base64content, img_src);
-            ImgCache.overridables.log('File ' + filename + ' loaded from cache', LOG_LEVEL_INFO);
-            if (success_callback) { success_callback($element); }
-          };
-          reader.readAsDataURL(file);
-        };
-        var _fail = function (error) {
-          ImgCache.overridables.log('Failed to read file ' + error.code, LOG_LEVEL_ERROR);
+        Private.getBase64DataFromEntry(entry, filename, function (base64content) {
+          set_path_callback($element, base64content, img_src);
+          if (success_callback) { success_callback($element); }
+        }, function () {
           if (error_callback) { error_callback($element); }
-        };
-
-        entry.file(_win, _fail);
+        });
       } else {
         // using src="filesystem:" kind of url
         var new_url = Helpers.EntryGetURL(entry);
@@ -730,16 +739,29 @@ LOG_LEVEL_ERROR = 3;
   // Returns the local url of a file already available in the cache
   ImgCache.getCachedFileURL = function (img_src, success_callback, error_callback) {
     var _getURL = function (img_src, entry) {
-      if (!entry) {
-        if (error_callback) { error_callback(img_src); }
-      } else {
+      if (entry) {
         success_callback(img_src, Helpers.EntryGetURL(entry));
+      } else {
+        if (error_callback) { error_callback(img_src); }
       }
     };
 
     ImgCache.getCachedFile(img_src, _getURL);
   };
 
+  ImgCache.getCachedFileBase64Data = function (img_src, success_callback, error_callback) {
+    var _getData = function(img_src, entry) {
+      if (entry) {
+        Private.getBase64DataFromEntry(entry, img_src, function (base64content) {
+          success_callback(img_src, base64content);
+        }, error_callback);
+      } else {
+        if (error_callback) { error_callback(img_src); }
+      }
+    };
+
+    ImgCache.getCachedFile(img_src, _getData);
+  };
 
   // checks if a copy of the file has already been cached
   // Reminder: this is an asynchronous method!
@@ -771,7 +793,9 @@ LOG_LEVEL_ERROR = 3;
       return;
     }
 
-    Private.loadCachedFile($img, DomHelpers.getAttribute($img, 'src'), Private.setNewImgPath, success_callback, error_callback);
+    var img_url = Helpers.sanitizeURI(DomHelpers.getAttribute($img, 'src'));
+
+    Private.loadCachedFile($img, img_url, Private.setNewImgPath, success_callback, error_callback);
   };
 
   // When the source url is not the 'src' attribute of the given img element

package-lock.json

@@ -1,6 +1,6 @@
 Package.describe({
   summary: "JS library that stores images locally for offline apps using PhoneGap/Cordova or browsers supporting the new html5 File API",
-  version: "2.0.0",
+  version: "2.1.0",
   git: "https://github.com/chrisben/imgcache.js"
 });
 

package.js

@@ -1,6 +1,6 @@
 {
   "name": "@chrisben/imgcache.js",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "JS library based on the File API to cache images for offline recovery (target: cordova/phonegap & chrome)",
   "main": "lib/imgcache.js",
   "directories": {