replace with react
This commit is contained in:
parent
f4eb72c178
commit
7d61d20c8e
GPG Key ID:
D1AE30E316E44E5D
@ -1,5 +1,9 @@
|
||||
/*! For license information please see src_components_faceRecognition_FaceRecognition_tsx-src_components_shared_organisms_Player_Ove-59cc90.a810eba2a0194c5f16e6.js.LICENSE.txt */
|
||||
/*! @ohtomi-preamble version: 8.1.0, name:src_components_faceRecognition_FaceRecognition_tsx-src_components_shared_organisms_Player_Ove-59cc90 */
|
||||
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import { jsx, jsxs } from "react/jsx-runtime";
|
||||
|
||||
try {
|
||||
const e =
|
||||
"undefined" !== typeof window
|
||||
@ -36,10 +40,10 @@ try {
|
||||
n.d(t, { B: () => o });
|
||||
const a = n(96540);
|
||||
function o({ disabled: e = !1, storedDevice: t } = {}) {
|
||||
const [n, o] = (0, a.useState)(null);
|
||||
const [inputDevices, setInputDevices] = (0, a.useState)([]);
|
||||
const [s, c] = (0, a.useState)();
|
||||
const l = (0, a.useCallback)(async () => {
|
||||
const [n, o] = useState(null);
|
||||
const [inputDevices, setInputDevices] = useState<MediaDeviceInfo[]>([]);
|
||||
const [s, c] = useState();
|
||||
const l = useCallback(async () => {
|
||||
try {
|
||||
await navigator.mediaDevices
|
||||
.getUserMedia({ video: !0 })
|
||||
@ -90,7 +94,7 @@ try {
|
||||
o(e);
|
||||
}
|
||||
}, [s, null == t ? void 0 : t.deviceId, null == t ? void 0 : t.label]);
|
||||
const d = (0, a.useCallback)(
|
||||
const d = useCallback(
|
||||
(e) => {
|
||||
c(
|
||||
null == inputDevices
|
||||
@ -101,7 +105,7 @@ try {
|
||||
[inputDevices],
|
||||
);
|
||||
return (
|
||||
(0, a.useEffect)(
|
||||
useEffect(
|
||||
() =>
|
||||
e
|
||||
? (o(null), setInputDevices([]), c(void 0), () => {})
|
||||
@ -134,7 +138,7 @@ try {
|
||||
serializer: (e) => JSON.stringify(e),
|
||||
deserializer: (e) => JSON.parse(e),
|
||||
});
|
||||
const n = (0, a.useCallback)((e) => t(e), [t]);
|
||||
const n = useCallback((e) => t(e), [t]);
|
||||
return { device: e, save: n };
|
||||
}
|
||||
},
|
||||
@ -149,7 +153,7 @@ try {
|
||||
const { device: l } = (0, r.y)();
|
||||
const { currentDevice: d } = (0, o.B)({ storedDevice: l });
|
||||
const { captureImage: u } = (({ deviceId: e }) => ({
|
||||
captureImage: (0, a.useCallback)(
|
||||
captureImage: useCallback(
|
||||
async ({ width: t, height: n, type: a, quality: o }) => {
|
||||
const r = await navigator.mediaDevices.getUserMedia({
|
||||
video: {
|
||||
@ -219,9 +223,9 @@ try {
|
||||
[e],
|
||||
),
|
||||
}))({ deviceId: null == d ? void 0 : d.deviceId });
|
||||
const [h, p] = (0, a.useState)(!1);
|
||||
const [h, p] = useState(!1);
|
||||
return (
|
||||
(0, a.useEffect)(() => {
|
||||
useEffect(() => {
|
||||
null == (null == d ? void 0 : d.deviceId) ||
|
||||
"progress" !== e ||
|
||||
h ||
|
||||
@ -243,21 +247,21 @@ try {
|
||||
const d = n(73305);
|
||||
const u = n(74848);
|
||||
function h({ status: e, horizontalAlign: t }) {
|
||||
return (0, u.jsxs)(p, {
|
||||
return jsxs(p, {
|
||||
horizontalAlign: t,
|
||||
children: [
|
||||
"failed" !== e &&
|
||||
(0, u.jsxs)(u.Fragment, {
|
||||
jsxs(u.Fragment, {
|
||||
children: [
|
||||
(0, u.jsx)(v, {}),
|
||||
(0, u.jsx)(f, { children: "認証中" }),
|
||||
jsx(v, {}),
|
||||
jsx(f, { children: "認証中" }),
|
||||
],
|
||||
}),
|
||||
"failed" === e &&
|
||||
(0, u.jsxs)(u.Fragment, {
|
||||
jsxs(u.Fragment, {
|
||||
children: [
|
||||
(0, u.jsx)(g, {}),
|
||||
(0, u.jsx)(f, { children: "認証不可" }),
|
||||
jsx(g, {}),
|
||||
jsx(f, { children: "認証不可" }),
|
||||
],
|
||||
}),
|
||||
],
|
||||
@ -324,16 +328,16 @@ try {
|
||||
};
|
||||
const I = n(80724);
|
||||
function C({ capture: e, horizontalAlign: t, contextDetail: n }) {
|
||||
const [i, s] = (0, a.useState)(void 0);
|
||||
const [i, s] = useState(void 0);
|
||||
const { device: l } = (0, r.y)();
|
||||
const { currentDevice: d, error: p } = (0, o.B)({ storedDevice: l });
|
||||
const [f, v] = (0, a.useState)();
|
||||
const [g, w] = (0, a.useState)("");
|
||||
const y = (0, a.useRef)(!1);
|
||||
(0, a.useEffect)(() => {
|
||||
const [f, v] = useState();
|
||||
const [g, w] = useState("");
|
||||
const y = useRef(!1);
|
||||
useEffect(() => {
|
||||
null == i && (null == p ? null != d && s("progress") : s("failed"));
|
||||
}, [d, p, i]),
|
||||
(0, a.useEffect)(() => {
|
||||
useEffect(() => {
|
||||
switch (i) {
|
||||
case "progress":
|
||||
case "success":
|
||||
@ -343,7 +347,7 @@ try {
|
||||
.then((e) => v(e));
|
||||
}
|
||||
}, [i, f]),
|
||||
(0, a.useEffect)(
|
||||
useEffect(
|
||||
() => () => {
|
||||
f &&
|
||||
(f.getTracks().forEach((e) => {
|
||||
@ -354,7 +358,7 @@ try {
|
||||
[f],
|
||||
);
|
||||
const x = (0, I.R)();
|
||||
(0, a.useEffect)(() => {
|
||||
useEffect(() => {
|
||||
let e;
|
||||
(null == (null == d ? void 0 : d.deviceId) && null == p) ||
|
||||
g ||
|
||||
@ -388,7 +392,7 @@ try {
|
||||
p,
|
||||
g,
|
||||
]);
|
||||
const b = (0, a.useCallback)(
|
||||
const b = useCallback(
|
||||
async (e) => {
|
||||
if (!g)
|
||||
throw (
|
||||
@ -409,11 +413,11 @@ try {
|
||||
},
|
||||
[g],
|
||||
);
|
||||
const C = (0, a.useCallback)(() => {}, []);
|
||||
const _ = (0, a.useMemo)(
|
||||
const C = useCallback(() => {}, []);
|
||||
const _ = useMemo(
|
||||
() =>
|
||||
e && "progress" === i && g
|
||||
? (0, u.jsx)(c, {
|
||||
? jsx(c, {
|
||||
status: i,
|
||||
onStatusChanged: s,
|
||||
onCapture: b,
|
||||
@ -422,8 +426,8 @@ try {
|
||||
: null,
|
||||
[e, b, C, g, i],
|
||||
);
|
||||
return (0, u.jsxs)(u.Fragment, {
|
||||
children: [_, i && (0, u.jsx)(h, { status: i, horizontalAlign: t })],
|
||||
return jsxs(u.Fragment, {
|
||||
children: [_, i && jsx(h, { status: i, horizontalAlign: t })],
|
||||
});
|
||||
}
|
||||
},
|
||||
@ -442,11 +446,11 @@ try {
|
||||
const r = n(96540);
|
||||
const i = n(74848);
|
||||
const s = ({ rate: e, currentRate: t, onClick: n }) => {
|
||||
const a = (0, r.useCallback)(() => {
|
||||
const a = useCallback(() => {
|
||||
n(e);
|
||||
}, [e, n]);
|
||||
const o = Math.abs(e - t) < 0.001;
|
||||
return (0, i.jsx)(c, { selected: o, onClick: a, children: `x${e}` });
|
||||
return jsx(c, { selected: o, onClick: a, children: `x${e}` });
|
||||
};
|
||||
const c = o.default.button.withConfig({ componentId: "sc-1iiy24x-0" })(
|
||||
[
|
||||
@ -474,7 +478,7 @@ try {
|
||||
...u
|
||||
}) {
|
||||
const h = (0, o.useTheme)();
|
||||
return (0, i.jsxs)(d, {
|
||||
return jsxs(d, {
|
||||
width: "108px",
|
||||
height: "128px",
|
||||
justifyContent: "center",
|
||||
@ -487,21 +491,21 @@ try {
|
||||
...u,
|
||||
$_css: t && n ? "flex" : "none",
|
||||
children: [
|
||||
(0, i.jsxs)(a.so, {
|
||||
jsxs(a.so, {
|
||||
flexDirection: "column",
|
||||
children: [
|
||||
(0, i.jsx)(s, { rate: 1, currentRate: e, onClick: r }),
|
||||
(0, i.jsx)(s, { rate: 0.75, currentRate: e, onClick: r }),
|
||||
(0, i.jsx)(s, { rate: 0.5, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 1, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 0.75, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 0.5, currentRate: e, onClick: r }),
|
||||
],
|
||||
}),
|
||||
(0, i.jsxs)(a.so, {
|
||||
jsxs(a.so, {
|
||||
flexDirection: "column",
|
||||
children: [
|
||||
(0, i.jsx)(s, { rate: 1.25, currentRate: e, onClick: r }),
|
||||
(0, i.jsx)(s, { rate: 1.5, currentRate: e, onClick: r }),
|
||||
(0, i.jsx)(s, { rate: 1.75, currentRate: e, onClick: r }),
|
||||
(0, i.jsx)(s, { rate: 2, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 1.25, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 1.5, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 1.75, currentRate: e, onClick: r }),
|
||||
jsx(s, { rate: 2, currentRate: e, onClick: r }),
|
||||
],
|
||||
}),
|
||||
],
|
||||
@ -525,28 +529,28 @@ try {
|
||||
handleRateItemButton: c,
|
||||
handleRateIcon: d,
|
||||
} = t;
|
||||
return (0, i.jsxs)(a.so, {
|
||||
return jsxs(a.so, {
|
||||
sx: { position: "relative" },
|
||||
children: [
|
||||
(0, i.jsxs)(a.az, {
|
||||
jsxs(a.az, {
|
||||
width: "80px",
|
||||
height: "80px",
|
||||
p: 5,
|
||||
children: [
|
||||
(0, i.jsx)(a.az, {
|
||||
jsx(a.az, {
|
||||
width: "20px",
|
||||
height: "20px",
|
||||
sx: { position: "absolute", left: "0", top: "40px" },
|
||||
onMouseEnter: r,
|
||||
onMouseLeave: s,
|
||||
}),
|
||||
(0, i.jsx)(h, {
|
||||
jsx(h, {
|
||||
type: `playback-rate-${`${e}`.replace(".", "-")}`,
|
||||
onClick: d,
|
||||
onMouseEnter: r,
|
||||
onMouseLeave: s,
|
||||
}),
|
||||
(0, i.jsx)(a.az, {
|
||||
jsx(a.az, {
|
||||
width: "20px",
|
||||
height: "20px",
|
||||
sx: { position: "absolute", right: "0", top: "40px" },
|
||||
@ -555,7 +559,7 @@ try {
|
||||
}),
|
||||
],
|
||||
}),
|
||||
(0, i.jsx)(l, {
|
||||
jsx(l, {
|
||||
currentPlaybackRate: e,
|
||||
isHover: n,
|
||||
isOpenRateList: o,
|
||||
@ -572,24 +576,24 @@ try {
|
||||
n.d(t, { y: () => o });
|
||||
const a = n(96540);
|
||||
function o({ changePlaybackRate: e }) {
|
||||
const [t, n] = (0, a.useState)(!1);
|
||||
const [o, r] = (0, a.useState)(!1);
|
||||
const [t, n] = useState(!1);
|
||||
const [o, r] = useState(!1);
|
||||
return {
|
||||
isHover: t,
|
||||
isOpenRateList: o,
|
||||
handleMouseEnter: (0, a.useCallback)(() => {
|
||||
handleMouseEnter: useCallback(() => {
|
||||
n(!0), r(!0);
|
||||
}, []),
|
||||
handleMouseLeave: (0, a.useCallback)(() => {
|
||||
handleMouseLeave: useCallback(() => {
|
||||
n(!1), r(!1);
|
||||
}, []),
|
||||
handleRateItemButton: (0, a.useCallback)(
|
||||
handleRateItemButton: useCallback(
|
||||
(t) => {
|
||||
e(t), r(!1);
|
||||
},
|
||||
[e],
|
||||
),
|
||||
handleRateIcon: (0, a.useCallback)(() => {
|
||||
handleRateIcon: useCallback(() => {
|
||||
r(!0);
|
||||
}, []),
|
||||
};
|
||||
@ -634,9 +638,9 @@ try {
|
||||
n.d(t, { J: () => o });
|
||||
const a = n(96540);
|
||||
function o(e) {
|
||||
const [t, n] = (0, a.useState)("prompt");
|
||||
const [t, n] = useState("prompt");
|
||||
return (
|
||||
(0, a.useEffect)(() => {
|
||||
useEffect(() => {
|
||||
null != e &&
|
||||
(e
|
||||
? navigator.mediaDevices
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user