softbuilders-react-video-player 1.1.35 → 1.1.37
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/ControlBar/index.d.ts +3 -1
- package/dist/components/ControlBar/index.js +8 -2
- package/dist/components/ControlBar/index.js.map +1 -1
- package/dist/components/ControlBar/index.tsx +13 -2
- package/dist/components/MenuButton/index.d.ts +1 -1
- package/dist/components/MenuButton/index.js +1 -1
- package/dist/components/MenuButton/index.js.map +1 -1
- package/dist/components/MenuButton/index.tsx +3 -3
- package/dist/components/QualityMenu/index.d.ts +1 -1
- package/dist/components/QualityMenu/index.js +2 -2
- package/dist/components/QualityMenu/index.js.map +1 -1
- package/dist/components/QualityMenu/index.tsx +3 -3
- package/dist/components/SoftBuildersVideoPlayer/index.js +1 -3
- package/dist/components/SoftBuildersVideoPlayer/index.js.map +1 -1
- package/dist/components/SoftBuildersVideoPlayer/index.tsx +1 -3
- package/dist/components/SubtitleMenu/index.d.ts +1 -1
- package/dist/components/SubtitleMenu/index.js +3 -3
- package/dist/components/SubtitleMenu/index.js.map +1 -1
- package/dist/components/SubtitleMenu/index.tsx +6 -6
- package/dist/components/VideoPlayerComponent/index.js +41 -6
- package/dist/components/VideoPlayerComponent/index.js.map +1 -1
- package/dist/components/VideoPlayerComponent/index.tsx +56 -4
- package/dist/components/VideoPlayerComponent/style/style.css +1 -1
- package/dist/index.css +15 -1
- package/dist/index.mjs +85 -27
- package/dist/styles/tailwind.css +14 -0
- package/package.json +1 -1
@@ -12,6 +12,8 @@ type Props<T> = {
|
|
12
12
|
id?: string;
|
13
13
|
handleSaveNoteAction?: (time: number, note: string) => Promise<T>;
|
14
14
|
handleControlDisplayTimer: (e: any) => void;
|
15
|
+
setIsQualityMenuOpen: (val: boolean) => void;
|
16
|
+
setIsSubtitleMenuOpen: (val: boolean) => void;
|
15
17
|
};
|
16
|
-
declare const ControlBar: <T>({ player, isPaused, setIsPaused, duration, notes, chapters, seekStep, id, handleSaveNoteAction, handleControlDisplayTimer, }: Props<T>) => import("react/jsx-runtime").JSX.Element;
|
18
|
+
declare const ControlBar: <T>({ player, isPaused, setIsPaused, duration, notes, chapters, seekStep, id, handleSaveNoteAction, handleControlDisplayTimer, setIsQualityMenuOpen, setIsSubtitleMenuOpen, }: Props<T>) => import("react/jsx-runtime").JSX.Element;
|
17
19
|
export default ControlBar;
|
@@ -11,7 +11,7 @@ import CurrentTimeTracker from "../CurrentTimeTracker";
|
|
11
11
|
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
12
12
|
import SubtitleMenu from "../SubtitleMenu";
|
13
13
|
import { BackwardIcon, ForwardIcon, FullScreenIcon, PauseIcon, PlayIcon, } from "../../images";
|
14
|
-
const ControlBar = ({ player, isPaused, setIsPaused, duration, notes, chapters, seekStep = 5, id, handleSaveNoteAction, handleControlDisplayTimer, }) => {
|
14
|
+
const ControlBar = ({ player, isPaused, setIsPaused, duration, notes, chapters, seekStep = 5, id, handleSaveNoteAction, handleControlDisplayTimer, setIsQualityMenuOpen, setIsSubtitleMenuOpen, }) => {
|
15
15
|
const { setPlayer, setDuration } = useSoftBuildersVideoPlayerContext();
|
16
16
|
const [width, setWidth] = useState(0);
|
17
17
|
const [isSeeking, setIsSeeking] = useState(true);
|
@@ -61,7 +61,13 @@ const ControlBar = ({ player, isPaused, setIsPaused, duration, notes, chapters,
|
|
61
61
|
left: "5%",
|
62
62
|
top: "90%",
|
63
63
|
}
|
64
|
-
: { width: "100%" }, className: `flex gap-2 ${width < 400 ? "absolute sb-top-1" : "-sb-translate-y-0 sb-w-full"} hover:sb-w-[45%] sb-transition-all sb-ease-in-out sb-duration-500`, children: [_jsx(CurrentTimeLabel, {}), _jsx(TimeSliderContainer, { chapters: chapters, notes: notes }), _jsx("p", { children: durationFormater(duration) })] }) }), _jsx("div", { className: "sb-h-full", children: _jsx(VolumeSlider, { volumeSliderToggler: volumeSliderToggler, width: width, setIsSeeking: (val) => setIsSeeking(val), handleControlDisplayTimer: handleControlDisplayTimer }) }), _jsx(QualityMenu, { width: width, onClick: (
|
64
|
+
: { width: "100%" }, className: `flex gap-2 ${width < 400 ? "absolute sb-top-1" : "-sb-translate-y-0 sb-w-full"} hover:sb-w-[45%] sb-transition-all sb-ease-in-out sb-duration-500`, children: [_jsx(CurrentTimeLabel, {}), _jsx(TimeSliderContainer, { chapters: chapters, notes: notes }), _jsx("p", { children: durationFormater(duration) })] }) }), _jsx("div", { className: "sb-h-full", children: _jsx(VolumeSlider, { volumeSliderToggler: volumeSliderToggler, width: width, setIsSeeking: (val) => setIsSeeking(val), handleControlDisplayTimer: handleControlDisplayTimer }) }), _jsx(QualityMenu, { width: width, onClick: (e, isOpen) => {
|
65
|
+
setVolumeToggler(!volumeSliderToggler);
|
66
|
+
setIsQualityMenuOpen(isOpen);
|
67
|
+
} }), handleSaveNoteAction && (_jsx(CreateNoteMenu, { handleSaveNoteAction: handleSaveNoteAction })), _jsx(SubtitleMenu, { width: width, onClick: (e, isOpen) => {
|
68
|
+
setVolumeToggler(!volumeSliderToggler);
|
69
|
+
setIsSubtitleMenuOpen(isOpen);
|
70
|
+
} }), _jsx("button", { onClick: (e) => {
|
65
71
|
e.preventDefault();
|
66
72
|
e.stopPropagation();
|
67
73
|
if (player === null || player === void 0 ? void 0 : player.isFullscreen()) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ControlBar/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,mBAAmB,MAAM,wBAAwB,CAAC;AACzD,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAC7C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAKvD,OAAO,EAAE,iCAAiC,EAAE,MAAM,kCAAkC,CAAC;AACrF,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EACL,YAAY,EACZ,WAAW,EACX,cAAc,EACd,SAAS,EACT,QAAQ,GACT,MAAM,cAAc,CAAC;
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ControlBar/index.tsx"],"names":[],"mappings":"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"}
|
@@ -21,6 +21,7 @@ import {
|
|
21
21
|
PauseIcon,
|
22
22
|
PlayIcon,
|
23
23
|
} from "../../images";
|
24
|
+
import { set } from "video.js/dist/types/tech/middleware";
|
24
25
|
|
25
26
|
type Props<T> = {
|
26
27
|
player: Player | undefined;
|
@@ -33,6 +34,8 @@ type Props<T> = {
|
|
33
34
|
id?: string;
|
34
35
|
handleSaveNoteAction?: (time: number, note: string) => Promise<T>;
|
35
36
|
handleControlDisplayTimer: (e: any) => void;
|
37
|
+
setIsQualityMenuOpen: (val: boolean) => void;
|
38
|
+
setIsSubtitleMenuOpen: (val: boolean) => void;
|
36
39
|
};
|
37
40
|
|
38
41
|
const ControlBar = <T,>({
|
@@ -46,6 +49,8 @@ const ControlBar = <T,>({
|
|
46
49
|
id,
|
47
50
|
handleSaveNoteAction,
|
48
51
|
handleControlDisplayTimer,
|
52
|
+
setIsQualityMenuOpen,
|
53
|
+
setIsSubtitleMenuOpen,
|
49
54
|
}: Props<T>) => {
|
50
55
|
const { setPlayer, setDuration } = useSoftBuildersVideoPlayerContext();
|
51
56
|
const [width, setWidth] = useState<number>(0);
|
@@ -163,7 +168,10 @@ const ControlBar = <T,>({
|
|
163
168
|
|
164
169
|
<QualityMenu
|
165
170
|
width={width}
|
166
|
-
onClick={() =>
|
171
|
+
onClick={(e: any, isOpen: boolean) => {
|
172
|
+
setVolumeToggler(!volumeSliderToggler);
|
173
|
+
setIsQualityMenuOpen(isOpen);
|
174
|
+
}}
|
167
175
|
/>
|
168
176
|
|
169
177
|
{handleSaveNoteAction && (
|
@@ -172,7 +180,10 @@ const ControlBar = <T,>({
|
|
172
180
|
|
173
181
|
<SubtitleMenu
|
174
182
|
width={width}
|
175
|
-
onClick={() =>
|
183
|
+
onClick={(e: any, isOpen: boolean) => {
|
184
|
+
setVolumeToggler(!volumeSliderToggler);
|
185
|
+
setIsSubtitleMenuOpen(isOpen);
|
186
|
+
}}
|
176
187
|
/>
|
177
188
|
<button
|
178
189
|
onClick={(e) => {
|
@@ -4,7 +4,7 @@ type Props = {
|
|
4
4
|
menuContent: React.ReactNode;
|
5
5
|
close?: (fun: Function) => void;
|
6
6
|
classContainer?: string;
|
7
|
-
onClick?: (e: any) => void;
|
7
|
+
onClick?: (e: any, isOpen: boolean) => void;
|
8
8
|
};
|
9
9
|
declare const MenuButton: ({ buttonContent, menuContent, close, classContainer, onClick, }: Props) => import("react/jsx-runtime").JSX.Element;
|
10
10
|
export default MenuButton;
|
@@ -27,7 +27,7 @@ const MenuButton = ({ buttonContent, menuContent, close, classContainer, onClick
|
|
27
27
|
return (_jsxs("div", { className: "sb-relative sb-flex sb-items-end", children: [_jsx("button", { ref: buttonRef, onClick: (e) => {
|
28
28
|
e.stopPropagation();
|
29
29
|
toggleMenu();
|
30
|
-
onClick && onClick(e);
|
30
|
+
onClick && onClick(e, !isOpen);
|
31
31
|
}, "aria-haspopup": "true", "aria-expanded": isOpen, "aria-label": "Open menu", children: buttonContent }), isOpen && (_jsx("div", { ref: menuRef, role: "menu", "aria-orientation": "vertical", "aria-labelledby": "Open menu", className: `sb-absolute sb-shadow-lg sb-right-0 sb-bottom-10 ${classContainer}`, children: menuContent }))] }));
|
32
32
|
};
|
33
33
|
export default MenuButton;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MenuButton/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAWxE,MAAM,UAAU,GAAG,CAAC,EAClB,aAAa,EACb,WAAW,EACX,KAAK,EACL,cAAc,EACd,OAAO,GACD,EAAE,EAAE;IACV,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,SAAS,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACzD,MAAM,OAAO,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEpD,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAEpD,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,kBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IACE,SAAS,CAAC,OAAO;gBACjB,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;gBACjD,OAAO,CAAC,OAAO;gBACf,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAC/C,CAAC;gBACD,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;QAEF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAC3D,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;IAC7E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK;YAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL,eAAK,SAAS,EAAC,mCAAmC,aAChD,iBACE,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,CAAC,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/MenuButton/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAWxE,MAAM,UAAU,GAAG,CAAC,EAClB,aAAa,EACb,WAAW,EACX,KAAK,EACL,cAAc,EACd,OAAO,GACD,EAAE,EAAE;IACV,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,SAAS,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACzD,MAAM,OAAO,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEpD,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;IAEpD,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,kBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IACE,SAAS,CAAC,OAAO;gBACjB,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;gBACjD,OAAO,CAAC,OAAO;gBACf,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAC/C,CAAC;gBACD,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;QAEF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAC3D,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;IAC7E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK;YAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL,eAAK,SAAS,EAAC,mCAAmC,aAChD,iBACE,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,CAAC,CAAM,EAAE,EAAE;oBAClB,CAAC,CAAC,eAAe,EAAE,CAAC;oBACpB,UAAU,EAAE,CAAC;oBACb,OAAO,IAAI,OAAO,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;gBACjC,CAAC,mBACa,MAAM,mBACL,MAAM,gBACV,WAAW,YAErB,aAAa,GACP,EAER,MAAM,IAAI,CACT,cACE,GAAG,EAAE,OAAO,EACZ,IAAI,EAAC,MAAM,sBACM,UAAU,qBACX,WAAW,EAC3B,SAAS,EAAE,oDAAoD,cAAc,EAAE,YAE9E,WAAW,GACR,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
@@ -6,7 +6,7 @@ type Props = {
|
|
6
6
|
menuContent: React.ReactNode;
|
7
7
|
close?: (fun: Function) => void;
|
8
8
|
classContainer?: string;
|
9
|
-
onClick?: (e: any) => void;
|
9
|
+
onClick?: (e: any, isOpen: boolean) => void;
|
10
10
|
};
|
11
11
|
|
12
12
|
const MenuButton = ({
|
@@ -50,10 +50,10 @@ const MenuButton = ({
|
|
50
50
|
<div className="sb-relative sb-flex sb-items-end">
|
51
51
|
<button
|
52
52
|
ref={buttonRef}
|
53
|
-
onClick={(e) => {
|
53
|
+
onClick={(e: any) => {
|
54
54
|
e.stopPropagation();
|
55
55
|
toggleMenu();
|
56
|
-
onClick && onClick(e);
|
56
|
+
onClick && onClick(e, !isOpen);
|
57
57
|
}}
|
58
58
|
aria-haspopup="true"
|
59
59
|
aria-expanded={isOpen}
|
@@ -21,8 +21,8 @@ const QualityMenu = ({ width, onClick }) => {
|
|
21
21
|
setCurrentQualitySrc(quality.src);
|
22
22
|
}
|
23
23
|
}, [player]);
|
24
|
-
return (_jsx(MenuButton, { classContainer: `${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`, onClick: () => {
|
25
|
-
onClick && onClick();
|
24
|
+
return (_jsx(MenuButton, { classContainer: `${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`, onClick: (e, isOpen) => {
|
25
|
+
onClick && onClick(e, isOpen);
|
26
26
|
}, buttonContent: _jsx(SettingsIcon, { className: "sb-w-3 sb-h-3" }), menuContent: _jsx("div", { className: `sb-rounded-md sb-bg-[#303030] sb-bg-opacity-50 ${width > 400
|
27
27
|
? "sb-w-[150px] sb-py-5"
|
28
28
|
: "sb-w-[90px] sb-items-center sb-justify-center sb-py-1"}`, children: _jsxs("div", { className: "sb-flex sb-flex-col sb-gap-3", children: [_jsxs("div", { className: `sb-px-5 sb-flex sb-flex-row sb-gap-3 sb-items-start sb-relative sb-top-2`, children: [_jsx("button", { onClick: () => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QualityMenu/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAe,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,iCAAiC,EAAE,MAAM,kCAAkC,CAAC;AAGrF,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AASxE,MAAM,aAAa,GAAG,CAAC,EACrB,UAAU,EACV,OAAO,EACP,OAAO,EACP,KAAK,GACc,EAAE,EAAE;IACvB,OAAO,CACL,iBACE,SAAS,EAAE,4BACT,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAC3B,EAAE,EACF,OAAO,EAAE,OAAO,YAEhB,eAAK,SAAS,EAAC,kDAAkD,aAC/D,cAAK,SAAS,EAAC,eAAe,YAC3B,UAAU,CAAC,CAAC,CAAC,CACZ,KAAC,WAAW,IACV,SAAS,EAAE,GAAG,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,EAAE,GAC/D,CACH,CAAC,CAAC,CAAC,CACF,eAAW,CACZ,GACG,EAEN,YAAG,SAAS,EAAC,4BAA4B,YAAE,OAAO,CAAC,KAAK,GAAK,IACzD,GACC,CACV,CAAC;AACJ,CAAC,CAAC;AAOF,MAAM,WAAW,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAoB,EAAE,EAAE;IAC3D,MAAM,EAAE,MAAM,EAAE,GAAG,iCAAiC,EAAE,CAAC;IAEvD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAExD,SAAS,CAAC,CAAC;IAEb,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CACxC,EAAE,CACH,CAAC;IAEF,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAExD,SAAS,CAAC,CAAC;IAEb,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,OAAO,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,cAAc,EAAE,CAAC;YAEzC,MAAM,EAAE,GAAoC,IAAI,CAAC,KAAK,CACpD,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CACxB,CAAC;YAEF,YAAY,CAAC,EAAE,CAAC,CAAC;YAEjB,MAAM,MAAM,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,aAAa,EAAE,CAAC;YACvC,MAAM,OAAO,GAAkC,IAAI,CAAC,KAAK,CACvD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CACvB,CAAC;YAEF,oBAAoB,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;QACpC,CAAC;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,KAAC,UAAU,IACT,cAAc,EAAE,GAAG,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAAE,EAAE,EAC9D,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QualityMenu/index.tsx"],"names":[],"mappings":"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"}
|
@@ -44,7 +44,7 @@ const QualityOption = ({
|
|
44
44
|
|
45
45
|
type QualityMenuProps = {
|
46
46
|
width: number;
|
47
|
-
onClick?: () => void;
|
47
|
+
onClick?: (e: any, toggleMenu: boolean) => void;
|
48
48
|
};
|
49
49
|
|
50
50
|
const QualityMenu = ({ width, onClick }: QualityMenuProps) => {
|
@@ -84,8 +84,8 @@ const QualityMenu = ({ width, onClick }: QualityMenuProps) => {
|
|
84
84
|
return (
|
85
85
|
<MenuButton
|
86
86
|
classContainer={`${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`}
|
87
|
-
onClick={() => {
|
88
|
-
onClick && onClick();
|
87
|
+
onClick={(e, isOpen) => {
|
88
|
+
onClick && onClick(e, isOpen);
|
89
89
|
}}
|
90
90
|
buttonContent={<SettingsIcon className="sb-w-3 sb-h-3" />}
|
91
91
|
menuContent={
|
@@ -29,9 +29,7 @@ const Component = ({ options, notes, chapters, startTime = 0, handleSaveNoteActi
|
|
29
29
|
if (options.width === undefined)
|
30
30
|
options.width = DEFAULT_OPTIONS.width;
|
31
31
|
const [tracks, setTracks] = useState([]);
|
32
|
-
useEffect(() => {
|
33
|
-
console.log(isFocused, "isF");
|
34
|
-
}, [isFocused]);
|
32
|
+
useEffect(() => { }, [isFocused]);
|
35
33
|
useEffect(() => {
|
36
34
|
const getTracks = async () => {
|
37
35
|
const newTracks = [];
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SoftBuildersVideoPlayer/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,oBAAoB,MAAM,yBAAyB,CAAC;AAO3D,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,eAAe,GAAmC;IACtD,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,IAAI;IACd,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,EAAE;IACX,MAAM,EAAE,EAAE;CACX,CAAC;AAaF,MAAM,SAAS,GAAG,CAAK,EACrB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,SAAS,GAAG,CAAC,EACb,oBAAoB,EACpB,MAAM,EACN,OAAO,EACP,SAAS,GAAG,IAAI,GACP,EAAE,EAAE;IACb,OAAO,GAAG,gCACL,OAAO,KACV,UAAU,EAAE,IAAI,EAChB,iBAAiB,EAAE,CAAC,EACpB,UAAU,EAAE;YACV,YAAY,EAAE,MAAM;SACrB,GACK,CAAC;IAET,IAAI,OAAO,CAAC,QAAQ,KAAK,SAAS;QAChC,OAAO,CAAC,QAAQ,GAAG,eAAe,CAAC,QAAQ,CAAC;IAC9C,IAAI,OAAO,CAAC,QAAQ,KAAK,SAAS;QAChC,OAAO,CAAC,QAAQ,GAAG,eAAe,CAAC,QAAQ,CAAC;IAC9C,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;QAAE,OAAO,CAAC,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC;IACvE,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;QAAE,OAAO,CAAC,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC;IACvE,IAAI,OAAO,CAAC,MAAM,KAAK,SAAS;QAAE,OAAO,CAAC,MAAM,GAAG,eAAe,CAAC,MAAM,CAAC;IAC1E,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;QAAE,OAAO,CAAC,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC;IAEvE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAiC,EAAE,CAAC,CAAC;IACzE,SAAS,CAAC,GAAG,EAAE
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SoftBuildersVideoPlayer/index.tsx"],"names":[],"mappings":"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"}
|
@@ -59,9 +59,7 @@ const Component = <T,>({
|
|
59
59
|
if (options.width === undefined) options.width = DEFAULT_OPTIONS.width;
|
60
60
|
|
61
61
|
const [tracks, setTracks] = useState<SoftBuildersVideoPlayerTrack[]>([]);
|
62
|
-
useEffect(() => {
|
63
|
-
console.log(isFocused, "isF");
|
64
|
-
}, [isFocused]);
|
62
|
+
useEffect(() => {}, [isFocused]);
|
65
63
|
useEffect(() => {
|
66
64
|
const getTracks = async () => {
|
67
65
|
const newTracks: SoftBuildersVideoPlayerTrack[] = [];
|
@@ -6,7 +6,7 @@ import { CheckedIcon, LeftArrowIcon, SubIcon } from "../../images";
|
|
6
6
|
const SubtitleOption = ({ isSelected, subtitle, onClick, }) => {
|
7
7
|
return (_jsx("button", { className: "hover:sb-text-orange-500 sb-p-2", onClick: (e) => {
|
8
8
|
e.stopPropagation();
|
9
|
-
onClick();
|
9
|
+
onClick(e);
|
10
10
|
}, children: _jsxs("div", { className: "sb-grid sb-grid-cols-12 sb-items-center sb-gap-2", children: [_jsx("div", { className: "sb-col-span-3", children: isSelected ? _jsx(CheckedIcon, { className: "sb-w-5 sb-h-5" }) : _jsx("div", {}) }), _jsx("p", { className: "sb-text-left sb-col-span-9", children: subtitle.label })] }) }));
|
11
11
|
};
|
12
12
|
const SubtitleMenu = ({ width, onClick }) => {
|
@@ -32,8 +32,8 @@ const SubtitleMenu = ({ width, onClick }) => {
|
|
32
32
|
setSubtitles(textTracks);
|
33
33
|
}
|
34
34
|
}, [player]);
|
35
|
-
return (_jsx(MenuButton, { onClick: () => {
|
36
|
-
onClick && onClick();
|
35
|
+
return (_jsx(MenuButton, { onClick: (e, isOpen) => {
|
36
|
+
onClick && onClick(e, isOpen);
|
37
37
|
}, classContainer: `${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`, buttonContent: _jsx(SubIcon, { className: "sb-w-4 sb-h-4 sb-text-white " }), menuContent: _jsx("div", { className: `sb-rounded-md sb-bg-[#303030] sb-bg-opacity-50 ${width > 400
|
38
38
|
? "sb-w-[150px] sb-py-5"
|
39
39
|
: "sb-w-[90px] sb-items-center sb-justify-center sb-py-1"}`, children: _jsxs("div", { className: "sb-flex sb-flex-col sb-gap-3", children: [_jsxs("div", { className: "sb-px-5 sb-flex sb-flex-row sb-gap-3 sb-items-start", children: [_jsx("button", { onClick: () => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SubtitleMenu/index.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAe,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,EAAE,iCAAiC,EAAE,MAAM,kCAAkC,CAAC;AACrF,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAOnE,MAAM,cAAc,GAAG,CAAC,EACtB,UAAU,EACV,QAAQ,EACR,OAAO,GACa,EAAE,EAAE;IACxB,OAAO,CACL,iBACE,SAAS,EAAC,iCAAiC,EAC3C,OAAO,EAAE,CAAC,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/SubtitleMenu/index.tsx"],"names":[],"mappings":"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"}
|
@@ -6,7 +6,7 @@ import { CheckedIcon, LeftArrowIcon, SubIcon } from "../../images";
|
|
6
6
|
type SubtitleOptionProps = {
|
7
7
|
isSelected: boolean;
|
8
8
|
subtitle: TextTrack;
|
9
|
-
onClick: () => void;
|
9
|
+
onClick: (e: any) => void;
|
10
10
|
};
|
11
11
|
const SubtitleOption = ({
|
12
12
|
isSelected,
|
@@ -16,9 +16,9 @@ const SubtitleOption = ({
|
|
16
16
|
return (
|
17
17
|
<button
|
18
18
|
className="hover:sb-text-orange-500 sb-p-2"
|
19
|
-
onClick={(e) => {
|
19
|
+
onClick={(e: any) => {
|
20
20
|
e.stopPropagation();
|
21
|
-
onClick();
|
21
|
+
onClick(e);
|
22
22
|
}}
|
23
23
|
>
|
24
24
|
<div className="sb-grid sb-grid-cols-12 sb-items-center sb-gap-2">
|
@@ -34,7 +34,7 @@ const SubtitleOption = ({
|
|
34
34
|
|
35
35
|
type SubtitleMenuProps = {
|
36
36
|
width: number;
|
37
|
-
onClick: () => void;
|
37
|
+
onClick: (e: any, isOpen: boolean) => void;
|
38
38
|
};
|
39
39
|
|
40
40
|
const SubtitleMenu = ({ width, onClick }: SubtitleMenuProps) => {
|
@@ -69,8 +69,8 @@ const SubtitleMenu = ({ width, onClick }: SubtitleMenuProps) => {
|
|
69
69
|
|
70
70
|
return (
|
71
71
|
<MenuButton
|
72
|
-
onClick={() => {
|
73
|
-
onClick && onClick();
|
72
|
+
onClick={(e: any, isOpen: boolean) => {
|
73
|
+
onClick && onClick(e, isOpen);
|
74
74
|
}}
|
75
75
|
classContainer={`${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`}
|
76
76
|
buttonContent={<SubIcon className="sb-w-4 sb-h-4 sb-text-white " />}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
2
|
import { useEffect, useRef, useState } from "react";
|
3
3
|
import ReactDOM from "react-dom/client";
|
4
4
|
import videojs from "video.js";
|
@@ -24,7 +24,7 @@ const renderBigPlayButton = (id, player, isPaused, setIsPaused, opacity = "100")
|
|
24
24
|
}
|
25
25
|
};
|
26
26
|
let controlBarRoot = {};
|
27
|
-
const renderControlBar = (id, player, isPaused, setIsPaused, duration, notes, chapters, seekStep = 5, handleSaveNoteAction, opacity = "0", handleControlDisplayTimer = () => { }, bgColor = "transparent") => {
|
27
|
+
const renderControlBar = (id, player, isPaused, setIsPaused, duration, notes, chapters, seekStep = 5, handleSaveNoteAction, opacity = "0", handleControlDisplayTimer = () => { }, bgColor = "transparent", setIsQualityMenuOpen, setIsSubtitleMenuOpen) => {
|
28
28
|
const container = document.getElementById(`video-container-${id}`);
|
29
29
|
if (container) {
|
30
30
|
container.style.height = "100%";
|
@@ -39,18 +39,22 @@ const renderControlBar = (id, player, isPaused, setIsPaused, duration, notes, ch
|
|
39
39
|
element.style.backgroundColor = `${bgColor} !important`;
|
40
40
|
element.style.height = "100%";
|
41
41
|
element.style.alignItems = "flex-end";
|
42
|
-
controlBarRoot[id].render(_jsx(SoftBuildersVideoPlayerProvider, { children: _jsx(ControlBar, { id: id, player: player, isPaused: isPaused, setIsPaused: setIsPaused, duration: duration, notes: notes, chapters: chapters, seekStep: seekStep, handleSaveNoteAction: handleSaveNoteAction, handleControlDisplayTimer: handleControlDisplayTimer }) }));
|
42
|
+
controlBarRoot[id].render(_jsx(SoftBuildersVideoPlayerProvider, { children: _jsx(ControlBar, { id: id, player: player, isPaused: isPaused, setIsPaused: setIsPaused, duration: duration, notes: notes, chapters: chapters, seekStep: seekStep, handleSaveNoteAction: handleSaveNoteAction, handleControlDisplayTimer: handleControlDisplayTimer, setIsSubtitleMenuOpen: setIsSubtitleMenuOpen, setIsQualityMenuOpen: setIsQualityMenuOpen }) }));
|
43
43
|
}
|
44
44
|
}
|
45
45
|
};
|
46
46
|
const VideoPlayerComponent = ({ id, options, notes, chapters, startTime = 0, handleSaveNoteAction, poster, onPlay, onPause, }) => {
|
47
|
+
var _a, _b, _c;
|
47
48
|
const videoRef = useRef(undefined);
|
48
49
|
const playerRef = useRef(undefined);
|
49
50
|
const [isReady, setIsReady] = useState(false);
|
50
51
|
const [isPaused, setIsPaused] = useState(!options.autoplay);
|
51
52
|
const [duration, setDuration] = useState(1);
|
52
53
|
const [opacity, setOpacity] = useState("0");
|
54
|
+
const [isControlBarPresent, setIsControlBarPresent] = useState(true);
|
53
55
|
const [bgColor, setBgColor] = useState("transparent");
|
56
|
+
const [isQualityMenuOpen, setIsQualityMenuOpen] = useState(false);
|
57
|
+
const [isSubtitleMenuOpen, setIsSubtitleMenuOpen] = useState(false);
|
54
58
|
const onReady = (player) => {
|
55
59
|
if (playerRef) {
|
56
60
|
playerRef.current = player;
|
@@ -118,7 +122,7 @@ const VideoPlayerComponent = ({ id, options, notes, chapters, startTime = 0, han
|
|
118
122
|
const controlBarTimeout = setTimeout(() => {
|
119
123
|
renderControlBar(id, playerRef.current, isPaused, setIsPaused, duration, notes, chapters, 5, handleSaveNoteAction, opacity, (e) => {
|
120
124
|
handlePlayerClick(e, true);
|
121
|
-
}, bgColor);
|
125
|
+
}, bgColor, setIsQualityMenuOpen, setIsSubtitleMenuOpen);
|
122
126
|
}, 500);
|
123
127
|
return () => clearTimeout(controlBarTimeout);
|
124
128
|
}
|
@@ -169,21 +173,43 @@ const VideoPlayerComponent = ({ id, options, notes, chapters, startTime = 0, han
|
|
169
173
|
};
|
170
174
|
}, []);
|
171
175
|
const timeoutRef = useRef(null);
|
176
|
+
useEffect(() => {
|
177
|
+
if (isQualityMenuOpen || isSubtitleMenuOpen) {
|
178
|
+
if (timeoutRef.current) {
|
179
|
+
clearTimeout(timeoutRef.current);
|
180
|
+
}
|
181
|
+
setOpacity("100");
|
182
|
+
}
|
183
|
+
else {
|
184
|
+
if (timeoutRef.current) {
|
185
|
+
clearTimeout(timeoutRef.current);
|
186
|
+
}
|
187
|
+
setOpacity("0");
|
188
|
+
timeoutRef.current = setTimeout(() => {
|
189
|
+
setIsControlBarPresent(false);
|
190
|
+
}, 3000);
|
191
|
+
}
|
192
|
+
}, [isQualityMenuOpen, isSubtitleMenuOpen]);
|
172
193
|
const handlePlayerClick = async (e, isTimerOnly = false) => {
|
173
194
|
e.preventDefault();
|
174
195
|
if (timeoutRef.current) {
|
175
196
|
clearTimeout(timeoutRef.current);
|
176
197
|
}
|
177
198
|
setOpacity("100");
|
199
|
+
setIsControlBarPresent(true);
|
178
200
|
// setBgColor("rgba(200, 200, 200, 0.5)");
|
179
201
|
// not using now
|
180
202
|
timeoutRef.current = setTimeout(() => {
|
181
203
|
setOpacity("0");
|
182
204
|
setBgColor("transparent");
|
183
|
-
|
205
|
+
setIsControlBarPresent(false);
|
206
|
+
}, 3000);
|
184
207
|
if (isTimerOnly) {
|
185
208
|
return;
|
186
209
|
}
|
210
|
+
if (!isControlBarPresent) {
|
211
|
+
return;
|
212
|
+
}
|
187
213
|
if (playerRef.current) {
|
188
214
|
if (playerRef.current.paused()) {
|
189
215
|
try {
|
@@ -231,7 +257,16 @@ const VideoPlayerComponent = ({ id, options, notes, chapters, startTime = 0, han
|
|
231
257
|
}
|
232
258
|
};
|
233
259
|
}, []);
|
234
|
-
|
260
|
+
console.log((_a = playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) === null || _a === void 0 ? void 0 : _a.currentTime(), (_b = playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) === null || _b === void 0 ? void 0 : _b.duration(), "player");
|
261
|
+
const [timeSeeker, setTimeSeeker] = useState("0");
|
262
|
+
useEffect(() => {
|
263
|
+
var _a, _b;
|
264
|
+
let value = `${(((_a = playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) === null || _a === void 0 ? void 0 : _a.currentTime()) / ((_b = playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) === null || _b === void 0 ? void 0 : _b.duration())) * 100}%`;
|
265
|
+
setTimeSeeker(value);
|
266
|
+
}, [(_c = playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) === null || _c === void 0 ? void 0 : _c.currentTime()]);
|
267
|
+
return (_jsx("div", { ref: videoRefs, id: `video-container-${id}`, className: "sb-relative sb-rounded-md sb-overflow-hidden sb-w-full sb-h-full ", children: _jsxs("div", { className: "hover:sb-cursor-pointer sb-w-full sb-h-full", "data-vjs-player": true, children: [_jsx("div", { className: `sb-h-[3px] sb-transition- sb-duration-500 sb-delay-400 sb-z-10 ease-in-out sb-border-spacing-x-2 sb-absolute sb-bg-[red] -sb-bottom-[1.5px] ${opacity == "100" ? "sb-opacity-0" : "sb-opacity-100"}`, style: {
|
268
|
+
width: timeSeeker,
|
269
|
+
} }), _jsx("div", { onClick: handlePlayerClick, ref: videoRef, className: "sb-h-full sb-w-full" })] }) }));
|
235
270
|
};
|
236
271
|
export default VideoPlayerComponent;
|
237
272
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/VideoPlayerComponent/index.tsx"],"names":[],"mappings":"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"}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/VideoPlayerComponent/index.tsx"],"names":[],"mappings":"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"}
|
@@ -59,7 +59,9 @@ const renderControlBar = <T,>(
|
|
59
59
|
opacity: string = "0",
|
60
60
|
|
61
61
|
handleControlDisplayTimer: (e: any) => void = () => {},
|
62
|
-
bgColor: string = "transparent"
|
62
|
+
bgColor: string = "transparent",
|
63
|
+
setIsQualityMenuOpen?: (val: boolean) => void,
|
64
|
+
setIsSubtitleMenuOpen?: (val: boolean) => void
|
63
65
|
) => {
|
64
66
|
const container = document.getElementById(`video-container-${id}`);
|
65
67
|
if (container) {
|
@@ -88,6 +90,8 @@ const renderControlBar = <T,>(
|
|
88
90
|
seekStep={seekStep}
|
89
91
|
handleSaveNoteAction={handleSaveNoteAction}
|
90
92
|
handleControlDisplayTimer={handleControlDisplayTimer}
|
93
|
+
setIsSubtitleMenuOpen={setIsSubtitleMenuOpen}
|
94
|
+
setIsQualityMenuOpen={setIsQualityMenuOpen}
|
91
95
|
/>
|
92
96
|
</SoftBuildersVideoPlayerProvider>
|
93
97
|
);
|
@@ -122,7 +126,10 @@ const VideoPlayerComponent = <T,>({
|
|
122
126
|
const [isPaused, setIsPaused] = useState(!options.autoplay);
|
123
127
|
const [duration, setDuration] = useState(1);
|
124
128
|
const [opacity, setOpacity] = useState("0");
|
129
|
+
const [isControlBarPresent, setIsControlBarPresent] = useState(true);
|
125
130
|
const [bgColor, setBgColor] = useState("transparent");
|
131
|
+
const [isQualityMenuOpen, setIsQualityMenuOpen] = useState(false);
|
132
|
+
const [isSubtitleMenuOpen, setIsSubtitleMenuOpen] = useState(false);
|
126
133
|
const onReady = (player: Player) => {
|
127
134
|
if (playerRef) {
|
128
135
|
playerRef.current = player;
|
@@ -202,7 +209,9 @@ const VideoPlayerComponent = <T,>({
|
|
202
209
|
(e: any) => {
|
203
210
|
handlePlayerClick(e, true);
|
204
211
|
},
|
205
|
-
bgColor
|
212
|
+
bgColor,
|
213
|
+
setIsQualityMenuOpen,
|
214
|
+
setIsSubtitleMenuOpen
|
206
215
|
);
|
207
216
|
}, 500);
|
208
217
|
return () => clearTimeout(controlBarTimeout);
|
@@ -259,21 +268,44 @@ const VideoPlayerComponent = <T,>({
|
|
259
268
|
};
|
260
269
|
}, []);
|
261
270
|
const timeoutRef = useRef<any>(null);
|
271
|
+
useEffect(() => {
|
272
|
+
if (isQualityMenuOpen || isSubtitleMenuOpen) {
|
273
|
+
if (timeoutRef.current) {
|
274
|
+
clearTimeout(timeoutRef.current);
|
275
|
+
}
|
276
|
+
setOpacity("100");
|
277
|
+
} else {
|
278
|
+
if (timeoutRef.current) {
|
279
|
+
clearTimeout(timeoutRef.current);
|
280
|
+
}
|
281
|
+
setOpacity("0");
|
282
|
+
|
283
|
+
timeoutRef.current = setTimeout(() => {
|
284
|
+
setIsControlBarPresent(false);
|
285
|
+
}, 3000);
|
286
|
+
}
|
287
|
+
}, [isQualityMenuOpen, isSubtitleMenuOpen]);
|
288
|
+
|
262
289
|
const handlePlayerClick = async (e: any, isTimerOnly = false) => {
|
263
290
|
e.preventDefault();
|
264
291
|
if (timeoutRef.current) {
|
265
292
|
clearTimeout(timeoutRef.current);
|
266
293
|
}
|
267
294
|
setOpacity("100");
|
295
|
+
setIsControlBarPresent(true);
|
268
296
|
// setBgColor("rgba(200, 200, 200, 0.5)");
|
269
297
|
// not using now
|
270
298
|
timeoutRef.current = setTimeout(() => {
|
271
299
|
setOpacity("0");
|
272
300
|
setBgColor("transparent");
|
273
|
-
|
301
|
+
setIsControlBarPresent(false);
|
302
|
+
}, 3000);
|
274
303
|
if (isTimerOnly) {
|
275
304
|
return;
|
276
305
|
}
|
306
|
+
if (!isControlBarPresent) {
|
307
|
+
return;
|
308
|
+
}
|
277
309
|
if (playerRef.current) {
|
278
310
|
if (playerRef.current.paused()) {
|
279
311
|
try {
|
@@ -322,7 +354,18 @@ const VideoPlayerComponent = <T,>({
|
|
322
354
|
}
|
323
355
|
};
|
324
356
|
}, []);
|
325
|
-
|
357
|
+
console.log(
|
358
|
+
playerRef?.current?.currentTime(),
|
359
|
+
playerRef?.current?.duration(),
|
360
|
+
"player"
|
361
|
+
);
|
362
|
+
const [timeSeeker, setTimeSeeker] = useState<string>("0");
|
363
|
+
useEffect(() => {
|
364
|
+
let value = `${
|
365
|
+
(playerRef?.current?.currentTime() / playerRef?.current?.duration()) * 100
|
366
|
+
}%`;
|
367
|
+
setTimeSeeker(value);
|
368
|
+
}, [playerRef?.current?.currentTime()]);
|
326
369
|
return (
|
327
370
|
<div
|
328
371
|
ref={videoRefs}
|
@@ -334,6 +377,15 @@ const VideoPlayerComponent = <T,>({
|
|
334
377
|
// Attach click event
|
335
378
|
data-vjs-player
|
336
379
|
>
|
380
|
+
<div
|
381
|
+
className={`sb-h-[3px] sb-transition- sb-duration-500 sb-delay-400 sb-z-10 ease-in-out sb-border-spacing-x-2 sb-absolute sb-bg-[red] -sb-bottom-[1.5px] ${
|
382
|
+
opacity == "100" ? "sb-opacity-0" : "sb-opacity-100"
|
383
|
+
}`}
|
384
|
+
style={{
|
385
|
+
width: timeSeeker,
|
386
|
+
}}
|
387
|
+
></div>
|
388
|
+
|
337
389
|
<div
|
338
390
|
onClick={handlePlayerClick}
|
339
391
|
ref={videoRef}
|
package/dist/index.css
CHANGED
@@ -36,7 +36,7 @@ input[type=range]::-moz-range-thumb {
|
|
36
36
|
|
37
37
|
/* src/components/VideoPlayerComponent/style/style.css */
|
38
38
|
.video-js .vjs-control-bar {
|
39
|
-
background-color: rgba(
|
39
|
+
background-color: rgba(85, 83, 83, 0.1);
|
40
40
|
display: none;
|
41
41
|
height: 100%;
|
42
42
|
width: 100%;
|
@@ -428,6 +428,9 @@ video {
|
|
428
428
|
.\!sb-top-8 {
|
429
429
|
top: 2rem !important;
|
430
430
|
}
|
431
|
+
.-sb-bottom-\[1\.5px\] {
|
432
|
+
bottom: -1.5px;
|
433
|
+
}
|
431
434
|
.-sb-left-9 {
|
432
435
|
left: -2.25rem;
|
433
436
|
}
|
@@ -512,6 +515,9 @@ video {
|
|
512
515
|
.sb-h-\[\.1px\] {
|
513
516
|
height: .1px;
|
514
517
|
}
|
518
|
+
.sb-h-\[3px\] {
|
519
|
+
height: 3px;
|
520
|
+
}
|
515
521
|
.sb-h-full {
|
516
522
|
height: 100%;
|
517
523
|
}
|
@@ -551,6 +557,10 @@ video {
|
|
551
557
|
.sb-w-full {
|
552
558
|
width: 100%;
|
553
559
|
}
|
560
|
+
.sb-border-spacing-x-2 {
|
561
|
+
--tw-border-spacing-x: 0.5rem;
|
562
|
+
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
|
563
|
+
}
|
554
564
|
.-sb-translate-y-0 {
|
555
565
|
--tw-translate-y: -0px;
|
556
566
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
@@ -672,6 +682,10 @@ video {
|
|
672
682
|
--tw-bg-opacity: 1;
|
673
683
|
background-color: rgb(170 170 170 / var(--tw-bg-opacity));
|
674
684
|
}
|
685
|
+
.sb-bg-\[red\] {
|
686
|
+
--tw-bg-opacity: 1;
|
687
|
+
background-color: rgb(255 0 0 / var(--tw-bg-opacity));
|
688
|
+
}
|
675
689
|
.sb-bg-orange-500 {
|
676
690
|
--tw-bg-opacity: 1;
|
677
691
|
background-color: rgb(249 115 22 / var(--tw-bg-opacity));
|
package/dist/index.mjs
CHANGED
@@ -636,7 +636,7 @@ var MenuButton = ({
|
|
636
636
|
onClick: (e) => {
|
637
637
|
e.stopPropagation();
|
638
638
|
toggleMenu();
|
639
|
-
onClick && onClick(e);
|
639
|
+
onClick && onClick(e, !isOpen);
|
640
640
|
},
|
641
641
|
"aria-haspopup": "true",
|
642
642
|
"aria-expanded": isOpen,
|
@@ -709,8 +709,8 @@ var QualityMenu = ({ width, onClick }) => {
|
|
709
709
|
MenuButton_default,
|
710
710
|
{
|
711
711
|
classContainer: `${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`,
|
712
|
-
onClick: () => {
|
713
|
-
onClick && onClick();
|
712
|
+
onClick: (e, isOpen) => {
|
713
|
+
onClick && onClick(e, isOpen);
|
714
714
|
},
|
715
715
|
buttonContent: /* @__PURE__ */ jsx21(SettingsIcon_default, { className: "sb-w-3 sb-h-3" }),
|
716
716
|
menuContent: /* @__PURE__ */ jsx21(
|
@@ -1108,7 +1108,7 @@ var SubtitleOption = ({
|
|
1108
1108
|
className: "hover:sb-text-orange-500 sb-p-2",
|
1109
1109
|
onClick: (e) => {
|
1110
1110
|
e.stopPropagation();
|
1111
|
-
onClick();
|
1111
|
+
onClick(e);
|
1112
1112
|
},
|
1113
1113
|
children: /* @__PURE__ */ jsxs12("div", { className: "sb-grid sb-grid-cols-12 sb-items-center sb-gap-2", children: [
|
1114
1114
|
/* @__PURE__ */ jsx32("div", { className: "sb-col-span-3", children: isSelected ? /* @__PURE__ */ jsx32(CheckedIcon_default, { className: "sb-w-5 sb-h-5" }) : /* @__PURE__ */ jsx32("div", {}) }),
|
@@ -1142,8 +1142,8 @@ var SubtitleMenu = ({ width, onClick }) => {
|
|
1142
1142
|
return /* @__PURE__ */ jsx32(
|
1143
1143
|
MenuButton_default,
|
1144
1144
|
{
|
1145
|
-
onClick: () => {
|
1146
|
-
onClick && onClick();
|
1145
|
+
onClick: (e, isOpen) => {
|
1146
|
+
onClick && onClick(e, isOpen);
|
1147
1147
|
},
|
1148
1148
|
classContainer: `${width < 400 ? "!sb-top-8 -sb-left-9" : ""}`,
|
1149
1149
|
buttonContent: /* @__PURE__ */ jsx32(SubIcon_default, { className: "sb-w-4 sb-h-4 sb-text-white " }),
|
@@ -1204,7 +1204,9 @@ var ControlBar = ({
|
|
1204
1204
|
seekStep = 5,
|
1205
1205
|
id,
|
1206
1206
|
handleSaveNoteAction,
|
1207
|
-
handleControlDisplayTimer
|
1207
|
+
handleControlDisplayTimer,
|
1208
|
+
setIsQualityMenuOpen,
|
1209
|
+
setIsSubtitleMenuOpen
|
1208
1210
|
}) => {
|
1209
1211
|
const { setPlayer, setDuration } = useSoftBuildersVideoPlayerContext();
|
1210
1212
|
const [width, setWidth] = useState12(0);
|
@@ -1302,7 +1304,10 @@ var ControlBar = ({
|
|
1302
1304
|
QualityMenu_default,
|
1303
1305
|
{
|
1304
1306
|
width,
|
1305
|
-
onClick: () =>
|
1307
|
+
onClick: (e, isOpen) => {
|
1308
|
+
setVolumeToggler(!volumeSliderToggler);
|
1309
|
+
setIsQualityMenuOpen(isOpen);
|
1310
|
+
}
|
1306
1311
|
}
|
1307
1312
|
),
|
1308
1313
|
handleSaveNoteAction && /* @__PURE__ */ jsx33(CreateNoteMenu_default, { handleSaveNoteAction }),
|
@@ -1310,7 +1315,10 @@ var ControlBar = ({
|
|
1310
1315
|
SubtitleMenu_default,
|
1311
1316
|
{
|
1312
1317
|
width,
|
1313
|
-
onClick: () =>
|
1318
|
+
onClick: (e, isOpen) => {
|
1319
|
+
setVolumeToggler(!volumeSliderToggler);
|
1320
|
+
setIsSubtitleMenuOpen(isOpen);
|
1321
|
+
}
|
1314
1322
|
}
|
1315
1323
|
),
|
1316
1324
|
/* @__PURE__ */ jsx33(
|
@@ -1354,7 +1362,7 @@ var BigPlayButton = ({ player, isPaused, setIsPaused }) => {
|
|
1354
1362
|
var BigPlayButton_default = BigPlayButton;
|
1355
1363
|
|
1356
1364
|
// src/components/VideoPlayerComponent/index.tsx
|
1357
|
-
import { jsx as jsx35 } from "react/jsx-runtime";
|
1365
|
+
import { jsx as jsx35, jsxs as jsxs14 } from "react/jsx-runtime";
|
1358
1366
|
var bigPlayButtonRoot = {};
|
1359
1367
|
var renderBigPlayButton = (id, player, isPaused, setIsPaused, opacity = "100") => {
|
1360
1368
|
const container = document.getElementById(`video-container-${id}`);
|
@@ -1381,7 +1389,7 @@ var renderBigPlayButton = (id, player, isPaused, setIsPaused, opacity = "100") =
|
|
1381
1389
|
};
|
1382
1390
|
var controlBarRoot = {};
|
1383
1391
|
var renderControlBar = (id, player, isPaused, setIsPaused, duration, notes, chapters, seekStep = 5, handleSaveNoteAction, opacity = "0", handleControlDisplayTimer = () => {
|
1384
|
-
}, bgColor = "transparent") => {
|
1392
|
+
}, bgColor = "transparent", setIsQualityMenuOpen, setIsSubtitleMenuOpen) => {
|
1385
1393
|
const container = document.getElementById(`video-container-${id}`);
|
1386
1394
|
if (container) {
|
1387
1395
|
container.style.height = "100%";
|
@@ -1409,7 +1417,9 @@ var renderControlBar = (id, player, isPaused, setIsPaused, duration, notes, chap
|
|
1409
1417
|
chapters,
|
1410
1418
|
seekStep,
|
1411
1419
|
handleSaveNoteAction,
|
1412
|
-
handleControlDisplayTimer
|
1420
|
+
handleControlDisplayTimer,
|
1421
|
+
setIsSubtitleMenuOpen,
|
1422
|
+
setIsQualityMenuOpen
|
1413
1423
|
}
|
1414
1424
|
) })
|
1415
1425
|
);
|
@@ -1427,13 +1437,17 @@ var VideoPlayerComponent = ({
|
|
1427
1437
|
onPlay,
|
1428
1438
|
onPause
|
1429
1439
|
}) => {
|
1440
|
+
var _a, _b, _c;
|
1430
1441
|
const videoRef = useRef2(void 0);
|
1431
1442
|
const playerRef = useRef2(void 0);
|
1432
1443
|
const [isReady, setIsReady] = useState13(false);
|
1433
1444
|
const [isPaused, setIsPaused] = useState13(!options.autoplay);
|
1434
1445
|
const [duration, setDuration] = useState13(1);
|
1435
1446
|
const [opacity, setOpacity] = useState13("0");
|
1447
|
+
const [isControlBarPresent, setIsControlBarPresent] = useState13(true);
|
1436
1448
|
const [bgColor, setBgColor] = useState13("transparent");
|
1449
|
+
const [isQualityMenuOpen, setIsQualityMenuOpen] = useState13(false);
|
1450
|
+
const [isSubtitleMenuOpen, setIsSubtitleMenuOpen] = useState13(false);
|
1437
1451
|
const onReady = (player) => {
|
1438
1452
|
if (playerRef) {
|
1439
1453
|
playerRef.current = player;
|
@@ -1510,7 +1524,9 @@ var VideoPlayerComponent = ({
|
|
1510
1524
|
(e) => {
|
1511
1525
|
handlePlayerClick(e, true);
|
1512
1526
|
},
|
1513
|
-
bgColor
|
1527
|
+
bgColor,
|
1528
|
+
setIsQualityMenuOpen,
|
1529
|
+
setIsSubtitleMenuOpen
|
1514
1530
|
);
|
1515
1531
|
}, 500);
|
1516
1532
|
return () => clearTimeout(controlBarTimeout);
|
@@ -1566,19 +1582,40 @@ var VideoPlayerComponent = ({
|
|
1566
1582
|
};
|
1567
1583
|
}, []);
|
1568
1584
|
const timeoutRef = useRef2(null);
|
1585
|
+
useEffect14(() => {
|
1586
|
+
if (isQualityMenuOpen || isSubtitleMenuOpen) {
|
1587
|
+
if (timeoutRef.current) {
|
1588
|
+
clearTimeout(timeoutRef.current);
|
1589
|
+
}
|
1590
|
+
setOpacity("100");
|
1591
|
+
} else {
|
1592
|
+
if (timeoutRef.current) {
|
1593
|
+
clearTimeout(timeoutRef.current);
|
1594
|
+
}
|
1595
|
+
setOpacity("0");
|
1596
|
+
timeoutRef.current = setTimeout(() => {
|
1597
|
+
setIsControlBarPresent(false);
|
1598
|
+
}, 3e3);
|
1599
|
+
}
|
1600
|
+
}, [isQualityMenuOpen, isSubtitleMenuOpen]);
|
1569
1601
|
const handlePlayerClick = async (e, isTimerOnly = false) => {
|
1570
1602
|
e.preventDefault();
|
1571
1603
|
if (timeoutRef.current) {
|
1572
1604
|
clearTimeout(timeoutRef.current);
|
1573
1605
|
}
|
1574
1606
|
setOpacity("100");
|
1607
|
+
setIsControlBarPresent(true);
|
1575
1608
|
timeoutRef.current = setTimeout(() => {
|
1576
1609
|
setOpacity("0");
|
1577
1610
|
setBgColor("transparent");
|
1578
|
-
|
1611
|
+
setIsControlBarPresent(false);
|
1612
|
+
}, 3e3);
|
1579
1613
|
if (isTimerOnly) {
|
1580
1614
|
return;
|
1581
1615
|
}
|
1616
|
+
if (!isControlBarPresent) {
|
1617
|
+
return;
|
1618
|
+
}
|
1582
1619
|
if (playerRef.current) {
|
1583
1620
|
if (playerRef.current.paused()) {
|
1584
1621
|
try {
|
@@ -1599,11 +1636,11 @@ var VideoPlayerComponent = ({
|
|
1599
1636
|
const observer = new IntersectionObserver(
|
1600
1637
|
(entries) => {
|
1601
1638
|
entries.forEach((entry) => {
|
1602
|
-
var
|
1639
|
+
var _a2, _b2;
|
1603
1640
|
if (entry.isIntersecting === false) {
|
1604
|
-
if (((
|
1641
|
+
if (((_a2 = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _a2.paused()) === false) {
|
1605
1642
|
try {
|
1606
|
-
(
|
1643
|
+
(_b2 = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _b2.pause();
|
1607
1644
|
setIsPaused(true);
|
1608
1645
|
} catch (error) {
|
1609
1646
|
console.error("Failed to play video:", error);
|
@@ -1626,25 +1663,47 @@ var VideoPlayerComponent = ({
|
|
1626
1663
|
}
|
1627
1664
|
};
|
1628
1665
|
}, []);
|
1666
|
+
console.log(
|
1667
|
+
(_a = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _a.currentTime(),
|
1668
|
+
(_b = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _b.duration(),
|
1669
|
+
"player"
|
1670
|
+
);
|
1671
|
+
const [timeSeeker, setTimeSeeker] = useState13("0");
|
1672
|
+
useEffect14(() => {
|
1673
|
+
var _a2, _b2;
|
1674
|
+
let value = `${((_a2 = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _a2.currentTime()) / ((_b2 = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _b2.duration()) * 100}%`;
|
1675
|
+
setTimeSeeker(value);
|
1676
|
+
}, [(_c = playerRef == null ? void 0 : playerRef.current) == null ? void 0 : _c.currentTime()]);
|
1629
1677
|
return /* @__PURE__ */ jsx35(
|
1630
1678
|
"div",
|
1631
1679
|
{
|
1632
1680
|
ref: videoRefs,
|
1633
1681
|
id: `video-container-${id}`,
|
1634
1682
|
className: "sb-relative sb-rounded-md sb-overflow-hidden sb-w-full sb-h-full ",
|
1635
|
-
children: /* @__PURE__ */
|
1683
|
+
children: /* @__PURE__ */ jsxs14(
|
1636
1684
|
"div",
|
1637
1685
|
{
|
1638
1686
|
className: "hover:sb-cursor-pointer sb-w-full sb-h-full",
|
1639
1687
|
"data-vjs-player": true,
|
1640
|
-
children:
|
1641
|
-
|
1642
|
-
|
1643
|
-
|
1644
|
-
|
1645
|
-
|
1646
|
-
|
1647
|
-
|
1688
|
+
children: [
|
1689
|
+
/* @__PURE__ */ jsx35(
|
1690
|
+
"div",
|
1691
|
+
{
|
1692
|
+
className: `sb-h-[3px] sb-transition- sb-duration-500 sb-delay-400 sb-z-10 ease-in-out sb-border-spacing-x-2 sb-absolute sb-bg-[red] -sb-bottom-[1.5px] ${opacity == "100" ? "sb-opacity-0" : "sb-opacity-100"}`,
|
1693
|
+
style: {
|
1694
|
+
width: timeSeeker
|
1695
|
+
}
|
1696
|
+
}
|
1697
|
+
),
|
1698
|
+
/* @__PURE__ */ jsx35(
|
1699
|
+
"div",
|
1700
|
+
{
|
1701
|
+
onClick: handlePlayerClick,
|
1702
|
+
ref: videoRef,
|
1703
|
+
className: "sb-h-full sb-w-full"
|
1704
|
+
}
|
1705
|
+
)
|
1706
|
+
]
|
1648
1707
|
}
|
1649
1708
|
)
|
1650
1709
|
}
|
@@ -1691,7 +1750,6 @@ var Component = ({
|
|
1691
1750
|
if (options.width === void 0) options.width = DEFAULT_OPTIONS.width;
|
1692
1751
|
const [tracks, setTracks] = useState14([]);
|
1693
1752
|
useEffect15(() => {
|
1694
|
-
console.log(isFocused, "isF");
|
1695
1753
|
}, [isFocused]);
|
1696
1754
|
useEffect15(() => {
|
1697
1755
|
const getTracks = async () => {
|
package/dist/styles/tailwind.css
CHANGED
@@ -517,6 +517,9 @@ video {
|
|
517
517
|
.\!sb-top-8 {
|
518
518
|
top: 2rem !important;
|
519
519
|
}
|
520
|
+
.-sb-bottom-\[1\.5px\] {
|
521
|
+
bottom: -1.5px;
|
522
|
+
}
|
520
523
|
.-sb-left-9 {
|
521
524
|
left: -2.25rem;
|
522
525
|
}
|
@@ -601,6 +604,9 @@ video {
|
|
601
604
|
.sb-h-\[\.1px\] {
|
602
605
|
height: .1px;
|
603
606
|
}
|
607
|
+
.sb-h-\[3px\] {
|
608
|
+
height: 3px;
|
609
|
+
}
|
604
610
|
.sb-h-full {
|
605
611
|
height: 100%;
|
606
612
|
}
|
@@ -640,6 +646,10 @@ video {
|
|
640
646
|
.sb-w-full {
|
641
647
|
width: 100%;
|
642
648
|
}
|
649
|
+
.sb-border-spacing-x-2 {
|
650
|
+
--tw-border-spacing-x: 0.5rem;
|
651
|
+
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
|
652
|
+
}
|
643
653
|
.-sb-translate-y-0 {
|
644
654
|
--tw-translate-y: -0px;
|
645
655
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
@@ -761,6 +771,10 @@ video {
|
|
761
771
|
--tw-bg-opacity: 1;
|
762
772
|
background-color: rgb(170 170 170 / var(--tw-bg-opacity));
|
763
773
|
}
|
774
|
+
.sb-bg-\[red\] {
|
775
|
+
--tw-bg-opacity: 1;
|
776
|
+
background-color: rgb(255 0 0 / var(--tw-bg-opacity));
|
777
|
+
}
|
764
778
|
.sb-bg-orange-500 {
|
765
779
|
--tw-bg-opacity: 1;
|
766
780
|
background-color: rgb(249 115 22 / var(--tw-bg-opacity));
|