UNMAINTAINED no need for a lib, see https://twitter.com/greweb/status/675620261232836608 – Simple Promise Image Loader based on Q
JavaScript HTML
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
build
docs
src
test
.gitignore
.travis.yml
Gruntfile.js
History.md
LICENSE
README.md
component.json
package.json

README.md

Qimage Build Status

Qimage is a simple Promise Image Loader library based on Q.

Checkout the Annotated Source Code

Installation

on NPM:

npm install qimage

Bower is also supported.

Usage Examples

Qimage takes an URL (string) and returns a Promise of Image.

Qimage(url: String) => Promise[Image]

Qimage.anonymously(url: String) => Promise[Image]

Simple example

Qimage("images/foo.png").then(function (img) {
  document.body.appendChild(img);
}, function (error) {
  document.body.innerHTML = "Unable to load the image";
});

Making Anonymous Cross Origin requests

Qimage.anonymously("https://example.com/image.jpg")
  .then(function (img) {
    // I'm now allowed to use img in a Canvas for instance. (CORS restriction)
    canvasctx.drawImage(img);
  });

Multiple image loading

Q.all([
  Qimage("res1.png"),
  Qimage("res2.png"),
  Qimage("res3.png")
])
.spread(function (res1, res2, res3) {
  document.body.appendChild(res1);
  document.body.appendChild(res2);
  document.body.appendChild(res3);
});

Mixing with Qajax

Qajax.getJSON("http://my-image-service.com/images/today.json?limit=10")
.get("images") // my json has an "images" array
.then(function (images) {
  // wait all images to load
  return Q.all(_.map(images, function (image) {
    return Qimage(image.url);
  }));
})
.then(function (imgs) {
  templatize(imgs);
})
.fail(displayError);