softbuilders-react-video-player 1.2.20 → 1.2.22
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/QualityMenu/index.js +9 -5
- package/dist/components/QualityMenu/index.js.map +1 -1
- package/dist/components/QualityMenu/index.tsx +10 -6
- package/dist/components/VideoPlayerComponent/style/style.css +6 -0
- package/dist/index.css +6 -0
- package/dist/index.mjs +6 -5
- package/package.json +1 -1
|
@@ -4,7 +4,10 @@ import MenuButton from "../MenuButton";
|
|
|
4
4
|
import { useSoftBuildersVideoPlayerContext } from "../VideoPlayerComponent/provider";
|
|
5
5
|
import { CheckedIcon, LeftArrowIcon, SettingsIcon } from "../../images";
|
|
6
6
|
const QualityOption = ({ isSelected, quality, onClick, width, isTrailer, }) => {
|
|
7
|
-
return (_jsx("button", { className: `hover:sb-text-orange-500 ${width > 400 && !isTrailer ? "sb-p-2" : "sp-pb-1"}`, onClick:
|
|
7
|
+
return (_jsx("button", { className: `hover:sb-text-orange-500 ${width > 400 && !isTrailer ? "sb-p-2" : "sp-pb-1"}`, onClick: (e) => {
|
|
8
|
+
e.stopPropagation();
|
|
9
|
+
onClick(e);
|
|
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: `${width > 400 && !isTrailer ? "sb-w-5 sb-h-5" : "sb-w-3 sb-h-3"}` })) : (_jsx("div", {})) }), _jsx("p", { className: "sb-text-left sb-col-span-9", children: quality === null || quality === void 0 ? void 0 : quality.label })] }) }));
|
|
8
11
|
};
|
|
9
12
|
const QualityMenu = ({ width, onClick, isTrailer }) => {
|
|
10
13
|
const { player } = useSoftBuildersVideoPlayerContext();
|
|
@@ -36,15 +39,16 @@ const QualityMenu = ({ width, onClick, isTrailer }) => {
|
|
|
36
39
|
closeMenuFunction();
|
|
37
40
|
}
|
|
38
41
|
}, 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) => {
|
|
39
|
-
return (_jsx(QualityOption, { width: width, isTrailer: isTrailer, isSelected: currentQualitySrc === (q === null || q === void 0 ? void 0 : q.label), quality: q, onClick: () => {
|
|
42
|
+
return (_jsx(QualityOption, { width: width, isTrailer: isTrailer, isSelected: currentQualitySrc === (q === null || q === void 0 ? void 0 : q.label), quality: q, onClick: (e) => {
|
|
40
43
|
const source = qualities.find((_q) => (q === null || q === void 0 ? void 0 : q.label) == (_q === null || _q === void 0 ? void 0 : _q.label));
|
|
41
44
|
if (source && source.src != currentQualitySrc) {
|
|
42
|
-
|
|
45
|
+
// player?.src(source.src);
|
|
43
46
|
const currentTime = player === null || player === void 0 ? void 0 : player.currentTime();
|
|
44
47
|
setCurrentQualitySrc(source === null || source === void 0 ? void 0 : source.label);
|
|
45
|
-
|
|
46
|
-
|
|
48
|
+
// player?.currentTime(currentTime);
|
|
49
|
+
// player?.play();
|
|
47
50
|
}
|
|
51
|
+
closeMenuFunction && closeMenuFunction();
|
|
48
52
|
} }, `quality-${q === null || q === void 0 ? void 0 : q.label}-${i}`));
|
|
49
53
|
}) })] }) }), close: (fn) => {
|
|
50
54
|
setCloseMenuFunction(() => fn);
|
|
@@ -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,EACL,SAAS,GACU,EAAE,EAAE;IACvB,OAAO,CACL,iBACE,SAAS,EAAE,4BACT,KAAK,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SACzC,EAAE,EACF,OAAO,EAAE,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/QualityMenu/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -8,7 +8,7 @@ import { CheckedIcon, LeftArrowIcon, SettingsIcon } from "../../images";
|
|
|
8
8
|
type QualityOptionProps = {
|
|
9
9
|
isSelected: boolean;
|
|
10
10
|
quality: SoftBuildersVideoPlayerSource;
|
|
11
|
-
onClick: () => void;
|
|
11
|
+
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
12
12
|
width: number;
|
|
13
13
|
isTrailer?: boolean;
|
|
14
14
|
};
|
|
@@ -24,7 +24,10 @@ const QualityOption = ({
|
|
|
24
24
|
className={`hover:sb-text-orange-500 ${
|
|
25
25
|
width > 400 && !isTrailer ? "sb-p-2" : "sp-pb-1"
|
|
26
26
|
}`}
|
|
27
|
-
onClick={
|
|
27
|
+
onClick={(e: React.MouseEvent<HTMLButtonElement>) => {
|
|
28
|
+
e.stopPropagation();
|
|
29
|
+
onClick(e);
|
|
30
|
+
}}
|
|
28
31
|
>
|
|
29
32
|
<div className="sb-grid sb-grid-cols-12 sb-items-center sb-gap-2">
|
|
30
33
|
<div className="sb-col-span-3">
|
|
@@ -136,17 +139,18 @@ const QualityMenu = ({ width, onClick, isTrailer }: QualityMenuProps) => {
|
|
|
136
139
|
key={`quality-${q?.label}-${i}`}
|
|
137
140
|
isSelected={currentQualitySrc === q?.label}
|
|
138
141
|
quality={q}
|
|
139
|
-
onClick={() => {
|
|
142
|
+
onClick={(e: React.MouseEvent<HTMLButtonElement>) => {
|
|
140
143
|
const source = qualities.find(
|
|
141
144
|
(_q) => q?.label == _q?.label
|
|
142
145
|
);
|
|
143
146
|
if (source && source.src != currentQualitySrc) {
|
|
144
|
-
player?.src(source.src);
|
|
147
|
+
// player?.src(source.src);
|
|
145
148
|
const currentTime = player?.currentTime();
|
|
146
149
|
setCurrentQualitySrc(source?.label);
|
|
147
|
-
player?.currentTime(currentTime);
|
|
148
|
-
player?.play();
|
|
150
|
+
// player?.currentTime(currentTime);
|
|
151
|
+
// player?.play();
|
|
149
152
|
}
|
|
153
|
+
closeMenuFunction && closeMenuFunction();
|
|
150
154
|
}}
|
|
151
155
|
/>
|
|
152
156
|
);
|
|
@@ -14,9 +14,15 @@
|
|
|
14
14
|
.vjs-big-play-button {
|
|
15
15
|
display: none;
|
|
16
16
|
}
|
|
17
|
+
.vjs-modal-dialog-content {
|
|
18
|
+
display: none;
|
|
19
|
+
}
|
|
17
20
|
.vjs-loading-spinner {
|
|
18
21
|
display: none;
|
|
19
22
|
}
|
|
23
|
+
.vjs-error-display {
|
|
24
|
+
display: none;
|
|
25
|
+
}
|
|
20
26
|
.vjs-loading-spinner::after {
|
|
21
27
|
display: none;
|
|
22
28
|
}
|
package/dist/index.css
CHANGED
|
@@ -51,9 +51,15 @@ input[type=range]::-moz-range-thumb {
|
|
|
51
51
|
.vjs-big-play-button {
|
|
52
52
|
display: none;
|
|
53
53
|
}
|
|
54
|
+
.vjs-modal-dialog-content {
|
|
55
|
+
display: none;
|
|
56
|
+
}
|
|
54
57
|
.vjs-loading-spinner {
|
|
55
58
|
display: none;
|
|
56
59
|
}
|
|
60
|
+
.vjs-error-display {
|
|
61
|
+
display: none;
|
|
62
|
+
}
|
|
57
63
|
.vjs-loading-spinner::after {
|
|
58
64
|
display: none;
|
|
59
65
|
}
|
package/dist/index.mjs
CHANGED
|
@@ -871,7 +871,10 @@ var QualityOption = ({
|
|
|
871
871
|
"button",
|
|
872
872
|
{
|
|
873
873
|
className: `hover:sb-text-orange-500 ${width > 400 && !isTrailer ? "sb-p-2" : "sp-pb-1"}`,
|
|
874
|
-
onClick
|
|
874
|
+
onClick: (e) => {
|
|
875
|
+
e.stopPropagation();
|
|
876
|
+
onClick(e);
|
|
877
|
+
},
|
|
875
878
|
children: /* @__PURE__ */ jsxs9("div", { className: "sb-grid sb-grid-cols-12 sb-items-center sb-gap-2", children: [
|
|
876
879
|
/* @__PURE__ */ jsx26("div", { className: "sb-col-span-3", children: isSelected ? /* @__PURE__ */ jsx26(
|
|
877
880
|
CheckedIcon_default,
|
|
@@ -951,17 +954,15 @@ var QualityMenu = ({ width, onClick, isTrailer }) => {
|
|
|
951
954
|
isTrailer,
|
|
952
955
|
isSelected: currentQualitySrc === (q == null ? void 0 : q.label),
|
|
953
956
|
quality: q,
|
|
954
|
-
onClick: () => {
|
|
957
|
+
onClick: (e) => {
|
|
955
958
|
const source = qualities.find(
|
|
956
959
|
(_q) => (q == null ? void 0 : q.label) == (_q == null ? void 0 : _q.label)
|
|
957
960
|
);
|
|
958
961
|
if (source && source.src != currentQualitySrc) {
|
|
959
|
-
player == null ? void 0 : player.src(source.src);
|
|
960
962
|
const currentTime = player == null ? void 0 : player.currentTime();
|
|
961
963
|
setCurrentQualitySrc(source == null ? void 0 : source.label);
|
|
962
|
-
player == null ? void 0 : player.currentTime(currentTime);
|
|
963
|
-
player == null ? void 0 : player.play();
|
|
964
964
|
}
|
|
965
|
+
closeMenuFunction && closeMenuFunction();
|
|
965
966
|
}
|
|
966
967
|
},
|
|
967
968
|
`quality-${q == null ? void 0 : q.label}-${i}`
|