diff --git a/ng-file-upload/ng-file-upload-tests.ts b/ng-file-upload/ng-file-upload-tests.ts
index 6ff440402..f7fdcf101 100644
--- a/ng-file-upload/ng-file-upload-tests.ts
+++ b/ng-file-upload/ng-file-upload-tests.ts
@@ -1,53 +1,88 @@
///
-module controllers {
+"use strict";
- "use strict";
+let controllerId = "upload";
- var controllerId = "upload";
+class UploadController {
+ static $inject = ["Upload"];
- class Upload {
+ constructor(private Upload: angular.angularFileUpload.IUploadService) {
+ this.Upload.setDefaults({
+ ngfAccept: "image/*",
+ ngfAllowDir: true,
+ ngfEnableFirefoxPaste: true,
+ ngfHideOnDropNotAvailable: true,
+ ngfMaxDuration: 20,
+ ngfMaxFiles: 10,
+ ngfMaxSize: "10MB",
+ ngfMaxTotalSize: "10MB",
+ ngfMinDuration: "10s",
+ ngfMinRatio: "8:10,1.6",
+ ngfMinSize: "9MB",
+ ngfMultiple: true,
+ ngfRatio: "8:10,1.6",
+ ngfStopPropagation: true,
+ ngfValidateForce: true
+ });
+ }
+
+ onFileSelect(files: Array) {
- static $inject = ["$upload"];
- constructor(
- private $upload: angular.angularFileUpload.IUploadService
- ) {
- }
+ this.Upload
+ .upload({
+ url: "/api/upload",
+ method: "POST",
+ data: {
+ media: files,
+ extraData: {
+ test: true
+ }
+ }
+ }).abort().xhr((evt: any) => {
+ console.log("xhr");
+ }).progress((evt: angular.angularFileUpload.IFileProgressEvent) => {
+ let percent = parseInt((100.0 * evt.loaded / evt.total).toString(), 10);
+ console.log("upload progress: " + percent + "% for " + evt.config.data.media[0]);
+ }).error((data: any, status: number, response: any, headers: any) => {
+ console.error(data, status, response, headers);
+ }).success((data: any, status: number, headers: any, config: angular.angularFileUpload.IFileUploadConfigFile) => {
+ // file is uploaded successfully
+ console.log("Success!", data, status, headers, config);
+ });
- onFileSelect($files: File[]) {
- // $files: an array of files selected, each file has name, size, and type.
- for (var i = 0; i < $files.length; i++) {
- var file = $files[i];
- this.$upload.upload({
- url: "/api/upload",
- method: "POST",
- data: {
- extraData: {
- fileName: file.name,
- test: "anything"
- }
- },
- file: file
- })
- .abort()
- .xhr((evt: any) => {
- console.log('xhr');
- })
- .progress((evt: angular.angularFileUpload.IFileProgressEvent) => {
- var percent = parseInt((100.0 * evt.loaded / evt.total).toString(), 10);
- console.log("upload progress: " + percent + "% for " + evt.config.file.name);
- })
- .error((data: any, status: number, response: any, headers: any) => {
- console.error(data, status, response, headers);
- })
- .success((data: any, status: number, headers: any, config: angular.angularFileUpload.IFileUploadConfigFile) => {
- // file is uploaded successfully
- console.log("Success!", data, status, headers, config);
- });
+ this.Upload
+ .base64DataUrl(files[0])
+ .then((file: string) => {
+ console.log(file);
+ })
- }
- }
- }
+ this.Upload
+ .dataUrl(files[0], true)
+ .then((result: string) => {
+ console.log(result);
+ });
- angular.module("app").controller(controllerId, Upload);
+ this.Upload
+ .imageDimensions(files[0])
+ .then((imageDimensions) => {
+ console.log(imageDimensions.height + " " + imageDimensions.width);
+ });
+
+ this.Upload.isResizeSupported();
+ this.Upload.isResumeSupported();
+ this.Upload.isUploadInProgress();
+
+ let json = this.Upload.json({ test: true }),
+ jsonBlob = this.Upload.jsonBlob({ test: true }),
+ fileWithNewName = this.Upload.rename(files[0], "newName.jpg");
+
+ this.Upload
+ .resize(files[0], 1024, 1024, 0.7, 'image/jpeg', 0.9, true)
+ .then((resizedFile) => {
+ console.log(resizedFile);
+ });
+ }
}
+
+angular.module("app").controller("UploadController", UploadController);
diff --git a/ng-file-upload/ng-file-upload.d.ts b/ng-file-upload/ng-file-upload.d.ts
index 79b1a91f1..ae646b516 100644
--- a/ng-file-upload/ng-file-upload.d.ts
+++ b/ng-file-upload/ng-file-upload.d.ts
@@ -1,43 +1,280 @@
-// Type definitions for Angular File Upload 4.2.1
+// Type definitions for Angular File Upload 11.1.1
// Project: https://github.com/danialfarid/ng-file-upload
// Definitions by: John Reilly
// Definitions: https://github.com/borisyankov/DefinitelyTyped
///
+declare module "ng-file-upload" {
+ let angularFileUploadDefaultExport: string;
+ export = angularFileUploadDefaultExport;
+}
+
declare module angular.angularFileUpload {
+ interface ImageDimensions {
+ height: number;
+ width: number;
+ }
+
+ interface FileUploadOptions {
+ /**
+ * Standard HTML accept attr, browser specific select popup window
+ * @type {string}
+ */
+ ngfAccept?: string;
+ /**
+ * Default true, allow dropping files only for Chrome webkit browser
+ * @type {boolean}
+ */
+ ngfAllowDir?: boolean;
+ /**
+ * Default false, enable firefox image paste by making element contenteditable
+ * @type {boolean}
+ */
+ ngfEnableFirefoxPaste?: boolean;
+ /**
+ * Default false, hides element if file drag&drop is not
+ * @type {boolean}
+ */
+ ngfHideOnDropNotAvailable?: boolean;
+ /**
+ * Validate error name: minDuration
+ * @type {(number|string)}
+ */
+ ngfMinDuration: number | string;
+ ngfMinSize?: number | string;
+ /**
+ * Validate error name: minRatio
+ * @type {(number|string)}
+ */
+ ngfMinRatio?: number | string;
+ /**
+ * Validate error name: maxDuration
+ * @type {(number|string)}
+ */
+ ngfMaxDuration?: number | string;
+ /**
+ * Maximum number of files allowed to be selected or dropped, validate error name: maxFiles
+ * @type {number}
+ */
+ ngfMaxFiles?: number;
+ /**
+ * Validate error name: maxSize
+ * @type {(number|string)}
+ */
+ ngfMaxSize?: number | string;
+ /**
+ * Validate error name: maxTotalSize
+ * @type {(number|string)}
+ */
+ ngfMaxTotalSize?: number | string;
+ /**
+ * Allows selecting multiple files
+ * @type {boolean}
+ */
+ ngfMultiple?: boolean;
+ /**
+ * List of comma separated valid aspect ratio of images in float or 2:3 format
+ * @type {string}
+ */
+ ngfRatio?: string;
+ /**
+ * Default false, whether to propagate drag/drop events.
+ * @type {boolean}
+ */
+ ngfStopPropagation?: boolean;
+ /**
+ * Default false, if true file.$error will be set if the dimension or duration
+ * values for validations cannot be calculated for example image load error or unsupported video by the browser.
+ * By default it would assume the file is valid if the duration or dimension cannot be calculated by the browser.
+ * @type {boolean}
+ */
+ ngfValidateForce?: boolean;
+ }
interface IUploadService {
-
+ /**
+ * Convert a single file or array of files to a single or array of
+ * base64 data url representation of the file(s).
+ * Could be used to send file in base64 format inside json to the databases
+ *
+ * @param {Array}
+ * @return {angular.IPromise}
+ */
+ base64DataUrl(files: File | Array): angular.IPromise | string>;
+ /**
+ * Convert the file to blob url object or base64 data url based on boolean disallowObjectUrl value
+ *
+ * @param {File} file
+ * @param {boolean} [disallowObjectUrl]
+ * @return {angular.IPromise}
+ */
+ dataUrl(file: File, disallowObjectUrl?: boolean): angular.IPromise;
+ /**
+ * Alternative way of uploading, send the file binary with the file's content-type.
+ * Could be used to upload files to CouchDB, imgur, etc... html5 FileReader is needed.
+ * This is equivalent to angular $http() but allow you to listen to the progress event for HTML5 browsers.
+ *
+ * @param {IRequestConfig} config
+ * @return {angular.IPromise}
+ */
http(config: IRequestConfig): IUploadPromise;
- upload(config: IFileUploadConfigFiles|IFileUploadConfigFile): IUploadPromise;
+ /**
+ * Get image file dimensions
+ *
+ * @param {File} file
+ * @return {angular.IPromise}
+ */
+ imageDimensions(file: File): angular.IPromise;
+ /**
+ * Returns boolean showing if image resize is supported by this browser
+ *
+ * @return {boolean}
+ */
+ isResizeSupported(): boolean;
+ /**
+ * Returns boolean showing if resumable upload is supported by this browser
+ *
+ * @return {boolean}
+ */
+ isResumeSupported(): boolean;
+ /**
+ * Returns true if there is an upload in progress. Can be used to prompt user before closing browser tab
+ *
+ * @return {boolean}
+ */
+ isUploadInProgress(): boolean;
+ /**
+ * Converts the value to json to send data as json string. Same as angular.toJson(obj)
+ *
+ * @param {Object} obj
+ * @return {string}
+ */
+ json(obj: Object): string;
+ /**
+ * Converts the object to a Blob object with application/json content type
+ * for jsob byte streaming support
+ *
+ * @param {Object} obj
+ * @return {Blob}
+ */
+ jsonBlob(obj: Object): Blob;
+ /**
+ * Returns a file which will be uploaded with the newName instead of original file name
+ *
+ * @param {File} file
+ * @param {string} newName
+ * @return {File}
+ */
+ rename(file: File, newName: string): File;
+ /**
+ * Resizes an image. Returns a promise
+ *
+ * @param {File} file
+ * @param {number} [width]
+ * @param {number} [height]
+ * @param {number} [quality]
+ * @param {string} [type]
+ * @param {number} [ratio]
+ * @param {boolean} [centerCrop]
+ * @return {angular.IPromise}
+ */
+ resize(file: File, width?: number, height?: number, quality?: number, type?: string,
+ ratio?: number | string, centerCrop?: boolean): angular.IPromise;
+ /**
+ * Set the default values for ngf-select and ngf-drop directives
+ *
+ * @param {FileUploadOptions} defaultFileUploadOptions
+ */
+ setDefaults(defaultFileUploadOptions: FileUploadOptions): void;
+ /**
+ * Upload a file. Returns a Promise,
+ *
+ * @param {IFileUploadConfigFile} config
+ * @return {IUploadPromise}
+ */
+ upload(config: IFileUploadConfigFile): IUploadPromise;
}
interface IUploadPromise extends IHttpPromise {
+ /**
+ * Cancel/abort the upload in progress.
+ *
+ * @return {IUploadPromise}
+ */
abort(): IUploadPromise;
progress(callback: IHttpPromiseCallback): IUploadPromise;
+ /**
+ * Access or attach event listeners to the underlying XMLHttpRequest
+ *
+ * @param {IHttpPromiseCallback}
+ * @return {IUploadPromise}
+ */
xhr(callback: IHttpPromiseCallback): IUploadPromise;
}
interface IFileUploadConfigFile extends IRequestConfig {
-
- file: File;
- fileName?: string;
- }
-
- interface IFileUploadConfigFiles extends IRequestConfig {
-
- file: File[];
- fileName?: string;
- }
-
- interface IFilesProgressEvent extends ProgressEvent {
-
- config: IFileUploadConfigFiles;
+ /**
+ * Specify the file and optional data to be sent to the server.
+ * Each field including nested objects will be sent as a form data multipart.
+ * Samples: {pic: file, username: username}
+ * {files: files, otherInfo: {id: id, person: person,...}} multiple files (html5)
+ * {profiles: {[{pic: file1, username: username1}, {pic: file2, username: username2}]} nested array multiple files (html5)
+ * {file: file, info: Upload.json({id: id, name: name, ...})} send fields as json string
+ * {file: file, info: Upload.jsonBlob({id: id, name: name, ...})} send fields as json blob, 'application/json' content_type
+ * {picFile: Upload.rename(file, 'profile.jpg'), title: title} send file with picFile key and profile.jpg file name
+ *
+ * @type {Object}
+ */
+ data: any;
+ /**
+ * upload.php script, node.js route, or servlet url
+ * @type {string}
+ */
+ url: string;
+ /**
+ * This is to accommodate server implementations expecting nested data object keys in .key or [key] format.
+ * Example: data: {rec: {name: 'N', pic: file}} sent as: rec[name] -> N, rec[pic] -> file
+ * data: {rec: {name: 'N', pic: file}, objectKey: '.k'} sent as: rec.name -> N, rec.pic -> file
+ * @type {string}
+ */
+ objectKey?: string;
+ /**
+ * This is to accommodate server implementations expecting array data object keys in '[i]' or '[]' or
+ * ''(multiple entries with same key) format.
+ * Example: data: {rec: [file[0], file[1], ...]} sent as: rec[0] -> file[0], rec[1] -> file[1],...
+ * data: {rec: {rec: [f[0], f[1], ...], arrayKey: '[]'} sent as: rec[] -> f[0], rec[] -> f[1],...
+ * @type {string}
+ */
+ arrayKey?: string;
+ /**
+ * Uploaded file size so far on the server
+ * @type {string}
+ */
+ resumeSizeUrl?: string;
+ /**
+ * Reads the uploaded file size from resumeSizeUrl GET response
+ * @type {Function}
+ */
+ resumeSizeResponseReader?: Function;
+ /**
+ * Function that returns a prommise which will be resolved to the upload file size on the server.
+ * @type {[type]}
+ */
+ resumeSize?: Function;
+ /**
+ * Upload in chunks of specified size
+ * @type {(number|string)}
+ */
+ resumeChunkSize?: number | string;
+ /**
+ * Default false, experimental as hotfix for potential library conflicts with other plugins
+ * @type {boolean}
+ */
+ disableProgress?: boolean;
}
interface IFileProgressEvent extends ProgressEvent {
-
config: IFileUploadConfigFile;
}
-}
+}
\ No newline at end of file