dompdf.js 1.0.4 → 1.1.1

package/dist/index.d.ts

@@ -1,18 +1,16 @@
+import { jsPDF } from 'jspdf';
 import { ContextOptions } from './core/context';
 import { CloneOptions, WindowOptions } from './dom/document-cloner';
 import { RenderOptions } from './render/canvas/pdf-renderer';
-interface FontConfig {
-    fontFamily: string;
-    fontBase64: string;
-    fontUrl: string;
-    fontWeight: number;
-    fontStyle: string;
-}
+import { FontConfig } from './utils';
 export type Options = CloneOptions & WindowOptions & RenderOptions & ContextOptions & {
     backgroundColor: string | null;
     foreignObjectRendering: boolean;
+    divisionDisable?: boolean;
     removeContainer?: boolean;
-    fontConfig?: FontConfig;
+    fontConfig?: FontConfig | FontConfig[] | undefined;
+    onJspdfReady?: (jspdfCtx: jsPDF) => void;
+    onJspdfFinish?: (jspdfCtx: jsPDF) => void;
 };
 declare const dompdf: (element: HTMLElement, options?: Partial<Options>) => Promise<HTMLCanvasElement>;
 export default dompdf;

package/dist/render/canvas/pdf-renderer.d.ts

@@ -1,26 +1,43 @@
+import { Context2d, EncryptionOptions, jsPDF } from 'jspdf';
+import 'jspdf/dist/polyfills.es.js';
 import { Context } from '../../core/context';
 import { CSSParsedDeclaration } from '../../css';
+import { Bounds } from '../../css/layout/bounds';
 import { TextBounds } from '../../css/layout/text';
 import { BORDER_STYLE } from '../../css/property-descriptors/border-style';
 import { Color } from '../../css/types/color';
 import { ElementContainer } from '../../dom/element-container';
-import { ReplacedElementContainer } from '../../dom/replaced-elements';
+import { CanvasElementContainer } from '../../dom/replaced-elements/canvas-element-container';
+import { ImageElementContainer } from '../../dom/replaced-elements/image-element-container';
+import { SVGElementContainer } from '../../dom/replaced-elements/svg-element-container';
 import { TextContainer } from '../../dom/text-container';
 import { BoundCurves } from '../bound-curves';
 import { IElementEffect } from '../effects';
+import { FontConfig } from '../../utils';
 import { Path } from '../path';
 import { Renderer } from '../renderer';
 import { ElementPaint, StackingContext } from '../stacking-context';
