59 lines
2.1 KiB
HTML
59 lines
2.1 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>TIFF</title>
|
||
|
|
<style type="text/css">
|
||
|
|
figure {
|
||
|
|
border: 1px solid #000;
|
||
|
|
}
|
||
|
|
figcaption {
|
||
|
|
border-bottom: 1px solid #000;
|
||
|
|
padding: 0.25em;
|
||
|
|
background-color: #ccc;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<script type="text/javascript" src="/adapter/UTIF.js"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
function request(method, url, responseType) {
|
||
|
|
return new Promise(function(resolve, reject) {
|
||
|
|
var xhr = new XMLHttpRequest();
|
||
|
|
xhr.open(method, url);
|
||
|
|
if(responseType) xhr.responseType = responseType;
|
||
|
|
xhr.onload = resolve;
|
||
|
|
xhr.onerror = reject;
|
||
|
|
xhr.send();
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function createElementX(tag, attrs) {
|
||
|
|
var res = document.createElement(tag);
|
||
|
|
if(attrs) for(var k in attrs) if(attrs.hasOwnProperty(k)) res.setAttribute(k, attrs[k]);
|
||
|
|
for(var i = 2, child; i < arguments.length; ++i) res.appendChild((typeof (child = arguments[i]) === 'string') || (child instanceof String) ? document.createTextNode(child) : child);
|
||
|
|
return res;
|
||
|
|
}
|
||
|
|
|
||
|
|
var pathname = window.location.pathname, filename = document.title = pathname.split('/').pop();
|
||
|
|
|
||
|
|
var body = document.body;
|
||
|
|
var header = document.createElement('div');
|
||
|
|
header.append(createElementX('a', { href: pathname }, 'Download ' + filename))
|
||
|
|
body.appendChild(header);
|
||
|
|
|
||
|
|
request('GET', pathname, 'arraybuffer').then(function(evt) {
|
||
|
|
var filedata = evt.target.response;
|
||
|
|
var cnv = document.createElement('canvas'), ctx = cnv.getContext('2d'), img;
|
||
|
|
var pages = UTIF.decode(filedata), page;
|
||
|
|
for(var i = 0; i < pages.length; ++i) {
|
||
|
|
UTIF.decodeImage(filedata, page = pages[i], pages);
|
||
|
|
var rgba = UTIF.toRGBA8(page);
|
||
|
|
ctx.putImageData(new ImageData(new Uint8ClampedArray(rgba.buffer), cnv.width = page.width, cnv.height = page.height), 0, 0);
|
||
|
|
body.appendChild(createElementX('figure', null, createElementX('figcaption', null, 'Page ' + (i + 1) + ' of ' + pages.length), img = createElementX('img', { src: cnv.toDataURL() })));
|
||
|
|
img.style.width = '100%';
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|