diff --git a/src/App.js b/src/App.js index 36d2ed7..42ada35 100644 --- a/src/App.js +++ b/src/App.js @@ -234,7 +234,7 @@ function App() { {!isAuthReady && !error &&

Authenticating...

} ); @@ -932,7 +932,7 @@ function DisplayView() { const [encounterError, setEncounterError] = useState(null); const [campaignBackgroundUrl, setCampaignBackgroundUrl] = useState(''); const [isPlayerDisplayActive, setIsPlayerDisplayActive] = useState(false); - const currentTurnRef = useRef(null); + // currentTurnRef removed as we are reverting the scroll-to-view logic for now useEffect(() => { if (!db) { @@ -994,14 +994,7 @@ function DisplayView() { }; }, [activeDisplayData, isLoadingActiveDisplay]); - useEffect(() => { - if (currentTurnRef.current) { - currentTurnRef.current.scrollIntoView({ - behavior: 'smooth', - block: 'center', - }); - } - }, [activeEncounterData?.currentTurnParticipantId, activeEncounterData?.participants]); // Also re-scroll if participants list changes (e.g. focused view) + // useEffect for scrollIntoView removed if (isLoadingActiveDisplay || (isPlayerDisplayActive && isLoadingEncounter)) { return
Loading Player Display...
; @@ -1023,13 +1016,14 @@ function DisplayView() { const { name, participants, round, currentTurnParticipantId, isStarted } = activeEncounterData; - let allOrderedActiveParticipants = []; + // Reverted to showing all active participants, no focused view logic + let participantsToRender = []; if (participants) { if (isStarted && activeEncounterData.turnOrderIds?.length > 0 ) { - allOrderedActiveParticipants = activeEncounterData.turnOrderIds + participantsToRender = activeEncounterData.turnOrderIds .map(id => participants.find(p => p.id === id)).filter(p => p && p.isActive); } else { - allOrderedActiveParticipants = [...participants].filter(p => p.isActive) + participantsToRender = [...participants].filter(p => p.isActive) .sort((a, b) => { if (a.initiative === b.initiative) { const indexA = participants.findIndex(p => p.id === a.id); @@ -1041,27 +1035,6 @@ function DisplayView() { } } - let participantsToRender = allOrderedActiveParticipants; - const FOCUSED_VIEW_THRESHOLD = 7; - const ITEMS_AROUND_CURRENT = 3; // Show 3 before and 3 after current = 7 total in focused view - let inFocusedView = false; - - if (isStarted && allOrderedActiveParticipants.length >= FOCUSED_VIEW_THRESHOLD) { - inFocusedView = true; - const currentIndex = allOrderedActiveParticipants.findIndex(p => p.id === currentTurnParticipantId); - if (currentIndex !== -1) { - const focusedList = []; - for (let i = -ITEMS_AROUND_CURRENT; i <= ITEMS_AROUND_CURRENT; i++) { - const listLength = allOrderedActiveParticipants.length; - const actualIndex = (currentIndex + i + listLength) % listLength; - focusedList.push(allOrderedActiveParticipants[actualIndex]); - } - participantsToRender = focusedList; - } else { - participantsToRender = allOrderedActiveParticipants.slice(0, ITEMS_AROUND_CURRENT * 2 + 1); - } - } - const displayStyles = campaignBackgroundUrl ? { backgroundImage: `url(${campaignBackgroundUrl})`, @@ -1079,17 +1052,18 @@ function DisplayView() { >

{name}

- {isStarted &&

Round: {round}

} - {inFocusedView &&

(Focused View: {participantsToRender.length} of {allOrderedActiveParticipants.length} active)

} + {isStarted &&

Round: {round}

} {/* Adjusted margin */} + {/* Focused view indicator removed */} {!isStarted && participants?.length > 0 &&

Awaiting Start

} {!isStarted && (!participants || participants.length === 0) &&

No participants.

} {participantsToRender.length === 0 && isStarted &&

No active participants.

} -
{/* Adjusted maxHeight */} + {/* Reverted to simpler list container */} +
{participantsToRender.map(p => (