initial commit

.gitignore

@@ -0,0 +1,7 @@
+*~
+*.map
+a.out.*
+
+tiff-*
+zlib-*
+*.o

LICENSE

@@ -0,0 +1,52 @@
+/**
+   ----
+   zlib: http://www.zlib.net/
+   Copyright (C) 1995-2013 Jean-loup Gailly and Mark Adler
+
+   This software is provided 'as-is', without any express or implied
+   warranty.  In no event will the authors be held liable for any damages
+   arising from the use of this software.
+
+   Permission is granted to anyone to use this software for any purpose,
+   including commercial applications, and to alter it and redistribute it
+   freely, subject to the following restrictions:
+
+   1. The origin of this software must not be misrepresented; you must not
+   claim that you wrote the original software. If you use this software
+   in a product, an acknowledgment in the product documentation would be
+   appreciated but is not required.
+   2. Altered source versions must be plainly marked as such, and must not be
+   misrepresented as being the original software.
+   3. This notice may not be removed or altered from any source distribution.
+
+   Jean-loup Gailly        Mark Adler
+   [email protected]          [email protected]
+
+
+   The data format used by the zlib library is described by RFCs (Request for
+   Comments) 1950 to 1952 in the files http://tools.ietf.org/html/rfc1950
+   (zlib format), rfc1951 (deflate format) and rfc1952 (gzip format).
+   ----
+   LibTIFF: http://www.remotesensing.org/libtiff/
+   Copyright (c) 1988-1997 Sam Leffler
+   Copyright (c) 1991-1997 Silicon Graphics, Inc.
+
+   Permission to use, copy, modify, distribute, and sell this software and 
+   its documentation for any purpose is hereby granted without fee, provided
+   that (i) the above copyright notices and this permission notice appear in
+   all copies of the software and related documentation, and (ii) the names of
+   Sam Leffler and Silicon Graphics may not be used in any advertising or
+   publicity relating to the software without the specific, prior written
+   permission of Sam Leffler and Silicon Graphics.
+
+   THE SOFTWARE IS PROVIDED "AS-IS" AND WITHOUT WARRANTY OF ANY KIND, 
+   EXPRESS, IMPLIED OR OTHERWISE, INCLUDING WITHOUT LIMITATION, ANY 
+   WARRANTY OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE.  
+
+   IN NO EVENT SHALL SAM LEFFLER OR SILICON GRAPHICS BE LIABLE FOR
+   ANY SPECIAL, INCIDENTAL, INDIRECT OR CONSEQUENTIAL DAMAGES OF ANY KIND,
+   OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS,
+   WHETHER OR NOT ADVISED OF THE POSSIBILITY OF DAMAGE, AND ON ANY THEORY OF 
+   LIABILITY, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE 
+   OF THIS SOFTWARE.
+*/

README.md

