argous 1.2.220 → 1.2.222
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/dist/api/index.d.ts +2 -1
- package/dist/api/index.js +6 -6
- package/dist/components/Cam/Cam.d.ts +19 -0
- package/dist/components/Cam/Cam.js +168 -0
- package/dist/components/Cam/cam.css +8 -0
- package/dist/components/Cam/index.d.ts +2 -0
- package/dist/components/Cam/index.js +8 -0
- package/dist/components/Carousel/Carousel.d.ts +1 -1
- package/dist/components/index.d.ts +4 -1
- package/dist/components/index.js +4 -1
- package/lib/api/index.js +2 -2
- package/lib/components/Cam/Cam.d.ts +19 -0
- package/lib/components/Cam/Cam.js +102 -0
- package/lib/components/Cam/cam.css +8 -0
- package/lib/components/Cam/index.d.ts +2 -0
- package/lib/components/Cam/index.js +1 -0
- package/lib/components/Carousel/Carousel.d.ts +1 -1
- package/lib/components/index.d.ts +4 -1
- package/lib/components/index.js +4 -1
- package/package.json +1 -1
package/dist/api/index.d.ts
CHANGED
|
@@ -59,8 +59,9 @@ export function createDocument({ idUnidade, cdUnidade, idDocPai, path, dsKeyWord
|
|
|
59
59
|
dsSubCategoria: any;
|
|
60
60
|
snSensivel: any;
|
|
61
61
|
}): Promise<any>;
|
|
62
|
-
export function getFileFromLink({ URL: link }?: {
|
|
62
|
+
export function getFileFromLink({ URL: link, token }?: {
|
|
63
63
|
URL?: string | undefined;
|
|
64
|
+
token?: string | undefined;
|
|
64
65
|
}): Promise<string>;
|
|
65
66
|
export function getLink(idDocumento: any, nrRevisao: any, timeout: any): Promise<any>;
|
|
66
67
|
export function scanDocument(idDocumento: any, nrRevisao: any): Promise<any>;
|
package/dist/api/index.js
CHANGED
|
@@ -766,21 +766,21 @@ var createDocument = function (_a) {
|
|
|
766
766
|
};
|
|
767
767
|
exports.createDocument = createDocument;
|
|
768
768
|
var getFileFromLink = function (_a) {
|
|
769
|
-
var _b = _a === void 0 ? {} : _a, _c = _b.URL, link = _c === void 0 ? '' : _c;
|
|
769
|
+
var _b = _a === void 0 ? {} : _a, _c = _b.URL, link = _c === void 0 ? '' : _c, _d = _b.token, token = _d === void 0 ? '' : _d;
|
|
770
770
|
return __awaiter(void 0, void 0, void 0, function () {
|
|
771
771
|
var file;
|
|
772
|
-
return __generator(this, function (
|
|
773
|
-
switch (
|
|
772
|
+
return __generator(this, function (_e) {
|
|
773
|
+
switch (_e.label) {
|
|
774
774
|
case 0:
|
|
775
775
|
if (!link)
|
|
776
776
|
return [2 /*return*/, ''];
|
|
777
777
|
return [4 /*yield*/, fetch(link, {
|
|
778
778
|
method: 'post',
|
|
779
|
-
headers: exports.headers()
|
|
779
|
+
headers: exports.headers(token)
|
|
780
780
|
})];
|
|
781
|
-
case 1: return [4 /*yield*/, (
|
|
781
|
+
case 1: return [4 /*yield*/, (_e.sent()).blob()];
|
|
782
782
|
case 2:
|
|
783
|
-
file =
|
|
783
|
+
file = _e.sent();
|
|
784
784
|
return [2 /*return*/, URL.createObjectURL(file)];
|
|
785
785
|
}
|
|
786
786
|
});
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export interface CamProps {
|
|
2
|
+
/**
|
|
3
|
+
* ID
|
|
4
|
+
*/
|
|
5
|
+
id: string,
|
|
6
|
+
/**
|
|
7
|
+
* Component style
|
|
8
|
+
*/
|
|
9
|
+
style?: object,
|
|
10
|
+
/**
|
|
11
|
+
* Function called on get stream
|
|
12
|
+
*/
|
|
13
|
+
onGetStream?: (parameters: object) => void
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
declare function Cam(props: CamProps): JSX.Element
|
|
18
|
+
|
|
19
|
+
export default Cam;
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
22
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
23
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
24
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
25
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
26
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
27
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
31
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
32
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
33
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
34
|
+
function step(op) {
|
|
35
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
36
|
+
while (_) try {
|
|
37
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
38
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
39
|
+
switch (op[0]) {
|
|
40
|
+
case 0: case 1: t = op; break;
|
|
41
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
42
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
43
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
44
|
+
default:
|
|
45
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
46
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
47
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
48
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
49
|
+
if (t[2]) _.ops.pop();
|
|
50
|
+
_.trys.pop(); continue;
|
|
51
|
+
}
|
|
52
|
+
op = body.call(thisArg, _);
|
|
53
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
54
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
58
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
59
|
+
};
|
|
60
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
61
|
+
exports.camSnapshot = void 0;
|
|
62
|
+
var utils_1 = require("../../utils");
|
|
63
|
+
require("./cam.css");
|
|
64
|
+
var moment_1 = __importDefault(require("moment"));
|
|
65
|
+
var react_1 = __importStar(require("react"));
|
|
66
|
+
var GET_STREAM_INTERVAL_TIMEOUT = 3000;
|
|
67
|
+
var VIDEO_ID = 'cam-video';
|
|
68
|
+
var CANVAS_ID = 'cam-canvas';
|
|
69
|
+
var VIDEO_CONSTRAINTS = {
|
|
70
|
+
audio: false,
|
|
71
|
+
video: {
|
|
72
|
+
facingMode: 'user'
|
|
73
|
+
}
|
|
74
|
+
};
|
|
75
|
+
var createVideoElementId = function (id) {
|
|
76
|
+
if (id === void 0) { id = ''; }
|
|
77
|
+
return (id) ? id + "-" + VIDEO_ID : VIDEO_ID;
|
|
78
|
+
};
|
|
79
|
+
var createCanvasElementId = function (id) {
|
|
80
|
+
if (id === void 0) { id = ''; }
|
|
81
|
+
return (id) ? id + "-" + CANVAS_ID : CANVAS_ID;
|
|
82
|
+
};
|
|
83
|
+
var camSnapshot = function (_a) {
|
|
84
|
+
var _b = _a.e, e = _b === void 0 ? undefined : _b, _c = _a.download, download = _c === void 0 ? false : _c, _d = _a.camComponentId, camComponentId = _d === void 0 ? '' : _d;
|
|
85
|
+
var status = false, file = undefined, linkElement = undefined, canvasElement = undefined;
|
|
86
|
+
var videoElementId = createVideoElementId(camComponentId);
|
|
87
|
+
var videoElement = document.getElementById(videoElementId);
|
|
88
|
+
if (videoElement) {
|
|
89
|
+
canvasElement = document.createElement('canvas');
|
|
90
|
+
if (canvasElement) {
|
|
91
|
+
var canvasElementId = createCanvasElementId(camComponentId);
|
|
92
|
+
canvasElement.id = canvasElementId;
|
|
93
|
+
var canvasContext2D = canvasElement.getContext('2d');
|
|
94
|
+
if (canvasContext2D) {
|
|
95
|
+
canvasElement.width = videoElement.offsetWidth;
|
|
96
|
+
canvasElement.height = videoElement.offsetHeight;
|
|
97
|
+
canvasContext2D.drawImage(videoElement, 0, 0, videoElement.offsetWidth, videoElement.offsetHeight);
|
|
98
|
+
linkElement = document.createElement('a');
|
|
99
|
+
linkElement.download = "Capture_" + moment_1.default(new Date()).format('DD-MM-YYYY_HH:mm:ss') + ".png";
|
|
100
|
+
var dataUrl = canvasElement.toDataURL('image/png');
|
|
101
|
+
linkElement.href = dataUrl;
|
|
102
|
+
var blob = utils_1.dataUrlToBlob(dataUrl);
|
|
103
|
+
if (blob)
|
|
104
|
+
file = new File([blob], linkElement.download, { type: blob.type });
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
(linkElement && file) && (status = true);
|
|
109
|
+
(linkElement && download) && linkElement.click();
|
|
110
|
+
return { e: e, status: status, file: file, link: linkElement, canvas: canvasElement };
|
|
111
|
+
};
|
|
112
|
+
exports.camSnapshot = camSnapshot;
|
|
113
|
+
var Cam = function (_a) {
|
|
114
|
+
var _b = _a.id, id = _b === void 0 ? '' : _b, _c = _a.style, style = _c === void 0 ? {} : _c, onGetStream = _a.onGetStream;
|
|
115
|
+
var videoRef = react_1.useRef(null);
|
|
116
|
+
var streamRef = react_1.useRef(null);
|
|
117
|
+
var getStreamIntervalIdRef = react_1.useRef(null);
|
|
118
|
+
var videoElementId = createVideoElementId(id);
|
|
119
|
+
var getStream = react_1.useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
120
|
+
var stream, error_1;
|
|
121
|
+
return __generator(this, function (_a) {
|
|
122
|
+
switch (_a.label) {
|
|
123
|
+
case 0:
|
|
124
|
+
stream = null;
|
|
125
|
+
_a.label = 1;
|
|
126
|
+
case 1:
|
|
127
|
+
_a.trys.push([1, 3, , 4]);
|
|
128
|
+
return [4 /*yield*/, navigator.mediaDevices.getUserMedia(VIDEO_CONSTRAINTS)];
|
|
129
|
+
case 2:
|
|
130
|
+
stream = _a.sent();
|
|
131
|
+
stream.getTracks().forEach(function (track) {
|
|
132
|
+
if (track.kind === 'video')
|
|
133
|
+
track.enabled = true;
|
|
134
|
+
});
|
|
135
|
+
return [3 /*break*/, 4];
|
|
136
|
+
case 3:
|
|
137
|
+
error_1 = _a.sent();
|
|
138
|
+
console.error(error_1);
|
|
139
|
+
return [3 /*break*/, 4];
|
|
140
|
+
case 4:
|
|
141
|
+
if ((stream && !streamRef.current) || (!stream && streamRef.current)) {
|
|
142
|
+
videoRef.current.srcObject = stream;
|
|
143
|
+
stopVideo(streamRef.current);
|
|
144
|
+
streamRef.current = stream;
|
|
145
|
+
(typeof onGetStream === 'function') && onGetStream({ stream: stream });
|
|
146
|
+
}
|
|
147
|
+
else if (stream)
|
|
148
|
+
stopVideo(stream);
|
|
149
|
+
return [2 /*return*/];
|
|
150
|
+
}
|
|
151
|
+
});
|
|
152
|
+
}); }, [onGetStream]);
|
|
153
|
+
var stopVideo = function (stream) { return (stream) && stream.getTracks().forEach(function (track) {
|
|
154
|
+
track === null || track === void 0 ? void 0 : track.stop();
|
|
155
|
+
track.enabled = false;
|
|
156
|
+
}); };
|
|
157
|
+
react_1.useEffect(function () {
|
|
158
|
+
getStream();
|
|
159
|
+
getStreamIntervalIdRef.current = setInterval(function () { return getStream(); }, GET_STREAM_INTERVAL_TIMEOUT);
|
|
160
|
+
return function () {
|
|
161
|
+
clearInterval(getStreamIntervalIdRef.current);
|
|
162
|
+
stopVideo(streamRef.current);
|
|
163
|
+
};
|
|
164
|
+
}, [getStream]);
|
|
165
|
+
return react_1.default.createElement("div", { style: style, className: 'cam-div' },
|
|
166
|
+
react_1.default.createElement("video", { id: videoElementId, ref: videoRef, autoPlay: true }));
|
|
167
|
+
};
|
|
168
|
+
exports.default = Cam;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var Cam_1 = require("./Cam");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Cam_1).default; } });
|
|
@@ -166,4 +166,7 @@ export { default as Zoom } from './Zoom';
|
|
|
166
166
|
export * from './Zoom';
|
|
167
167
|
|
|
168
168
|
export { default as Carousel } from './Carousel';
|
|
169
|
-
export * from './Carousel';
|
|
169
|
+
export * from './Carousel';
|
|
170
|
+
|
|
171
|
+
export { default as Cam } from './Cam';
|
|
172
|
+
export * from './Cam';
|
package/dist/components/index.js
CHANGED
|
@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
14
|
};
|
|
15
15
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
16
16
|
exports.AutoCompleteFavorites = exports.UtilAutoComplete = exports.ThreadLog = exports.TextArea = exports.Tabs = exports.TablePicker = exports.Stepper = exports.SimpleTable = exports.Select = exports.ProgressBar = exports.Programa = exports.Pagination = exports.OutputText = exports.OtpInput = exports.MultipleSelect = exports.MonthPicker = exports.ModalProvider = exports.MenuBar = exports.MaterialButton = exports.ListSelect = exports.InputTags = exports.Input = exports.ImageResizeButton = exports.ImageResize = exports.Highlight = exports.FormVisualizer = exports.FileUploader = exports.FilePreparer = exports.DropArea = exports.Compartilhar = exports.Collapse = exports.CartaoUsuario = exports.Calendar = exports.Cabecalho = exports.Button = exports.BarraFerramentas = exports.BarChart = exports.AutoComplete = exports.ArgousSimpleTable = exports.ArgousProgressBar = exports.ArgousPagination = exports.ArgousInput = exports.ArgousComplexTableToolbar = exports.ArgousComplexTableHead = exports.ArgousComplexTableBody = exports.ArgousComplexTable = exports.ArgousComplexPagination = exports.ArgousAvatar = exports.ArgousAction = exports.Alert = void 0;
|
|
17
|
-
exports.Carousel = exports.Zoom = exports.TextToHtml = exports.UserCard = exports.HalfGauge = exports.PercentageDisplay = void 0;
|
|
17
|
+
exports.Cam = exports.Carousel = exports.Zoom = exports.TextToHtml = exports.UserCard = exports.HalfGauge = exports.PercentageDisplay = void 0;
|
|
18
18
|
var Alert_1 = require("./Alert");
|
|
19
19
|
Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return __importDefault(Alert_1).default; } });
|
|
20
20
|
__exportStar(require("./Alert"), exports);
|
|
@@ -182,3 +182,6 @@ __exportStar(require("./Zoom"), exports);
|
|
|
182
182
|
var Carousel_1 = require("./Carousel");
|
|
183
183
|
Object.defineProperty(exports, "Carousel", { enumerable: true, get: function () { return __importDefault(Carousel_1).default; } });
|
|
184
184
|
__exportStar(require("./Carousel"), exports);
|
|
185
|
+
var Cam_1 = require("./Cam");
|
|
186
|
+
Object.defineProperty(exports, "Cam", { enumerable: true, get: function () { return __importDefault(Cam_1).default; } });
|
|
187
|
+
__exportStar(require("./Cam"), exports);
|
package/lib/api/index.js
CHANGED
|
@@ -405,11 +405,11 @@ export const createDocument = async ({
|
|
|
405
405
|
})).json();
|
|
406
406
|
};
|
|
407
407
|
|
|
408
|
-
export const getFileFromLink = async ({ URL: link = '' } = {}) => {
|
|
408
|
+
export const getFileFromLink = async ({ URL: link = '', token = '' } = {}) => {
|
|
409
409
|
if (!link) return '';
|
|
410
410
|
const file = await (await fetch(link, {
|
|
411
411
|
method: 'post',
|
|
412
|
-
headers: headers()
|
|
412
|
+
headers: headers(token)
|
|
413
413
|
})).blob();
|
|
414
414
|
return URL.createObjectURL(file);
|
|
415
415
|
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export interface CamProps {
|
|
2
|
+
/**
|
|
3
|
+
* ID
|
|
4
|
+
*/
|
|
5
|
+
id: string,
|
|
6
|
+
/**
|
|
7
|
+
* Component style
|
|
8
|
+
*/
|
|
9
|
+
style?: object,
|
|
10
|
+
/**
|
|
11
|
+
* Function called on get stream
|
|
12
|
+
*/
|
|
13
|
+
onGetStream?: (parameters: object) => void
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
declare function Cam(props: CamProps): JSX.Element
|
|
18
|
+
|
|
19
|
+
export default Cam;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { dataUrlToBlob } from '../../utils';
|
|
2
|
+
import './cam.css';
|
|
3
|
+
import moment from 'moment';
|
|
4
|
+
import React, { useCallback, useEffect, useRef } from 'react';
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
const GET_STREAM_INTERVAL_TIMEOUT = 3000;
|
|
8
|
+
|
|
9
|
+
const VIDEO_ID = 'cam-video';
|
|
10
|
+
const CANVAS_ID = 'cam-canvas';
|
|
11
|
+
|
|
12
|
+
const VIDEO_CONSTRAINTS = {
|
|
13
|
+
audio: false,
|
|
14
|
+
video: {
|
|
15
|
+
facingMode: 'user'
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
const createVideoElementId = (id = '') => (id) ? `${id}-${VIDEO_ID}` : VIDEO_ID;
|
|
20
|
+
const createCanvasElementId = (id = '') => (id) ? `${id}-${CANVAS_ID}` : CANVAS_ID;
|
|
21
|
+
|
|
22
|
+
export const camSnapshot = ({ e = undefined, download = false, camComponentId = '' }) => {
|
|
23
|
+
let status = false, file = undefined, linkElement = undefined, canvasElement = undefined;
|
|
24
|
+
const videoElementId = createVideoElementId(camComponentId);
|
|
25
|
+
const videoElement = document.getElementById(videoElementId);
|
|
26
|
+
|
|
27
|
+
if (videoElement) {
|
|
28
|
+
canvasElement = document.createElement('canvas');
|
|
29
|
+
if (canvasElement) {
|
|
30
|
+
const canvasElementId = createCanvasElementId(camComponentId);
|
|
31
|
+
canvasElement.id = canvasElementId;
|
|
32
|
+
const canvasContext2D = canvasElement.getContext('2d');
|
|
33
|
+
if (canvasContext2D) {
|
|
34
|
+
canvasElement.width = videoElement.offsetWidth;
|
|
35
|
+
canvasElement.height = videoElement.offsetHeight;
|
|
36
|
+
canvasContext2D.drawImage(videoElement, 0, 0, videoElement.offsetWidth, videoElement.offsetHeight);
|
|
37
|
+
|
|
38
|
+
linkElement = document.createElement('a');
|
|
39
|
+
linkElement.download = `Capture_${moment(new Date()).format('DD-MM-YYYY_HH:mm:ss')}.png`;
|
|
40
|
+
const dataUrl = canvasElement.toDataURL('image/png');
|
|
41
|
+
linkElement.href = dataUrl;
|
|
42
|
+
|
|
43
|
+
const blob = dataUrlToBlob(dataUrl);
|
|
44
|
+
if (blob) file = new File([blob], linkElement.download, { type: blob.type });
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
(linkElement && file) && (status = true);
|
|
49
|
+
(linkElement && download) && linkElement.click();
|
|
50
|
+
return { e, status, file, link: linkElement, canvas: canvasElement };
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
const Cam = ({ id = '', style = {}, onGetStream }) => {
|
|
55
|
+
|
|
56
|
+
const videoRef = useRef(null);
|
|
57
|
+
const streamRef = useRef(null);
|
|
58
|
+
const getStreamIntervalIdRef = useRef(null);
|
|
59
|
+
const videoElementId = createVideoElementId(id);
|
|
60
|
+
|
|
61
|
+
const getStream = useCallback(async () => {
|
|
62
|
+
let stream = null;
|
|
63
|
+
|
|
64
|
+
try {
|
|
65
|
+
stream = await navigator.mediaDevices.getUserMedia(VIDEO_CONSTRAINTS);
|
|
66
|
+
stream.getTracks().forEach((track) => {
|
|
67
|
+
if (track.kind === 'video') track.enabled = true;
|
|
68
|
+
});
|
|
69
|
+
} catch (error) {
|
|
70
|
+
console.error(error);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
if ((stream && !streamRef.current) || (!stream && streamRef.current)) {
|
|
74
|
+
videoRef.current.srcObject = stream;
|
|
75
|
+
stopVideo(streamRef.current);
|
|
76
|
+
streamRef.current = stream;
|
|
77
|
+
(typeof onGetStream === 'function') && onGetStream({ stream });
|
|
78
|
+
} else if (stream) stopVideo(stream);
|
|
79
|
+
}, [onGetStream]);
|
|
80
|
+
|
|
81
|
+
const stopVideo = (stream) => (stream) && stream.getTracks().forEach((track) => {
|
|
82
|
+
track?.stop();
|
|
83
|
+
track.enabled = false;
|
|
84
|
+
});
|
|
85
|
+
|
|
86
|
+
useEffect(() => {
|
|
87
|
+
getStream();
|
|
88
|
+
getStreamIntervalIdRef.current = setInterval(() => getStream(), GET_STREAM_INTERVAL_TIMEOUT);
|
|
89
|
+
return () => {
|
|
90
|
+
clearInterval(getStreamIntervalIdRef.current);
|
|
91
|
+
stopVideo(streamRef.current);
|
|
92
|
+
};
|
|
93
|
+
}, [getStream]);
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
return <div style={style} className='cam-div'>
|
|
97
|
+
<video id={videoElementId} ref={videoRef} autoPlay />
|
|
98
|
+
</div>;
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
export default Cam;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './Cam';
|
|
@@ -166,4 +166,7 @@ export { default as Zoom } from './Zoom';
|
|
|
166
166
|
export * from './Zoom';
|
|
167
167
|
|
|
168
168
|
export { default as Carousel } from './Carousel';
|
|
169
|
-
export * from './Carousel';
|
|
169
|
+
export * from './Carousel';
|
|
170
|
+
|
|
171
|
+
export { default as Cam } from './Cam';
|
|
172
|
+
export * from './Cam';
|
package/lib/components/index.js
CHANGED
|
@@ -164,4 +164,7 @@ export { default as Zoom } from './Zoom';
|
|
|
164
164
|
export * from './Zoom';
|
|
165
165
|
|
|
166
166
|
export { default as Carousel } from './Carousel';
|
|
167
|
-
export * from './Carousel';
|
|
167
|
+
export * from './Carousel';
|
|
168
|
+
|
|
169
|
+
export { default as Cam } from './Cam';
|
|
170
|
+
export * from './Cam';
|