mirror of
https://github.com/Qortal/qapp-core.git
synced 2025-07-15 13:21:20 +00:00
fix time hover
This commit is contained in:
parent
9e6c1b2bb5
commit
3796ed7180
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "qapp-core",
|
"name": "qapp-core",
|
||||||
"version": "1.0.39",
|
"version": "1.0.41",
|
||||||
"description": "Qortal's core React library with global state, UI components, and utilities",
|
"description": "Qortal's core React library with global state, UI components, and utilities",
|
||||||
"main": "dist/index.js",
|
"main": "dist/index.js",
|
||||||
"module": "dist/index.mjs",
|
"module": "dist/index.mjs",
|
||||||
|
@ -124,12 +124,17 @@ export const ProgressSlider = ({
|
|||||||
const x = e.clientX - rect.left;
|
const x = e.clientX - rect.left;
|
||||||
const percent = x / rect.width;
|
const percent = x / rect.width;
|
||||||
const time = Math.min(Math.max(0, percent * duration), duration);
|
const time = Math.min(Math.max(0, percent * duration), duration);
|
||||||
setHoverX(e.clientX);
|
|
||||||
|
|
||||||
|
// Position anchor element at the correct spot
|
||||||
|
if (hoverAnchorRef.current) {
|
||||||
|
hoverAnchorRef.current.style.left = `${x}px`;
|
||||||
|
}
|
||||||
|
|
||||||
|
setHoverX(e.clientX); // optional – can be removed unless used elsewhere
|
||||||
setShowDuration(time);
|
setShowDuration(time);
|
||||||
|
|
||||||
if (debounceTimeoutRef.current) clearTimeout(debounceTimeoutRef.current);
|
if (debounceTimeoutRef.current) clearTimeout(debounceTimeoutRef.current);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleMouseLeave = () => {
|
const handleMouseLeave = () => {
|
||||||
lastRequestedTimeRef.current = null;
|
lastRequestedTimeRef.current = null;
|
||||||
setThumbnailUrl(null);
|
setThumbnailUrl(null);
|
||||||
@ -171,11 +176,11 @@ export const ProgressSlider = ({
|
|||||||
ref={hoverAnchorRef}
|
ref={hoverAnchorRef}
|
||||||
sx={{
|
sx={{
|
||||||
position: "absolute",
|
position: "absolute",
|
||||||
left: hoverX ?? -9999,
|
|
||||||
top: 0,
|
top: 0,
|
||||||
width: "1px",
|
width: "1px",
|
||||||
height: "1px",
|
height: "1px",
|
||||||
pointerEvents: "none",
|
pointerEvents: "none",
|
||||||
|
transform: "translateX(-50%)", // center popper on the anchor
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Slider
|
<Slider
|
||||||
@ -223,7 +228,7 @@ export const ProgressSlider = ({
|
|||||||
anchorEl={hoverAnchorRef.current}
|
anchorEl={hoverAnchorRef.current}
|
||||||
placement="top"
|
placement="top"
|
||||||
disablePortal
|
disablePortal
|
||||||
modifiers={[{ name: "offset", options: { offset: [-10, 0] } }]}
|
modifiers={[{ name: "offset", options: { offset: [10, 0] } }]}
|
||||||
>
|
>
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
|
@ -319,7 +319,7 @@ export const VideoPlayer = ({
|
|||||||
useVideoPlayerHotKeys(hotkeyHandlers);
|
useVideoPlayerHotKeys(hotkeyHandlers);
|
||||||
|
|
||||||
const updateProgress = useCallback(() => {
|
const updateProgress = useCallback(() => {
|
||||||
if(!isPlaying) return
|
if(!isPlaying || !isPlayerInitialized) return
|
||||||
const player = playerRef?.current;
|
const player = playerRef?.current;
|
||||||
if (!player || typeof player?.currentTime !== "function") return;
|
if (!player || typeof player?.currentTime !== "function") return;
|
||||||
|
|
||||||
@ -328,7 +328,7 @@ export const VideoPlayer = ({
|
|||||||
setProgress(videoLocation, currentTime);
|
setProgress(videoLocation, currentTime);
|
||||||
setLocalProgress(currentTime);
|
setLocalProgress(currentTime);
|
||||||
}
|
}
|
||||||
}, [videoLocation, isPlaying]);
|
}, [videoLocation, isPlaying, isPlayerInitialized]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (videoLocation) {
|
if (videoLocation) {
|
||||||
@ -616,8 +616,11 @@ export const VideoPlayer = ({
|
|||||||
playerRef.current?.poster("");
|
playerRef.current?.poster("");
|
||||||
playerRef.current?.playbackRate(playbackRate);
|
playerRef.current?.playbackRate(playbackRate);
|
||||||
playerRef.current?.volume(volume);
|
playerRef.current?.volume(volume);
|
||||||
if (videoLocationRef.current) {
|
const key = `${resource.service}-${resource.name}-${resource.identifier}`
|
||||||
const savedProgress = getProgress(videoLocationRef.current);
|
console.log('key', key)
|
||||||
|
if (key) {
|
||||||
|
const savedProgress = getProgress(key);
|
||||||
|
console.log('savedProgress', savedProgress)
|
||||||
if (typeof savedProgress === "number") {
|
if (typeof savedProgress === "number") {
|
||||||
playerRef.current?.currentTime(savedProgress);
|
playerRef.current?.currentTime(savedProgress);
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user