@@ -0,0 +1,29 @@
+# tiff.js
+tiff.js is a port of LibTIFF by compiling the LibTIFF C code with Emscripten.
+
+See [demo](http://moon.kmc.gr.jp/~seikichi/tiffjs/1.html).
+
+## Usage
+Use tiff.min.js:
+
+    var xhr = new XMLHttpRequest();
+    xhr.responseType = 'arraybuffer';
+    xhr.open('GET', "tiff-image-url");
+    xhr.onload = function (e) {
+        var canvas = new Tiff(xhr.response).toCanvas();
+        // do something nice
+    };
+    xhr.send();
+
+When you load large tiff file,
+you will see the error message "Cannot enlarge memory arrays in asm.js" ([example](http://moon.kmc.gr.jp/~seikichi/tiffjs/2.html)).
+In that case, use tiff.memory\_growth.min.js (which is build with with "-s ALLOW\_MEMORY\_GROWTH=1" option)
+or set TiffSetting.TOTAL\_MEMORY as follow (set TiffSetting.TOTAL\_MEMORY before you load the tiff.min.js, [example](http://moon.kmc.gr.jp/~seikichi/tiffjs/3.html))
+
+    <script type="text/javascript">
+        var TiffSetting = { TOTAL_MEMORY: 16777216 * 10 };
+    </script>
+    <script src="path/to/tiff.min.js"></script>
+
+## License
+LibTIFF is LibTIFF Software License, zlib is zlib License, additional code is MIT.

build.sh

@@ -0,0 +1,38 @@
+#!/bin/bash
+
+export EMCC_CFLAGS="-O2"
+
+# build zlib
+ZLIB_PKGVER=1.2.8
+wget http://zlib.net/current/zlib-${ZLIB_PKGVER}.tar.gz
+tar xf zlib-${ZLIB_PKGVER}.tar.gz
+cd zlib-${ZLIB_PKGVER}
+emconfigure ./configure
+emmake make
+cd ..
+
+# build libtiff
+LIBTIFF_PKGVER=4.0.3
+wget ftp://ftp.remotesensing.org/pub/libtiff/tiff-${LIBTIFF_PKGVER}.tar.gz
+tar xzvf tiff-${LIBTIFF_PKGVER}.tar.gz
+cd tiff-${LIBTIFF_PKGVER}
+# see: https://github.com/kripken/emscripten/issues/662
+patch -p0 < ../tif_open.c.patch
+patch -p0 < ../tiff.h.patch
+emconfigure ./configure --enable-shared
+emmake make
+cd ..
+
+emcc -c export.c
+emcc -s EXPORTED_FUNCTIONS="['_TIFFFileToRGBAData','FS']" \
+    -o tmp1.js \
+    export.o \
+    tiff-${LIBTIFF_PKGVER}/libtiff/.libs/libtiff.a \
+    zlib-${ZLIB_PKGVER}/libz.a
+
+cat LICENSE tmp1.js export.js > tmp2.js
+cat LICENSE > tiff.min.js
+echo 'var TiffSetting;' >> tiff.min.js
+closure --js=tmp2.js \
+    --output_wrapper="(function(window,Module){%output%})(window,TiffSetting||{});" >> tiff.min.js
+rm tmp?.js

demo/1.html

@@ -0,0 +1,46 @@
+<!doctype html>
+<html>
+  <head>
+    <title>tiff.js demo</title>
+  </head>
+  <body>
+    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+    <script src="../tiff.min.js"></script>
+    <script type="text/javascript">
+$(function () {
+  var imageFiles = [
+    'minisblack-1c-16b.tiff',
+    'minisblack-1c-8b.tiff',
+    'minisblack-2c-8b-alpha.tiff',
+    'miniswhite-1c-1b.tiff',
+    'palette-1c-1b.tiff',
+    'palette-1c-4b.tiff',
+    'palette-1c-8b.tiff',
+    'rgb-3c-16b.tiff',
+    'rgb-3c-8b.tiff'
+  ];
+
+  var loadImage = function (filename) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', filename);
+    xhr.responseType = 'arraybuffer';
+    xhr.onload = function (e) {
+      var buffer = xhr.response;
+      var canvas = new Tiff(buffer).toCanvas();
+      if (canvas) {
+        var $elem = $('<div><div><a href="' + filename + '">' + filename + '</a></div></div>');
+        $elem.append(canvas);
+        $('body').append($elem);
+      }
+    };
+    xhr.send();
+  };
+
+  for (var i = 0, len = imageFiles.length; i < len; ++i) {
+    loadImage('images/' + imageFiles[i]);
+  }
+});
+
+    </script>
+  </body>
+</html>

demo/2.html

@@ -0,0 +1,36 @@
+<!doctype html>
+<html>
+  <head>
+    <title>tiff.js demo</title>
+  </head>
+  <body>
+    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+    <script src="../tiff.min.js"></script>
+    <script type="text/javascript">
+$(function () {
+  var imageFiles = [ '4838.tiff' ];
+
+  var loadImage = function (filename) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', filename);
+    xhr.responseType = 'arraybuffer';
+    xhr.onload = function (e) {
+      var buffer = xhr.response;
+      var canvas = new Tiff(buffer).toCanvas();
+      if (canvas) {
+        var $elem = $('<div><div><a href="' + filename + '">' + filename + '</a></div></div>');
+        $elem.append(canvas);
+        $('body').append($elem);
+      }
+    };
+    xhr.send();
+  };
+
+  for (var i = 0, len = imageFiles.length; i < len; ++i) {
+    loadImage('images/' + imageFiles[i]);
+  }
+});
+
+    </script>
+  </body>
+</html>

demo/3.html

@@ -0,0 +1,39 @@
+<!doctype html>
+<html>
+  <head>
+    <title>tiff.js demo</title>
+  </head>
+  <body>
+    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+    <script type="text/javascript">
+      var TiffSetting = { TOTAL_MEMORY: 16777216 * 40 };
+    </script>
+    <script src="../tiff.min.js"></script>
+    <script type="text/javascript">
+$(function () {
+  var imageFiles = [ '4838.tiff' ];
+
+  var loadImage = function (filename) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', filename);
+    xhr.responseType = 'arraybuffer';
+    xhr.onload = function (e) {
+      var buffer = xhr.response;
+      var canvas = new Tiff(buffer).toCanvas();
+      if (canvas) {
+        var $elem = $('<div><div><a href="' + filename + '">' + filename + '</a></div></div>');
+        $elem.append(canvas);
+        $('body').append($elem);
+      }
+    };
+    xhr.send();
+  };
+
+  for (var i = 0, len = imageFiles.length; i < len; ++i) {
+    loadImage('images/' + imageFiles[i]);
+  }
+});
+
+    </script>
+  </body>
+</html>

demo/4.html

@@ -0,0 +1,36 @@
+<!doctype html>
+<html>
+  <head>
+    <title>tiff.js demo</title>
+  </head>
+  <body>
+    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+    <script src="../tiff.memory_growth.min.js"></script>
+    <script type="text/javascript">
+$(function () {
+  var imageFiles = [ '4838.tiff' ];
+
+  var loadImage = function (filename) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', filename);
+    xhr.responseType = 'arraybuffer';
+    xhr.onload = function (e) {
+      var buffer = xhr.response;
+      var canvas = new Tiff(buffer).toCanvas();
+      if (canvas) {
+        var $elem = $('<div><div><a href="' + filename + '">' + filename + '</a></div></div>');
+        $elem.append(canvas);
+        $('body').append($elem);
+      }
+    };
+    xhr.send();
+  };
+
+  for (var i = 0, len = imageFiles.length; i < len; ++i) {
+    loadImage('images/' + imageFiles[i]);
+  }
+});
+
+    </script>
+  </body>
+</html>

demo/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html>
+  <head>
+    <title>tiff.js demo</title>
+  </head>
+  <body>
+    <ul>
+      <li><a href="1.html">simple example</a></li>
+      <li><a href="2.html">large tiff image (caues error)</a></li>
+      <li><a href="3.html">set TiffSetting.TOTAL_MEMORY</a></li>
+      <li><a href="4.html">use tiff.memory_growth.min.js (slow)</a></li>
+    </ul>
+  </body>
+</html>

export.c

@@ -0,0 +1,24 @@
+#include "tiffio.h"
+#include <stdlib.h>
+
+int TIFFFileToRGBAData(const char *filename,
+                       int *width,
+                       int *height,
+                       uint32 **rgba) {
+  size_t i;
+  TIFF* tif = TIFFOpen(filename, "r");
+  if (!tif) { return -1; }
+  TIFFGetField(tif, TIFFTAG_IMAGEWIDTH, width);
+  TIFFGetField(tif, TIFFTAG_IMAGELENGTH, height);
+
+  size_t npixels = (*width) * (*height);
+  *rgba = (uint32*)_TIFFmalloc(npixels * sizeof(uint32));
+  if (rgba == NULL ||
+      !TIFFReadRGBAImageOriented(tif, *width, *height,
+                                 *rgba, ORIENTATION_TOPLEFT, 0)) {
+    TIFFClose(tif);
+    return -1;
+  }
+  TIFFClose(tif);
+  return 0;
+}

export.js

@@ -0,0 +1,65 @@
+// export.js
+
+var TIFFFileToRGBAData = cwrap('TIFFFileToRGBAData', 'number', [
+  'string', 'number', 'number', 'number']);
+var malloc = cwrap('malloc', 'number', ['number']);
+var free = cwrap('free', 'number', ['number']);
+
+var Tiff = (function () {
+  function Tiff(arraybuffer) {
+    this.buffer = arraybuffer;
+  }
+  Tiff.prototype['toDataURL'] = function () {
+    var canvas = this.toCanvas();
+    return canvas ? canvas.toDataURL() : '';
+  };
+  var fileid = 0;
+  Tiff.prototype['toCanvas'] = function () {
+    var widthPtr = malloc(4);
+    var heightPtr = malloc(4);
+    var rgbaArrayPtr = malloc(4);
+
+    var filename = (++fileid) + '.tiff';
+    var canvas = null;
+
+    try {
+      FS.createDataFile('/', filename, new Uint8Array(this.buffer),
+                               true, false);
+      var result = TIFFFileToRGBAData(filename, widthPtr, heightPtr, rgbaArrayPtr);
+      if (result !== 0) { return null; }
+      var width = getValue(widthPtr, 'i32*');
+      var height = getValue(heightPtr, 'i32*');
+      var rgbaArray = getValue(rgbaArrayPtr, 'i32*');
+
+      canvas = document.createElement('canvas');
+      var data = HEAPU8.subarray(rgbaArray, rgbaArray + width * height * 4);
+      var context = canvas.getContext('2d');
+      var imageData = context.createImageData(width, height);
+      var pixelData = imageData.data;
+      if ('set' in pixelData) {
+        pixelData.set(data);
+      } else {
+        for (var i = 0, length = data.length; i < length; ++i) {
+          pixelData[i] = data[i];
+        }
+      }
+      canvas.width = width;
+      canvas.height = height;
+      context.putImageData(imageData, 0, 0);
+    } finally {
+      free(rgbaArray);
+      FS.deleteFile(filename);
+    }
+    free(rgbaArrayPtr);
+    free(heightPtr);
+    free(widthPtr);
+    return canvas;
+  };
+  return Tiff;
+})();
+
+if (typeof define === "function" && define.amd) {
+  define('tiff', [], function () { return Tiff; });
+} else if (typeof window === "object" && typeof window.document === "object") {
+  window['Tiff'] = Tiff;
+}