1 | <!DOCTYPE html>
|
2 | <html lang="en">
|
3 | <head>
|
4 | <meta charset="utf-8">
|
5 | <title>JSDoc: Source: index.js</title>
|
6 |
|
7 | <script src="scripts/prettify/prettify.js"> </script>
|
8 | <script src="scripts/prettify/lang-css.js"> </script>
|
9 | |
10 |
|
11 |
|
12 | <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
|
13 | <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
|
14 | </head>
|
15 |
|
16 | <body>
|
17 |
|
18 | <div id="main">
|
19 |
|
20 | <h1 class="page-title">Source: index.js</h1>
|
21 |
|
22 |
|
23 |
|
24 |
|
25 |
|
26 |
|
27 | <section>
|
28 | <article>
|
29 | <pre class="prettyprint source linenums"><code>'use strict';
|
30 |
|
31 | /* jshint -W079 */
|
32 | var Blob = require('blob');
|
33 | var Promise = require('pouchdb-promise');
|
34 |
|
35 | //
|
36 | // PRIVATE
|
37 | //
|
38 |
|
39 | // From http://stackoverflow.com/questions/14967647/ (continues on next line)
|
40 | // encode-decode-image-with-base64-breaks-image (2013-04-21)
|
41 | function binaryStringToArrayBuffer(binary) {
|
42 | var length = binary.length;
|
43 | var buf = new ArrayBuffer(length);
|
44 | var arr = new Uint8Array(buf);
|
45 | var i = -1;
|
46 | while (++i < length) {
|
47 | arr[i] = binary.charCodeAt(i);
|
48 | }
|
49 | return buf;
|
50 | }
|
51 |
|
52 | // Can't find original post, but this is close
|
53 | // http://stackoverflow.com/questions/6965107/ (continues on next line)
|
54 | // converting-between-strings-and-arraybuffers
|
55 | function arrayBufferToBinaryString(buffer) {
|
56 | var binary = '';
|
57 | var bytes = new Uint8Array(buffer);
|
58 | var length = bytes.byteLength;
|
59 | var i = -1;
|
60 | while (++i < length) {
|
61 | binary += String.fromCharCode(bytes[i]);
|
62 | }
|
63 | return binary;
|
64 | }
|
65 |
|
66 | // doesn't download the image more than once, because
|
67 | // browsers aren't dumb. uses the cache
|
68 | function loadImage(src, crossOrigin) {
|
69 | return new Promise(function (resolve, reject) {
|
70 | var img = new Image();
|
71 | if (crossOrigin) {
|
72 | img.crossOrigin = crossOrigin;
|
73 | }
|
74 | img.onload = function () {
|
75 | resolve(img);
|
76 | };
|
77 | img.onerror = reject;
|
78 | img.src = src;
|
79 | });
|
80 | }
|
81 |
|
82 | function imgToCanvas(img) {
|
83 | var canvas = document.createElement('canvas');
|
84 |
|
85 | canvas.width = img.width;
|
86 | canvas.height = img.height;
|
87 |
|
88 | // copy the image contents to the canvas
|
89 | var context = canvas.getContext('2d');
|
90 | context.drawImage(
|
91 | img,
|
92 | 0, 0,
|
93 | img.width, img.height,
|
94 | 0, 0,
|
95 | img.width, img.height);
|
96 |
|
97 | return canvas;
|
98 | }
|
99 |
|
100 | //
|
101 | // PUBLIC
|
102 | //
|
103 |
|
104 | /**
|
105 | * Shim for
|
106 | * [new Blob()]{@link https://developer.mozilla.org/en-US/docs/Web/API/Blob.Blob}
|
107 | * to support
|
108 | * [older browsers that use the deprecated <code>BlobBuilder</code> API]{@link http://caniuse.com/blob}.
|
109 | *
|
110 | * @param {Array} parts - content of the <code>Blob</code>
|
111 | * @param {Object} options - usually just <code>{type: myContentType}</code>
|
112 | * @returns {Blob}
|
113 | */
|
114 | function createBlob(parts, options) {
|
115 | options = options || {};
|
116 | if (typeof options === 'string') {
|
117 | options = {type: options}; // do you a solid here
|
118 | }
|
119 | return new Blob(parts, options);
|
120 | }
|
121 |
|
122 | /**
|
123 | * Shim for
|
124 | * [URL.createObjectURL()]{@link https://developer.mozilla.org/en-US/docs/Web/API/URL.createObjectURL}
|
125 | * to support browsers that only have the prefixed
|
126 | * <code>webkitURL</code> (e.g. Android <4.4).
|
127 | * @param {Blob} blob
|
128 | * @returns {string} url
|
129 | */
|
130 | function createObjectURL(blob) {
|
131 | return (window.URL || window.webkitURL).createObjectURL(blob);
|
132 | }
|
133 |
|
134 | /**
|
135 | * Shim for
|
136 | * [URL.revokeObjectURL()]{@link https://developer.mozilla.org/en-US/docs/Web/API/URL.revokeObjectURL}
|
137 | * to support browsers that only have the prefixed
|
138 | * <code>webkitURL</code> (e.g. Android <4.4).
|
139 | * @param {string} url
|
140 | */
|
141 | function revokeObjectURL(url) {
|
142 | return (window.URL || window.webkitURL).revokeObjectURL(url);
|
143 | }
|
144 |
|
145 | /**
|
146 | * Convert a <code>Blob</code> to a binary string. Returns a Promise.
|
147 | *
|
148 | * @param {Blob} blob
|
149 | * @returns {Promise} Promise that resolves with the binary string
|
150 | */
|
151 | function blobToBinaryString(blob) {
|
152 | return new Promise(function (resolve, reject) {
|
153 | var reader = new FileReader();
|
154 | var hasBinaryString = typeof reader.readAsBinaryString === 'function';
|
155 | reader.onloadend = function (e) {
|
156 | var result = e.target.result || '';
|
157 | if (hasBinaryString) {
|
158 | return resolve(result);
|
159 | }
|
160 | resolve(arrayBufferToBinaryString(result));
|
161 | };
|
162 | reader.onerror = reject;
|
163 | if (hasBinaryString) {
|
164 | reader.readAsBinaryString(blob);
|
165 | } else {
|
166 | reader.readAsArrayBuffer(blob);
|
167 | }
|
168 | });
|
169 | }
|
170 |
|
171 | /**
|
172 | * Convert a base64-encoded string to a <code>Blob</code>. Returns a Promise.
|
173 | * @param {string} base64
|
174 | * @param {string|undefined} type - the content type (optional)
|
175 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
176 | */
|
177 | function base64StringToBlob(base64, type) {
|
178 | return Promise.resolve().then(function () {
|
179 | var parts = [binaryStringToArrayBuffer(atob(base64))];
|
180 | return type ? createBlob(parts, {type: type}) : createBlob(parts);
|
181 | });
|
182 | }
|
183 |
|
184 | /**
|
185 | * Convert a binary string to a <code>Blob</code>. Returns a Promise.
|
186 | * @param {string} binary
|
187 | * @param {string|undefined} type - the content type (optional)
|
188 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
189 | */
|
190 | function binaryStringToBlob(binary, type) {
|
191 | return Promise.resolve().then(function () {
|
192 | return base64StringToBlob(btoa(binary), type);
|
193 | });
|
194 | }
|
195 |
|
196 | /**
|
197 | * Convert a <code>Blob</code> to a binary string. Returns a Promise.
|
198 | * @param {Blob} blob
|
199 | * @returns {Promise} Promise that resolves with the binary string
|
200 | */
|
201 | function blobToBase64String(blob) {
|
202 | return blobToBinaryString(blob).then(function (binary) {
|
203 | return btoa(binary);
|
204 | });
|
205 | }
|
206 |
|
207 | /**
|
208 | * Convert a data URL string
|
209 | * (e.g. <code>'data:image/png;base64,iVBORw0KG...'</code>)
|
210 | * to a <code>Blob</code>. Returns a Promise.
|
211 | * @param {string} dataURL
|
212 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
213 | */
|
214 | function dataURLToBlob(dataURL) {
|
215 | return Promise.resolve().then(function () {
|
216 | var type = dataURL.match(/data:([^;]+)/)[1];
|
217 | var base64 = dataURL.replace(/^[^,]+,/, '');
|
218 |
|
219 | var buff = binaryStringToArrayBuffer(atob(base64));
|
220 | return createBlob([buff], {type: type});
|
221 | });
|
222 | }
|
223 |
|
224 | /**
|
225 | * Convert an image's <code>src</code> URL to a data URL by loading the image and painting
|
226 | * it to a <code>canvas</code>. Returns a Promise.
|
227 | *
|
228 | * <p/>Note: this will coerce the image to the desired content type, and it
|
229 | * will only paint the first frame of an animated GIF.
|
230 | *
|
231 | * @param {string} src
|
232 | * @param {string|undefined} type - the content type (optional, defaults to 'image/png')
|
233 | * @param {string|undefined} crossOrigin - for CORS-enabled images, set this to
|
234 | * 'Anonymous' to avoid "tainted canvas" errors
|
235 | * @param {number|undefined} quality - a number between 0 and 1 indicating image quality
|
236 | * if the requested type is 'image/jpeg' or 'image/webp'
|
237 | * @returns {Promise} Promise that resolves with the data URL string
|
238 | */
|
239 | function imgSrcToDataURL(src, type, crossOrigin, quality) {
|
240 | type = type || 'image/png';
|
241 |
|
242 | return loadImage(src, crossOrigin).then(function (img) {
|
243 | return imgToCanvas(img);
|
244 | }).then(function (canvas) {
|
245 | return canvas.toDataURL(type, quality);
|
246 | });
|
247 | }
|
248 |
|
249 | /**
|
250 | * Convert a <code>canvas</code> to a <code>Blob</code>. Returns a Promise.
|
251 | * @param {string} canvas
|
252 | * @param {string|undefined} type - the content type (optional, defaults to 'image/png')
|
253 | * @param {number|undefined} quality - a number between 0 and 1 indicating image quality
|
254 | * if the requested type is 'image/jpeg' or 'image/webp'
|
255 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
256 | */
|
257 | function canvasToBlob(canvas, type, quality) {
|
258 | return Promise.resolve().then(function () {
|
259 | if (typeof canvas.toBlob === 'function') {
|
260 | return new Promise(function (resolve) {
|
261 | canvas.toBlob(resolve, type, quality);
|
262 | });
|
263 | }
|
264 | return dataURLToBlob(canvas.toDataURL(type, quality));
|
265 | });
|
266 | }
|
267 |
|
268 | /**
|
269 | * Convert an image's <code>src</code> URL to a <code>Blob</code> by loading the image and painting
|
270 | * it to a <code>canvas</code>. Returns a Promise.
|
271 | *
|
272 | * <p/>Note: this will coerce the image to the desired content type, and it
|
273 | * will only paint the first frame of an animated GIF.
|
274 | *
|
275 | * @param {string} src
|
276 | * @param {string|undefined} type - the content type (optional, defaults to 'image/png')
|
277 | * @param {string|undefined} crossOrigin - for CORS-enabled images, set this to
|
278 | * 'Anonymous' to avoid "tainted canvas" errors
|
279 | * @param {number|undefined} quality - a number between 0 and 1 indicating image quality
|
280 | * if the requested type is 'image/jpeg' or 'image/webp'
|
281 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
282 | */
|
283 | function imgSrcToBlob(src, type, crossOrigin, quality) {
|
284 | type = type || 'image/png';
|
285 |
|
286 | return loadImage(src, crossOrigin).then(function (img) {
|
287 | return imgToCanvas(img);
|
288 | }).then(function (canvas) {
|
289 | return canvasToBlob(canvas, type, quality);
|
290 | });
|
291 | }
|
292 |
|
293 | /**
|
294 | * Convert an <code>ArrayBuffer</code> to a <code>Blob</code>. Returns a Promise.
|
295 | *
|
296 | * @param {ArrayBuffer} buffer
|
297 | * @param {string|undefined} type - the content type (optional)
|
298 | * @returns {Promise} Promise that resolves with the <code>Blob</code>
|
299 | */
|
300 | function arrayBufferToBlob(buffer, type) {
|
301 | return Promise.resolve().then(function () {
|
302 | return createBlob([buffer], type);
|
303 | });
|
304 | }
|
305 |
|
306 | /**
|
307 | * Convert a <code>Blob</code> to an <code>ArrayBuffer</code>. Returns a Promise.
|
308 | * @param {Blob} blob
|
309 | * @returns {Promise} Promise that resolves with the <code>ArrayBuffer</code>
|
310 | */
|
311 | function blobToArrayBuffer(blob) {
|
312 | return new Promise(function (resolve, reject) {
|
313 | var reader = new FileReader();
|
314 | reader.onloadend = function (e) {
|
315 | var result = e.target.result || new ArrayBuffer(0);
|
316 | resolve(result);
|
317 | };
|
318 | reader.onerror = reject;
|
319 | reader.readAsArrayBuffer(blob);
|
320 | });
|
321 | }
|
322 |
|
323 | module.exports = {
|
324 | createBlob : createBlob,
|
325 | createObjectURL : createObjectURL,
|
326 | revokeObjectURL : revokeObjectURL,
|
327 | imgSrcToBlob : imgSrcToBlob,
|
328 | imgSrcToDataURL : imgSrcToDataURL,
|
329 | canvasToBlob : canvasToBlob,
|
330 | dataURLToBlob : dataURLToBlob,
|
331 | blobToBase64String : blobToBase64String,
|
332 | base64StringToBlob : base64StringToBlob,
|
333 | binaryStringToBlob : binaryStringToBlob,
|
334 | blobToBinaryString : blobToBinaryString,
|
335 | arrayBufferToBlob : arrayBufferToBlob,
|
336 | blobToArrayBuffer : blobToArrayBuffer
|
337 | };
|
338 | </code></pre>
|
339 | </article>
|
340 | </section>
|
341 |
|
342 |
|
343 |
|
344 |
|
345 | </div>
|
346 |
|
347 | <nav>
|
348 | <h2><a href="index.html">Home</a></h2><h3>Global</h3><ul><li><a href="global.html#arrayBufferToBlob">arrayBufferToBlob</a></li><li><a href="global.html#base64StringToBlob">base64StringToBlob</a></li><li><a href="global.html#binaryStringToBlob">binaryStringToBlob</a></li><li><a href="global.html#blobToArrayBuffer">blobToArrayBuffer</a></li><li><a href="global.html#blobToBase64String">blobToBase64String</a></li><li><a href="global.html#blobToBinaryString">blobToBinaryString</a></li><li><a href="global.html#canvasToBlob">canvasToBlob</a></li><li><a href="global.html#createBlob">createBlob</a></li><li><a href="global.html#createObjectURL">createObjectURL</a></li><li><a href="global.html#dataURLToBlob">dataURLToBlob</a></li><li><a href="global.html#imgSrcToBlob">imgSrcToBlob</a></li><li><a href="global.html#imgSrcToDataURL">imgSrcToDataURL</a></li><li><a href="global.html#revokeObjectURL">revokeObjectURL</a></li></ul>
|
349 | </nav>
|
350 |
|
351 | <br class="clear">
|
352 |
|
353 | <footer>
|
354 | Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.3.0-beta3</a> on Sat Jan 16 2016 14:43:19 GMT-0500 (EST)
|
355 | </footer>
|
356 |
|
357 | <script> prettyPrint(); </script>
|
358 | <script src="scripts/linenumber.js"> </script>
|
359 | </body>
|
360 | </html>
|