softbuilders-react-video-player 1.1.71 → 1.1.73
Sign up to get free protection for your applications and to get access to all the features.
- package/LICENSE +21 -21
- package/dist/components/ChapterTooltip/index.tsx +65 -65
- package/dist/components/ControlBar/index.js +1 -1
- package/dist/components/ControlBar/index.js.map +1 -1
- package/dist/components/ControlBar/index.tsx +9 -7
- package/dist/components/CurrentTimeLabel/index.tsx +13 -13
- package/dist/components/Menu/index.tsx +49 -49
- package/dist/components/NoteTooltip/index.tsx +46 -46
- package/dist/components/QualityMenu/index.js +11 -11
- package/dist/components/QualityMenu/index.js.map +1 -1
- package/dist/components/QualityMenu/index.tsx +18 -20
- package/dist/components/SoftBuildersVideoPlayer/index.js +55 -32
- package/dist/components/SoftBuildersVideoPlayer/index.js.map +1 -1
- package/dist/components/SoftBuildersVideoPlayer/index.tsx +80 -40
- package/dist/components/Tooltip/GlobalTooltip.js +1 -1
- package/dist/components/Tooltip/GlobalTooltip.js.map +1 -1
- package/dist/components/Tooltip/GlobalTooltip.tsx +1 -1
- package/dist/components/VideoPlayerComponent/index.js +25 -21
- package/dist/components/VideoPlayerComponent/index.js.map +1 -1
- package/dist/components/VideoPlayerComponent/index.tsx +28 -19
- package/dist/components/VideoPlayerComponent/provider.tsx +82 -82
- package/dist/components/VolumeSlider/index.js +1 -1
- package/dist/components/VolumeSlider/index.js.map +1 -1
- package/dist/components/VolumeSlider/index.tsx +1 -1
- package/dist/index.css +6 -6
- package/dist/index.mjs +69 -67
- package/dist/styles/tailwind.css +129 -129
- package/package.json +2 -1
package/LICENSE
CHANGED
@@ -1,21 +1,21 @@
|
|
1
|
-
MIT License
|
2
|
-
|
3
|
-
Copyright (c) 2024 masri-softbuilders
|
4
|
-
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
7
|
-
in the Software without restriction, including without limitation the rights
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
10
|
-
furnished to do so, subject to the following conditions:
|
11
|
-
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
13
|
-
copies or substantial portions of the Software.
|
14
|
-
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
21
|
-
SOFTWARE.
|
1
|
+
MIT License
|
2
|
+
|
3
|
+
Copyright (c) 2024 masri-softbuilders
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
7
|
+
in the Software without restriction, including without limitation the rights
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
10
|
+
furnished to do so, subject to the following conditions:
|
11
|
+
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
13
|
+
copies or substantial portions of the Software.
|
14
|
+
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
21
|
+
SOFTWARE.
|
@@ -1,65 +1,65 @@
|
|
1
|
-
import React, { useEffect, useState } from "react";
|
2
|
-
import Tooltip from "../Tooltip";
|
3
|
-
import { durationFormater } from "../../utils";
|
4
|
-
import { SoftBuildersVideoPlayerChapter } from "../../types";
|
5
|
-
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
6
|
-
type Chapter = SoftBuildersVideoPlayerChapter & {
|
7
|
-
startPercentage: number;
|
8
|
-
endPercentage: number;
|
9
|
-
};
|
10
|
-
type Props = {
|
11
|
-
chapter: Chapter;
|
12
|
-
};
|
13
|
-
const ChapterTooltip = ({ chapter }: Props) => {
|
14
|
-
const { player } = useSoftBuildersVideoPlayerContext();
|
15
|
-
|
16
|
-
const [open, setOpen] = useState(false);
|
17
|
-
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
18
|
-
|
19
|
-
useEffect(() => {
|
20
|
-
if (currentTime === Math.floor(chapter.startTime)) {
|
21
|
-
setOpen(true);
|
22
|
-
|
23
|
-
setTimeout(() => {
|
24
|
-
setOpen(false);
|
25
|
-
}, 5000);
|
26
|
-
}
|
27
|
-
}, [currentTime, chapter.startTime]);
|
28
|
-
|
29
|
-
const handleClickChapter = () => {
|
30
|
-
player?.currentTime(chapter.startTime);
|
31
|
-
};
|
32
|
-
|
33
|
-
return (
|
34
|
-
<div
|
35
|
-
id={`ii-section-${chapter.title}`}
|
36
|
-
className="sb-flex sb-items-center sb-w-full sb-h-full sb-absolute sb-z-20"
|
37
|
-
style={{
|
38
|
-
left: `${chapter.startPercentage}%`,
|
39
|
-
width: `${chapter.endPercentage - chapter.startPercentage}%`,
|
40
|
-
}}
|
41
|
-
onMouseEnter={() => setOpen(true)}
|
42
|
-
onMouseLeave={() => setOpen(false)}
|
43
|
-
>
|
44
|
-
<button
|
45
|
-
id={`section-${chapter.title}`}
|
46
|
-
className="sb-h-full sb-w-full"
|
47
|
-
onClick={handleClickChapter}
|
48
|
-
>
|
49
|
-
<div className="sb-relative sb-flex sb-h-full sb-w-full sb-justify-between sb-items-center">
|
50
|
-
<Tooltip open={open}>
|
51
|
-
<div className="sb-flex sb-flex-col sb-gap-2 sb-items-center">
|
52
|
-
<p>{chapter.title}</p>
|
53
|
-
<p className="sb-p-2 sb-bg-[#303030] sb-bg-opacity-50 sb-rounded-md">
|
54
|
-
{durationFormater(chapter.startTime)} -{" "}
|
55
|
-
{durationFormater(chapter.endTime)}
|
56
|
-
</p>
|
57
|
-
</div>
|
58
|
-
</Tooltip>
|
59
|
-
</div>
|
60
|
-
</button>
|
61
|
-
</div>
|
62
|
-
);
|
63
|
-
};
|
64
|
-
|
65
|
-
export default ChapterTooltip;
|
1
|
+
import React, { useEffect, useState } from "react";
|
2
|
+
import Tooltip from "../Tooltip";
|
3
|
+
import { durationFormater } from "../../utils";
|
4
|
+
import { SoftBuildersVideoPlayerChapter } from "../../types";
|
5
|
+
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
6
|
+
type Chapter = SoftBuildersVideoPlayerChapter & {
|
7
|
+
startPercentage: number;
|
8
|
+
endPercentage: number;
|
9
|
+
};
|
10
|
+
type Props = {
|
11
|
+
chapter: Chapter;
|
12
|
+
};
|
13
|
+
const ChapterTooltip = ({ chapter }: Props) => {
|
14
|
+
const { player } = useSoftBuildersVideoPlayerContext();
|
15
|
+
|
16
|
+
const [open, setOpen] = useState(false);
|
17
|
+
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
18
|
+
|
19
|
+
useEffect(() => {
|
20
|
+
if (currentTime === Math.floor(chapter.startTime)) {
|
21
|
+
setOpen(true);
|
22
|
+
|
23
|
+
setTimeout(() => {
|
24
|
+
setOpen(false);
|
25
|
+
}, 5000);
|
26
|
+
}
|
27
|
+
}, [currentTime, chapter.startTime]);
|
28
|
+
|
29
|
+
const handleClickChapter = () => {
|
30
|
+
player?.currentTime(chapter.startTime);
|
31
|
+
};
|
32
|
+
|
33
|
+
return (
|
34
|
+
<div
|
35
|
+
id={`ii-section-${chapter.title}`}
|
36
|
+
className="sb-flex sb-items-center sb-w-full sb-h-full sb-absolute sb-z-20"
|
37
|
+
style={{
|
38
|
+
left: `${chapter.startPercentage}%`,
|
39
|
+
width: `${chapter.endPercentage - chapter.startPercentage}%`,
|
40
|
+
}}
|
41
|
+
onMouseEnter={() => setOpen(true)}
|
42
|
+
onMouseLeave={() => setOpen(false)}
|
43
|
+
>
|
44
|
+
<button
|
45
|
+
id={`section-${chapter.title}`}
|
46
|
+
className="sb-h-full sb-w-full"
|
47
|
+
onClick={handleClickChapter}
|
48
|
+
>
|
49
|
+
<div className="sb-relative sb-flex sb-h-full sb-w-full sb-justify-between sb-items-center">
|
50
|
+
<Tooltip open={open}>
|
51
|
+
<div className="sb-flex sb-flex-col sb-gap-2 sb-items-center">
|
52
|
+
<p>{chapter.title}</p>
|
53
|
+
<p className="sb-p-2 sb-bg-[#303030] sb-bg-opacity-50 sb-rounded-md">
|
54
|
+
{durationFormater(chapter.startTime)} -{" "}
|
55
|
+
{durationFormater(chapter.endTime)}
|
56
|
+
</p>
|
57
|
+
</div>
|
58
|
+
</Tooltip>
|
59
|
+
</div>
|
60
|
+
</button>
|
61
|
+
</div>
|
62
|
+
);
|
63
|
+
};
|
64
|
+
|
65
|
+
export default ChapterTooltip;
|
@@ -52,7 +52,7 @@ const ControlBar = ({ player, isPaused, setIsPaused, duration, notes, chapters,
|
|
52
52
|
? "sb-absolute sb-bottom-1 sb-items-end sb-mb-1 sb-pb-2 "
|
53
53
|
: "sb-items-start"} sb-pb-2`, children: [_jsx(BufferTracker, {}), _jsx(CurrentTimeTracker, {}), _jsx("button", { onClick: () => {
|
54
54
|
seek(-seekStep);
|
55
|
-
}, children: _jsx(TooltipModal, { width: width, content: _jsx("p", { children: "Backward 5 sec" }), isLeft: true, children: _jsx(BackwardIcon, { className: "sb-w-3 sb-h-3" }) }) }), _jsx(TooltipModal, { content: _jsx("p", { children: isPaused ? "Play" : "pause" }), isLeft: true, children:
|
55
|
+
}, children: _jsx(TooltipModal, { width: width, content: _jsx("p", { children: "Backward 5 sec" }), isLeft: true, children: _jsx(BackwardIcon, { className: "sb-w-3 sb-h-3" }) }) }), _jsx("button", { onClick: togglePlay, children: _jsx(TooltipModal, { width: width, content: _jsx("p", { children: isPaused ? "Play" : "pause" }), isLeft: true, children: isPaused ? (_jsx(PlayIcon, { className: "sb-w-3 sb-h-3" })) : (_jsx(PauseIcon, { className: "sb-w-3 sb-h-3" })) }) }), _jsx("button", { onClick: (e) => {
|
56
56
|
e.preventDefault();
|
57
57
|
seek(seekStep);
|
58
58
|
}, children: _jsx(TooltipModal, { width: width, content: _jsx("p", { children: "Forward 5 sec" }), isLeft: true, children: _jsx(ForwardIcon, { className: "sb-w-3 sb-h-3" }) }) }),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ControlBar/index.tsx"],"names":[],"mappings":"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
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ControlBar/index.tsx"],"names":[],"mappings":"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"}
|
@@ -126,18 +126,20 @@ const ControlBar = <T,>({
|
|
126
126
|
<BackwardIcon className="sb-w-3 sb-h-3" />
|
127
127
|
</TooltipModal>
|
128
128
|
</button>
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
129
|
+
|
130
|
+
<button onClick={togglePlay}>
|
131
|
+
<TooltipModal
|
132
|
+
width={width}
|
133
|
+
content={<p>{isPaused ? "Play" : "pause"}</p>}
|
134
|
+
isLeft={true}
|
135
|
+
>
|
134
136
|
{isPaused ? (
|
135
137
|
<PlayIcon className="sb-w-3 sb-h-3" />
|
136
138
|
) : (
|
137
139
|
<PauseIcon className="sb-w-3 sb-h-3" />
|
138
140
|
)}
|
139
|
-
</
|
140
|
-
</
|
141
|
+
</TooltipModal>
|
142
|
+
</button>
|
141
143
|
|
142
144
|
<button
|
143
145
|
onClick={(e) => {
|
@@ -1,13 +1,13 @@
|
|
1
|
-
"use client";
|
2
|
-
import React, { useEffect } from "react";
|
3
|
-
import { durationFormater } from "../../utils";
|
4
|
-
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
5
|
-
type Props = {};
|
6
|
-
|
7
|
-
const CurrentTimeLabel = ({}: Props) => {
|
8
|
-
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
9
|
-
|
10
|
-
return <p>{durationFormater(currentTime)}</p>;
|
11
|
-
};
|
12
|
-
|
13
|
-
export default CurrentTimeLabel;
|
1
|
+
"use client";
|
2
|
+
import React, { useEffect } from "react";
|
3
|
+
import { durationFormater } from "../../utils";
|
4
|
+
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
5
|
+
type Props = {};
|
6
|
+
|
7
|
+
const CurrentTimeLabel = ({}: Props) => {
|
8
|
+
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
9
|
+
|
10
|
+
return <p>{durationFormater(currentTime)}</p>;
|
11
|
+
};
|
12
|
+
|
13
|
+
export default CurrentTimeLabel;
|
@@ -1,49 +1,49 @@
|
|
1
|
-
import React from "react";
|
2
|
-
|
3
|
-
type Props = {
|
4
|
-
name: string;
|
5
|
-
};
|
6
|
-
|
7
|
-
const Menu = ({ name }: Props) => {
|
8
|
-
return (
|
9
|
-
<div className="absolute right-0 z-10 w-48 mt-2 origin-top-right bg-white border border-gray-300 rounded-md shadow-lg focus:outline-none">
|
10
|
-
<div
|
11
|
-
className="py-1"
|
12
|
-
role="menu"
|
13
|
-
aria-orientation="vertical"
|
14
|
-
aria-labelledby={`${name}-button`}
|
15
|
-
>
|
16
|
-
<a
|
17
|
-
href="#"
|
18
|
-
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
19
|
-
role="menuitem"
|
20
|
-
>
|
21
|
-
Dashboard
|
22
|
-
</a>
|
23
|
-
<a
|
24
|
-
href="#"
|
25
|
-
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
26
|
-
role="menuitem"
|
27
|
-
>
|
28
|
-
Settings
|
29
|
-
</a>
|
30
|
-
<a
|
31
|
-
href="#"
|
32
|
-
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
33
|
-
role="menuitem"
|
34
|
-
>
|
35
|
-
Profile
|
36
|
-
</a>
|
37
|
-
<a
|
38
|
-
href="#"
|
39
|
-
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
40
|
-
role="menuitem"
|
41
|
-
>
|
42
|
-
Logout
|
43
|
-
</a>
|
44
|
-
</div>
|
45
|
-
</div>
|
46
|
-
);
|
47
|
-
};
|
48
|
-
|
49
|
-
export default Menu;
|
1
|
+
import React from "react";
|
2
|
+
|
3
|
+
type Props = {
|
4
|
+
name: string;
|
5
|
+
};
|
6
|
+
|
7
|
+
const Menu = ({ name }: Props) => {
|
8
|
+
return (
|
9
|
+
<div className="absolute right-0 z-10 w-48 mt-2 origin-top-right bg-white border border-gray-300 rounded-md shadow-lg focus:outline-none">
|
10
|
+
<div
|
11
|
+
className="py-1"
|
12
|
+
role="menu"
|
13
|
+
aria-orientation="vertical"
|
14
|
+
aria-labelledby={`${name}-button`}
|
15
|
+
>
|
16
|
+
<a
|
17
|
+
href="#"
|
18
|
+
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
19
|
+
role="menuitem"
|
20
|
+
>
|
21
|
+
Dashboard
|
22
|
+
</a>
|
23
|
+
<a
|
24
|
+
href="#"
|
25
|
+
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
26
|
+
role="menuitem"
|
27
|
+
>
|
28
|
+
Settings
|
29
|
+
</a>
|
30
|
+
<a
|
31
|
+
href="#"
|
32
|
+
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
33
|
+
role="menuitem"
|
34
|
+
>
|
35
|
+
Profile
|
36
|
+
</a>
|
37
|
+
<a
|
38
|
+
href="#"
|
39
|
+
className="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900"
|
40
|
+
role="menuitem"
|
41
|
+
>
|
42
|
+
Logout
|
43
|
+
</a>
|
44
|
+
</div>
|
45
|
+
</div>
|
46
|
+
);
|
47
|
+
};
|
48
|
+
|
49
|
+
export default Menu;
|
@@ -1,46 +1,46 @@
|
|
1
|
-
import React, { useEffect, useState } from "react";
|
2
|
-
import Tooltip from "../Tooltip";
|
3
|
-
import { durationFormater } from "../../utils";
|
4
|
-
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
5
|
-
import { SoftBuildersVideoPlayerNote } from "../../types";
|
6
|
-
type Note = SoftBuildersVideoPlayerNote & { percentage: number };
|
7
|
-
|
8
|
-
type Props = {
|
9
|
-
note: Note;
|
10
|
-
};
|
11
|
-
|
12
|
-
const NoteTooltip = ({ note }: Props) => {
|
13
|
-
const [open, setOpen] = useState(false);
|
14
|
-
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
15
|
-
|
16
|
-
useEffect(() => {
|
17
|
-
if (currentTime === Math.floor(note.time)) {
|
18
|
-
setOpen(true);
|
19
|
-
|
20
|
-
setTimeout(() => {
|
21
|
-
setOpen(false);
|
22
|
-
}, 5000);
|
23
|
-
}
|
24
|
-
}, [currentTime, note.time]);
|
25
|
-
return (
|
26
|
-
<div
|
27
|
-
className="sb-w-1 sb-h-1 sb-rounded-full sb-bg-white sb-absolute sb-z-30"
|
28
|
-
style={{ left: `${note.percentage}%` }}
|
29
|
-
onMouseEnter={() => setOpen(true)}
|
30
|
-
onMouseLeave={() => setOpen(false)}
|
31
|
-
>
|
32
|
-
<div className="sb-relative">
|
33
|
-
<Tooltip open={open}>
|
34
|
-
<div className="sb-flex sb-flex-col sb-gap-2 sb-items-center">
|
35
|
-
<p>{note.label}</p>
|
36
|
-
<p className="sb-p-2 sb-bg-[#303030] sb-bg-opacity-50 sb-rounded-md">
|
37
|
-
{durationFormater(note.time)}
|
38
|
-
</p>
|
39
|
-
</div>
|
40
|
-
</Tooltip>
|
41
|
-
</div>
|
42
|
-
</div>
|
43
|
-
);
|
44
|
-
};
|
45
|
-
|
46
|
-
export default NoteTooltip;
|
1
|
+
import React, { useEffect, useState } from "react";
|
2
|
+
import Tooltip from "../Tooltip";
|
3
|
+
import { durationFormater } from "../../utils";
|
4
|
+
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
5
|
+
import { SoftBuildersVideoPlayerNote } from "../../types";
|
6
|
+
type Note = SoftBuildersVideoPlayerNote & { percentage: number };
|
7
|
+
|
8
|
+
type Props = {
|
9
|
+
note: Note;
|
10
|
+
};
|
11
|
+
|
12
|
+
const NoteTooltip = ({ note }: Props) => {
|
13
|
+
const [open, setOpen] = useState(false);
|
14
|
+
const { currentTime } = useSoftBuildersVideoPlayerContext();
|
15
|
+
|
16
|
+
useEffect(() => {
|
17
|
+
if (currentTime === Math.floor(note.time)) {
|
18
|
+
setOpen(true);
|
19
|
+
|
20
|
+
setTimeout(() => {
|
21
|
+
setOpen(false);
|
22
|
+
}, 5000);
|
23
|
+
}
|
24
|
+
}, [currentTime, note.time]);
|
25
|
+
return (
|
26
|
+
<div
|
27
|
+
className="sb-w-1 sb-h-1 sb-rounded-full sb-bg-white sb-absolute sb-z-30"
|
28
|
+
style={{ left: `${note.percentage}%` }}
|
29
|
+
onMouseEnter={() => setOpen(true)}
|
30
|
+
onMouseLeave={() => setOpen(false)}
|
31
|
+
>
|
32
|
+
<div className="sb-relative">
|
33
|
+
<Tooltip open={open}>
|
34
|
+
<div className="sb-flex sb-flex-col sb-gap-2 sb-items-center">
|
35
|
+
<p>{note.label}</p>
|
36
|
+
<p className="sb-p-2 sb-bg-[#303030] sb-bg-opacity-50 sb-rounded-md">
|
37
|
+
{durationFormater(note.time)}
|
38
|
+
</p>
|
39
|
+
</div>
|
40
|
+
</Tooltip>
|
41
|
+
</div>
|
42
|
+
</div>
|
43
|
+
);
|
44
|
+
};
|
45
|
+
|
46
|
+
export default NoteTooltip;
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
2
|
import { useEffect, useState } from "react";
|
3
3
|
import MenuButton from "../MenuButton";
|
4
4
|
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
@@ -34,16 +34,16 @@ const QualityMenu = ({ width, onClick }) => {
|
|
34
34
|
closeMenuFunction();
|
35
35
|
}
|
36
36
|
}, className: "hover:sb-scale-150", children: _jsx(LeftArrowIcon, { className: "sb-w-3 sb-h-3" }) }), _jsx("h3", { children: "Quality" })] }), _jsx("div", { className: "sb-w-full sb-h-[.1px] sb-bg-[#AAAAAA] sb-bg-opacity-70" }), _jsx("div", { className: "sb-px-5 sb-flex sb-flex-col sb-gap-3 sb-items-start ", children: qualities === null || qualities === void 0 ? void 0 : qualities.map((q, i) => {
|
37
|
-
return (_jsx(
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
37
|
+
return (_jsx(QualityOption, { width: width, isSelected: currentQualitySrc === q.label, quality: q, onClick: () => {
|
38
|
+
const source = qualities.find((_q) => q.label == _q.label);
|
39
|
+
if (source && source.src != currentQualitySrc) {
|
40
|
+
player === null || player === void 0 ? void 0 : player.src(source.src);
|
41
|
+
const currentTime = player === null || player === void 0 ? void 0 : player.currentTime();
|
42
|
+
setCurrentQualitySrc(source.label);
|
43
|
+
player === null || player === void 0 ? void 0 : player.currentTime(currentTime);
|
44
|
+
player === null || player === void 0 ? void 0 : player.play();
|
45
|
+
}
|
46
|
+
} }, `quality-${q.label}-${i}`));
|
47
47
|
}) })] }) }), close: (fn) => {
|
48
48
|
setCloseMenuFunction(() => fn);
|
49
49
|
} }));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QualityMenu/index.tsx"],"names":[],"mappings":"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
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QualityMenu/index.tsx"],"names":[],"mappings":"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"}
|
@@ -122,26 +122,24 @@ const QualityMenu = ({ width, onClick }: QualityMenuProps) => {
|
|
122
122
|
<div className="sb-px-5 sb-flex sb-flex-col sb-gap-3 sb-items-start ">
|
123
123
|
{qualities?.map((q, i) => {
|
124
124
|
return (
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
/>
|
144
|
-
</>
|
125
|
+
<QualityOption
|
126
|
+
width={width}
|
127
|
+
key={`quality-${q.label}-${i}`}
|
128
|
+
isSelected={currentQualitySrc === q.label}
|
129
|
+
quality={q}
|
130
|
+
onClick={() => {
|
131
|
+
const source = qualities.find(
|
132
|
+
(_q) => q.label == _q.label
|
133
|
+
);
|
134
|
+
if (source && source.src != currentQualitySrc) {
|
135
|
+
player?.src(source.src);
|
136
|
+
const currentTime = player?.currentTime();
|
137
|
+
setCurrentQualitySrc(source.label);
|
138
|
+
player?.currentTime(currentTime);
|
139
|
+
player?.play();
|
140
|
+
}
|
141
|
+
}}
|
142
|
+
/>
|
145
143
|
);
|
146
144
|
})}
|
147
145
|
</div>
|