init

.gitignore

@@ -0,0 +1,15 @@
+node_modules
+*.log
+node_modules
+coverage
+dist
+**/.DS_Store
+lib
+.cache
+/*.js
+/*.map
+.*_cache
+
+!/*.config.js
+!/*.conf.js
+!/benchmark.js

.npmignore

@@ -0,0 +1,43 @@
+/*.js
+
+app
+src
+test
+
+*#
+node_modules
+bower_components
+ssl
+nbproject
+bower.json
+.DS_STORE
+.DS_Store
+*~
+*.swo
+*.swp
+*.swn
+*.swm
+.git
+.gitattributes
+.travis.yml
+.gitignore
+.idea
+.tmp
+.jshintrc
+.editorconfig
+*.md
+**/*.md
+__tests__
+.babelrc
+.eslintrc
+karma.conf.js
+scripts
+coverage
+*.webpack.js
+*.config.js
+.nyc_output
+yarn.lock
+tsconfig.json
+tslint.json
+.cache
+.vscode

.travis.yml

@@ -0,0 +1,30 @@
+sudo: false
+
+language: node_js
+
+node_js:
+  - '8'
+  - '10'
+
+env:
+- NODE_ENV=development
+
+git:
+  depth: 1
+
+cache:
+  yarn: true
+  directories:
+    - node_modules
+
+notifications:
+  email: false
+
+before_install:
+  - export CHROME_BIN=chromium-browser
+  - export DISPLAY=:99.0
+  - sh -e /etc/init.d/xvfb start
+
+before_script:
+  - "sudo chown root /usr/lib/chromium-browser/chrome-sandbox"
+  - "sudo chmod 4755 /usr/lib/chromium-browser/chrome-sandbox"

.vscode/settings.json

@@ -0,0 +1,22 @@
+{
+  "editor.formatOnSave": true,
+  "editor.tabSize": 2,
+  "editor.rulers": [
+    120
+  ],
+  "files.trimTrailingWhitespace": true,
+  "files.insertFinalNewline": true,
+  "files.exclude": {
+    "**/.git": true,
+    "**/.DS_Store": true,
+    "node_modules": true,
+    "test-lib": true,
+    "lib": true,
+    "coverage": true,
+    "npm": true
+  },
+  "eslint.enable": false,
+  "typescript.format.enable": false,
+  "tslint.enable": true,
+  "tslint.autoFixOnSave": true,
+}

LICENSE.md

@@ -0,0 +1,20 @@
+The MIT License (MIT)
+
+Copyright (c) 2018 José Luis Quintana <https://git.io/joseluisq>
+
+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.

README.md

