robert/ttrpg-initiative-tracker
1
0
Fork 0
Code Pull Requests Releases 2 Wiki Activity

more view changes.

Browse Source
This commit is contained in:
Robert Johnson 2025-05-26 09:11:29 -04:00
parent 118804926f
commit 34e40ae769
1 changed files with 4 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/App.js
View File

@ -234,7 +234,7 @@ function App() {
{!isAuthReady && !error && <p>Authenticating...</p>} {!isAuthReady && !error && <p>Authenticating...</p>}
</main> </main>
<footer className="bg-slate-900 p-4 text-center text-sm text-slate-400 mt-8"> <footer className="bg-slate-900 p-4 text-center text-sm text-slate-400 mt-8">
TTRPG Initiative Tracker v0.1.21 TTRPG Initiative Tracker v0.1.22
</footer> </footer>
</div> </div>
); );
@ -1001,7 +1001,7 @@ function DisplayView() {
block: 'center', block: 'center',
}); });
} }
}, [activeEncounterData?.currentTurnParticipantId]); }, [activeEncounterData?.currentTurnParticipantId, activeEncounterData?.participants]); // Also re-scroll if participants list changes (e.g. focused view)
if (isLoadingActiveDisplay || (isPlayerDisplayActive && isLoadingEncounter)) { if (isLoadingActiveDisplay || (isPlayerDisplayActive && isLoadingEncounter)) {
return <div className="text-center py-10 text-2xl text-slate-300">Loading Player Display...</div>; return <div className="text-center py-10 text-2xl text-slate-300">Loading Player Display...</div>;
@ -1042,7 +1042,7 @@ function DisplayView() {
} }
let participantsToRender = allOrderedActiveParticipants; let participantsToRender = allOrderedActiveParticipants;
const FOCUSED_VIEW_THRESHOLD = 7; // When to switch to focused view const FOCUSED_VIEW_THRESHOLD = 7;
const ITEMS_AROUND_CURRENT = 3; // Show 3 before and 3 after current = 7 total in focused view const ITEMS_AROUND_CURRENT = 3; // Show 3 before and 3 after current = 7 total in focused view
let inFocusedView = false; let inFocusedView = false;
@ -1053,7 +1053,6 @@ function DisplayView() {
const focusedList = []; const focusedList = [];
for (let i = -ITEMS_AROUND_CURRENT; i <= ITEMS_AROUND_CURRENT; i++) { for (let i = -ITEMS_AROUND_CURRENT; i <= ITEMS_AROUND_CURRENT; i++) {
const listLength = allOrderedActiveParticipants.length; const listLength = allOrderedActiveParticipants.length;
// Ensure the index wraps around correctly for the circular list effect
const actualIndex = (currentIndex + i + listLength) % listLength; const actualIndex = (currentIndex + i + listLength) % listLength;
focusedList.push(allOrderedActiveParticipants[actualIndex]); focusedList.push(allOrderedActiveParticipants[actualIndex]);
} }
@ -1086,7 +1085,7 @@ function DisplayView() {
{!isStarted && (!participants || participants.length === 0) && <p className="text-2xl text-slate-500 mb-6">No participants.</p>} {!isStarted && (!participants || participants.length === 0) && <p className="text-2xl text-slate-500 mb-6">No participants.</p>}
{participantsToRender.length === 0 && isStarted && <p className="text-xl text-slate-400">No active participants.</p>} {participantsToRender.length === 0 && isStarted && <p className="text-xl text-slate-400">No active participants.</p>}
<div className="space-y-4 max-w-4xl mx-auto overflow-y-auto" style={{maxHeight: 'calc(100vh - 220px)'}}> {/* Widened and adjusted maxHeight */} <div className="space-y-4 max-w-4xl mx-auto overflow-y-auto" style={{maxHeight: 'calc(100vh - 180px)'}}> {/* Adjusted maxHeight */}
{participantsToRender.map(p => ( {participantsToRender.map(p => (
<div <div
key={p.id} key={p.id}