Qimage

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

Checkout the Annotated Source Code

Installation

on NPM:

1npm 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

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

Making Anonymous Cross Origin requests

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

Multiple image loading

1Q.all([
2  Qimage("res1.png"),
3  Qimage("res2.png"),
4  Qimage("res3.png")
5])
6.spread(function (res1, res2, res3) {
7  document.body.appendChild(res1);
8  document.body.appendChild(res2);
9  document.body.appendChild(res3);
10});

Mixing with Qajax

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