@sam-senior/photo-capture 1.2.3 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/photo-capture.component.mjs +156 -0
- package/esm2022/lib/photo-capture.module.mjs +17 -0
- package/esm2022/lib/photo-capture.service.mjs +48 -0
- package/esm2022/public_api.mjs +7 -0
- package/esm2022/sam-senior-photo-capture.mjs +5 -0
- package/fesm2022/sam-senior-photo-capture.mjs +226 -0
- package/fesm2022/sam-senior-photo-capture.mjs.map +1 -0
- package/{sam-senior-photo-capture.d.ts → index.d.ts} +5 -4
- package/lib/photo-capture.component.d.ts +34 -31
- package/lib/photo-capture.module.d.ts +7 -2
- package/lib/photo-capture.service.d.ts +20 -17
- package/package.json +21 -17
- package/public_api.d.ts +3 -3
- package/bundles/sam-senior-photo-capture.umd.js +0 -489
- package/bundles/sam-senior-photo-capture.umd.js.map +0 -1
- package/bundles/sam-senior-photo-capture.umd.min.js +0 -2
- package/bundles/sam-senior-photo-capture.umd.min.js.map +0 -1
- package/esm2015/lib/photo-capture.component.js +0 -287
- package/esm2015/lib/photo-capture.module.js +0 -16
- package/esm2015/lib/photo-capture.service.js +0 -110
- package/esm2015/public_api.js +0 -11
- package/esm2015/sam-senior-photo-capture.js +0 -9
- package/esm5/lib/photo-capture.component.js +0 -349
- package/esm5/lib/photo-capture.module.js +0 -20
- package/esm5/lib/photo-capture.service.js +0 -144
- package/esm5/public_api.js +0 -11
- package/esm5/sam-senior-photo-capture.js +0 -9
- package/fesm2015/sam-senior-photo-capture.js +0 -351
- package/fesm2015/sam-senior-photo-capture.js.map +0 -1
- package/fesm5/sam-senior-photo-capture.js +0 -448
- package/fesm5/sam-senior-photo-capture.js.map +0 -1
- package/sam-senior-photo-capture.metadata.json +0 -1
|
@@ -1,448 +0,0 @@
|
|
|
1
|
-
import { __read } from 'tslib';
|
|
2
|
-
import { Injectable, EventEmitter, NgModule, defineInjectable, Component, ViewChild, Input, Output } from '@angular/core';
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* @fileoverview added by tsickle
|
|
6
|
-
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
7
|
-
*/
|
|
8
|
-
var PhotoCaptureService = /** @class */ (function () {
|
|
9
|
-
function PhotoCaptureService() {
|
|
10
|
-
this.key = 'key';
|
|
11
|
-
this.photoTaken = new EventEmitter();
|
|
12
|
-
this.cameraStop = new EventEmitter();
|
|
13
|
-
this.cameraStart = new EventEmitter();
|
|
14
|
-
}
|
|
15
|
-
/**
|
|
16
|
-
* @param {?} key
|
|
17
|
-
* @return {?}
|
|
18
|
-
*/
|
|
19
|
-
PhotoCaptureService.prototype.setKey = /**
|
|
20
|
-
* @param {?} key
|
|
21
|
-
* @return {?}
|
|
22
|
-
*/
|
|
23
|
-
function (key) {
|
|
24
|
-
this.key = key;
|
|
25
|
-
};
|
|
26
|
-
/**
|
|
27
|
-
* @return {?}
|
|
28
|
-
*/
|
|
29
|
-
PhotoCaptureService.prototype.getKey = /**
|
|
30
|
-
* @return {?}
|
|
31
|
-
*/
|
|
32
|
-
function () {
|
|
33
|
-
return this.key;
|
|
34
|
-
};
|
|
35
|
-
/**
|
|
36
|
-
* @param {?} videoElement
|
|
37
|
-
* @return {?}
|
|
38
|
-
*/
|
|
39
|
-
PhotoCaptureService.prototype.setVideoElement = /**
|
|
40
|
-
* @param {?} videoElement
|
|
41
|
-
* @return {?}
|
|
42
|
-
*/
|
|
43
|
-
function (videoElement) {
|
|
44
|
-
this.videoElement = videoElement;
|
|
45
|
-
};
|
|
46
|
-
/**
|
|
47
|
-
* @return {?}
|
|
48
|
-
*/
|
|
49
|
-
PhotoCaptureService.prototype.getVideoElement = /**
|
|
50
|
-
* @return {?}
|
|
51
|
-
*/
|
|
52
|
-
function () {
|
|
53
|
-
return this.videoElement;
|
|
54
|
-
};
|
|
55
|
-
/**
|
|
56
|
-
* @return {?}
|
|
57
|
-
*/
|
|
58
|
-
PhotoCaptureService.prototype.stop = /**
|
|
59
|
-
* @return {?}
|
|
60
|
-
*/
|
|
61
|
-
function () {
|
|
62
|
-
this.cameraStop.emit();
|
|
63
|
-
};
|
|
64
|
-
/**
|
|
65
|
-
* @return {?}
|
|
66
|
-
*/
|
|
67
|
-
PhotoCaptureService.prototype.onStop = /**
|
|
68
|
-
* @return {?}
|
|
69
|
-
*/
|
|
70
|
-
function () {
|
|
71
|
-
return this.cameraStop.asObservable();
|
|
72
|
-
};
|
|
73
|
-
/**
|
|
74
|
-
* @return {?}
|
|
75
|
-
*/
|
|
76
|
-
PhotoCaptureService.prototype.start = /**
|
|
77
|
-
* @return {?}
|
|
78
|
-
*/
|
|
79
|
-
function () {
|
|
80
|
-
this.cameraStart.emit();
|
|
81
|
-
};
|
|
82
|
-
/**
|
|
83
|
-
* @return {?}
|
|
84
|
-
*/
|
|
85
|
-
PhotoCaptureService.prototype.onStart = /**
|
|
86
|
-
* @return {?}
|
|
87
|
-
*/
|
|
88
|
-
function () {
|
|
89
|
-
return this.cameraStart.asObservable();
|
|
90
|
-
};
|
|
91
|
-
/**
|
|
92
|
-
* @return {?}
|
|
93
|
-
*/
|
|
94
|
-
PhotoCaptureService.prototype.takePhoto = /**
|
|
95
|
-
* @return {?}
|
|
96
|
-
*/
|
|
97
|
-
function () {
|
|
98
|
-
this.photoTaken.emit();
|
|
99
|
-
};
|
|
100
|
-
/**
|
|
101
|
-
* @return {?}
|
|
102
|
-
*/
|
|
103
|
-
PhotoCaptureService.prototype.onPhotoTaken = /**
|
|
104
|
-
* @return {?}
|
|
105
|
-
*/
|
|
106
|
-
function () {
|
|
107
|
-
return this.photoTaken.asObservable();
|
|
108
|
-
};
|
|
109
|
-
PhotoCaptureService.decorators = [
|
|
110
|
-
{ type: Injectable, args: [{
|
|
111
|
-
providedIn: 'root'
|
|
112
|
-
},] }
|
|
113
|
-
];
|
|
114
|
-
/** @nocollapse */ PhotoCaptureService.ngInjectableDef = defineInjectable({ factory: function PhotoCaptureService_Factory() { return new PhotoCaptureService(); }, token: PhotoCaptureService, providedIn: "root" });
|
|
115
|
-
return PhotoCaptureService;
|
|
116
|
-
}());
|
|
117
|
-
|
|
118
|
-
/**
|
|
119
|
-
* @fileoverview added by tsickle
|
|
120
|
-
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
121
|
-
*/
|
|
122
|
-
var PhotoCaptureComponent = /** @class */ (function () {
|
|
123
|
-
function PhotoCaptureComponent(photoCaptureService) {
|
|
124
|
-
this.photoCaptureService = photoCaptureService;
|
|
125
|
-
this.width = screen.width;
|
|
126
|
-
this.height = screen.height;
|
|
127
|
-
this.error = new EventEmitter();
|
|
128
|
-
this.open = new EventEmitter();
|
|
129
|
-
this.photoTake = new EventEmitter();
|
|
130
|
-
this.cameraConfigConstraints = {
|
|
131
|
-
audio: false,
|
|
132
|
-
video: {
|
|
133
|
-
height: this.height,
|
|
134
|
-
facingMode: {
|
|
135
|
-
ideal: 'user'
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
};
|
|
139
|
-
}
|
|
140
|
-
/**
|
|
141
|
-
* @return {?}
|
|
142
|
-
*/
|
|
143
|
-
PhotoCaptureComponent.prototype.ngOnInit = /**
|
|
144
|
-
* @return {?}
|
|
145
|
-
*/
|
|
146
|
-
function () {
|
|
147
|
-
var _this = this;
|
|
148
|
-
this.photoCaptureService.onStart()
|
|
149
|
-
.subscribe((/**
|
|
150
|
-
* @return {?}
|
|
151
|
-
*/
|
|
152
|
-
function () { return _this.cameraStart(); }));
|
|
153
|
-
this.photoCaptureService.onStop()
|
|
154
|
-
.subscribe((/**
|
|
155
|
-
* @return {?}
|
|
156
|
-
*/
|
|
157
|
-
function () { return _this.cameraStop(); }));
|
|
158
|
-
this.photoTakeListener();
|
|
159
|
-
};
|
|
160
|
-
/**
|
|
161
|
-
* @private
|
|
162
|
-
* @return {?}
|
|
163
|
-
*/
|
|
164
|
-
PhotoCaptureComponent.prototype.cameraStart = /**
|
|
165
|
-
* @private
|
|
166
|
-
* @return {?}
|
|
167
|
-
*/
|
|
168
|
-
function () {
|
|
169
|
-
if (this.hasGetUserMedia()) {
|
|
170
|
-
this.createCameraElement();
|
|
171
|
-
this.initializeCamera();
|
|
172
|
-
}
|
|
173
|
-
else {
|
|
174
|
-
this.error.emit({
|
|
175
|
-
error: 'browser_not_support',
|
|
176
|
-
message: 'This browser does not support camera features (No getUserMedia)'
|
|
177
|
-
});
|
|
178
|
-
}
|
|
179
|
-
};
|
|
180
|
-
/**
|
|
181
|
-
* @private
|
|
182
|
-
* @return {?}
|
|
183
|
-
*/
|
|
184
|
-
PhotoCaptureComponent.prototype.cameraStop = /**
|
|
185
|
-
* @private
|
|
186
|
-
* @return {?}
|
|
187
|
-
*/
|
|
188
|
-
function () {
|
|
189
|
-
this.finalizeCamera();
|
|
190
|
-
};
|
|
191
|
-
/**
|
|
192
|
-
* @private
|
|
193
|
-
* @return {?}
|
|
194
|
-
*/
|
|
195
|
-
PhotoCaptureComponent.prototype.createCameraElement = /**
|
|
196
|
-
* @private
|
|
197
|
-
* @return {?}
|
|
198
|
-
*/
|
|
199
|
-
function () {
|
|
200
|
-
var _this = this;
|
|
201
|
-
this.cameraElement = (/** @type {?} */ (this.camera.nativeElement));
|
|
202
|
-
if (this.cameraElement) {
|
|
203
|
-
this.photoCaptureService.setVideoElement(this.cameraElement);
|
|
204
|
-
this.cameraElement.style.width = this.width + "px";
|
|
205
|
-
this.cameraElement.style.height = this.height + "px";
|
|
206
|
-
this.cameraElement.onerror = (/**
|
|
207
|
-
* @param {?} err
|
|
208
|
-
* @return {?}
|
|
209
|
-
*/
|
|
210
|
-
function (err) { return _this.error.emit(err); });
|
|
211
|
-
}
|
|
212
|
-
else {
|
|
213
|
-
this.error.emit({
|
|
214
|
-
error: 'browser_not_retriving_element',
|
|
215
|
-
message: 'The browser not retriving #camera element of browser'
|
|
216
|
-
});
|
|
217
|
-
}
|
|
218
|
-
};
|
|
219
|
-
/**
|
|
220
|
-
* @private
|
|
221
|
-
* @return {?}
|
|
222
|
-
*/
|
|
223
|
-
PhotoCaptureComponent.prototype.initializeCamera = /**
|
|
224
|
-
* @private
|
|
225
|
-
* @return {?}
|
|
226
|
-
*/
|
|
227
|
-
function () {
|
|
228
|
-
var _this = this;
|
|
229
|
-
navigator.mediaDevices.getUserMedia(this.cameraConfigConstraints)
|
|
230
|
-
.then((/**
|
|
231
|
-
* @param {?} mediaStream
|
|
232
|
-
* @return {?}
|
|
233
|
-
*/
|
|
234
|
-
function (mediaStream) {
|
|
235
|
-
_this.setCameraElementSrcObject(mediaStream);
|
|
236
|
-
_this.cameraElement.onloadedmetadata = (/**
|
|
237
|
-
* @return {?}
|
|
238
|
-
*/
|
|
239
|
-
function () {
|
|
240
|
-
return _this.onLoadCameraElement();
|
|
241
|
-
});
|
|
242
|
-
}))
|
|
243
|
-
.catch((/**
|
|
244
|
-
* @param {?} err
|
|
245
|
-
* @return {?}
|
|
246
|
-
*/
|
|
247
|
-
function (err) { return _this.error.emit(err); }));
|
|
248
|
-
};
|
|
249
|
-
/**
|
|
250
|
-
* @private
|
|
251
|
-
* @return {?}
|
|
252
|
-
*/
|
|
253
|
-
PhotoCaptureComponent.prototype.hasGetUserMedia = /**
|
|
254
|
-
* @private
|
|
255
|
-
* @return {?}
|
|
256
|
-
*/
|
|
257
|
-
function () {
|
|
258
|
-
return !!(navigator.mediaDevices && navigator.mediaDevices.getUserMedia);
|
|
259
|
-
};
|
|
260
|
-
/**
|
|
261
|
-
* @private
|
|
262
|
-
* @param {?} mediaStream
|
|
263
|
-
* @return {?}
|
|
264
|
-
*/
|
|
265
|
-
PhotoCaptureComponent.prototype.setCameraElementSrcObject = /**
|
|
266
|
-
* @private
|
|
267
|
-
* @param {?} mediaStream
|
|
268
|
-
* @return {?}
|
|
269
|
-
*/
|
|
270
|
-
function (mediaStream) {
|
|
271
|
-
this.cameraElement.srcObject = mediaStream;
|
|
272
|
-
};
|
|
273
|
-
/**
|
|
274
|
-
* @private
|
|
275
|
-
* @return {?}
|
|
276
|
-
*/
|
|
277
|
-
PhotoCaptureComponent.prototype.onLoadCameraElement = /**
|
|
278
|
-
* @private
|
|
279
|
-
* @return {?}
|
|
280
|
-
*/
|
|
281
|
-
function () {
|
|
282
|
-
this.getCameraElementDimensions();
|
|
283
|
-
this.updateCameraElementDimensions();
|
|
284
|
-
this.open.emit();
|
|
285
|
-
};
|
|
286
|
-
/**
|
|
287
|
-
* @private
|
|
288
|
-
* @return {?}
|
|
289
|
-
*/
|
|
290
|
-
PhotoCaptureComponent.prototype.getCameraElementDimensions = /**
|
|
291
|
-
* @private
|
|
292
|
-
* @return {?}
|
|
293
|
-
*/
|
|
294
|
-
function () {
|
|
295
|
-
this.effectiveHeight = this.height;
|
|
296
|
-
this.effectiveWidth = this.width;
|
|
297
|
-
};
|
|
298
|
-
/**
|
|
299
|
-
* @return {?}
|
|
300
|
-
*/
|
|
301
|
-
PhotoCaptureComponent.prototype.updateCameraElementDimensions = /**
|
|
302
|
-
* @return {?}
|
|
303
|
-
*/
|
|
304
|
-
function () {
|
|
305
|
-
this.cameraElement.height = this.effectiveHeight;
|
|
306
|
-
this.cameraElement.width = this.effectiveWidth;
|
|
307
|
-
this.cameraElement.style.width = this.effectiveWidth + "px";
|
|
308
|
-
this.cameraElement.style.height = this.effectiveHeight + "px";
|
|
309
|
-
};
|
|
310
|
-
/**
|
|
311
|
-
* @private
|
|
312
|
-
* @return {?}
|
|
313
|
-
*/
|
|
314
|
-
PhotoCaptureComponent.prototype.photoTakeListener = /**
|
|
315
|
-
* @private
|
|
316
|
-
* @return {?}
|
|
317
|
-
*/
|
|
318
|
-
function () {
|
|
319
|
-
var _this = this;
|
|
320
|
-
this.photoCaptureService.onPhotoTaken()
|
|
321
|
-
.subscribe((/**
|
|
322
|
-
* @return {?}
|
|
323
|
-
*/
|
|
324
|
-
function () {
|
|
325
|
-
_this.takePhoto();
|
|
326
|
-
}));
|
|
327
|
-
};
|
|
328
|
-
/**
|
|
329
|
-
* @private
|
|
330
|
-
* @return {?}
|
|
331
|
-
*/
|
|
332
|
-
PhotoCaptureComponent.prototype.takePhoto = /**
|
|
333
|
-
* @private
|
|
334
|
-
* @return {?}
|
|
335
|
-
*/
|
|
336
|
-
function () {
|
|
337
|
-
var _this = this;
|
|
338
|
-
return new Promise((/**
|
|
339
|
-
* @param {?} resolve
|
|
340
|
-
* @return {?}
|
|
341
|
-
*/
|
|
342
|
-
function (resolve) {
|
|
343
|
-
/** @type {?} */
|
|
344
|
-
var canvas = _this.getCameraImagemCanvas();
|
|
345
|
-
canvas.toBlob((/**
|
|
346
|
-
* @param {?} blob
|
|
347
|
-
* @return {?}
|
|
348
|
-
*/
|
|
349
|
-
function (blob) {
|
|
350
|
-
_this.photoTake.emit({
|
|
351
|
-
blob: blob,
|
|
352
|
-
image: canvas.toDataURL()
|
|
353
|
-
});
|
|
354
|
-
}));
|
|
355
|
-
_this.finalizeCamera();
|
|
356
|
-
resolve('');
|
|
357
|
-
}));
|
|
358
|
-
};
|
|
359
|
-
/**
|
|
360
|
-
* @private
|
|
361
|
-
* @return {?}
|
|
362
|
-
*/
|
|
363
|
-
PhotoCaptureComponent.prototype.finalizeCamera = /**
|
|
364
|
-
* @private
|
|
365
|
-
* @return {?}
|
|
366
|
-
*/
|
|
367
|
-
function () {
|
|
368
|
-
if (this.cameraElement) {
|
|
369
|
-
if (this.cameraElement.srcObject) {
|
|
370
|
-
/** @type {?} */
|
|
371
|
-
var video = (/** @type {?} */ (this.cameraElement.srcObject));
|
|
372
|
-
if (video && video.getTracks) {
|
|
373
|
-
var _a = __read(video.getTracks(), 1), tracks = _a[0];
|
|
374
|
-
if (tracks) {
|
|
375
|
-
tracks.stop();
|
|
376
|
-
}
|
|
377
|
-
}
|
|
378
|
-
}
|
|
379
|
-
}
|
|
380
|
-
};
|
|
381
|
-
/**
|
|
382
|
-
* @private
|
|
383
|
-
* @return {?}
|
|
384
|
-
*/
|
|
385
|
-
PhotoCaptureComponent.prototype.getCameraImagemCanvas = /**
|
|
386
|
-
* @private
|
|
387
|
-
* @return {?}
|
|
388
|
-
*/
|
|
389
|
-
function () {
|
|
390
|
-
/** @type {?} */
|
|
391
|
-
var canvas = document.createElement('canvas');
|
|
392
|
-
canvas.width = PhotoCaptureComponent.PHOTO_DIMENSIONS;
|
|
393
|
-
canvas.height = PhotoCaptureComponent.PHOTO_DIMENSIONS;
|
|
394
|
-
canvas.getContext('2d').drawImage(this.cameraElement, 0, 0, PhotoCaptureComponent.PHOTO_DIMENSIONS, PhotoCaptureComponent.PHOTO_DIMENSIONS);
|
|
395
|
-
return canvas;
|
|
396
|
-
};
|
|
397
|
-
PhotoCaptureComponent.PHOTO_DIMENSIONS = 700;
|
|
398
|
-
PhotoCaptureComponent.decorators = [
|
|
399
|
-
{ type: Component, args: [{
|
|
400
|
-
selector: 'sam-photo-capture',
|
|
401
|
-
template: "<video #camera autoplay muted class=\"sam-camera\"></video>"
|
|
402
|
-
}] }
|
|
403
|
-
];
|
|
404
|
-
/** @nocollapse */
|
|
405
|
-
PhotoCaptureComponent.ctorParameters = function () { return [
|
|
406
|
-
{ type: PhotoCaptureService }
|
|
407
|
-
]; };
|
|
408
|
-
PhotoCaptureComponent.propDecorators = {
|
|
409
|
-
camera: [{ type: ViewChild, args: ['camera',] }],
|
|
410
|
-
width: [{ type: Input }],
|
|
411
|
-
height: [{ type: Input }],
|
|
412
|
-
error: [{ type: Output }],
|
|
413
|
-
open: [{ type: Output }],
|
|
414
|
-
photoTake: [{ type: Output }]
|
|
415
|
-
};
|
|
416
|
-
return PhotoCaptureComponent;
|
|
417
|
-
}());
|
|
418
|
-
|
|
419
|
-
/**
|
|
420
|
-
* @fileoverview added by tsickle
|
|
421
|
-
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
422
|
-
*/
|
|
423
|
-
var PhotoCaptureModule = /** @class */ (function () {
|
|
424
|
-
function PhotoCaptureModule() {
|
|
425
|
-
}
|
|
426
|
-
PhotoCaptureModule.decorators = [
|
|
427
|
-
{ type: NgModule, args: [{
|
|
428
|
-
declarations: [PhotoCaptureComponent],
|
|
429
|
-
imports: [],
|
|
430
|
-
exports: [PhotoCaptureComponent]
|
|
431
|
-
},] }
|
|
432
|
-
];
|
|
433
|
-
return PhotoCaptureModule;
|
|
434
|
-
}());
|
|
435
|
-
|
|
436
|
-
/**
|
|
437
|
-
* @fileoverview added by tsickle
|
|
438
|
-
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
439
|
-
*/
|
|
440
|
-
|
|
441
|
-
/**
|
|
442
|
-
* @fileoverview added by tsickle
|
|
443
|
-
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
|
|
444
|
-
*/
|
|
445
|
-
|
|
446
|
-
export { PhotoCaptureService, PhotoCaptureComponent, PhotoCaptureModule };
|
|
447
|
-
|
|
448
|
-
//# sourceMappingURL=sam-senior-photo-capture.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sam-senior-photo-capture.js.map","sources":["ng://@sam-senior/photo-capture/lib/photo-capture.service.ts","ng://@sam-senior/photo-capture/lib/photo-capture.component.ts","ng://@sam-senior/photo-capture/lib/photo-capture.module.ts"],"sourcesContent":["import { Injectable, EventEmitter } from '@angular/core';\r\n\r\n@Injectable({\r\n providedIn: 'root'\r\n})\r\nexport class PhotoCaptureService {\r\n\r\n private key = 'key';\r\n private photoTaken = new EventEmitter();\r\n private cameraStop = new EventEmitter();\r\n private cameraStart = new EventEmitter();\r\n private videoElement: HTMLVideoElement;\r\n\r\n public setKey(key) {\r\n this.key = key;\r\n }\r\n\r\n public getKey() {\r\n return this.key;\r\n }\r\n\r\n public setVideoElement(videoElement) {\r\n this.videoElement = videoElement;\r\n }\r\n\r\n public getVideoElement() {\r\n return this.videoElement;\r\n }\r\n\r\n public stop() {\r\n this.cameraStop.emit();\r\n }\r\n\r\n public onStop() {\r\n return this.cameraStop.asObservable();\r\n }\r\n\r\n public start() {\r\n this.cameraStart.emit();\r\n }\r\n\r\n public onStart() {\r\n return this.cameraStart.asObservable();\r\n }\r\n\r\n public takePhoto() {\r\n this.photoTaken.emit();\r\n }\r\n\r\n public onPhotoTaken() {\r\n return this.photoTaken.asObservable();\r\n }\r\n}\r\n","import { Component, ViewChild, ElementRef, Input, Output, EventEmitter, OnInit } from '@angular/core';\r\n\r\nimport { PhotoCaptureService } from './photo-capture.service';\r\n\r\n@Component({\r\n selector: 'sam-photo-capture',\r\n template: `<video #camera autoplay muted class=\"sam-camera\"></video>`\r\n})\r\nexport class PhotoCaptureComponent implements OnInit {\r\n\r\n private static PHOTO_DIMENSIONS = 700;\r\n\r\n @ViewChild('camera') public camera: ElementRef;\r\n\r\n @Input() width = screen.width;\r\n @Input() height = screen.height;\r\n\r\n @Output() error = new EventEmitter();\r\n @Output() open = new EventEmitter();\r\n @Output() photoTake = new EventEmitter();\r\n\r\n private cameraElement: HTMLVideoElement;\r\n private effectiveHeight: number;\r\n private effectiveWidth: number;\r\n\r\n private cameraConfigConstraints: MediaStreamConstraints = {\r\n audio: false,\r\n video: {\r\n height: this.height,\r\n facingMode: {\r\n ideal: 'user'\r\n }\r\n }\r\n };\r\n\r\n constructor(\r\n private photoCaptureService: PhotoCaptureService\r\n ) { }\r\n\r\n ngOnInit() {\r\n this.photoCaptureService.onStart()\r\n .subscribe(() => this.cameraStart());\r\n this.photoCaptureService.onStop()\r\n .subscribe(() => this.cameraStop());\r\n this.photoTakeListener();\r\n }\r\n\r\n private cameraStart() {\r\n if (this.hasGetUserMedia()) {\r\n this.createCameraElement();\r\n this.initializeCamera();\r\n } else {\r\n this.error.emit({\r\n error: 'browser_not_support',\r\n message: 'This browser does not support camera features (No getUserMedia)'\r\n });\r\n }\r\n }\r\n\r\n private cameraStop() {\r\n this.finalizeCamera();\r\n }\r\n\r\n private createCameraElement(): void {\r\n this.cameraElement = this.camera.nativeElement as HTMLVideoElement;\r\n if (this.cameraElement) {\r\n this.photoCaptureService.setVideoElement(this.cameraElement);\r\n this.cameraElement.style.width = `${this.width}px`;\r\n this.cameraElement.style.height = `${this.height}px`;\r\n this.cameraElement.onerror = err => this.error.emit(err);\r\n } else {\r\n this.error.emit({\r\n error: 'browser_not_retriving_element',\r\n message: 'The browser not retriving #camera element of browser'\r\n });\r\n }\r\n }\r\n\r\n private initializeCamera(): void {\r\n navigator.mediaDevices.getUserMedia(this.cameraConfigConstraints)\r\n .then(mediaStream => {\r\n this.setCameraElementSrcObject(mediaStream);\r\n this.cameraElement.onloadedmetadata = () =>\r\n this.onLoadCameraElement();\r\n })\r\n .catch(err => this.error.emit(err));\r\n }\r\n\r\n private hasGetUserMedia(): boolean {\r\n return !!(navigator.mediaDevices && navigator.mediaDevices.getUserMedia);\r\n }\r\n\r\n private setCameraElementSrcObject(mediaStream: MediaStream): void {\r\n this.cameraElement.srcObject = mediaStream;\r\n }\r\n\r\n private onLoadCameraElement(): void {\r\n this.getCameraElementDimensions();\r\n this.updateCameraElementDimensions();\r\n this.open.emit();\r\n }\r\n\r\n private getCameraElementDimensions() {\r\n this.effectiveHeight = this.height;\r\n this.effectiveWidth = this.width;\r\n }\r\n\r\n public updateCameraElementDimensions() {\r\n this.cameraElement.height = this.effectiveHeight;\r\n this.cameraElement.width = this.effectiveWidth;\r\n this.cameraElement.style.width = `${this.effectiveWidth}px`;\r\n this.cameraElement.style.height = `${this.effectiveHeight}px`;\r\n }\r\n\r\n private photoTakeListener(): void {\r\n this.photoCaptureService.onPhotoTaken()\r\n .subscribe(() => {\r\n this.takePhoto();\r\n });\r\n }\r\n\r\n private takePhoto() {\r\n return new Promise(resolve => {\r\n const canvas = this.getCameraImagemCanvas();\r\n canvas.toBlob((blob) => {\r\n this.photoTake.emit({\r\n blob: blob,\r\n image: canvas.toDataURL()\r\n });\r\n });\r\n this.finalizeCamera();\r\n resolve('');\r\n });\r\n }\r\n\r\n private finalizeCamera() {\r\n if (this.cameraElement) {\r\n if (this.cameraElement.srcObject) {\r\n const video = this.cameraElement.srcObject as MediaStream;\r\n if (video && video.getTracks) {\r\n const [tracks] = video.getTracks();\r\n if (tracks) {\r\n tracks.stop();\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n private getCameraImagemCanvas(): HTMLCanvasElement {\r\n const canvas = document.createElement('canvas');\r\n canvas.width = PhotoCaptureComponent.PHOTO_DIMENSIONS;\r\n canvas.height = PhotoCaptureComponent.PHOTO_DIMENSIONS;\r\n canvas.getContext('2d').drawImage(this.cameraElement, 0, 0, PhotoCaptureComponent.PHOTO_DIMENSIONS, PhotoCaptureComponent.PHOTO_DIMENSIONS);\r\n return canvas;\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { PhotoCaptureComponent } from './photo-capture.component';\r\n\r\n@NgModule({\r\n declarations: [PhotoCaptureComponent],\r\n imports: [\r\n ],\r\n exports: [PhotoCaptureComponent]\r\n})\r\nexport class PhotoCaptureModule { }\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"__symbolic":"module","version":4,"metadata":{"PhotoCaptureService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"setKey":[{"__symbolic":"method"}],"getKey":[{"__symbolic":"method"}],"setVideoElement":[{"__symbolic":"method"}],"getVideoElement":[{"__symbolic":"method"}],"stop":[{"__symbolic":"method"}],"onStop":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"onStart":[{"__symbolic":"method"}],"takePhoto":[{"__symbolic":"method"}],"onPhotoTaken":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"PhotoCaptureComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"sam-photo-capture","template":"<video #camera autoplay muted class=\"sam-camera\"></video>"}]}],"members":{"camera":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":12,"character":3},"arguments":["camera"]}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"error":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":17,"character":3}}]}],"open":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":18,"character":3}}]}],"photoTake":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"PhotoCaptureService"}]}],"ngOnInit":[{"__symbolic":"method"}],"cameraStart":[{"__symbolic":"method"}],"cameraStop":[{"__symbolic":"method"}],"createCameraElement":[{"__symbolic":"method"}],"initializeCamera":[{"__symbolic":"method"}],"hasGetUserMedia":[{"__symbolic":"method"}],"setCameraElementSrcObject":[{"__symbolic":"method"}],"onLoadCameraElement":[{"__symbolic":"method"}],"getCameraElementDimensions":[{"__symbolic":"method"}],"updateCameraElementDimensions":[{"__symbolic":"method"}],"photoTakeListener":[{"__symbolic":"method"}],"takePhoto":[{"__symbolic":"method"}],"finalizeCamera":[{"__symbolic":"method"}],"getCameraImagemCanvas":[{"__symbolic":"method"}]},"statics":{"PHOTO_DIMENSIONS":700}},"PhotoCaptureModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":3,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PhotoCaptureComponent"}],"imports":[],"exports":[{"__symbolic":"reference","name":"PhotoCaptureComponent"}]}]}],"members":{}}},"origins":{"PhotoCaptureService":"./lib/photo-capture.service","PhotoCaptureComponent":"./lib/photo-capture.component","PhotoCaptureModule":"./lib/photo-capture.module"},"importAs":"@sam-senior/photo-capture"}
|