@@ -0,0 +1,48 @@
+# Imgz [![npm](https://img.shields.io/npm/v/imgz.svg)](https://www.npmjs.com/package/imgz) [![npm](https://img.shields.io/npm/dt/imgz.svg)](https://www.npmjs.com/package/imgz) [![Build Status](https://travis-ci.org/joseluisq/imgz.svg?branch=master)](https://travis-ci.org/joseluisq/imgz) [![JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com/)
+
+> Tiny image sources loader.
+
+## Install
+
+[Yarn](https://github.com/yarnpkg/)
+
+```sh
+yarn add imgz --dev
+```
+
+[NPM](https://www.npmjs.com/)
+
+```sh
+npm install imgz --save-dev
+```
+
+The [UMD](https://github.com/umdjs/umd) and style builds are also available on [unpkg](https://unpkg.com).
+
+```html
+<link rel="stylesheet" href="https://unpkg.com/imgz/dist/imgz.min.css">
+```
+
+You can use the component via `window.imgz`
+
+## Usage
+
+```ts
+import { Loader } from 'imgz'
+
+const images = [
+  'https://i.imgur.com/G5MR088.png',
+  'http://server/not-found-image.png',
+  'https://i.imgur.com/G5MR088.png'
+]
+
+Loader(images, (img) => console.log('HTMLImageElement:', img))
+```
+
+## Contributions
+
+[Pull requests](https://github.com/joseluisq/imgz/pulls) or [issues](https://github.com/joseluisq/imgz/issues) are very appreciated.
+
+## License
+MIT license
+
+© 2018 [José Luis Quintana](http://git.io/joseluisq)

index.d.ts

@@ -0,0 +1,30 @@
+interface LoadEvent extends Event {
+  type: 'load'
+}
+
+interface ErrorEvent extends Event {
+  type: 'error'
+}
+
+type SourceLoaded = (image: HTMLImageElement | null, event: LoadEvent | ErrorEvent) => void
+
+/**
+ * Load one image string source
+ *
+ * @param source Image source URL
+ * @param sourceLoaded Callback executed per source loading. It includes 'success' or 'error' loadings.
+ * If source loading was successful `image` param will contains an `HTMLImageElement`, otherwise `null`.
+ * `event` param contains a 'load' or 'error' `Event` object
+ */
+export function Loader (source: string, sourceLoaded: SourceLoaded): void
+
+/**
+ * Load an array of image string sources
+ *
+ * @param sources Image source URLs
+ * @param sourceLoaded Callback executed per source loading. It includes 'success' or 'error' loadings.
+ * If source loading was successful `image` param will contains an `HTMLImageElement`, otherwise `null`.
+ * `event` param contains a 'load' or 'error' `Event` object
+ * @param completed Callback executed when all image sources were loaded
+ */
+export function Loader (sources: string[], sourceLoaded: SourceLoaded, completed?: () => void): void

karma.conf.js

@@ -0,0 +1,38 @@
+const realBrowser = String(process.env.BROWSER).match(/^(1|true)$/gi)
+const travisLaunchers = {
+  chrome_travis: {
+    base: 'Chrome',
+    flags: ['--no-sandbox']
+  }
+}
+
+const localBrowsers = realBrowser ? Object.keys(travisLaunchers) : ['Chrome']
+
+module.exports = (config) => {
+  const env = process.env['NODE_ENV'] || 'development'
+
+  config.set({
+    frameworks: ['jasmine', 'karma-typescript'],
+    plugins: [
+      'karma-jasmine',
+      'karma-typescript',
+      'karma-chrome-launcher',
+      'karma-jasmine-html-reporter',
+      'karma-spec-reporter'
+    ],
+    client: {
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    files: [{ pattern: 'src/**/*.ts' }, { pattern: 'test/**/*.spec.ts' }],
+    preprocessors: {
+      '**/*.ts': ['karma-typescript'],
+      'test/**/*.spec.ts': ['karma-typescript']
+    },
+    reporters: ['progress', 'kjhtml'],
+    colors: true,
+    logLevel: env === 'debug' ? config.LOG_DEBUG : config.LOG_INFO,
+    autoWatch: true,
+    browsers: localBrowsers,
+    singleRun: false
+  })
+}

package.json

@@ -0,0 +1,51 @@
+{
+  "name": "imgz",
+  "description": "Tiny image sources loader",
+  "version": "0.0.0",
+  "repository": "joseluisq/imgz",
+  "license": "MIT",
+  "main": "./dist/index.js",
+  "typings": "./dist/index.d.ts",
+  "files": [
+    "/dist/*.js",
+    "/dist/*.d.ts",
+    "/dist/*.map",
+    "README.md",
+    "LICENSE.md"
+  ],
+  "author": {
+    "name": "Jose Luis Quintana",
+    "url": "http://git.io/joseluisq"
+  },
+  "keywords": [
+    "image",
+    "loader",
+    "lazy-load"
+  ],
+  "scripts": {
+    "version": "npm run build",
+    "build": "env NODE_ENV=production PKG_NAME=$npm_package_name ./task build",
+    "test": "env NODE_ENV=testing ./task test"
+  },
+  "devDependencies": {
+    "@types/jasmine": "^2.8.8",
+    "@types/node": "^10.7.1",
+    "git-testing-hook": "^0.3.0",
+    "jasmine-core": "^3.2.1",
+    "jasmine-spec-reporter": "^4.2.1",
+    "karma": "^2.0.5",
+    "karma-chrome-launcher": "^2.2.0",
+    "karma-jasmine": "^1.1.2",
+    "karma-jasmine-html-reporter": "^1.3.0",
+    "karma-spec-reporter": "^0.0.32",
+    "karma-typescript": "^3.0.13",
+    "rollup": "^0.64.1",
+    "rollup-plugin-commonjs": "^9.1.5",
+    "rollup-plugin-node-resolve": "^3.3.0",
+    "rollup-plugin-terser": "^1.0.1",
+    "rollup-plugin-typescript2": "^0.16.1",
+    "tslint": "^5.11.0",
+    "tslint-config-standard-plus": "^2.1.1",
+    "typescript": "^2.9.2"
+  }
+}

rollup.config.js

@@ -0,0 +1,43 @@
+import commonjs from 'rollup-plugin-commonjs'
+import resolve from 'rollup-plugin-node-resolve'
+import typescript from 'rollup-plugin-typescript2'
+import { terser } from 'rollup-plugin-terser'
+import { name } from './package.json'
+
+const format = process.env.MODULE_FORMAT || 'cjs'
+const isUMD = (format === 'umd')
+const file = './dist/' + (isUMD ? name + '.min.js' : 'index.js')
+const output = {
+  name,
+  file,
+  format,
+  sourcemap: false,
+  exports: 'named'
+}
+const plugins = [
+  typescript()
+]
+
+if (isUMD) {
+  plugins.push(resolve())
+  plugins.push(terser())
+  plugins.push(commonjs({
+    sourceMap: false,
+    include: 'node_modules/emitus/index.js'
+  }))
+}
+
+export default {
+  input: 'src/index.ts',
+  output,
+  plugins,
+  onwarn
+}
+
+function onwarn(message) {
+  const suppressed = ['UNRESOLVED_IMPORT', 'THIS_IS_UNDEFINED']
+
+  if (!suppressed.find((code) => message.code === code)) {
+    return console.warn(message.message)
+  }
+}