-interface FontConfig {
-    fontFamily: string;
-    fontBase64: string;
-    fontUrl: string;
-    fontWeight: number;
-    fontStyle: string;
-}
 export type RenderConfigurations = RenderOptions & {
     backgroundColor: Color | null;
-    fontConfig: FontConfig;
+    fontConfig: FontConfig | FontConfig[] | undefined;
+};
+export type pageConfigOptions = {
+    header: {
+        content: string;
+        height: number;
+        contentPosition: 'center' | 'centerLeft' | 'centerRight' | 'centerTop' | 'centerBottom' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom' | [number, number];
+        contentColor: string;
+        contentFontSize: number;
+        padding?: [number, number, number, number];
+    };
+    footer: {
+        content: string;
+        height: number;
+        contentPosition: 'center' | 'centerLeft' | 'centerRight' | 'centerTop' | 'centerBottom' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom' | [number, number];
+        contentColor: string;
+        contentFontSize: number;
+        padding?: [number, number, number, number];
+    };
 };
 export interface RenderOptions {
     scale: number;
@@ -30,19 +47,33 @@ export interface RenderOptions {
     width: number;
     height: number;
     pdfFileName?: string;
+    encryption?: EncryptionOptions | undefined;
+    precision?: number;
+    floatPrecision?: number | 'smart';
+    compress?: boolean;
+    putOnlyUsedFonts?: boolean;
+    pagination?: boolean;
+    format?: 'a0' | 'a1' | 'a2' | 'a3' | 'a4' | 'a5' | 'a6' | 'a7' | 'a8' | 'a9' | 'a10' | 'b0' | 'b1' | 'b2' | 'b3' | 'b4' | 'b5' | 'b6' | 'b7' | 'b8' | 'b9' | 'b10' | 'c0' | 'c1' | 'c2' | 'c3' | 'c4' | 'c5' | 'c6' | 'c7' | 'c8' | 'c9' | 'c10' | 'dl' | 'letter' | 'government-letter' | 'legal' | 'junior-legal' | 'ledger' | 'tabloid' | 'credit-card' | [number, number];
+    pageConfig?: pageConfigOptions;
+}
+export declare class JsPdfContext2d {
+}
+export interface JsPdfContext2d extends Context2d {
+    getLineDash(): number[];
+    setLineDash(segments: number[]): void;
 }
 export declare class CanvasRenderer extends Renderer {
     canvas: HTMLCanvasElement;
-    ctx: CanvasRenderingContext2D;
-    readonly jspdfCtx: any;
-    readonly context2dCtx: any;
+    readonly jspdfCtx: jsPDF;
+    readonly context2dCtx: JsPdfContext2d;
     private readonly _activeEffects;
     private readonly fontMetrics;
     private readonly pxToPt;
+    private totalPages;
     constructor(context: Context, options: RenderConfigurations);
-    loadFont(): Promise<void>;
-    loadFontFromURL(url: string): Promise<unknown>;
-    addFontToJsPDF(fontData: string): void;
+    addFontToJsPDF(): void;
+    resetJsPDFFont(): void;
+    setTextFont(styles: CSSParsedDeclaration): string;
     applyEffects(effects: IElementEffect[]): void;
     applyEffect(effect: IElementEffect): void;
     popEffect(): void;
@@ -52,29 +83,28 @@ export declare class CanvasRenderer extends Renderer {
     private createFontStyle;
     private convertColor;
     renderTextNode(text: TextContainer, styles: CSSParsedDeclaration): Promise<void>;
-    renderReplacedElement(container: ReplacedElementContainer, curves: BoundCurves, image: HTMLImageElement | HTMLCanvasElement): void;
+    renderReplacedJsPdfImage(container: ImageElementContainer, image: HTMLImageElement | HTMLCanvasElement): void;
+    renderReplacedJsPdfSvg(container: SVGElementContainer, image: HTMLImageElement | HTMLCanvasElement): void;
+    renderReplacedJsPdfCanvasImage(container: CanvasElementContainer): void;
     renderNodeContent(paint: ElementPaint): Promise<void>;
     renderStackContent(stack: StackingContext): Promise<void>;
     mask(paths: Path[]): void;
-    path(paths: Path[]): void;
-    formatPath(paths: Path[]): void;
-    renderRepeat(path: Path[], pattern: CanvasPattern | CanvasGradient, offsetX: number, offsetY: number): void;
+    path(paths: Path[], ctx2d?: Context2d | CanvasRenderingContext2D): void;
+    formatPath(paths: Path[], ctx2d?: Context2d | CanvasRenderingContext2D): void;
+    renderRepeat(boxs: Bounds, ctx: CanvasRenderingContext2D, path: Path[], pattern: CanvasPattern | CanvasGradient): void;
     resizeImage(image: HTMLImageElement, width: number, height: number): HTMLCanvasElement | HTMLImageElement;
     renderBackgroundImage(container: ElementContainer): Promise<void>;
-    /**
-     * 渲染实线边框
-     * @param color - 边框颜色
-     * @param side - 边的位置(0-3,分别代表上右下左)
-     * @param curvePoints - 边框曲线点
-     */
     renderSolidBorder(color: Color, side: number, curvePoints: BoundCurves): Promise<void>;
     renderDoubleBorder(color: Color, width: number, side: number, curvePoints: BoundCurves): Promise<void>;
     renderNodeBackgroundAndBorders(paint: ElementPaint): Promise<void>;
-    renderDashedDottedBorder(color: Color, // 边框颜色
-    width: number, // 边框宽度
-    side: number, // 边的位置(0-3,分别代表上右下左)
-    curvePoints: BoundCurves, // 边框曲线点
-    style: BORDER_STYLE): Promise<void>;
-    render(element: ElementContainer): Promise<HTMLCanvasElement>;
+    renderDashedDottedBorder(color: Color, width: number, side: number, curvePoints: BoundCurves, style: BORDER_STYLE): Promise<void>;
+    addPage(offsetY: number): Promise<void>;
+    renderPage(element: ElementContainer, pageNum: number): Promise<void>;
+    setTotalPages(total: number): void;
+    private setTextColorFromString;
+    private safe;
+    private textPdf;
+    private computeContentPosition;
+    private addImagePdf;
+    output(): Promise<Blob>;
 }
-export {};

package/dist/render/page-format-map.d.ts

@@ -0,0 +1,4 @@
+export declare const PAGE_FORMAT_MAP: Record<string, {
+    width: number;
+    height: number;
+}>;

package/dist/render/paginate.d.ts

@@ -0,0 +1,3 @@
+import type { ElementContainer } from '../dom/element-container';
+import { pageConfigOptions } from './canvas/pdf-renderer';
+export declare const paginateNode: (root: ElementContainer, pageHeight: number, initialOffset?: number, pageConfig?: pageConfigOptions) => ElementContainer[];

package/dist/utils/css-utils.d.ts

@@ -0,0 +1,2 @@
+import { BACKGROUND_REPEAT } from '../css/property-descriptors/background-repeat';
+export declare function getBackgroundRepeat(value: BACKGROUND_REPEAT): string;

package/dist/utils/element-utils.d.ts

@@ -0,0 +1,7 @@
+import type { ElementContainer } from '../dom/element-container';
+/**
+ * Recursively traverse the nodes and check whether the textNodes of all levels are empty arrays
+ * @param {ElementContainer} node
+ * @returns {boolean} - If all textNodes are empty, return true; otherwise, return false
+ */
+export declare function checkAllTextNodesEmpty(node: ElementContainer): boolean;

package/dist/utils/font-utils.d.ts

@@ -0,0 +1,7 @@
+export interface FontConfig {
+    fontFamily: string;
+    fontBase64: string;
+    fontStyle: string;
+    fontWeight: 400 | 700;
+}
+export declare function validateFontConfig(fontConfig: FontConfig | FontConfig[] | undefined): boolean;

package/dist/utils/index.d.ts

@@ -0,0 +1,5 @@
+export * from './css-utils';
+export * from './element-utils';
+export * from './font-utils';
+export * from './type-utils';
+export * from './url-path';

package/dist/utils/type-utils.d.ts

@@ -0,0 +1,4 @@
+export declare function isEmptyValue(obj: unknown): boolean;
+export declare function isArray(obj: unknown): obj is Array<unknown>;
+export declare function isObject(obj: unknown): obj is Record<string, unknown>;
+export declare function isFunction(fn: unknown): fn is (...args: unknown[]) => unknown;

package/dist/utils/url-path.d.ts

@@ -0,0 +1,7 @@
+/**
+ * 判断图片路径是否为指定类型的图片
+ * @param {string} path 图片路径/URL（如 "../tests/assets/image.svg"、"https://xxx.com/photo.webp"）
+ * @param {("svg" | "webp" | "png" | "jpg" | "gif" | "unknown")} type 要判断的图片类型
+ * @returns {boolean} 是否为指定类型的图片
+ */
+export declare function getImageTypeByPath(path: string, type: 'svg' | 'webp' | 'png' | 'jpg' | 'gif' | 'unknown'): boolean;

package/fontconverter/FileSaver.js

@@ -0,0 +1,2 @@
+/*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */
+var saveAs=saveAs||function(e){"use strict";if(typeof e==="undefined"||typeof navigator!=="undefined"&&/MSIE [1-9]\./.test(navigator.userAgent)){return}var t=e.document,n=function(){return e.URL||e.webkitURL||e},r=t.createElementNS("http://www.w3.org/1999/xhtml","a"),o="download"in r,a=function(e){var t=new MouseEvent("click");e.dispatchEvent(t)},i=/constructor/i.test(e.HTMLElement)||e.safari,f=/CriOS\/[\d]+/.test(navigator.userAgent),u=function(t){(e.setImmediate||e.setTimeout)(function(){throw t},0)},s="application/octet-stream",d=1e3*40,c=function(e){var t=function(){if(typeof e==="string"){n().revokeObjectURL(e)}else{e.remove()}};setTimeout(t,d)},l=function(e,t,n){t=[].concat(t);var r=t.length;while(r--){var o=e["on"+t[r]];if(typeof o==="function"){try{o.call(e,n||e)}catch(a){u(a)}}}},p=function(e){if(/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)){return new Blob([String.fromCharCode(65279),e],{type:e.type})}return e},v=function(t,u,d){if(!d){t=p(t)}var v=this,w=t.type,m=w===s,y,h=function(){l(v,"writestart progress write writeend".split(" "))},S=function(){if((f||m&&i)&&e.FileReader){var r=new FileReader;r.onloadend=function(){var t=f?r.result:r.result.replace(/^data:[^;]*;/,"data:attachment/file;");var n=e.open(t,"_blank");if(!n)e.location.href=t;t=undefined;v.readyState=v.DONE;h()};r.readAsDataURL(t);v.readyState=v.INIT;return}if(!y){y=n().createObjectURL(t)}if(m){e.location.href=y}else{var o=e.open(y,"_blank");if(!o){e.location.href=y}}v.readyState=v.DONE;h();c(y)};v.readyState=v.INIT;if(o){y=n().createObjectURL(t);setTimeout(function(){r.href=y;r.download=u;a(r);h();c(y);v.readyState=v.DONE});return}S()},w=v.prototype,m=function(e,t,n){return new v(e,t||e.name||"download",n)};if(typeof navigator!=="undefined"&&navigator.msSaveOrOpenBlob){return function(e,t,n){t=t||e.name||"download";if(!n){e=p(e)}return navigator.msSaveOrOpenBlob(e,t)}}w.abort=function(){};w.readyState=w.INIT=0;w.WRITING=1;w.DONE=2;w.error=w.onwritestart=w.onprogress=w.onwrite=w.onabort=w.onerror=w.onwriteend=null;return m}(typeof self!=="undefined"&&self||typeof window!=="undefined"&&window||this.content);if(typeof module!=="undefined"&&module.exports){module.exports.saveAs=saveAs}else if(typeof define!=="undefined"&&define!==null&&define.amd!==null){define("FileSaver.js",function(){return saveAs})}

package/fontconverter/filereader.js

@@ -0,0 +1,432 @@
+/*!
+FileReader.js - v0.99
+A lightweight wrapper for common FileReader usage.
+Copyright 2014 Brian Grinstead - MIT License.
+See http://github.com/bgrins/filereader.js for documentation.
+*/
+
+(function(window, document) {
+
+    var FileReader = window.FileReader;
+    var FileReaderSyncSupport = false;
+    var workerScript = "self.addEventListener('message', function(e) { var data=e.data; try { var reader = new FileReaderSync; postMessage({ result: reader[data.readAs](data.file), extra: data.extra, file: data.file})} catch(e){ postMessage({ result:'error', extra:data.extra, file:data.file}); } }, false);";
+    var syncDetectionScript = "onmessage = function(e) { postMessage(!!FileReaderSync); };";
+    var fileReaderEvents = ['loadstart', 'progress', 'load', 'abort', 'error', 'loadend'];
+    var sync = false;
+    var FileReaderJS = window.FileReaderJS = {
+        enabled: false,
+        setupInput: setupInput,
+        setupDrop: setupDrop,
+        setupClipboard: setupClipboard,
+        setSync: function (value) {
+            sync = value;
+
+            if (sync && !FileReaderSyncSupport) {
+                checkFileReaderSyncSupport();
+            }
+        },
+        getSync: function() {
+            return sync && FileReaderSyncSupport;
+        },
+        output: [],
+        opts: {
+            dragClass: "drag",
+            accept: false,
+            readAsDefault: 'DataURL',
+            readAsMap: {
+            },
+            on: {
+                loadstart: noop,
+                progress: noop,
+                load: noop,
+                abort: noop,
+                error: noop,
+                loadend: noop,
+                skip: noop,
+                groupstart: noop,
+                groupend: noop,
+                beforestart: noop
+            }
+        }
+    };
+
+    // Setup jQuery plugin (if available)
+    if (typeof(jQuery) !== "undefined") {
+        jQuery.fn.fileReaderJS = function(opts) {
+            return this.each(function() {
+                if (jQuery(this).is("input")) {
+                    setupInput(this, opts);
+                }
+                else {
+                    setupDrop(this, opts);
+                }
+            });
+        };
+
+        jQuery.fn.fileClipboard = function(opts) {
+            return this.each(function() {
+                setupClipboard(this, opts);
+            });
+        };
+    }
+
+    // Not all browsers support the FileReader interface. Return with the enabled bit = false.
+    if (!FileReader) {
+        return;
+    }
+
+
+    // makeWorker is a little wrapper for generating web workers from strings
+    function makeWorker(script) {
+        var URL = window.URL || window.webkitURL;
+        var Blob = window.Blob;
+        var Worker = window.Worker;
+
+        if (!URL || !Blob || !Worker || !script) {
+            return null;
+        }
+
+        var blob = new Blob([script]);
+        var worker = new Worker(URL.createObjectURL(blob));
+        return worker;
+    }
+
+    // setupClipboard: bind to clipboard events (intended for document.body)
+    function setupClipboard(element, opts) {
+
+        if (!FileReaderJS.enabled) {
+            return;
+        }
+        var instanceOptions = extend(extend({}, FileReaderJS.opts), opts);
+
+        element.addEventListener("paste", onpaste, false);
+
+        function onpaste(e) {
+            var files = [];
+            var clipboardData = e.clipboardData || {};
+            var items = clipboardData.items || [];
+
+            for (var i = 0; i < items.length; i++) {
+                var file = items[i].getAsFile();
+
+                if (file) {
+
+                    // Create a fake file name for images from clipboard, since this data doesn't get sent
+                    var matches = new RegExp("/\(.*\)").exec(file.type);
+                    if (!file.name && matches) {
+                        var extension = matches[1];
+                        file.name = "clipboard" + i + "." + extension;
+                    }
+
+                    files.push(file);
+                }
+            }
+
+            if (files.length) {
+                processFileList(e, files, instanceOptions);
+                e.preventDefault();
+                e.stopPropagation();
+            }
+        }
+    }
+
+    // setupInput: bind the 'change' event to an input[type=file]
+    function setupInput(input, opts) {
+
+        if (!FileReaderJS.enabled) {
+            return;
+        }
+        var instanceOptions = extend(extend({}, FileReaderJS.opts), opts);
+
+        input.addEventListener("change", inputChange, false);
+        input.addEventListener("drop", inputDrop, false);
+
+        function inputChange(e) {
+            processFileList(e, input.files, instanceOptions);
+        }
+
+        function inputDrop(e) {
+            e.stopPropagation();
+            e.preventDefault();
+            processFileList(e, e.dataTransfer.files, instanceOptions);
+        }
+    }
+
+    // setupDrop: bind the 'drop' event for a DOM element
+    function setupDrop(dropbox, opts) {
+
+        if (!FileReaderJS.enabled) {
+            return;
+        }
+        var instanceOptions = extend(extend({}, FileReaderJS.opts), opts);
+        var dragClass = instanceOptions.dragClass;
+        var initializedOnBody = false;
+
+        // Bind drag events to the dropbox to add the class while dragging, and accept the drop data transfer.
+        dropbox.addEventListener("dragenter", onlyWithFiles(dragenter), false);
+        dropbox.addEventListener("dragleave", onlyWithFiles(dragleave), false);
+        dropbox.addEventListener("dragover", onlyWithFiles(dragover), false);
+        dropbox.addEventListener("drop", onlyWithFiles(drop), false);
+
+        // Bind to body to prevent the dropbox events from firing when it was initialized on the page.
+        document.body.addEventListener("dragstart", bodydragstart, true);
+        document.body.addEventListener("dragend", bodydragend, true);
+        document.body.addEventListener("drop", bodydrop, false);
+
+        function bodydragend(e) {
+            initializedOnBody = false;
+        }
+
+        function bodydragstart(e) {
+            initializedOnBody = true;
+        }
+
+        function bodydrop(e) {
+            if (e.dataTransfer.files && e.dataTransfer.files.length ){
+                e.stopPropagation();
+                e.preventDefault();
+            }
+        }
+
+        function onlyWithFiles(fn) {
+            return function() {
+                if (!initializedOnBody) {
+                    fn.apply(this, arguments);
+                }
+            };
+        }
+
+        function drop(e) {
+            e.stopPropagation();
+            e.preventDefault();
+            if (dragClass) {
+                removeClass(dropbox, dragClass);
+            }
+            processFileList(e, e.dataTransfer.files, instanceOptions);
+        }
+
+        function dragenter(e) {
+            e.stopPropagation();
+            e.preventDefault();
+            if (dragClass) {
+                addClass(dropbox, dragClass);
+            }
+        }
+
+        function dragleave(e) {
+            if (dragClass) {
+                removeClass(dropbox, dragClass);
+            }
+        }
+
+        function dragover(e) {
+            e.stopPropagation();
+            e.preventDefault();
+            if (dragClass) {
+                addClass(dropbox, dragClass);
+            }
+        }
+    }
+
+    // setupCustomFileProperties: modify the file object with extra properties
+    function setupCustomFileProperties(files, groupID) {
+        for (var i = 0; i < files.length; i++) {
+            var file = files[i];
+            file.extra = {
+                nameNoExtension: file.name.substring(0, file.name.lastIndexOf('.')),
+                extension: file.name.substring(file.name.lastIndexOf('.') + 1),
+                fileID: i,
+                uniqueID: getUniqueID(),
+                groupID: groupID,
+                prettySize: prettySize(file.size)
+            };
+        }
+    }
+
+    // getReadAsMethod: return method name for 'readAs*' - http://www.w3.org/TR/FileAPI/#reading-a-file
+    function getReadAsMethod(type, readAsMap, readAsDefault) {
+        for (var r in readAsMap) {
+            if (type.match(new RegExp(r))) {
+                return 'readAs' + readAsMap[r];
+            }
+        }
+        return 'readAs' + readAsDefault;
+    }
+
+    // processFileList: read the files with FileReader, send off custom events.
+    function processFileList(e, files, opts) {
+
+        var filesLeft = files.length;
+        var group = {
+            groupID: getGroupID(),
+            files: files,
+            started: new Date()
+        };
+
+        function groupEnd() {
+            group.ended = new Date();
+            opts.on.groupend(group);
+        }
+
+        function groupFileDone() {
+            if (--filesLeft === 0) {
+                groupEnd();
+            }
+        }
+
+        FileReaderJS.output.push(group);
+        setupCustomFileProperties(files, group.groupID);
+
+        opts.on.groupstart(group);
+
+        // No files in group - end immediately
+        if (!files.length) {
+            groupEnd();
+            return;
+        }
+
+        var supportsSync = sync && FileReaderSyncSupport;
+        var syncWorker;
+
+        // Only initialize the synchronous worker if the option is enabled - to prevent the overhead
+        if (supportsSync) {
+            syncWorker = makeWorker(workerScript);
+            syncWorker.onmessage = function(e) {
+                var file = e.data.file;
+                var result = e.data.result;
+
+                // Workers seem to lose the custom property on the file object.
+                if (!file.extra) {
+                    file.extra = e.data.extra;
+                }
+
+                file.extra.ended = new Date();
+
+                // Call error or load event depending on success of the read from the worker.
+                opts.on[result === "error" ? "error" : "load"]({ target: { result: result } }, file);
+                groupFileDone();
+            };
+        }
+
+        Array.prototype.forEach.call(files, function(file) {
+
+            file.extra.started = new Date();
+
+            if (opts.accept && !file.type.match(new RegExp(opts.accept))) {
+                opts.on.skip(file);
+                groupFileDone();
+                return;
+            }
+
+            if (opts.on.beforestart(file) === false) {
+                opts.on.skip(file);
+                groupFileDone();
+                return;
+            }
+
+            var readAs = getReadAsMethod(file.type, opts.readAsMap, opts.readAsDefault);
+
+            if (syncWorker) {
+                syncWorker.postMessage({
+                    file: file,
+                    extra: file.extra,
+                    readAs: readAs
+                });
+            }
+            else {
+
+                var reader = new FileReader();
+                reader.originalEvent = e;
+
+                fileReaderEvents.forEach(function(eventName) {
+                    reader['on' + eventName] = function(e) {
+                        if (eventName == 'load' || eventName == 'error') {
+                            file.extra.ended = new Date();
+                        }
+                        opts.on[eventName](e, file);
+                        if (eventName == 'loadend') {
+                            groupFileDone();
+                        }
+                    };
+                });
+                reader[readAs](file);
+            }
+        });
+    }
+
+    // checkFileReaderSyncSupport: Create a temporary worker and see if FileReaderSync exists
+    function checkFileReaderSyncSupport() {
+        var worker = makeWorker(syncDetectionScript);
+        if (worker) {
+            worker.onmessage =function(e) {
+                FileReaderSyncSupport = e.data;
+            };
+            worker.postMessage({});
+        }
+    }
+
+    // noop: do nothing
+    function noop() {
+
+    }
+
+    // extend: used to make deep copies of options object
+    function extend(destination, source) {
+        for (var property in source) {
+            if (source[property] && source[property].constructor &&
+                source[property].constructor === Object) {
+                destination[property] = destination[property] || {};
+                arguments.callee(destination[property], source[property]);
+            }
+            else {
+                destination[property] = source[property];
+            }
+        }
+        return destination;
+    }
+
+    // hasClass: does an element have the css class?
+    function hasClass(el, name) {
+        return new RegExp("(?:^|\\s+)" + name + "(?:\\s+|$)").test(el.className);
+    }
+
+    // addClass: add the css class for the element.
+    function addClass(el, name) {
+        if (!hasClass(el, name)) {
+          el.className = el.className ? [el.className, name].join(' ') : name;
+        }
+    }
+
+    // removeClass: remove the css class from the element.
+    function removeClass(el, name) {
+        if (hasClass(el, name)) {
+          var c = el.className;
+          el.className = c.replace(new RegExp("(?:^|\\s+)" + name + "(?:\\s+|$)", "g"), " ").replace(/^\s\s*/, '').replace(/\s\s*$/, '');
+        }
+    }
+
+    // prettySize: convert bytes to a more readable string.
+    function prettySize(bytes) {
+        var s = ['bytes', 'kb', 'MB', 'GB', 'TB', 'PB'];
+        var e = Math.floor(Math.log(bytes)/Math.log(1024));
+        return (bytes/Math.pow(1024, Math.floor(e))).toFixed(2)+" "+s[e];
+    }
+
+    // getGroupID: generate a unique int ID for groups.
+    var getGroupID = (function(id) {
+        return function() {
+            return id++;
+        };
+    })(0);
+
+    // getUniqueID: generate a unique int ID for files
+    var getUniqueID = (function(id) {
+        return function() {
+            return id++;
+        };
+    })(0);
+
+    // The interface is supported, bind the FileReaderJS callbacks
+    FileReaderJS.enabled = true;
+
+})(this, document);