Skip to content

Commit 70d4342

Browse files
paulprinspaulprins
committed
Change the scope and accessibility of the config
1 parent 2a948fe commit 70d4342

File tree

3 files changed

+36
-30
lines changed

3 files changed

+36
-30
lines changed

‎demo.html‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -77,18 +77,20 @@ <h2>Flickr Test</h2>
7777
* Grab all of the images and display them inside the container
7878
*/
7979

80-
var cacheKeys = []; // Store the keys we need to drop here
81-
var cacheImagesShowAll = function( container ){
80+
var cacheKeys = [], // Store the keys we need to drop here
81+
debug = true;
82+
var cacheImagesShowAll = function( container, storagePrefix ){
83+
if( typeof storagePrefix === 'undefined' ){ storagePrefix = 'cached'; }
8284
var cacheKeys = []; // Store the keys we need to drop here
8385
// Lets get our loop on
8486
for (i = 0; i < window.localStorage.length; i++) {
85-
if( window.localStorage.key(i).substr( 0, window.cacheImagesConfig.storagePrefix.length + 1 ) !== window.cacheImagesConfig.storagePrefix + ':' ){ continue; } // Does not match our prefix?
87+
if( window.localStorage.key(i).substr( 0, storagePrefix.length + 1 ) !== storagePrefix + ':' ){ continue; } // Does not match our prefix?
8688

8789
cacheKeys.push( window.localStorage.key(i) ); // Droping the keys here re-indexes the localStorage so that the offset in our loop is wrong
8890
}
8991

9092
if( cacheKeys.length === 0 ){
91-
if( window.cacheImagesConfig.debug ){ console.log( 'No Images to Drop' ); }
93+
if( window.debug ){ console.log( 'No Images to Drop' ); }
9294
return true;
9395
}
9496

‎jquery.cacheImages.js‎

Lines changed: 29 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
(function ($) {
2020
$.fn.cacheImages = function (opts) {
2121
// Set the defaults
22-
window.cacheImagesConfig = $.extend({}, {
22+
this.cacheImagesConfig = $.extend({}, {
2323
debug: false, // Boolean value to enable or disable some of the console messaging for trouble shooting
2424
defaultImage: 'data:image/png;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBAQEBAQEBAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUwMDU1QEA/QEBAQEBAQEBAQEBA/8AAEQgAZABkAwEiAAIRAQMRAf/EAEsAAQEAAAAAAAAAAAAAAAAAAAAFAQEAAAAAAAAAAAAAAAAAAAAAEAEAAAAAAAAAAAAAAAAAAAAAEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwCwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD//2Q==', // URL or base64 string for the default image (will obviously get cached) - default is at assets/default.jpg
2525
encodeOnCanvas: false, // This is still experimental and should be disabled in production
@@ -28,16 +28,16 @@
2828
}, opts);
2929

3030
// Check for canvas support
31-
window.cacheImagesConfig.encodeOnCanvas = typeof HTMLCanvasElement != undefined ? window.cacheImagesConfig.encodeOnCanvas : false;
31+
this.cacheImagesConfig.encodeOnCanvas = typeof HTMLCanvasElement != undefined ? this.cacheImagesConfig.encodeOnCanvas : false;
3232

3333
var self = this;
3434

3535

3636
/*
3737
* Ensure we have the default image cached and ready for use
3838
*/
39-
if( /^data:image/.test( window.cacheImagesConfig.defaultImage ) === false ){
40-
window.cacheImagesConfig.defaultSrc = window.cacheImagesConfig.defaultImage;
39+
if( /^data:image/.test( this.cacheImagesConfig.defaultImage ) === false ){
40+
this.cacheImagesConfig.defaultSrc = this.cacheImagesConfig.defaultImage;
4141
}
4242

4343

@@ -126,16 +126,16 @@
126126
$(self).each(function (i, img) {
127127
var $this = $(img),
128128
src = $this.prop('src') || $this.data('cachedImageSrc');
129-
if( window.cacheImagesConfig.url !== null ){ // URL set in the opts
130-
src = window.cacheImagesConfig.url;
129+
if( self.cacheImagesConfig.url !== null ){ // URL set in the opts
130+
src = self.cacheImagesConfig.url;
131131
$this.prop('src', '');
132132
}
133133

134-
var key = window.cacheImagesConfig.storagePrefix + ':' + src, // Prepare the localStorage key
134+
var key = self.cacheImagesConfig.storagePrefix + ':' + src, // Prepare the localStorage key
135135
localSrcEncoded = localStorage[key];
136136

137137
if( typeof localStorage !== "object" ){ // See if local storage is working
138-
if( window.cacheImagesConfig.debug ){ console.log("localStorage is not available"); }
138+
if( self.cacheImagesConfig.debug ){ console.log("localStorage is not available"); }
139139
return false; // Unable to cache, so stop looping
140140
}
141141

@@ -162,7 +162,7 @@
162162
localStorage[key] = 'pending';
163163
$this.data('cachedImageSrc', src);
164164

165-
if( window.cacheImagesConfig.encodeOnCanvas && imgType !== 'gif' ){
165+
if( self.cacheImagesConfig.encodeOnCanvas && imgType !== 'gif' ){
166166
$this.load(function () {
167167
localStorage[key] = src = base64EncodeCanvas( img );
168168
if( src.substring(0,5) === 'data:' ){
@@ -186,15 +186,15 @@
186186
}else{
187187
localStorage[key] = 'error';
188188
// Display the default image
189-
if( typeof window.cacheImagesConfig.defaultSrc !== 'undefined' ){
190-
var defaultKey = window.cacheImagesConfig.storagePrefix + ':' + window.cacheImagesConfig.defaultSrc;
189+
if( typeof self.cacheImagesConfig.defaultSrc !== 'undefined' ){
190+
var defaultKey = self.cacheImagesConfig.storagePrefix + ':' + self.cacheImagesConfig.defaultSrc;
191191
if( typeof localStorage[defaultKey] !== 'undefined' ){
192192
$this.prop('src', localStorage[defaultKey] );
193193
}else{
194-
$this.cacheImages({url: window.cacheImagesConfig.defaultSrc }); // Will cache it, and display it here
194+
$this.cacheImages({url: self.cacheImagesConfig.defaultSrc }); // Will cache it, and display it here
195195
}
196196
}else{
197-
$this.prop('src', window.cacheImagesConfig.defaultImage );
197+
$this.prop('src', self.cacheImagesConfig.defaultImage );
198198
}
199199
}
200200
};
@@ -216,17 +216,18 @@
216216
/*
217217
* Manually cache an image into the local storage
218218
*/
219-
window.cacheImagesOutput = function( url ){
220-
var tempKey = window.cacheImagesConfig.storagePrefix + ':' + url;
219+
window.cacheImagesOutput = function( url, storagePrefix ){
220+
if( typeof storagePrefix === 'undefined' ){ storagePrefix = 'cached'; }
221+
var tempKey = storagePrefix + ':' + url;
221222
if( window.localStorage.getItem( tempKey ) != null ){
222223
return window.localStorage.getItem( tempKey ); // Image exists in the cache
223224
}else{
224-
225-
if( /^data:image/.test( window.cacheImagesConfig.defaultImage ) === true ){
226-
return window.cacheImagesConfig.defaultImage; // this is an encoded string
225+
226+
if( /^data:image/.test( this.cacheImagesConfig.defaultImage ) === true ){
227+
return this.cacheImagesConfig.defaultImage; // this is an encoded string
227228
}
228229

229-
tempKey = window.cacheImagesConfig.storagePrefix + ':' + window.cacheImagesConfig.defaultImage;
230+
tempKey = storagePrefix + ':' + this.cacheImagesConfig.defaultImage;
230231
if( window.localStorage.getItem( tempKey ) != null ){
231232
return window.localStorage.getItem( tempKey ); // Default URL was already cached
232233
}
@@ -237,27 +238,30 @@
237238
/*
238239
* Will remove all of the cached images from their localStorage
239240
*/
240-
window.cacheImagesDrop = function(){
241-
var dropKeys = []; // Store the keys we need to drop here
241+
window.cacheImagesDrop = function( storagePrefix ){
242+
var dropKeys = [], // Store the keys we need to drop here
243+
debug = false;
244+
if( typeof storagePrefix === 'undefined' ){ storagePrefix = 'cached'; }
245+
242246
// Lets get our loop on
243247
for (i = 0; i < window.localStorage.length; i++) {
244-
if( window.localStorage.key(i).substr( 0, window.cacheImagesConfig.storagePrefix.length + 1 ) !== window.cacheImagesConfig.storagePrefix + ':' ){ continue; } // Does not match our prefix?
248+
if( window.localStorage.key(i).substr( 0,storagePrefix.length + 1 ) !== storagePrefix + ':' ){ continue; } // Does not match our prefix?
245249

246250
dropKeys.push( window.localStorage.key(i) ); // Droping the keys here re-indexes the localStorage so that the offset in our loop is wrong
247251
}
248252

249253
if( dropKeys.length === 0 ){
250-
if( window.cacheImagesConfig.debug ){ console.log( 'No Images to Drop' ); }
254+
if( debug ){ console.log( 'No Images to Drop' ); }
251255
return true;
252256
}
253257

254258
// Drop the keys we found
255259
for( i = 0; i < dropKeys.length; i++ ){
256-
if( window.cacheImagesConfig.debug ){ console.log( 'Dropping localStorage Key:', dropKeys[i] ); } // Let them know what keys were dropped
260+
if( debug ){ console.log( 'Dropping localStorage Key:', dropKeys[i] ); } // Let them know what keys were dropped
257261
window.localStorage.removeItem( dropKeys[i] );
258262
}
259263

260-
if( window.cacheImagesConfig.debug ){ console.log( 'Dropped ' + dropKeys.length + ' images from localStorage' ); } // Provide a bit of feedback for developers
264+
if( debug ){ console.log( 'Dropped ' + dropKeys.length + ' images from localStorage' ); } // Provide a bit of feedback for developers
261265
return true;
262266
};
263267
})(jQuery);

‎jquery.cacheImages.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)