update imagesloaded to version 4.1.4 via composer

(cherry picked from commit c667572d3e)
This commit is contained in:
Mario 2018-11-25 09:09:26 +00:00
parent 863cae1bab
commit a0d1ce77dc
40 changed files with 1871 additions and 99 deletions

View File

@ -40,7 +40,8 @@
"smarty/smarty": "~3.1",
"ramsey/uuid": "^3.8",
"twbs/bootstrap": "4.1.3",
"blueimp/jquery-file-upload": "^9.25"
"blueimp/jquery-file-upload": "^9.25",
"desandro/imagesloaded": "^4.1"
},
"require-dev" : {
"phpunit/phpunit" : "@stable",

41
composer.lock generated
View File

@ -4,7 +4,7 @@
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
"This file is @generated automatically"
],
"content-hash": "63d0e52cc07f8113059ec30d3637b850",
"content-hash": "fe5e71d7076eeddf1c174be4a5c052dd",
"packages": [
{
"name": "blueimp/jquery-file-upload",
@ -163,6 +163,45 @@
"description": "Internationalization library powered by CLDR data.",
"time": "2017-12-29T00:13:05+00:00"
},
{
"name": "desandro/imagesloaded",
"version": "v4.1.4",
"source": {
"type": "git",
"url": "https://github.com/desandro/imagesloaded.git",
"reference": "67c4e57453120935180c45c6820e7d3fbd2ea1f9"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/desandro/imagesloaded/zipball/67c4e57453120935180c45c6820e7d3fbd2ea1f9",
"reference": "67c4e57453120935180c45c6820e7d3fbd2ea1f9",
"shasum": ""
},
"type": "component",
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "David DeSandro",
"homepage": "http://desandro.com/",
"role": "developer"
}
],
"description": "JavaScript is all like _You images done yet or what?_",
"homepage": "http://imagesloaded.desandro.com",
"keywords": [
"dom",
"images",
"javascript",
"jquery-plugin",
"library",
"loaded",
"ui"
],
"time": "2018-01-02T16:53:35+00:00"
},
{
"name": "ezyang/htmlpurifier",
"version": "v4.10.0",

File diff suppressed because one or more lines are too long

View File

@ -279,7 +279,7 @@ class ClassLoader
*/
public function setApcuPrefix($apcuPrefix)
{
$this->apcuPrefix = function_exists('apcu_fetch') && ini_get('apc.enabled') ? $apcuPrefix : null;
$this->apcuPrefix = function_exists('apcu_fetch') && filter_var(ini_get('apc.enabled'), FILTER_VALIDATE_BOOLEAN) ? $apcuPrefix : null;
}
/**

View File

@ -1,56 +1,21 @@
Format: http://www.debian.org/doc/packaging-manuals/copyright-format/1.0/
Upstream-Name: Composer
Upstream-Contact: Jordi Boggiano <j.boggiano@seld.be>
Source: https://github.com/composer/composer
Files: *
Copyright: 2016, Nils Adermann <naderman@naderman.de>
2016, Jordi Boggiano <j.boggiano@seld.be>
License: Expat
Copyright (c) Nils Adermann, Jordi Boggiano
Files: src/Composer/Util/TlsHelper.php
Copyright: 2016, Nils Adermann <naderman@naderman.de>
2016, Jordi Boggiano <j.boggiano@seld.be>
2013, Evan Coury <me@evancoury.com>
License: Expat and BSD-2-Clause
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is furnished
to do so, subject to the following conditions:
License: BSD-2-Clause
Redistribution and use in source and binary forms, with or without modification,
are permitted provided that the following conditions are met:
.
* Redistributions of source code must retain the above copyright notice,
this list of conditions and the following disclaimer.
.
* Redistributions in binary form must reproduce the above copyright notice,
this list of conditions and the following disclaimer in the documentation
and/or other materials provided with the distribution.
.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
License: Expat
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is furnished
to do so, subject to the following conditions:
.
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

View File

@ -981,7 +981,6 @@ return array(
'Zotlabs\\Module\\Mood' => $baseDir . '/Zotlabs/Module/Mood.php',
'Zotlabs\\Module\\Network' => $baseDir . '/Zotlabs/Module/Network.php',
'Zotlabs\\Module\\New_channel' => $baseDir . '/Zotlabs/Module/New_channel.php',
'Zotlabs\\Module\\Nojs' => $baseDir . '/Zotlabs/Module/Nojs.php',
'Zotlabs\\Module\\Notes' => $baseDir . '/Zotlabs/Module/Notes.php',
'Zotlabs\\Module\\Notifications' => $baseDir . '/Zotlabs/Module/Notifications.php',
'Zotlabs\\Module\\Notify' => $baseDir . '/Zotlabs/Module/Notify.php',
@ -1337,7 +1336,10 @@ return array(
'Zotlabs\\Update\\_1222' => $baseDir . '/Zotlabs/Update/_1222.php',
'Zotlabs\\Update\\_1223' => $baseDir . '/Zotlabs/Update/_1223.php',
'Zotlabs\\Update\\_1224' => $baseDir . '/Zotlabs/Update/_1224.php',
'Zotlabs\\Web\\CheckJS' => $baseDir . '/Zotlabs/Web/CheckJS.php',
'Zotlabs\\Update\\_1225' => $baseDir . '/Zotlabs/Update/_1225.php',
'Zotlabs\\Update\\_1226' => $baseDir . '/Zotlabs/Update/_1226.php',
'Zotlabs\\Update\\_1227' => $baseDir . '/Zotlabs/Update/_1227.php',
'Zotlabs\\Update\\_1228' => $baseDir . '/Zotlabs/Update/_1228.php',
'Zotlabs\\Web\\Controller' => $baseDir . '/Zotlabs/Web/Controller.php',
'Zotlabs\\Web\\HTTPHeaders' => $baseDir . '/Zotlabs/Web/HTTPHeaders.php',
'Zotlabs\\Web\\HTTPSig' => $baseDir . '/Zotlabs/Web/HTTPSig.php',

View File

@ -1149,7 +1149,6 @@ class ComposerStaticInit7b34d7e50a62201ec5d5e526a5b8b35d
'Zotlabs\\Module\\Mood' => __DIR__ . '/../..' . '/Zotlabs/Module/Mood.php',
'Zotlabs\\Module\\Network' => __DIR__ . '/../..' . '/Zotlabs/Module/Network.php',
'Zotlabs\\Module\\New_channel' => __DIR__ . '/../..' . '/Zotlabs/Module/New_channel.php',
'Zotlabs\\Module\\Nojs' => __DIR__ . '/../..' . '/Zotlabs/Module/Nojs.php',
'Zotlabs\\Module\\Notes' => __DIR__ . '/../..' . '/Zotlabs/Module/Notes.php',
'Zotlabs\\Module\\Notifications' => __DIR__ . '/../..' . '/Zotlabs/Module/Notifications.php',
'Zotlabs\\Module\\Notify' => __DIR__ . '/../..' . '/Zotlabs/Module/Notify.php',
@ -1506,7 +1505,9 @@ class ComposerStaticInit7b34d7e50a62201ec5d5e526a5b8b35d
'Zotlabs\\Update\\_1223' => __DIR__ . '/../..' . '/Zotlabs/Update/_1223.php',
'Zotlabs\\Update\\_1224' => __DIR__ . '/../..' . '/Zotlabs/Update/_1224.php',
'Zotlabs\\Update\\_1225' => __DIR__ . '/../..' . '/Zotlabs/Update/_1225.php',
'Zotlabs\\Web\\CheckJS' => __DIR__ . '/../..' . '/Zotlabs/Web/CheckJS.php',
'Zotlabs\\Update\\_1226' => __DIR__ . '/../..' . '/Zotlabs/Update/_1226.php',
'Zotlabs\\Update\\_1227' => __DIR__ . '/../..' . '/Zotlabs/Update/_1227.php',
'Zotlabs\\Update\\_1228' => __DIR__ . '/../..' . '/Zotlabs/Update/_1228.php',
'Zotlabs\\Web\\Controller' => __DIR__ . '/../..' . '/Zotlabs/Web/Controller.php',
'Zotlabs\\Web\\HTTPHeaders' => __DIR__ . '/../..' . '/Zotlabs/Web/HTTPHeaders.php',
'Zotlabs\\Web\\HTTPSig' => __DIR__ . '/../..' . '/Zotlabs/Web/HTTPSig.php',

View File

@ -162,6 +162,47 @@
],
"description": "Internationalization library powered by CLDR data."
},
{
"name": "desandro/imagesloaded",
"version": "v4.1.4",
"version_normalized": "4.1.4.0",
"source": {
"type": "git",
"url": "https://github.com/desandro/imagesloaded.git",
"reference": "67c4e57453120935180c45c6820e7d3fbd2ea1f9"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/desandro/imagesloaded/zipball/67c4e57453120935180c45c6820e7d3fbd2ea1f9",
"reference": "67c4e57453120935180c45c6820e7d3fbd2ea1f9",
"shasum": ""
},
"time": "2018-01-02T16:53:35+00:00",
"type": "component",
"installation-source": "dist",
"notification-url": "https://packagist.org/downloads/",
"license": [
"MIT"
],
"authors": [
{
"name": "David DeSandro",
"homepage": "http://desandro.com/",
"role": "developer"
}
],
"description": "JavaScript is all like _You images done yet or what?_",
"homepage": "http://imagesloaded.desandro.com",
"keywords": [
"dom",
"images",
"javascript",
"jquery-plugin",
"library",
"loaded",
"ui"
]
},
{
"name": "ezyang/htmlpurifier",
"version": "v4.10.0",

View File

@ -0,0 +1,5 @@
bower_components/
node_modules/
_site/
build/
package-lock.json

12
vendor/desandro/imagesloaded/.jshintrc vendored Normal file
View File

@ -0,0 +1,12 @@
{
"browser": true,
"curly": true,
"newcap": false,
"strict": true,
"undef": true,
"unused": true,
"globals": {
"imagesLoaded": false,
"QUnit": false
}
}

362
vendor/desandro/imagesloaded/README.md vendored Normal file
View File

@ -0,0 +1,362 @@
# imagesLoaded
<p class="tagline">JavaScript is all like "You images done yet or what?"</p>
[imagesloaded.desandro.com](http://imagesloaded.desandro.com)
Detect when images have been loaded.
## Install
### Download
+ [imagesloaded.pkgd.min.js](https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js) minified
+ [imagesloaded.pkgd.js](https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.js) un-minified
### CDN
``` html
<script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
<!-- or -->
<script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.js"></script>
```
### Package managers
Install via [npm](https://www.npmjs.com/package/imagesloaded): `npm install imagesloaded`
Install via [Bower](http://bower.io): `bower install imagesloaded --save`
## jQuery
You can use imagesLoaded as a jQuery Plugin.
``` js
$('#container').imagesLoaded( function() {
// images have loaded
});
// options
$('#container').imagesLoaded( {
// options...
},
function() {
// images have loaded
}
);
```
`.imagesLoaded()` returns a [jQuery Deferred object](http://api.jquery.com/category/deferred-object/). This allows you to use `.always()`, `.done()`, `.fail()` and `.progress()`.
``` js
$('#container').imagesLoaded()
.always( function( instance ) {
console.log('all images loaded');
})
.done( function( instance ) {
console.log('all images successfully loaded');
})
.fail( function() {
console.log('all images loaded, at least one is broken');
})
.progress( function( instance, image ) {
var result = image.isLoaded ? 'loaded' : 'broken';
console.log( 'image is ' + result + ' for ' + image.img.src );
});
```
## Vanilla JavaScript
You can use imagesLoaded with vanilla JS.
``` js
imagesLoaded( elem, callback )
// options
imagesLoaded( elem, options, callback )
// you can use `new` if you like
new imagesLoaded( elem, callback )
```
+ `elem` _Element, NodeList, Array, or Selector String_
+ `options` _Object_
+ `callback` _Function_ - function triggered after all images have been loaded
Using a callback function is the same as binding it to the `always` event (see below).
``` js
// element
imagesLoaded( document.querySelector('#container'), function( instance ) {
console.log('all images are loaded');
});
// selector string
imagesLoaded( '#container', function() {...});
// multiple elements
var posts = document.querySelectorAll('.post');
imagesLoaded( posts, function() {...});
```
Bind events with vanilla JS with .on(), .off(), and .once() methods.
``` js
var imgLoad = imagesLoaded( elem );
function onAlways( instance ) {
console.log('all images are loaded');
}
// bind with .on()
imgLoad.on( 'always', onAlways );
// unbind with .off()
imgLoad.off( 'always', onAlways );
```
## Background
Detect when background images have loaded, in addition to `<img>`s.
Set `{ background: true }` to detect when the element's background image has loaded.
``` js
// jQuery
$('#container').imagesLoaded( { background: true }, function() {
console.log('#container background image loaded');
});
// vanilla JS
imagesLoaded( '#container', { background: true }, function() {
console.log('#container background image loaded');
});
```
[See jQuery demo](http://codepen.io/desandro/pen/pjVMPB) or [vanilla JS demo](http://codepen.io/desandro/pen/avKooW) on CodePen.
Set to a selector string like `{ background: '.item' }` to detect when the background images of child elements have loaded.
``` js
// jQuery
$('#container').imagesLoaded( { background: '.item' }, function() {
console.log('all .item background images loaded');
});
// vanilla JS
imagesLoaded( '#container', { background: '.item' }, function() {
console.log('all .item background images loaded');
});
```
[See jQuery demo](http://codepen.io/desandro/pen/avKoZL) or [vanilla JS demo](http://codepen.io/desandro/pen/vNrBGz) on CodePen.
## Events
### always
``` js
// jQuery
$('#container').imagesLoaded().always( function( instance ) {
console.log('ALWAYS - all images have been loaded');
});
// vanilla JS
imgLoad.on( 'always', function( instance ) {
console.log('ALWAYS - all images have been loaded');
});
```
Triggered after all images have been either loaded or confirmed broken.
+ `instance` _imagesLoaded_ - the imagesLoaded instance
### done
``` js
// jQuery
$('#container').imagesLoaded().done( function( instance ) {
console.log('DONE - all images have been successfully loaded');
});
// vanilla JS
imgLoad.on( 'done', function( instance ) {
console.log('DONE - all images have been successfully loaded');
});
```
Triggered after all images have successfully loaded without any broken images.
### fail
``` js
$('#container').imagesLoaded().fail( function( instance ) {
console.log('FAIL - all images loaded, at least one is broken');
});
// vanilla JS
imgLoad.on( 'fail', function( instance ) {
console.log('FAIL - all images loaded, at least one is broken');
});
```
Triggered after all images have been loaded with at least one broken image.
### progress
``` js
imgLoad.on( 'progress', function( instance, image ) {
var result = image.isLoaded ? 'loaded' : 'broken';
console.log( 'image is ' + result + ' for ' + image.img.src );
});
```
Triggered after each image has been loaded.
+ `instance` _imagesLoaded_ - the imagesLoaded instance
+ `image` _LoadingImage_ - the LoadingImage instance of the loaded image
<!-- sponsored -->
## Properties
### LoadingImage.img
_Image_ - The `img` element
### LoadingImage.isLoaded
_Boolean_ - `true` when the image has successfully loaded
### imagesLoaded.images
Array of _LoadingImage_ instances for each image detected
``` js
var imgLoad = imagesLoaded('#container');
imgLoad.on( 'always', function() {
console.log( imgLoad.images.length + ' images loaded' );
// detect which image is broken
for ( var i = 0, len = imgLoad.images.length; i < len; i++ ) {
var image = imgLoad.images[i];
var result = image.isLoaded ? 'loaded' : 'broken';
console.log( 'image is ' + result + ' for ' + image.img.src );
}
});
```
## Browserify
imagesLoaded works with [Browserify](http://browserify.org/).
``` bash
npm install imagesloaded --save
```
``` js
var imagesLoaded = require('imagesloaded');
imagesLoaded( elem, function() {...} );
```
Use `.makeJQueryPlugin` to make to use `.imagesLoaded()` jQuery plugin.
``` js
var $ = require('jquery');
var imagesLoaded = require('imagesloaded');
// provide jQuery argument
imagesLoaded.makeJQueryPlugin( $ );
// now use .imagesLoaded() jQuery plugin
$('#container').imagesLoaded( function() {...});
```
## Webpack
Install imagesLoaded with npm.
``` bash
npm install imagesloaded
```
You can then `require('imagesloaded')`.
``` js
// main.js
var imagesLoaded = require('imagesloaded');
imagesLoaded( '#container', function() {
// images have loaded
});
```
Use `.makeJQueryPlugin` to make `.imagesLoaded()` jQuery plugin.
``` js
// main.js
var imagesLoaded = require('imagesloaded');
var $ = require('jquery');
// provide jQuery argument
imagesLoaded.makeJQueryPlugin( $ );
// now use .imagesLoaded() jQuery plugin
$('#container').imagesLoaded( function() {...});
```
Run webpack.
``` bash
webpack main.js bundle.js
```
## RequireJS
imagesLoaded works with [RequireJS](http://requirejs.org).
You can require [imagesloaded.pkgd.js](http://imagesloaded.desandro.com/imagesloaded.pkgd.js).
``` js
requirejs( [
'path/to/imagesloaded.pkgd.js',
], function( imagesLoaded ) {
imagesLoaded( '#container', function() { ... });
});
```
Use `.makeJQueryPlugin` to make `.imagesLoaded()` jQuery plugin.
``` js
requirejs( [
'jquery',
'path/to/imagesloaded.pkgd.js',
], function( $, imagesLoaded ) {
// provide jQuery argument
imagesLoaded.makeJQueryPlugin( $ );
// now use .imagesLoaded() jQuery plugin
$('#container').imagesLoaded( function() {...});
});
```
You can manage dependencies with [Bower](http://bower.io). Set `baseUrl` to `bower_components` and set a path config for all your application code.
``` js
requirejs.config({
baseUrl: 'bower_components/',
paths: { // path to your app
app: '../'
}
});
requirejs( [
'imagesloaded/imagesloaded',
'app/my-component.js'
], function( imagesLoaded, myComp ) {
imagesLoaded( '#container', function() { ... });
});
```
## Browser support
+ IE9+
+ Android 2.3+
+ iOS Safari 4+
+ All other modern browsers
Use [imagesLoaded v3](http://imagesloaded.desandro.com/v3/) for IE8 support.
## MIT License
imagesLoaded is released under the [MIT License](http://desandro.mit-license.org/). Have at it.

37
vendor/desandro/imagesloaded/bower.json vendored Normal file
View File

@ -0,0 +1,37 @@
{
"name": "imagesloaded",
"description": "JavaScript is all like _You images done yet or what?_",
"main": "imagesloaded.js",
"dependencies": {
"ev-emitter": "^1.0.0"
},
"devDependencies": {
"jquery": ">=1.9 <4.0",
"qunit": "^2.0.0"
},
"ignore": [
"**/.*",
"test",
"package.json",
"composer.json",
"node_modules",
"bower_components",
"tests",
"sandbox/",
"gulpfile.js",
"contributing.md"
],
"homepage": "http://imagesloaded.desandro.com",
"authors": [
"David DeSandro"
],
"moduleType": [
"amd",
"globals",
"node"
],
"keywords": [
"images"
],
"license": "MIT"
}

