8
0

filereader.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /**
  6. * @module upload/filereader
  7. */
  8. /* globals window */
  9. import ObservableMixin from '@ckeditor/ckeditor5-utils/src/observablemixin';
  10. import mix from '@ckeditor/ckeditor5-utils/src/mix';
  11. /**
  12. * Wrapper over the native `FileReader`.
  13. */
  14. export default class FileReader {
  15. /**
  16. * Creates an instance of the FileReader.
  17. */
  18. constructor() {
  19. const reader = new window.FileReader();
  20. /**
  21. * Instance of native FileReader.
  22. *
  23. * @private
  24. * @member {FileReader} #_reader
  25. */
  26. this._reader = reader;
  27. this._data = undefined;
  28. /**
  29. * Number of bytes loaded.
  30. *
  31. * @readonly
  32. * @observable
  33. * @member {Number} #loaded
  34. */
  35. this.set( 'loaded', 0 );
  36. reader.onprogress = evt => {
  37. this.loaded = evt.loaded;
  38. };
  39. }
  40. /**
  41. * Returns error that occurred during file reading.
  42. *
  43. * @returns {Error}
  44. */
  45. get error() {
  46. return this._reader.error;
  47. }
  48. /**
  49. * Holds the data of an already loaded file. The file must be first loaded
  50. * by using {@link module:upload/filereader~FileReader#read `read()`}.
  51. *
  52. * @type {File|undefined}
  53. */
  54. get data() {
  55. return this._data;
  56. }
  57. /**
  58. * Reads the provided file.
  59. *
  60. * @param {File} file Native File object.
  61. * @returns {Promise.<String>} Returns a promise that will be resolved with file's content.
  62. * The promise will be rejected in case of an error or when the reading process is aborted.
  63. */
  64. read( file ) {
  65. const reader = this._reader;
  66. this.total = file.size;
  67. return new Promise( ( resolve, reject ) => {
  68. reader.onload = () => {
  69. const result = reader.result;
  70. this._data = result;
  71. resolve( result );
  72. };
  73. reader.onerror = () => {
  74. reject( 'error' );
  75. };
  76. reader.onabort = () => {
  77. reject( 'aborted' );
  78. };
  79. this._reader.readAsDataURL( file );
  80. } );
  81. }
  82. /**
  83. * Aborts file reader.
  84. */
  85. abort() {
  86. this._reader.abort();
  87. }
  88. }
  89. mix( FileReader, ObservableMixin );