mirror of
https://github.com/legop3/MultiRoombaRover.git
synced 2026-09-16 01:21:20 -04:00
finally?
This commit is contained in:
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
@@ -11,8 +11,8 @@
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="apple-mobile-web-app-title" content="Multi Roomba Rover" />
|
||||
<title>Multi Roomba Rover</title>
|
||||
<script type="module" crossorigin src="/assets/index-B5J0CUJj.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-C9IjFgQB.css">
|
||||
<script type="module" crossorigin src="/assets/index-dU53IKaa.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/assets/index-BhKzLrKY.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
|
||||
+7
-3
@@ -58,9 +58,13 @@ function DesktopLayout({ layout }) {
|
||||
<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">
|
||||
<DriverVideoPanel />
|
||||
<div className="grid grid-cols-2 gap-0.5">
|
||||
<UserListPanel />
|
||||
<ChatPanel />
|
||||
<div className="grid grid-cols-2 gap-0.5 h-48">
|
||||
<div className="h-full">
|
||||
<UserListPanel fullHeight />
|
||||
</div>
|
||||
<div className="h-full">
|
||||
<ChatPanel fullHeight />
|
||||
</div>
|
||||
</div>
|
||||
<LogPanel />
|
||||
</div>
|
||||
|
||||
@@ -25,7 +25,7 @@ function displayName(message) {
|
||||
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, fullHeight = false }) {
|
||||
const { session } = useSession();
|
||||
const { messages, sendMessage, registerInputRef, onInputFocus, onInputBlur, blurChat } = useChat();
|
||||
const [draft, setDraft] = useState('');
|
||||
@@ -57,10 +57,12 @@ export default function ChatPanel({ hideInput = false, hideSpectatorNotice = fal
|
||||
}
|
||||
}
|
||||
|
||||
const listClass = 'h-48';
|
||||
const listClass = fullHeight ? 'flex-1 min-h-0' : 'h-48';
|
||||
|
||||
return (
|
||||
<section className="panel-section space-y-0.5 text-base">
|
||||
<section
|
||||
className={`panel-section space-y-0.5 text-base ${fullHeight ? 'flex h-full flex-col overflow-hidden' : ''}`}
|
||||
>
|
||||
<div className={`surface overflow-y-auto space-y-0.25 ${listClass}`} ref={listRef}>
|
||||
{sorted.length === 0 ? (
|
||||
<p className="text-sm text-slate-500">No messages yet.</p>
|
||||
|
||||
@@ -26,7 +26,7 @@ function formatLabel(user, selfId) {
|
||||
return base;
|
||||
}
|
||||
|
||||
export default function UserListPanel({ hideNicknameForm = false, hideHeader = false, className = '' }) {
|
||||
export default function UserListPanel({ hideNicknameForm = false, hideHeader = false, className = '', fullHeight = false }) {
|
||||
const { session, setNickname } = useSession();
|
||||
const { value } = useSettingsNamespace('profile', { nickname: '' });
|
||||
const lastSyncedSocketRef = useRef(null);
|
||||
@@ -91,10 +91,12 @@ export default function UserListPanel({ hideNicknameForm = false, hideHeader = f
|
||||
return Math.ceil(ms / 1000);
|
||||
}, []);
|
||||
|
||||
const listClass = 'h-48';
|
||||
const listClass = fullHeight ? 'flex-1 min-h-0' : 'h-48';
|
||||
|
||||
return (
|
||||
<section className={`panel-section space-y-0.5 text-base ${className}`}>
|
||||
<section
|
||||
className={`panel-section space-y-0.5 text-base ${fullHeight ? 'flex h-full flex-col overflow-hidden' : ''} ${className}`}
|
||||
>
|
||||
{!hideNicknameForm && (
|
||||
<div className="space-y-0.5">
|
||||
<NicknameForm />
|
||||
|
||||
@@ -86,13 +86,15 @@ function RoverRow({ roster, frames, videoSources, session }) {
|
||||
|
||||
function SecondaryRow() {
|
||||
return (
|
||||
<section className="grid grid-cols-1 items-start gap-0.5 lg:grid-cols-[2fr_1fr_1fr]">
|
||||
<RoomCameraPanel defaultOrientation="horizontal" hideLayoutToggle hideHeader />
|
||||
<div className="flex flex-col">
|
||||
<UserListPanel hideNicknameForm hideHeader />
|
||||
<section className="grid grid-cols-1 items-stretch gap-0.5 lg:grid-cols-[2fr_1fr_1fr]">
|
||||
<div className="flex h-full flex-col">
|
||||
<RoomCameraPanel defaultOrientation="horizontal" hideLayoutToggle hideHeader />
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<ChatPanel hideInput hideSpectatorNotice />
|
||||
<div className="flex h-full min-h-0 flex-col">
|
||||
<UserListPanel hideNicknameForm hideHeader fullHeight />
|
||||
</div>
|
||||
<div className="flex h-full min-h-0 flex-col">
|
||||
<ChatPanel hideInput hideSpectatorNotice fullHeight />
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user