legop3/MultiRoombaRover
1
0
Fork 0
mirror of https://github.com/legop3/MultiRoombaRover.git synced 2026-09-15 17:12:59 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

fullscreen popup

Browse Source
This commit is contained in:
legop3
2026-05-17 21:42:39 -04:00
parent 27f31531ac
commit f6f985d740
3 changed files with 63 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/public/assets/index-D-6ytlM1.js → server/public/assets/index-DBkeJzWB.js
+8 -8
View File
File diff suppressed because one or more lines are too long
server/public/index.html
+1 -1
View File
@@ -11,7 +11,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="Roomba Rover" /> <meta name="apple-mobile-web-app-title" content="Roomba Rover" />
<title>Roomba Rover</title> <title>Roomba Rover</title>
<script type="module" crossorigin src="/assets/index-D-6ytlM1.js"></script> <script type="module" crossorigin src="/assets/index-DBkeJzWB.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-CkqCBh_q.css"> <link rel="stylesheet" crossorigin href="/assets/index-CkqCBh_q.css">
</head> </head>
<body> <body>
webui/src/components/HudOverlays/ManualDockAssistOverlay/index.jsx
+54 -9
View File
@@ -1,8 +1,41 @@
import React from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { useManualDockAssist } from '../../../features/manualDockAssist/useManualDockAssist.js'; import { useManualDockAssist } from '../../../features/manualDockAssist/useManualDockAssist.js';
function ManualDockAssistOverlay({ mobileHud = false }) { function ManualDockAssistOverlay({ mobileHud = false }) {
const { visible, statusLabel, statusTone } = useManualDockAssist({ manageLifecycle: true }); const { visible, statusLabel, statusTone, active, charging } = useManualDockAssist({ manageLifecycle: true });
const [popupMessage, setPopupMessage] = useState('');
const timerRef = useRef(null);
const prevActiveRef = useRef(active);
useEffect(() => {
const prevActive = prevActiveRef.current;
const enabledNow = active && !prevActive;
const autoDisabledOnCharge = !active && prevActive && charging;
if (enabledNow) {
setPopupMessage('Dock assist mode enabled');
} else if (autoDisabledOnCharge) {
setPopupMessage('Docking successful! Thank you!');
}
prevActiveRef.current = active;
}, [active, charging]);
useEffect(() => {
if (!popupMessage) return undefined;
if (timerRef.current) {
clearTimeout(timerRef.current);
}
timerRef.current = setTimeout(() => {
setPopupMessage('');
timerRef.current = null;
}, 2500);
return () => {
if (timerRef.current) {
clearTimeout(timerRef.current);
timerRef.current = null;
}
};
}, [popupMessage]);
if (!visible) return null; if (!visible) return null;
const toneClass = const toneClass =
statusTone === 'good' statusTone === 'good'
@@ -13,13 +46,25 @@ function ManualDockAssistOverlay({ mobileHud = false }) {
return ( return (
<div className="pointer-events-none absolute inset-0"> <div className="pointer-events-none absolute inset-0">
<div {popupMessage ? (
className={`absolute right-2 top-1/2 -translate-y-1/2 rounded-lg border px-2 py-1 font-semibold shadow-lg ${toneClass} ${ <div className="absolute inset-0 flex items-center justify-center">
mobileHud ? 'text-[0.65rem]' : 'text-xs' <div
}`} className={`rounded-xl border border-indigo-200/70 bg-indigo-900/88 px-4 py-2 text-center font-semibold text-indigo-50 shadow-2xl ${
> mobileHud ? 'text-lg' : 'text-2xl'
{statusLabel} }`}
</div> >
{popupMessage}
</div>
</div>
) : (
<div
className={`absolute right-2 top-1/2 -translate-y-1/2 rounded-lg border px-2 py-1 font-semibold shadow-lg ${toneClass} ${
mobileHud ? 'text-[0.65rem]' : 'text-xs'
}`}
>
{statusLabel}
</div>
)}
</div> </div>
); );
} }