View File

@ -0,0 +1,15 @@
{
"name": "desandro/imagesloaded",
"description": "JavaScript is all like _You images done yet or what?_",
"type": "component",
"keywords": ["javascript", "library", "images", "loaded", "dom", "ui", "jquery-plugin"],
"homepage": "http://imagesloaded.desandro.com",
"license": "MIT",
"authors": [
{
"name": "David DeSandro",
"homepage": "http://desandro.com/",
"role": "developer"
}
]
}

View File

@ -0,0 +1,20 @@
## Submitting issues
### Reduced test case required
All bug reports and problem issues require a [**reduced test case**](http://css-tricks.com/reduced-test-cases/).
+ A reduced test case clearly demonstrates the bug or issue.
+ It contains the bare minimum HTML, CSS, and JavaScript required to demonstrate the bug.
+ A link to your production site is **not** a reduced test case.
Create a test case by forking a [CodePen demos](http://codepen.io/desandro/pens/tags/?selected_tag=imagesloaded-docs).
+ [progress with jQuery](http://codepen.io/desandro/pen/bIFyl)
+ [progress with vanilla JS](http://codepen.io/desandro/pen/hlzaw)
+ [`{ background: true }` with jQuery](http://codepen.io/desandro/pen/pjVMPB)
+ [`{ background: true }` with vanilla JS](http://codepen.io/desandro/pen/avKooW)
+ [`{ background: '.selector' }` with jQuery](http://codepen.io/desandro/pen/avKoZL)
+ [`{ background: '.selector' }` with vanilla JS](http://codepen.io/desandro/pen/vNrBGz)
Providing a reduced test case is the best way to get your issue addressed. They help you point out the problem. They help me verify and debug the problem. They help others understand the problem. Without a reduced test case, your issue may be closed.

128
vendor/desandro/imagesloaded/gulpfile.js vendored Normal file
View File

@ -0,0 +1,128 @@
/*jshint node: true, strict: false */
var fs = require('fs');
var gulp = require('gulp');
var rename = require('gulp-rename');
var replace = require('gulp-replace');
// ----- hint ----- //
var jshint = require('gulp-jshint');
gulp.task( 'hint-js', function() {
return gulp.src('imagesloaded.js')
.pipe( jshint() )
.pipe( jshint.reporter('default') );
});
gulp.task( 'hint-test', function() {
return gulp.src('test/unit/*.js')
.pipe( jshint() )
.pipe( jshint.reporter('default') );
});
gulp.task( 'hint-task', function() {
return gulp.src('gulpfile.js')
.pipe( jshint() )
.pipe( jshint.reporter('default') );
});
var jsonlint = require('gulp-json-lint');
gulp.task( 'jsonlint', function() {
return gulp.src( '*.json' )
.pipe( jsonlint() )
.pipe( jsonlint.report('verbose') );
});
gulp.task( 'hint', [ 'hint-js', 'hint-test', 'hint-task', 'jsonlint' ]);
// -------------------------- RequireJS makes pkgd -------------------------- //
// refactored from gulp-requirejs-optimize
// https://www.npmjs.com/package/gulp-requirejs-optimize/
var gutil = require('gulp-util');
var chalk = require('chalk');
var rjsOptimize = require('gulp-requirejs-optimize');
// regex for banner comment
var reBannerComment = new RegExp('^\\s*(?:\\/\\*[\\s\\S]*?\\*\\/)\\s*');
function getBanner() {
var src = fs.readFileSync( 'imagesloaded.js', 'utf8' );
var matches = src.match( reBannerComment );
var banner = matches[0].replace( 'imagesLoaded', 'imagesLoaded PACKAGED' );
return banner;
}
function addBanner( str ) {
return replace( /^/, str );
}
gulp.task( 'requirejs', function() {
var banner = getBanner();
// HACK src is not needed
// should refactor rjsOptimize to produce src
return gulp.src('imagesloaded.js')
.pipe( rjsOptimize({
baseUrl: 'bower_components',
optimize: 'none',
include: [
'../imagesloaded'
]
}) )
// remove named module
.pipe( replace( "'../imagesloaded',", '' ) )
// add banner
.pipe( addBanner( banner ) )
.pipe( rename('imagesloaded.pkgd.js') )
.pipe( gulp.dest('.') );
});
// ----- uglify ----- //
var uglify = require('gulp-uglify');
gulp.task( 'uglify', [ 'requirejs' ], function() {
var banner = getBanner();
gulp.src('imagesloaded.pkgd.js')
.pipe( uglify() )
// add banner
.pipe( addBanner( banner ) )
.pipe( rename('imagesloaded.pkgd.min.js') )
.pipe( gulp.dest('.') );
});
// ----- version ----- //
// set version in source files
var minimist = require('minimist');
// use gulp version -t 1.2.3
gulp.task( 'version', function() {
var args = minimist( process.argv.slice(3) );
var version = args.t;
if ( !version || !/\d+\.\d+\.\d+/.test( version ) ) {
gutil.log( 'invalid version: ' + chalk.red( version ) );
return;
}
gutil.log( 'ticking version to ' + chalk.green( version ) );
gulp.src('imagesloaded.js')
.pipe( replace( /imagesLoaded v\d+\.\d+\.\d+/, 'imagesLoaded v' + version ) )
.pipe( gulp.dest('.') );
gulp.src( [ 'bower.json', 'package.json' ] )
.pipe( replace( /"version": "\d+\.\d+\.\d+"/, '"version": "' + version + '"' ) )
.pipe( gulp.dest('.') );
});
// ----- default ----- //
gulp.task( 'default', [
'hint',
'uglify'
]);

View File

@ -0,0 +1,377 @@
/*!
* imagesLoaded v4.1.4
* JavaScript is all like "You images are done yet or what?"
* MIT License
*/
( function( window, factory ) { 'use strict';
// universal module definition
/*global define: false, module: false, require: false */
if ( typeof define == 'function' && define.amd ) {
// AMD
define( [
'ev-emitter/ev-emitter'
], function( EvEmitter ) {
return factory( window, EvEmitter );
});
} else if ( typeof module == 'object' && module.exports ) {
// CommonJS
module.exports = factory(
window,
require('ev-emitter')
);
} else {
// browser global
window.imagesLoaded = factory(
window,
window.EvEmitter
);
}
})( typeof window !== 'undefined' ? window : this,
// -------------------------- factory -------------------------- //
function factory( window, EvEmitter ) {
'use strict';
var $ = window.jQuery;
var console = window.console;
// -------------------------- helpers -------------------------- //
// extend objects
function extend( a, b ) {
for ( var prop in b ) {
a[ prop ] = b[ prop ];
}
return a;
}
var arraySlice = Array.prototype.slice;
// turn element or nodeList into an array
function makeArray( obj ) {
if ( Array.isArray( obj ) ) {
// use object if already an array
return obj;
}
var isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
if ( isArrayLike ) {
// convert nodeList to array
return arraySlice.call( obj );
}
// array of single index
return [ obj ];
}
// -------------------------- imagesLoaded -------------------------- //
/**
* @param {Array, Element, NodeList, String} elem
* @param {Object or Function} options - if function, use as callback
* @param {Function} onAlways - callback function
*/
function ImagesLoaded( elem, options, onAlways ) {
// coerce ImagesLoaded() without new, to be new ImagesLoaded()
if ( !( this instanceof ImagesLoaded ) ) {
return new ImagesLoaded( elem, options, onAlways );
}
// use elem as selector string
var queryElem = elem;
if ( typeof elem == 'string' ) {
queryElem = document.querySelectorAll( elem );
}
// bail if bad element
if ( !queryElem ) {
console.error( 'Bad element for imagesLoaded ' + ( queryElem || elem ) );
return;
}
this.elements = makeArray( queryElem );
this.options = extend( {}, this.options );
// shift arguments if no options set
if ( typeof options == 'function' ) {
onAlways = options;
} else {
extend( this.options, options );
}
if ( onAlways ) {
this.on( 'always', onAlways );
}
this.getImages();
if ( $ ) {
// add jQuery Deferred object
this.jqDeferred = new $.Deferred();
}
// HACK check async to allow time to bind listeners
setTimeout( this.check.bind( this ) );
}
ImagesLoaded.prototype = Object.create( EvEmitter.prototype );
ImagesLoaded.prototype.options = {};
ImagesLoaded.prototype.getImages = function() {
this.images = [];
// filter & find items if we have an item selector
this.elements.forEach( this.addElementImages, this );
};
/**
* @param {Node} element
*/
ImagesLoaded.prototype.addElementImages = function( elem ) {
// filter siblings
if ( elem.nodeName == 'IMG' ) {
this.addImage( elem );
}
// get background image on element
if ( this.options.background === true ) {
this.addElementBackgroundImages( elem );
}
// find children
// no non-element nodes, #143
var nodeType = elem.nodeType;
if ( !nodeType || !elementNodeTypes[ nodeType ] ) {
return;
}
var childImgs = elem.querySelectorAll('img');
// concat childElems to filterFound array
for ( var i=0; i < childImgs.length; i++ ) {
var img = childImgs[i];
this.addImage( img );
}
// get child background images
if ( typeof this.options.background == 'string' ) {
var children = elem.querySelectorAll( this.options.background );
for ( i=0; i < children.length; i++ ) {
var child = children[i];
this.addElementBackgroundImages( child );
}
}
};
var elementNodeTypes = {
1: true,
9: true,
11: true
};
ImagesLoaded.prototype.addElementBackgroundImages = function( elem ) {
var style = getComputedStyle( elem );
if ( !style ) {
// Firefox returns null if in a hidden iframe https://bugzil.la/548397
return;
}
// get url inside url("...")
var reURL = /url\((['"])?(.*?)\1\)/gi;
var matches = reURL.exec( style.backgroundImage );
while ( matches !== null ) {
var url = matches && matches[2];
if ( url ) {
this.addBackground( url, elem );
}
matches = reURL.exec( style.backgroundImage );
}
};
/**
* @param {Image} img
*/
ImagesLoaded.prototype.addImage = function( img ) {
var loadingImage = new LoadingImage( img );
this.images.push( loadingImage );
};
ImagesLoaded.prototype.addBackground = function( url, elem ) {
var background = new Background( url, elem );
this.images.push( background );
};
ImagesLoaded.prototype.check = function() {
var _this = this;
this.progressedCount = 0;
this.hasAnyBroken = false;
// complete if no images
if ( !this.images.length ) {
this.complete();
return;
}
function onProgress( image, elem, message ) {
// HACK - Chrome triggers event before object properties have changed. #83
setTimeout( function() {
_this.progress( image, elem, message );
});
}
this.images.forEach( function( loadingImage ) {
loadingImage.once( 'progress', onProgress );
loadingImage.check();
});
};
ImagesLoaded.prototype.progress = function( image, elem, message ) {
this.progressedCount++;
this.hasAnyBroken = this.hasAnyBroken || !image.isLoaded;
// progress event
this.emitEvent( 'progress', [ this, image, elem ] );
if ( this.jqDeferred && this.jqDeferred.notify ) {
this.jqDeferred.notify( this, image );
}
// check if completed
if ( this.progressedCount == this.images.length ) {
this.complete();
}
if ( this.options.debug && console ) {
console.log( 'progress: ' + message, image, elem );
}
};
ImagesLoaded.prototype.complete = function() {
var eventName = this.hasAnyBroken ? 'fail' : 'done';
this.isComplete = true;
this.emitEvent( eventName, [ this ] );
this.emitEvent( 'always', [ this ] );
if ( this.jqDeferred ) {
var jqMethod = this.hasAnyBroken ? 'reject' : 'resolve';
this.jqDeferred[ jqMethod ]( this );
}
};
// -------------------------- -------------------------- //
function LoadingImage( img ) {
this.img = img;
}
LoadingImage.prototype = Object.create( EvEmitter.prototype );
LoadingImage.prototype.check = function() {
// If complete is true and browser supports natural sizes,
// try to check for image status manually.
var isComplete = this.getIsImageComplete();
if ( isComplete ) {
// report based on naturalWidth
this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
return;
}
// If none of the checks above matched, simulate loading on detached element.
this.proxyImage = new Image();
this.proxyImage.addEventListener( 'load', this );
this.proxyImage.addEventListener( 'error', this );
// bind to image as well for Firefox. #191
this.img.addEventListener( 'load', this );
this.img.addEventListener( 'error', this );
this.proxyImage.src = this.img.src;
};
LoadingImage.prototype.getIsImageComplete = function() {
// check for non-zero, non-undefined naturalWidth
// fixes Safari+InfiniteScroll+Masonry bug infinite-scroll#671
return this.img.complete && this.img.naturalWidth;
};
LoadingImage.prototype.confirm = function( isLoaded, message ) {
this.isLoaded = isLoaded;
this.emitEvent( 'progress', [ this, this.img, message ] );
};
// ----- events ----- //
// trigger specified handler for event type
LoadingImage.prototype.handleEvent = function( event ) {
var method = 'on' + event.type;
if ( this[ method ] ) {
this[ method ]( event );
}
};
LoadingImage.prototype.onload = function() {
this.confirm( true, 'onload' );
this.unbindEvents();
};
LoadingImage.prototype.onerror = function() {
this.confirm( false, 'onerror' );
this.unbindEvents();
};
LoadingImage.prototype.unbindEvents = function() {
this.proxyImage.removeEventListener( 'load', this );
this.proxyImage.removeEventListener( 'error', this );
this.img.removeEventListener( 'load', this );
this.img.removeEventListener( 'error', this );
};
// -------------------------- Background -------------------------- //
function Background( url, element ) {
this.url = url;
this.element = element;
this.img = new Image();
}
// inherit LoadingImage prototype
Background.prototype = Object.create( LoadingImage.prototype );
Background.prototype.check = function() {
this.img.addEventListener( 'load', this );
this.img.addEventListener( 'error', this );
this.img.src = this.url;
// check if image is already complete
var isComplete = this.getIsImageComplete();
if ( isComplete ) {
this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
this.unbindEvents();
}
};
Background.prototype.unbindEvents = function() {
this.img.removeEventListener( 'load', this );
this.img.removeEventListener( 'error', this );
};
Background.prototype.confirm = function( isLoaded, message ) {
this.isLoaded = isLoaded;
this.emitEvent( 'progress', [ this, this.element, message ] );
};
// -------------------------- jQuery -------------------------- //
ImagesLoaded.makeJQueryPlugin = function( jQuery ) {
jQuery = jQuery || window.jQuery;
if ( !jQuery ) {
return;
}
// set local variable
$ = jQuery;
// $().imagesLoaded()
$.fn.imagesLoaded = function( options, callback ) {
var instance = new ImagesLoaded( this, options, callback );
return instance.jqDeferred.promise( $(this) );
};
};
// try making plugin
ImagesLoaded.makeJQueryPlugin();
// -------------------------- -------------------------- //
return ImagesLoaded;
});

View File

@ -1,11 +1,11 @@
/*!
* imagesLoaded PACKAGED v4.1.0
* imagesLoaded PACKAGED v4.1.4
* JavaScript is all like "You images are done yet or what?"
* MIT License
*/
/**
* EvEmitter v1.0.1
* EvEmitter v1.1.0
* Lil' event emitter
* MIT License
*/
@ -14,7 +14,7 @@
( function( global, factory ) {
// universal module definition
/* jshint strict: false */ /* globals define, module */
/* jshint strict: false */ /* globals define, module, window */
if ( typeof define == 'function' && define.amd ) {
// AMD - RequireJS
define( 'ev-emitter/ev-emitter',factory );
@ -26,7 +26,7 @@
global.EvEmitter = factory();
}
}( this, function() {
}( typeof window != 'undefined' ? window : this, function() {
@ -59,8 +59,8 @@ proto.once = function( eventName, listener ) {
// set once flag
// set onceEvents hash
var onceEvents = this._onceEvents = this._onceEvents || {};
// set onceListeners array
var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || [];
// set onceListeners object
var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
// set flag
onceListeners[ listener ] = true;
@ -85,13 +85,14 @@ proto.emitEvent = function( eventName, args ) {
if ( !listeners || !listeners.length ) {
return;
}
var i = 0;
var listener = listeners[i];
// copy over to avoid interference if .off() in listener
listeners = listeners.slice(0);
args = args || [];
// once stuff
var onceListeners = this._onceEvents && this._onceEvents[ eventName ];
while ( listener ) {
for ( var i=0; i < listeners.length; i++ ) {
var listener = listeners[i]
var isOnce = onceListeners && onceListeners[ listener ];
if ( isOnce ) {
// remove listener
@ -102,20 +103,22 @@ proto.emitEvent = function( eventName, args ) {
}
// trigger listener
listener.apply( this, args );
// get next listener
i += isOnce ? 0 : 1;
listener = listeners[i];
}
return this;
};
proto.allOff = function() {
delete this._events;
delete this._onceEvents;
};
return EvEmitter;
}));
/*!
* imagesLoaded v4.1.0
* imagesLoaded v4.1.4
* JavaScript is all like "You images are done yet or what?"
* MIT License
*/
@ -146,7 +149,7 @@ return EvEmitter;
);
}
})( window,
})( typeof window !== 'undefined' ? window : this,
// -------------------------- factory -------------------------- //
@ -167,22 +170,23 @@ function extend( a, b ) {
return a;
}
var arraySlice = Array.prototype.slice;
// turn element or nodeList into an array
function makeArray( obj ) {
var ary = [];
if ( Array.isArray( obj ) ) {
// use object if already an array
ary = obj;
} else if ( typeof obj.length == 'number' ) {
// convert nodeList to array
for ( var i=0; i < obj.length; i++ ) {
ary.push( obj[i] );
}
} else {
// array of single index
ary.push( obj );
return obj;
}
return ary;
var isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
if ( isArrayLike ) {
// convert nodeList to array
return arraySlice.call( obj );
}
// array of single index
return [ obj ];
}
// -------------------------- imagesLoaded -------------------------- //
@ -198,13 +202,19 @@ function ImagesLoaded( elem, options, onAlways ) {
return new ImagesLoaded( elem, options, onAlways );
}
// use elem as selector string
var queryElem = elem;
if ( typeof elem == 'string' ) {
elem = document.querySelectorAll( elem );
queryElem = document.querySelectorAll( elem );
}
// bail if bad element
if ( !queryElem ) {
console.error( 'Bad element for imagesLoaded ' + ( queryElem || elem ) );
return;
}
this.elements = makeArray( elem );
this.elements = makeArray( queryElem );
this.options = extend( {}, this.options );
// shift arguments if no options set
if ( typeof options == 'function' ) {
onAlways = options;
} else {
@ -223,9 +233,7 @@ function ImagesLoaded( elem, options, onAlways ) {
}
// HACK check async to allow time to bind listeners
setTimeout( function() {
this.check();
}.bind( this ));
setTimeout( this.check.bind( this ) );
}
ImagesLoaded.prototype = Object.create( EvEmitter.prototype );
@ -393,7 +401,9 @@ LoadingImage.prototype.check = function() {
};
LoadingImage.prototype.getIsImageComplete = function() {
return this.img.complete && this.img.naturalWidth !== undefined;
// check for non-zero, non-undefined naturalWidth
// fixes Safari+InfiniteScroll+Masonry bug infinite-scroll#671
return this.img.complete && this.img.naturalWidth;
};
LoadingImage.prototype.confirm = function( isLoaded, message ) {

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,48 @@
{
"name": "imagesloaded",
"version": "4.1.4",
"description": "JavaScript is all like _You images done yet or what?_",
"main": "imagesloaded.js",
"dependencies": {
"ev-emitter": "^1.0.0"
},
"devDependencies": {
"chalk": "^1.1.1",
"cheerio": "^0.19.0",
"gulp": "^3.9.0",
"gulp-jshint": "^1.11.2",
"gulp-json-lint": "^0.1.0",
"gulp-rename": "^1.2.2",
"gulp-replace": "^0.5.4",
"gulp-requirejs-optimize": "github:metafizzy/gulp-requirejs-optimize",
"gulp-uglify": "^1.4.2",
"gulp-util": "^3.0.7",
"highlight.js": "^8.9.1",
"marked": "^0.3.5",
"minimist": "^1.2.0",
"transfob": "^1.0.0"
},
"repository": {
"type": "git",
"url": "git://github.com/desandro/imagesloaded.git"
},
"keywords": [
"images",
"loaded",
"ui",
"dom",
"jquery-plugin"
],
"license": "MIT",
"bugs": {
"url": "https://github.com/desandro/imagesloaded/issues"
},
"homepage": "https://github.com/desandro/imagesloaded",
"directories": {
"test": "test"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "David DeSandro"
}

View File

@ -0,0 +1,29 @@
.box {
width: 300px;
height: 300px;
margin: 0 20px 20px 0;
border: 1px solid;
display: inline-block;
}
.orange-tree {
background: url('http://i.imgur.com/bwy74ok.jpg');
background-size: cover;
}
.thunder-cloud {
background: url('../../../test/img/thunder-cloud.jpg');
background-size: contain;
}
.multi1 {
background:
url("http://i.imgur.com/ZAVN3.png"),
url('http://i.imgur.com/6UdOxeB.png') bottom right,
url(http://i.imgur.com/LkmcILl.jpg);
background-size: cover;
}
.blue {
background: #09F;
}

View File

@ -0,0 +1,51 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>background</title>
<!-- put in separate folder so JS path is different from CSS path -->
<link rel="stylesheet" href="css/background.css" >
</head>
<body>
<h1>background</h1>
<div class="box orange-tree"></div>
<div class="box thunder-cloud"></div>
<div class="box multi1"></div>
<div class="box blue"></div>
<script src="../../bower_components/ev-emitter/ev-emitter.js"></script>
<script src="../../imagesloaded.js"></script>
<script>
var imgLoad0 = imagesLoaded( '.orange-tree', { background: true }, function() {
console.log('orange tree bg images loaded', imgLoad0.images.length );
});
var imgLoad1 = imagesLoaded( '.thunder-cloud', { background: true }, function() {
console.log('thunder cloud bg images loaded', imgLoad1.images.length);
});
var imgLoad2 = imagesLoaded( '.multi1', { background: true }, function() {
console.log('multi1 bg images loaded', imgLoad2.images.length);
});
var imgLoad3 = imagesLoaded( '.box', { background: true }, function() {
console.log('.box bg images loaded', imgLoad3.images.length);
});
imgLoad3.on('progress', function( instance, image, element ) {
console.log( 'progress on .box', image.img.src, element.className );
});
</script>
</body>
</html>

View File

@ -0,0 +1,89 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>progress</title>
<style>
#image-container img {
max-height: 140px;
}
li {
height: 140px;
min-width: 100px;
display: block;
float: left;
list-style: none;
margin: 0 5px 5px 0;
background-color: black;
background-position: center center;
background-repeat: no-repeat;
}
li img,
#status {
-webkit-transition: opacity 0.4s;
-moz-transition: opacity 0.4s;
-ms-transition: opacity 0.4s;
transition: opacity 0.4s;
}
li.is-loading {
background-color: black;
background-image: url('http://desandro.github.io/imagesloaded/assets/loading.gif');
}
li.is-broken {
background-image: url('http://desandro.github.io/imagesloaded/assets/broken.png');
background-color: #be3730;
width: 120px;
}
li.is-loading img,
li.is-broken img {
opacity: 0;
}
.buttons { margin-bottom: 1.0em; }
button {
font-size: 18px;
padding: 0.4em 0.8em;
font-family: sans-serif;
}
#status {
opacity: 0;
position: fixed;
right: 20px;
top: 20px;
background: hsla( 0, 0%, 0%, 0.8);
padding: 20px;
border-radius: 10px;
z-index: 2; /* over other stuff */
}
</style>
</head>
<body>
<h1>progress</h1>
<div class="buttons">
<button id="add">Add images</button>
<button id="reset">Reset</button>
</div>
<div id="status">
<progress max="7" value="0"></progress>
</div>
<div id="image-container"></div>
<script src="../../bower_components/ev-emitter/ev-emitter.js"></script>
<script src="../../imagesloaded.js"></script>
<script src="progress.js"></script>
</body>
</html>

View File

@ -0,0 +1,111 @@
/* jshint strict: false */
var progressElem, statusElem;
var supportsProgress;
var loadedImageCount, imageCount;
var container = document.querySelector('#image-container');
statusElem = document.querySelector('#status');
progressElem = document.querySelector('progress');
supportsProgress = progressElem &&
// IE does not support progress
progressElem.toString().indexOf('Unknown') === -1;
document.querySelector('#add').onclick = function() {
// add new images
var fragment = getItemsFragment();
container.insertBefore( fragment, container.firstChild );
// use ImagesLoaded
var imgLoad = imagesLoaded( container );
imgLoad.on( 'progress', onProgress );
imgLoad.on( 'always', onAlways );
// reset progress counter
imageCount = imgLoad.images.length;
resetProgress();
updateProgress( 0 );
};
// reset container
document.querySelector('#reset').onclick = function() {
empty( container );
};
// ----- set text helper ----- //
var docElem = document.documentElement;
var textSetter = docElem.textContent !== undefined ? 'textContent' : 'innerText';
function setText( elem, value ) {
elem[ textSetter ] = value;
}
function empty( elem ) {
while ( elem.firstChild ) {
elem.removeChild( elem.firstChild );
}
}
// ----- ----- //
// return doc fragment with
function getItemsFragment() {
var fragment = document.createDocumentFragment();
for ( var i = 0; i < 7; i++ ) {
var item = getImageItem();
fragment.appendChild( item );
}
return fragment;
}
// return an <li> with a <img> in it
function getImageItem() {
var item = document.createElement('li');
item.className = 'is-loading';
var img = document.createElement('img');
var size = Math.random() * 3 + 1;
var width = Math.random() * 110 + 100;
width = Math.round( width * size );
var height = Math.round( 140 * size );
var rando = Math.ceil( Math.random() * 1000 );
// 10% chance of broken image src
// random parameter to prevent cached images
img.src = rando < 100 ? '//foo/broken-' + rando + '.jpg' :
// use picsum for great random images
'https://picsum.photos/' + width + '/' + height + '/' + '?random';
item.appendChild( img );
return item;
}
// ----- ----- //
function resetProgress() {
statusElem.style.opacity = 1;
loadedImageCount = 0;
if ( supportsProgress ) {
progressElem.setAttribute( 'max', imageCount );
}
}
function updateProgress( value ) {
if ( supportsProgress ) {
progressElem.setAttribute( 'value', value );
} else {
// if you don't support progress elem
setText( statusElem, value + ' / ' + imageCount );
}
}
// triggered after each item is loaded
function onProgress( imgLoad, image ) {
// change class if the image is loaded or broken
image.img.parentNode.className = image.isLoaded ? '' : 'is-broken';
// update progress element
loadedImageCount++;
updateProgress( loadedImageCount );
}
// hide status when done
function onAlways() {
statusElem.style.opacity = 0;
}

View File

@ -0,0 +1,41 @@
img {
display: inline-block;
max-width: 240px;
}
/* ---- backgrounds ---- */
.bg-box {
width: 240px;
height: 240px;
margin: 0 20px 20px 0;
border: 1px solid;
display: inline-block;
}
.bg-box.tulip {
background: url('http://i.imgur.com/9xYjgCk.jpg');
background-size: cover;
}
.bg-box.thunder-cloud {
background: url('../img/thunder-cloud.jpg');
background-size: contain;
}
.bg-box.multi {
background:
url("http://i.imgur.com/ZAVN3.png"),
url('http://i.imgur.com/6UdOxeB.png') bottom right,
url(https://picsum.photos/601/401/?random);
background-size: cover;
}
.bg-box.blue {
background: #09F;
}
.bg-box.gulls {
background-image: url('http://i.imgur.com/qKhkOKC.jpg');
background-size: cover;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

View File

@ -0,0 +1,104 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>imagesLoaded tests</title>
<link rel="stylesheet" href="../bower_components/qunit/qunit/qunit.css" />
<link rel="stylesheet" href="css/tests.css" />
<script src="../bower_components/ev-emitter/ev-emitter.js"></script>
<script src="../bower_components/qunit/qunit/qunit.js"></script>
<script src="../bower_components/jquery/dist/jquery.js"></script>
<script src="../imagesloaded.js"></script>
<script src="unit/basics.js"></script>
<script src="unit/selector-string.js"></script>
<script src="unit/single-element.js"></script>
<script src="unit/local-files.js"></script>
<script src="unit/data-uri.js"></script>
<script src="unit/append.js"></script>
<script src="unit/no-images.js"></script>
<script src="unit/jquery-success.js"></script>
<script src="unit/jquery-fail.js"></script>
<script src="unit/non-element.js"></script>
<script src="unit/background.js"></script>
</head>
<body>
<h1>imagesLoaded tests</h1>
<div id="qunit"></div>
<h2>Basics</h2>
<div id="basics">
<img src="http://i.imgur.com/xrQHn.jpg" />
<img src="http://i.imgur.com/b3fBJ.jpg" />
<img src="http://i.imgur.com/xmSh2.jpg" />
<img src="http://i.imgur.com/iIpJm.jpg" />
<img src="http://i.imgur.com/cvZZl10.gif" />
</div>
<img id="mario-with-shell" src="http://i.imgur.com/ZAVN3.png" >
<h2>Locals</h2>
<div id="locals">
<img src="img/blue-shell.jpg" />
<img src="img/bowser-jr.jpg" />
<!-- thunder cloud has bad permissions, should 403 -->
<img src="img/not-there.jpg" />
</div>
<h2>Data URI</h2>
<div id="data-uri">
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAARgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQABAMDAwMDBAMDBAYEAwQGBwUEBAUHCAYGBwYGCAoICQkJCQgKCgwMDAwMCgwMDQ0MDBERERERFBQUFBQUFBQUFAEEBQUIBwgPCgoPFA4ODhQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQUFBQU/8AAEQgAMAAwAwERAAIRAQMRAf/EAJMAAAEFAQEBAAAAAAAAAAAAAAYAAwQHCAUBAgEAAgIDAQEAAAAAAAAAAAAAAAUEBgECAwcIEAABAwMDAgQFAwUAAAAAAAACAQMEEQUGACESMQdBUSIyYUJiExRSIwihgiQVFhEAAQMCBQEFBgcAAAAAAAAAAQARAgMEITFBEgVRYYGRIgZxocHRchPw4TJCIxQH/9oADAMBAAIRAxEAPwDf2hCWhC42R5JBxuF+RJq7JcqMWIC/uOmngnkKfMXh/TSTmOZt+MoGrVP0x1kez4nTwCl21rOvPbHvPRRMHuFzutmcuF2NClPyn1ERSjYNiXEQD4DTx389RvTl/VvrKNxUzqGRA6B2AHgt72lGlVMI/tbxRJqyKCloQloQm31eRlxY4iT6CqtCaqIqVNkVURaJXWk9207W3Ng+T9qyGfFUtPutrbyFIuazTtWRyy+1FbuIKyw9v6QiO7tODVdhEuXmldfM/qbi+arXMql2A2hDmAHQM7D29+Kt9tc04w20Rh7+9FkKZIx1VFhf8bkv3I5biqqu6p5Kvw0u9N+sL3iav9eX8tJ22dPoOnsy7FwrW8bnzZS6/NHkZ4pEdt42yZIxQlaP3DXwXX1LQqmrTjMxMNwfbLMdh7VWJBiQ7p3Xdapt99mMy5JkOC1HZEnHXTVBEQBKkSqvRERN9CFSFx7q5PkqOz8TfZs2ON8lizJDIvyZLadHlFxeLYF1BOKlTdadNWy34emIg1XMjoNElr35EmgEORO4uaXWUNnya2QMpxZ50FemSWBhuxXBJFB9tKGDn219ftAtvStdJvUnEQHHXEqQJIpTaP6jI7SwGrk5KVZ3z1IieDkfgqDkOf8AcEsmQ7FGbs+LspRm7SowzJkh2u7iNGvFhpE9iqJGXVeOvPfQX+Yw4+Iu+Q89zIOIPhSfqdanXSOQxxU6+5oSBhROA9/5Isgd08vxltq5ZQ+zfccNUKZIYZFiUwz4ugjXocEfcQ8UKnRa7a9cuOHpyiftOJDQ6pPR5AmTTCvONJYmR2ZcVwXosgBdYeBeQG2aIQkKp1RUWqaqZDJ0qL7p5U9nz1w7cY887FtMSQLGR3JteKyVb9TkJrxQK0F4/HcE8V1ZONsAwrVMtB8Uru7v7flGaGZlqdt8AGnXUOMwQqTYogjTolUTy1Z4yEkid1DwPIrzLzLKbNdba7GsFo+wlruDraCxL/IqQ/jkgopIAJ+9Ui9dKcemlUjWlUkCPKGbwXWpCAhEjMu697gZHfYmW4pabRbnZVjuzjwXa4NAJsRRZ4kX5JKKqCE2pfaUVH1pvXprANaE4iIwLv4IpxgYSJzGSnwLQ7cbe4DLyNx3iJRbVEIadFoi+emkpiJXEll2O1uXu9u5cLt1fnXZVinS1ZsFwMuSwjfWoRHK7q0p1RkvkqgL6aKlc5Pj3BrQ7x8fmn1pd7/Kc1W9zukjtr3AvuMX0VjPSpsm5WqQ5sEyFMeJ4XGyXYlFSVtxE3Eh36ppnYV4VKMRqAyj3luTJwuxIvzV6bKG2+ipJFRJQXdBXqqeVNMwAEs2mKYKZc7MItPG3NbH2PI4jLnH6gL01+IrocrIAllgkk26XgSaYJuG2XueJxHnOPjxAdq+XJaaHKCBHPFSYeQt2JoYDj9Ejigipruop4rrBiDmsGBlih+DOkdzc8s2K2BFkPtTI1wukltOTcOFDeB43XFTZFLigNoq1Ii26Lpdf3EKdEjUhgmdpbyEnK1plWF4pm8BLZltoi3eEKqTYSm0MmyXqTZ7EBbdQVF1R4VJQLxLJ2Q6zdlX8asvxO5O3TtPLbulofLktiukhWpbH0syTRRcBPAXaEn6i0+teV24T8VFq24mEMOdve/F3f8Awf8AjljPJRClS5sQIqeFeYOGS0+kFXTGXLUgMCosbJl9tdu+/FoeWEuHpKc3QZUSdFKMXxQnHGyT+4E0R5aiRiidk6IsX/jVmOW3Jq5d15bdqsrBcksdrfV2Y/T5XZIIgttr8yNciX9Q6X3XK7g0PFSqVuILSmLYbiuE2/8A1eJ2iLaIKrycbitoCuElfU4XuMt+pqq6QTqSmXkXUoBl/9k=" />
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAwCAMAAAC/knOqAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAMBQTFRFkF0QF27/Bgsp/fQF+fr6jqvpDEG2zp4CCx9Ys4IFo5JU8MqQXJH2Ulxj89QDC0bIsrKxIHn//fxztcv2iYqG5ebmCjCHzNjxAzTYRmih2drcCzijMof+OB8U/Pg59PHXE2D9xMK9eUMDAVf8kXNP/fvr2eP0p6WgOUtnAkX7Eljwa3WB5er2UXjVC0jZAh9/EFHa8PHyl5mZJVKt6NM34dzNz87NASGpsbzZDlDytq4tLWfs4bQFyLNp////+/v7DjziEwAAAEB0Uk5T////////////////////////////////////////////////////////////////////////////////////AMJ7sUQAAAPaSURBVHjadNWLdqo6EAZgQKGRA0YUYzRQY1ELqFykiojV93+rM0FQbLt/VlcvfpmVhGQq3V6TjgyjLOWyNIzR9sdn0stvE0MuQrmOZxmjf9pRybln+sJZspWZiSU7o7+twTmXtcU3BmhZ4f6/zLJk2ej+ttsyDIXVN4klsGzqmQP1ZXn9044TQbmcuS5Yx3Ic380cy2rj2qZJktzrui7MFqiDKlutcv1ip0mNseuGFbaedeVd235qGOMkAo4VJYB4AVcUbHG5erjxtN1ME8kwpgHybV0/63vbRF5QrUFk+7ADwpgGD82nva9+p4m+CQKYWFjwUH3YKYNkjPrnCr6/D4fz93f46WsKuIDqu8amPmGE5bnZr2u+fw2Hwwr3N4FYRZKsazshBLCggPv9S79K56saV+NRbU8McO6+ifSavL1dLtVQk2LYT7VtY/hcgnw8HgkGAL9Q2E78tDGJfWBV3CbiFwnqmzlsfmPXUDd2pTtUFAVVj6IIDtVNqmGtmW+aEYJQDZ9puM/gPTX7cNtBYeS7r+z+hVyfAp0+3gUsDsXKP5IXGLPne7uVUJf8TRFPEi1Ln1YVq/sbazzBbN8+v2LGjCguzNBtllVRwovoPtvnvcgYihlpLaueQeFRjY1f79vWhxfCGKpz54gVRYTZ7Nedn8JeiPNG7lhBGS2KIKdZ99edT6cKQjEiBGMf+UhhZRFQSnG02/60J9i0qmCMcsbimPGABkXIRYdQX+2EaaEcinOc57GWlWXpeR7cYqsUPWj0YksKN73QNEpLdZJer9d0rToeVC2LEG5+2rIqLjjXKKPJ6PrMxPJkK6DcsdSn3dIo5DnK8113de22tOHJWhyUDp88rBFFPEJxvruu0jYVOEE0tCyjsSMchQVBOZ3Px+MfeOehmHJLbs76LioKpuT5QND0hV4nnqZoGPrb3Z6iKNIUJc6Os5nA3ZfKTgCvGtq3Kuw2BIpMP5/O/8JGQEzC4N/BGuyuwAyZKYvtw/GOYc7A4RHf1ICNbUIi2blJqocJWt5Skm8OiyPo8aGufX/UQJvd9sSPZFUqKfGPcHRYPF0MBovT8VhXh3TT1cqgFM7kzESslEbqUezdyszJ4HvwKfhi8eCra0incwFm+1N9Hub9ztnffOqf+0/IY8BhpWbnTmfePjurs2iJZ922dXsPqQcMFouqWfbnLfst+ii05t7Stjd2lb0Y1Lt0hkA73y3bexNddzjs93S7yd5e9i4XaPFQ5tLqD5LohxfouG+S5G/u8T8+7l34Al25+7SHpVRlKS312fo4OA0Ws7Fe/1FaLg+V+l+AAQAurhhy+upm/wAAAABJRU5ErkJggg==" />
</div>
<h2>append</h2>
<div id="append"></div>
<h2>no images</h2>
<div id="no-images"></div>
<h2>jQuery success</h2>
<div id="jquery-success">
<img src="http://i.imgur.com/YbYCPFF.png" />
<img src="http://i.imgur.com/6UdOxeB.png" />
<img src="http://i.imgur.com/qd8G15D.png" />
</div>
<h2>jQuery fail</h2>
<div id="jquery-fail">
<img src="http://i.imgur.com/xmSh2.jpg" />
<img src="img/bowser-jr.jpg" />
<img src="http://i.imgur.com/ZAVN3.png">
<img src="img/not-there.jpg" />
<img src="foobar.jpg" />
</div>
<h2>background</h2>
<div id="background">
<div class="bg-box tulip"></div>
<div class="bg-box thunder-cloud"></div>
<div class="bg-box multi"></div>
<div class="bg-box blue"></div>
<div class="bg-box gulls">
<img src="https://picsum.photos/400/300/?random" />
<img src="https://picsum.photos/800/600/?random" />
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,30 @@
QUnit.test( 'append', function( assert ) {
'use strict';
var imgUrls = [
'http://i.imgur.com/bwy74ok.jpg',
'http://i.imgur.com/bAZWoqx.jpg',
'http://i.imgur.com/PgmEBSB.jpg',
'http://i.imgur.com/aboaFoB.jpg',
'http://i.imgur.com/LkmcILl.jpg',
'http://i.imgur.com/q9zO6tw.jpg'
];
// create images
var fragment = document.createDocumentFragment();
for ( var i=0, len = imgUrls.length; i < len; i++ ) {
var img = document.createElement('img');
img.src = imgUrls[i];
fragment.appendChild( img );
}
var elem = document.querySelector('#append');
elem.appendChild( fragment );
var done = assert.async();
imagesLoaded( elem, { debug: false } ).on( 'always', function() {
assert.ok( 'appended images loaded' );
done();
});
});

View File

@ -0,0 +1,70 @@
QUnit.test( 'background', function( assert ) {
'use strict';
// from Modernizr
var supportsMultiBGs = ( function() {
var style = document.createElement('a').style;
style.cssText = 'background:url(https://),url(https://),red url(https://)';
return (/(url\s*\(.*?){3}/).test(style.background);
})();
var multiBGCount = supportsMultiBGs ? 3 : 0;
var done = assert.async( 14 + multiBGCount );
var imgLoad0 = imagesLoaded( '#background .tulip', { background: true }, function() {
assert.ok( true, 'callback triggered on .orange-tree');
done();
});
assert.equal( imgLoad0.images.length, 1, '1 image on .images' );
imgLoad0.on( 'progress', function( instance, image, element ) {
assert.ok( element.nodeName == 'DIV', 'progress; element is div');
assert.ok( image.isLoaded, 'progress; image.isLoaded');
done();
});
var imgLoad1 = imagesLoaded( '#background .thunder-cloud', { background: true }, function() {
assert.ok( true, 'callback triggered on .thunder-cloud');
done();
});
assert.equal( imgLoad1.images.length, 1, '1 image on .images' );
// multiple backgrounds
var imgLoad2 = imagesLoaded( '#background .multi', { background: true }, function() {
assert.ok( true, 'callback triggered on .multi');
done();
});
assert.equal( imgLoad2.images.length, multiBGCount, 'correct multiple BG count on .images' );
// multiple elements
var imgLoad3 = imagesLoaded( '#background .bg-box', { background: true }, function() {
assert.ok( true, 'callback triggered on .bg-box');
var count = 5 + multiBGCount;
assert.equal( imgLoad3.images.length, count, count + ' images on .bg-box' );
done();
});
imgLoad3.on('progress', function( instance, image/*, element */) {
assert.ok( true, 'progress on .bg-box; ' + image.img.src );
assert.equal( image.isLoaded, true, 'image.isLoaded == true' );
done();
});
// background and <img> children
var imgLoad4 = imagesLoaded( '#background .gulls', { background: true } );
assert.equal( imgLoad4.images.length, 3, '3 images: 1 background and 2 <img>' );
imgLoad4.on( 'progress', function( instance, image ) {
assert.equal( image.isLoaded, true, 'image is loaded' );
done();
});
// child background selector
var imgLoad5 = imagesLoaded( '#background', { background: '.bg-box' }, function() {
var count = 5 + multiBGCount;
assert.equal( imgLoad5.images.length, count,
count + ' images on .bg-box, with {background: .bg-box}' );
done();
});
});

View File

@ -0,0 +1,28 @@
QUnit.test( 'basics', function( assert ) {
'use strict';
var elem = document.querySelector('#basics');
var images = elem.querySelectorAll('img');
var done = assert.async( 3 + images.length );
var imgLoader = new imagesLoaded( elem, function( obj ) {
assert.ok( true, 'callback function triggered' );
assert.equal( imgLoader, obj, 'callback argument and instance match' );
done();
});
imgLoader.on( 'done', function() {
assert.ok( true, 'done event triggered' );
done();
});
imgLoader.on( 'always', function() {
assert.ok( true, 'always event triggered' );
done();
});
imgLoader.on( 'progress', function( loader, image ) {
assert.ok( image.isLoaded, 'image is loaded');
done();
});
});

View File

@ -0,0 +1,10 @@
QUnit.test( 'data-uri', function( assert ) {
'use strict';
var done = assert.async();
imagesLoaded('#data-uri', { debug: false }).on( 'done', function( obj ) {
assert.ok( true, 'data-uri images loaded' );
assert.equal( obj.images.length, 2, 'instance has 2 images' );
done();
});
});

View File

@ -0,0 +1,29 @@
QUnit.test( 'jquery fail', function( assert ) {
'use strict';
var $ = window.jQuery;
var $images = $('#jquery-fail img');
var done = assert.async( 3 + $images.length );
$('#jquery-fail').imagesLoaded( function( instance ) {
assert.ok( true, 'callback triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.fail( function( instance ) {
assert.ok( true, 'fail triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.always( function( instance ) {
assert.ok( true, 'always triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.progress( function(/* instance, image */) {
assert.ok( true, 'progress trigged');
done();
});
});

View File

@ -0,0 +1,28 @@
QUnit.test( 'jquery success', function( assert ) {
'use strict';
var $ = window.jQuery;
var done = assert.async( 6 );
$('#jquery-success').imagesLoaded( function( instance ) {
assert.ok( true, 'callback triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.done( function( instance ) {
assert.ok( true, 'done triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.always( function( instance ) {
assert.ok( true, 'always triggered' );
assert.ok( instance instanceof imagesLoaded, 'instance instanceof imagesLoaded' );
done();
})
.progress( function( instance, image ) {
assert.ok( image.isLoaded, 'progress trigged, image is loaded');
done();
});
});

View File

@ -0,0 +1,31 @@
QUnit.test( 'local files', function( assert ) {
'use strict';
var elem = document.querySelector('#locals');
var done = assert.async( 6 );
var imgLoader = new imagesLoaded( elem, function( obj ) {
assert.ok( true, 'callback function triggered' );
assert.equal( imgLoader, obj, 'callback argument and instance match' );
done();
});
imgLoader.on( 'fail', function() {
assert.ok( true, 'fail event triggered' );
done();
});
imgLoader.on( 'always', function() {
assert.ok( true, 'always event triggered' );
done();
});
imgLoader.on( 'progress', function( loader, image ) {
assert.ok( true, 'image progressed');
if ( image.img.src.indexOf('img/not-there.jpg') !== -1 ) {
assert.ok( !image.isLoaded, 'thunder cloud is not loaded' );
} else {
assert.ok( image.isLoaded, 'image is loaded' );
}
done();
});
});

View File

@ -0,0 +1,11 @@
QUnit.test( 'no images', function( assert ) {
'use strict';
var elem = document.querySelector('#no-images');
var done = assert.async();
imagesLoaded( elem, function() {
assert.ok( true, 'triggered with no images' );
done();
});
});

View File

@ -0,0 +1,24 @@
QUnit.test( 'dismiss non-element nodes', function( assert ) {
'use strict';
var $ = window.jQuery;
var done = assert.async( 2 );
$(' <img src="https://picsum.photos/401/301/?random" /> <img src="https://picsum.photos/402/302/?random" /> ')
.imagesLoaded(function() {
assert.ok( true, 'elements from jQuery string ok' );
done();
});
// test fragment
var frag = document.createDocumentFragment();
var img = new Image();
img.src = 'https://picsum.photos/403/303/?random';
frag.appendChild( img );
var imgLoad = imagesLoaded( frag, function() {
assert.ok( true, 'document fragment ok' );
assert.equal( imgLoad.images.length, 1, '1 image found' );
done();
});
});

View File

@ -0,0 +1,12 @@
QUnit.test( 'selector string', function( assert ) {
'use strict';
var images = document.querySelectorAll('#basics img');
var done = assert.async();
var imgLoad = imagesLoaded('#basics', { debug: true }).on( 'done', function( obj ) {
assert.ok( true, 'selector string worked' );
assert.ok( obj.images, 'argument has images' );
assert.equal( obj.images.length, images.length, 'images.length matches' );
done();
});
assert.ok( imgLoad.options.debug, 'debug option set' );
});

View File

@ -0,0 +1,11 @@
QUnit.test( 'single element', function( assert ) {
'use strict';
var elem = document.querySelector('#mario-with-shell');
var done = assert.async();
imagesLoaded( elem ).on( 'done', function( obj ) {
assert.ok( true, 'single element worked' );
assert.ok( obj.images, 'argument has images' );
assert.equal( obj.images.length, 1, 'images.length = 1' );
done();
});
});

View File

@ -36,7 +36,7 @@ head_add_js('/library/colorbox/jquery.colorbox-min.js');
head_add_js('/library/jquery.AreYouSure/jquery.are-you-sure.js');
head_add_js('/library/tableofcontents/jquery.toc.js');
head_add_js('/library/imagesloaded/imagesloaded.pkgd.min.js');
head_add_js('/vendor/desandro/imagesloaded/imagesloaded.pkgd.min.js');
/**
* Those who require this feature will know what to do with it.
* Those who don't, won't.