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 2 Packages Projects Releases Wiki Activity

moving things around

Browse Source
This commit is contained in:
legop3
2026-01-20 01:18:13 -05:00
parent bdcb488988
commit 87dd9a24a0
10 changed files with 197 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
server/public/assets/index-BcGpq6_c.js
-119
View File
File diff suppressed because one or more lines are too long
server/public/assets/index-BjSf29Wv.css
+1
View File
File diff suppressed because one or more lines are too long
server/public/assets/index-BxYZsNCL.js
+119
View File
File diff suppressed because one or more lines are too long
server/public/assets/index-CxMMWICN.css
-1
View File
File diff suppressed because one or more lines are too long
server/public/index.html
+2 -2
View File
@@ -11,8 +11,8 @@
<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="Multi Roomba Rover" /> <meta name="apple-mobile-web-app-title" content="Multi Roomba Rover" />
<title>Multi Roomba Rover</title> <title>Multi Roomba Rover</title>
<script type="module" crossorigin src="/assets/index-BcGpq6_c.js"></script> <script type="module" crossorigin src="/assets/index-BxYZsNCL.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-CxMMWICN.css"> <link rel="stylesheet" crossorigin href="/assets/index-BjSf29Wv.css">
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
webui/src/components/HomeAssistantControls.jsx
+3 -3
View File
@@ -83,11 +83,11 @@ export default function HomeAssistantControls() {
return ( return (
<section className="panel-section space-y-0.5 text-base"> <section className="panel-section space-y-0.5 text-base">
<header className="flex flex-wrap items-start justify-between gap-0.5 text-sm text-slate-400"> <header className="flex items-center justify-between gap-0.5 text-sm text-slate-400">
<div className="flex flex-wrap items-center gap-1"> <div className="flex items-center gap-1">
<p>Light Controls</p> <p>Light Controls</p>
<span className="text-xs text-slate-500">{entities.length}</span> <span className="text-xs text-slate-500">{entities.length}</span>
<div className="flex w-full flex-wrap items-center gap-1 text-xs text-slate-300"> <div className="flex items-center gap-1 text-xs text-slate-300 background-black">
<span className="flex items-center gap-0.5"> <span className="flex items-center gap-0.5">
<span>On</span> <span>On</span>
{onKeyLabel ? <KeyPill label={onKeyLabel} /> : null} {onKeyLabel ? <KeyPill label={onKeyLabel} /> : null}
webui/src/components/RightPaneTabs.jsx
+6 -3
View File
@@ -4,7 +4,7 @@ import HomeAssistantControls from './HomeAssistantControls.jsx';
import SettingsPanel from './SettingsPanel.jsx'; import SettingsPanel from './SettingsPanel.jsx';
import HelpPanel from './HelpPanel.jsx'; import HelpPanel from './HelpPanel.jsx';
import ChatPanel from './ChatPanel.jsx'; import ChatPanel from './ChatPanel.jsx';
import UserListPanel, { NicknameLinksPanel } from './UserListPanel.jsx'; import UserListPanel, { LinkButtonsPanel, NicknameEntryPanel } from './UserListPanel.jsx';
import ReplaySourcesPanel from './ReplaySourcesPanel.jsx'; import ReplaySourcesPanel from './ReplaySourcesPanel.jsx';
import Tabs, { Tab, TabList, TabPanel, TabPanels } from './Tabs.jsx'; import Tabs, { Tab, TabList, TabPanel, TabPanels } from './Tabs.jsx';
import TopDownMap from './TopDownMap.jsx'; import TopDownMap from './TopDownMap.jsx';
@@ -59,15 +59,18 @@ export default function RightPaneTabs({ layout, onOpenHelpOverlay }) {
<TopDownMapPanel /> <TopDownMapPanel />
<DriveDockPanel /> <DriveDockPanel />
</div> </div>
<div className="grid gap-0.5 grid-cols-[minmax(0,0.6fr)_minmax(0,1.1fr)_minmax(0,0.9fr)]"> <div className="grid gap-0.5 grid-cols-[minmax(0,1fr)_minmax(0,0.9fr)_minmax(0,0.75fr)]">
<NicknameLinksPanel compact />
<RoverRosterPanel /> <RoverRosterPanel />
<ReplaySourcesPanel panelId="replay-sources-desktop" fillHeight /> <ReplaySourcesPanel panelId="replay-sources-desktop" fillHeight />
<LinkButtonsPanel />
</div> </div>
<div className="grid items-stretch gap-0.5 grid-cols-[minmax(0,1.3fr)_minmax(0,0.7fr)] h-[14rem]"> <div className="grid items-stretch gap-0.5 grid-cols-[minmax(0,1.3fr)_minmax(0,0.7fr)] h-[14rem]">
<ChatPanel fillHeight /> <ChatPanel fillHeight />
<div className="grid min-h-0 gap-0.5 grid-rows-[auto_minmax(0,1fr)]">
<NicknameEntryPanel compact />
<UserListPanel compact hideNicknameForm fillHeight /> <UserListPanel compact hideNicknameForm fillHeight />
</div> </div>
</div>
<HomeAssistantControls /> <HomeAssistantControls />
<RoomCameraPanel defaultOrientation="horizontal" panelId="rightpane-telemetry" /> <RoomCameraPanel defaultOrientation="horizontal" panelId="rightpane-telemetry" />
</div> </div>
webui/src/components/UserListPanel.jsx
+59 -13
View File
@@ -6,12 +6,19 @@ import NicknameForm from './NicknameForm.jsx';
import DiscordInviteButton from './DiscordInviteButton.jsx'; import DiscordInviteButton from './DiscordInviteButton.jsx';
import KoFiButton from './KoFiButton.jsx'; import KoFiButton from './KoFiButton.jsx';
export function NicknameLinksPanel({ compact = false }) { export function NicknameEntryPanel({ compact = false }) {
return ( return (
<section className="panel-section flex h-full min-h-0 flex-col gap-0.5 text-base"> <section className="panel-section flex h-full min-h-0 flex-col gap-0.5 text-base">
<div className="surface flex w-full items-center"> <div className="surface flex w-full items-center">
<NicknameForm compact={compact} /> <NicknameForm compact={compact} />
</div> </div>
</section>
);
}
export function LinkButtonsPanel() {
return (
<section className="panel-section flex h-full min-h-0 flex-col gap-0.5 text-base">
<div className="grid flex-1 min-h-0 gap-0.5 grid-rows-2"> <div className="grid flex-1 min-h-0 gap-0.5 grid-rows-2">
<DiscordInviteButton className="h-full" /> <DiscordInviteButton className="h-full" />
<KoFiButton className="h-full" /> <KoFiButton className="h-full" />
@@ -48,6 +55,7 @@ export default function UserListPanel({
className = '', className = '',
fillHeight = false, fillHeight = false,
compact = false, compact = false,
showBothTurnsAndUsers = false,
}) { }) {
const { session, setNickname } = useSession(); const { session, setNickname } = useSession();
const { value } = useSettingsNamespace('profile', { nickname: '' }); const { value } = useSettingsNamespace('profile', { nickname: '' });
@@ -59,6 +67,12 @@ export default function UserListPanel({
const isTurnsMode = session?.mode === 'turns'; const isTurnsMode = session?.mode === 'turns';
const turnQueues = session?.turnQueues || {}; const turnQueues = session?.turnQueues || {};
const roster = session?.roster || []; const roster = session?.roster || [];
const [turnView, setTurnView] = useState('queues');
useEffect(() => {
if (!isTurnsMode) return;
setTurnView('queues');
}, [isTurnsMode]);
useEffect(() => { useEffect(() => {
if (!canSetNickname) return; if (!canSetNickname) return;
@@ -126,6 +140,10 @@ export default function UserListPanel({
: baseListClass; : baseListClass;
const usersListClass = const usersListClass =
isTurnsMode && fillHeight ? 'flex-1 min-h-0 overflow-y-auto' : baseListClass; isTurnsMode && fillHeight ? 'flex-1 min-h-0 overflow-y-auto' : baseListClass;
const showToggle = isTurnsMode && !showBothTurnsAndUsers;
const showQueuesSection = isTurnsMode && (showBothTurnsAndUsers || turnView === 'queues');
const showUsersSection = !isTurnsMode || (showToggle && turnView === 'users');
const showUsersSecondary = isTurnsMode && showBothTurnsAndUsers;
const renderUserList = () => const renderUserList = () =>
sorted.length === 0 ? ( sorted.length === 0 ? (
@@ -179,15 +197,41 @@ export default function UserListPanel({
<div className={`space-y-0.5 ${fillHeight ? 'flex flex-1 min-h-0 flex-col' : ''}`}> <div className={`space-y-0.5 ${fillHeight ? 'flex flex-1 min-h-0 flex-col' : ''}`}>
{!hideHeader && ( {!hideHeader && (
<div className={`flex items-center justify-between text-sm text-slate-400 ${compact ? 'text-xs' : ''}`}> <div className={`flex items-center justify-between text-sm text-slate-400 ${compact ? 'text-xs' : ''}`}>
<span>{isTurnsMode ? 'Turn queues' : 'Users'}</span> <div className="flex items-center gap-0.5">
<span>
{isTurnsMode
? showQueuesSection
? 'Turn queues'
: 'Users'
: 'Users'}
</span>
<span className="text-xs text-slate-500"> <span className="text-xs text-slate-500">
{isTurnsMode ? Object.keys(turnQueues || {}).length : sorted.length} {showQueuesSection && isTurnsMode ? Object.keys(turnQueues || {}).length : sorted.length}
</span> </span>
</div> </div>
{showToggle ? (
<div className="inline-flex overflow-hidden rounded border border-slate-700 text-[0.7rem]">
<button
type="button"
className={`px-1 py-0.5 ${turnView === 'queues' ? 'bg-slate-600 text-white' : 'bg-transparent text-slate-400 hover:text-white'}`}
onClick={() => setTurnView('queues')}
>
Queues
</button>
<button
type="button"
className={`px-1 py-0.5 ${turnView === 'users' ? 'bg-slate-600 text-white' : 'bg-transparent text-slate-400 hover:text-white'}`}
onClick={() => setTurnView('users')}
>
Users
</button>
</div>
) : null}
</div>
)} )}
<div className={`surface space-y-0.25 ${isTurnsMode ? turnsListClass : baseListClass} ${compact ? 'text-[0.8rem]' : ''}`}> {showQueuesSection ? (
{isTurnsMode ? ( <div className={`surface space-y-0.25 ${turnsListClass} ${compact ? 'text-[0.8rem]' : ''}`}>
Object.keys(turnQueues || {}).length === 0 ? ( {Object.keys(turnQueues || {}).length === 0 ? (
<p className="text-sm text-slate-500">No turn queues yet.</p> <p className="text-sm text-slate-500">No turn queues yet.</p>
) : ( ) : (
Object.entries(turnQueues).map(([roverId, info]) => { Object.entries(turnQueues).map(([roverId, info]) => {
@@ -248,21 +292,23 @@ export default function UserListPanel({
</div> </div>
); );
}) })
)
) : (
renderUserList()
)} )}
</div> </div>
) : null}
{isTurnsMode ? ( {showUsersSection ? (
<div className={`surface space-y-0.25 ${usersListClass} ${compact ? 'text-[0.8rem]' : ''}`}>
{renderUserList()}
</div>
) : null}
{showUsersSecondary ? (
<div className={`space-y-0.25 ${fillHeight ? 'flex min-h-0 flex-1 flex-col' : ''}`}> <div className={`space-y-0.25 ${fillHeight ? 'flex min-h-0 flex-1 flex-col' : ''}`}>
<div className="flex items-center justify-between text-xs text-slate-400"> <div className="flex items-center justify-between text-xs text-slate-400">
<span>Users</span> <span>Users</span>
<span className="text-[0.7rem] text-slate-500">{sorted.length}</span> <span className="text-[0.7rem] text-slate-500">{sorted.length}</span>
</div> </div>
<div className={`surface space-y-0.25 ${usersListClass}`}> <div className={`surface space-y-0.25 ${usersListClass}`}>{renderUserList()}</div>
{renderUserList()}
</div>
</div> </div>
) : null} ) : null}
</div> </div>
webui/src/components/VideoTile.jsx
+1 -1
View File
@@ -434,7 +434,7 @@ export default function VideoTile({
> >
<div className="text-center">{qualityNotice}</div> <div className="text-center">{qualityNotice}</div>
<div className="pointer-events-auto mt-1"> <div className="pointer-events-auto mt-1">
<DiscordInviteButton text={'Join Discord server while you wait!'} /> <DiscordInviteButton text={'Join our Discord server while you wait!'} />
</div> </div>
</div> </div>
</div> </div>
webui/src/spectate/SpectatorApp.jsx
+1 -1
View File
@@ -141,7 +141,7 @@ function SpectatorContent() {
<RoverRoster roster={roster} title="Rovers" emptyText="No rovers registered." /> <RoverRoster roster={roster} title="Rovers" emptyText="No rovers registered." />
</div> </div>
<div className="min-h-0 min-w-0 flex-1 overflow-hidden"> <div className="min-h-0 min-w-0 flex-1 overflow-hidden">
<UserListPanel hideNicknameForm hideHeader fillHeight className="h-full" /> <UserListPanel hideNicknameForm hideHeader fillHeight className="h-full" showBothTurnsAndUsers />
</div> </div>
<div className="min-h-0 min-w-0 flex-[1.1] overflow-hidden"> <div className="min-h-0 min-w-0 flex-[1.1] overflow-hidden">
<ChatPanel hideInput hideSpectatorNotice fillHeight /> <ChatPanel hideInput hideSpectatorNotice fillHeight />