UNPKG

5.3 kBJavaScriptView Raw
1;(function(){
2(function (global, factory) {
3 if (typeof define === "function" && define.amd) {
4 define(['exports', './image-reader', './image-dataurl', '../_util', '../_style/global.css', './style/index.css'], factory);
5 } else if (typeof exports !== "undefined") {
6 factory(exports, require('./image-reader'), require('./image-dataurl'), require('../_util'), require('../_style/global.css'), require('./style/index.css'));
7 } else {
8 var mod = {
9 exports: {}
10 };
11 factory(mod.exports, global.imageReader, global.imageDataurl, global._util, global.global, global.index);
12 global.index = mod.exports;
13 }
14})(this, function (exports, _imageReader, _imageDataurl, _util) {
15 'use strict';
16
17 Object.defineProperty(exports, "__esModule", {
18 value: true
19 });
20
21 var _imageReader2 = _interopRequireDefault(_imageReader);
22
23 function _interopRequireDefault(obj) {
24 return obj && obj.__esModule ? obj : {
25 default: obj
26 };
27 }
28
29 var ERROR = {
30 '100': 'browser does not support',
31 '101': 'picture size is beyond the preset',
32 '102': 'picture read failure',
33 '103': 'the number of pictures exceeds the limit'
34 };
35
36 exports.default = {
37 name: 'md-image-reader',
38
39 props: {
40 name: {
41 type: String,
42 default: function _default() {
43 return (0, _util.randomId)('image-reader');
44 }
45 },
46 size: {
47 type: [String, Number],
48 default: 0
49 },
50 mime: {
51 type: Array,
52 default: function _default() {
53 return [];
54 }
55 },
56 isCameraOnly: {
57 type: Boolean,
58 default: false
59 },
60 isMultiple: {
61 type: Boolean,
62 default: false
63 },
64 amount: {
65 type: Number,
66 default: 0
67 }
68 },
69
70 data: function data() {
71 return {
72 inputTmpKey: Date.now() };
73 },
74
75
76 computed: {
77 mimeType: function mimeType() {
78 if (this.mime.length) {
79 var mimeStr = '';
80 this.mime.forEach(function (type) {
81 mimeStr += 'image/' + type + ',';
82 });
83 return mimeStr.substring(0, mimeStr.length - 1);
84 } else {
85 return 'image/*';
86 }
87 }
88 },
89
90 methods: {
91 $_emitter: function $_emitter(event, data) {
92 this.$emit(event, this.name, data);
93 },
94 $_openWebWorker: function $_openWebWorker(fn) {
95 return new Worker((0, _util.functionToUrl)(fn));
96 },
97 $_closeWebWorker: function $_closeWebWorker(worker) {
98 worker.terminate();
99 },
100 $_readFile: function $_readFile(fileElement) {
101 var _this = this;
102
103 var size = +this.size * 1000;
104 var files = fileElement.files;
105 var worker = void 0;
106 var count = 0;
107
108 if (window.Worker) {
109 worker = this.$_openWebWorker(_imageReader2.default);
110
111 worker.postMessage({
112 files: files,
113 size: size,
114 isWebWorker: true
115 });
116
117 worker.onmessage = function (evt) {
118 _this.$_onReaderComplete(evt.data);
119
120 count++;
121
122 if (count === files.length) {
123 _this.$_closeWebWorker(worker);
124 }
125 };
126 } else {
127 var imageReader = (0, _imageReader2.default)(window);
128 imageReader({
129 files: files,
130 size: size,
131 isWebWorker: false,
132 complete: this.$_onReaderComplete
133 });
134 }
135 },
136 $_cleaeFile: function $_cleaeFile() {
137 this.inputTmpKey = Date.now();
138 },
139 $_onFileChange: function $_onFileChange(event) {
140 var fileElement = event.target;
141
142 if (fileElement.files && fileElement.files.length) {
143 this.$_emitter('select', {
144 files: Array.prototype.slice.call(fileElement.files)
145 });
146
147 if (this.amount && fileElement.files.length > this.amount) {
148 this.$_emitter('error', {
149 code: '103',
150 msg: ERROR['103']
151 });
152 this.$_cleaeFile();
153 return;
154 }
155
156 this.$_readFile(fileElement);
157 }
158 },
159 $_onReaderComplete: function $_onReaderComplete(_ref) {
160 var errorCode = _ref.errorCode,
161 dataUrl = _ref.dataUrl,
162 file = _ref.file;
163
164 if (errorCode) {
165 this.$_emitter('error', {
166 code: errorCode,
167 msg: ERROR[errorCode]
168 });
169 return;
170 }
171
172 this.$_emitter('complete', {
173 blob: (0, _imageDataurl.dataURItoBlob)(dataUrl),
174 dataUrl: dataUrl,
175 file: file
176 });
177 this.$_cleaeFile();
178 }
179 }
180 };
181});
182})()
183if (module.exports.__esModule) module.exports = module.exports.default
184var __vue__options__ = (typeof module.exports === "function"? module.exports.options: module.exports)
185__vue__options__.render = function render () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"md-image-reader"},[_c('input',{key:_vm.inputTmpKey,staticClass:"md-image-reader-file",attrs:{"type":"file","name":_vm.name,"accept":_vm.mimeType,"capture":_vm.isCameraOnly,"multiple":_vm.isMultiple},on:{"change":_vm.$_onFileChange}})])}
186__vue__options__.staticRenderFns = []