This commit is contained in:
legop3
2025-11-24 03:23:22 -05:00
parent f80d2445b0
commit 7bbb039da1
8 changed files with 32 additions and 24 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+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-DCz0m6Ns.js"></script> <script type="module" crossorigin src="/assets/index-BP_oTuNY.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-BIRlXFVL.css"> <link rel="stylesheet" crossorigin href="/assets/index-B9t5gasU.css">
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
+3 -3
View File
@@ -58,9 +58,9 @@ function DesktopLayout({ layout }) {
<div className="flex h-full gap-0.5 overflow-hidden"> <div className="flex h-full gap-0.5 overflow-hidden">
<div className="flex min-w-0 flex-[1.8] flex-col gap-0.5 overflow-y-auto pr-0.5"> <div className="flex min-w-0 flex-[1.8] flex-col gap-0.5 overflow-y-auto pr-0.5">
<DriverVideoPanel /> <DriverVideoPanel />
<div className="grid grid-cols-2 gap-0.5"> <div className="grid grid-cols-2 gap-0.5 max-h-[50vh]">
<UserListPanel /> <UserListPanel fillParent />
<ChatPanel /> <ChatPanel fillParent />
</div> </div>
<LogPanel /> <LogPanel />
</div> </div>
+7 -3
View File
@@ -25,7 +25,7 @@ function displayName(message) {
return message.nickname || message.socketId?.slice(0, 6) || 'unknown'; return message.nickname || message.socketId?.slice(0, 6) || 'unknown';
} }
export default function ChatPanel({ hideInput = false, hideSpectatorNotice = false }) { export default function ChatPanel({ hideInput = false, hideSpectatorNotice = false, fillParent = false }) {
const { session } = useSession(); const { session } = useSession();
const { messages, sendMessage, registerInputRef, onInputFocus, onInputBlur, blurChat } = useChat(); const { messages, sendMessage, registerInputRef, onInputFocus, onInputBlur, blurChat } = useChat();
const [draft, setDraft] = useState(''); const [draft, setDraft] = useState('');
@@ -57,9 +57,13 @@ export default function ChatPanel({ hideInput = false, hideSpectatorNotice = fal
} }
} }
const listClass = fillParent
? 'flex-1 min-h-[8rem]'
: 'h-48';
return ( return (
<section className="panel-section flex h-full flex-col space-y-0.5 text-base overflow-hidden"> <section className={`panel-section ${fillParent ? 'flex h-full flex-col overflow-hidden' : ''} space-y-0.5 text-base`}>
<div className="surface flex-1 min-h-[8rem] overflow-y-auto space-y-0.25" ref={listRef}> <div className={`surface overflow-y-auto space-y-0.25 ${listClass}`} ref={listRef}>
{sorted.length === 0 ? ( {sorted.length === 0 ? (
<p className="text-sm text-slate-500">No messages yet.</p> <p className="text-sm text-slate-500">No messages yet.</p>
) : ( ) : (
+7 -3
View File
@@ -26,7 +26,7 @@ function formatLabel(user, selfId) {
return base; return base;
} }
export default function UserListPanel({ hideNicknameForm = false, hideHeader = false, className = '' }) { export default function UserListPanel({ hideNicknameForm = false, hideHeader = false, className = '', fillParent = false }) {
const { session, setNickname } = useSession(); const { session, setNickname } = useSession();
const { value } = useSettingsNamespace('profile', { nickname: '' }); const { value } = useSettingsNamespace('profile', { nickname: '' });
const lastSyncedSocketRef = useRef(null); const lastSyncedSocketRef = useRef(null);
@@ -91,8 +91,12 @@ export default function UserListPanel({ hideNicknameForm = false, hideHeader = f
return Math.ceil(ms / 1000); return Math.ceil(ms / 1000);
}, []); }, []);
const listClass = fillParent ? 'flex-1 min-h-[8rem]' : 'h-48';
return ( return (
<section className={`panel-section flex h-full flex-col space-y-0.5 overflow-hidden text-base ${className}`}> <section
className={`panel-section ${fillParent ? 'flex h-full flex-col overflow-hidden' : ''} space-y-0.5 text-base ${className}`}
>
{!hideNicknameForm && ( {!hideNicknameForm && (
<div className="space-y-0.5"> <div className="space-y-0.5">
<NicknameForm /> <NicknameForm />
@@ -109,7 +113,7 @@ export default function UserListPanel({ hideNicknameForm = false, hideHeader = f
</span> </span>
</div> </div>
)} )}
<div className="surface flex-1 min-h-[8rem] overflow-y-auto space-y-0.25"> <div className={`surface overflow-y-auto space-y-0.25 ${listClass}`}>
{isTurnsMode ? ( {isTurnsMode ? (
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>
+4 -4
View File
@@ -88,11 +88,11 @@ function SecondaryRow() {
return ( return (
<section className="grid grid-cols-1 gap-0.5 lg:grid-cols-[2fr_1fr_1fr]"> <section className="grid grid-cols-1 gap-0.5 lg:grid-cols-[2fr_1fr_1fr]">
<RoomCameraPanel defaultOrientation="horizontal" hideLayoutToggle hideHeader /> <RoomCameraPanel defaultOrientation="horizontal" hideLayoutToggle hideHeader />
<div className="flex h-full flex-col"> <div className="flex h-[50vh] flex-col">
<UserListPanel hideNicknameForm hideHeader /> <UserListPanel hideNicknameForm hideHeader fillParent />
</div> </div>
<div className="flex h-full flex-col"> <div className="flex h-[50vh] flex-col">
<ChatPanel hideInput hideSpectatorNotice /> <ChatPanel hideInput hideSpectatorNotice fillParent />
</div> </div>
</section> </section>
); );