diff --git a/app/game-api/src/router/general/index.ts b/app/game-api/src/router/general/index.ts index b07c1550..23e6d3c1 100644 --- a/app/game-api/src/router/general/index.ts +++ b/app/game-api/src/router/general/index.ts @@ -45,6 +45,7 @@ import { import { resolveGeneralTypeCall, resolveLeadershipBonus, + resolveNextTurnMonthOffset, resolveRefreshScoreText, resolveRemainingMinutes, } from '../../services/generalBasicCardProjection.js'; @@ -265,6 +266,7 @@ export const getGeneralContext = async (ctx: GameApiContext) => { dedication: true, age: true, turnTime: true, + turnTick: true, recentWarTime: true, crewTypeId: true, personalCode: true, @@ -333,7 +335,14 @@ export const getGeneralContext = async (ctx: GameApiContext) => { }) : Promise.resolve(NEUTRAL_NATION_CONTEXT), ctx.db.worldState.findFirst({ - select: { currentYear: true, currentMonth: true, tickSeconds: true, config: true, meta: true }, + select: { + currentYear: true, + currentMonth: true, + tickSeconds: true, + lastTurnTick: true, + config: true, + meta: true, + }, }), officerCityId > 0 ? ctx.db.city.findUnique({ where: { id: officerCityId }, select: { name: true } }) @@ -521,6 +530,13 @@ export const getGeneralContext = async (ctx: GameApiContext) => { age: general.age, retirementYear, turnTime: general.turnTime.toISOString(), + nextTurnMonthOffset: resolveNextTurnMonthOffset({ + turnTime: general.turnTime, + turnTick: general.turnTick, + lastExecuted: parsedLastExecuted, + lastTurnTick: worldState?.lastTurnTick, + turnSeconds: worldState?.tickSeconds ?? 0, + }), recentWar: general.recentWarTime?.toISOString() ?? null, defenceTrain: settings.defence_train, killTurn: readNumber(metaRecord.killturn ?? metaRecord.killTurn, 0), diff --git a/app/game-api/src/services/generalBasicCardProjection.ts b/app/game-api/src/services/generalBasicCardProjection.ts index 556c53aa..3f389efb 100644 --- a/app/game-api/src/services/generalBasicCardProjection.ts +++ b/app/game-api/src/services/generalBasicCardProjection.ts @@ -1,3 +1,5 @@ +import { GAME_TICKS_PER_TURN } from '@sammo-ts/common'; + export interface GeneralBasicStats { leadership: number; strength: number; @@ -53,3 +55,41 @@ export const resolveRemainingMinutes = ( } return Math.floor(Math.min(999, Math.max(0, (nextTurnMillis - lastExecuted.getTime()) / 60_000))); }; + +export interface NextTurnMonthOffsetInput { + turnTime: Date; + turnTick?: bigint | number | null; + lastExecuted: Date | null; + lastTurnTick?: bigint | number | null; + turnSeconds: number; +} + +const normalizeTick = (value: bigint | number | null | undefined): bigint | null => { + if (typeof value === 'bigint') return value; + if (typeof value === 'number' && Number.isSafeInteger(value)) return BigInt(value); + return null; +}; + +const turnBucket = (tick: bigint): bigint => { + const ticksPerTurn = BigInt(GAME_TICKS_PER_TURN); + const quotient = tick / ticksPerTurn; + return tick % ticksPerTurn < 0 ? quotient - 1n : quotient; +}; + +/** + * Ref Command.GetReservedCommand cuts both clocks to a gameplay-turn bucket. + * A general in the next bucket has already acted in the displayed world month, + * so the first reserved command belongs to the following month. + */ +export const resolveNextTurnMonthOffset = (input: NextTurnMonthOffsetInput): 0 | 1 => { + const turnTick = normalizeTick(input.turnTick); + const lastTurnTick = normalizeTick(input.lastTurnTick); + if (turnTick !== null && lastTurnTick !== null) { + return turnBucket(turnTick) > turnBucket(lastTurnTick) ? 1 : 0; + } + + const turnTimeMs = input.turnTime.getTime(); + const lastExecutedMs = input.lastExecuted?.getTime() ?? Number.NaN; + if (!Number.isFinite(turnTimeMs) || !Number.isFinite(lastExecutedMs) || input.turnSeconds <= 0) return 0; + return turnTimeMs >= lastExecutedMs + input.turnSeconds * 1_000 ? 1 : 0; +}; diff --git a/app/game-api/test/generalBasicCardProjection.test.ts b/app/game-api/test/generalBasicCardProjection.test.ts index 9df312ad..250661f4 100644 --- a/app/game-api/test/generalBasicCardProjection.test.ts +++ b/app/game-api/test/generalBasicCardProjection.test.ts @@ -3,6 +3,7 @@ import { describe, expect, it } from 'vitest'; import { resolveGeneralTypeCall, resolveLeadershipBonus, + resolveNextTurnMonthOffset, resolveRefreshScoreText, resolveRemainingMinutes, } from '../src/services/generalBasicCardProjection.js'; @@ -41,4 +42,55 @@ describe('general basic card Ref projection', () => { expect(resolveRemainingMinutes(new Date('2026-08-12T23:59:00.000Z'), lastExecuted, 3_600)).toBe(59); expect(resolveRemainingMinutes(new Date('2026-08-13T00:07:06.000Z'), null, 3_600)).toBeNull(); }); + + it('moves the first reserved month only after the general turn bucket has passed', () => { + const lastExecuted = new Date('2026-08-13T00:00:00.000Z'); + const lastTurnTick = 36_000_000n * 11n; + + expect( + resolveNextTurnMonthOffset({ + turnTime: new Date('2026-08-13T00:07:00.000Z'), + turnTick: lastTurnTick + 12_000_000n, + lastExecuted, + lastTurnTick, + turnSeconds: 600, + }) + ).toBe(0); + expect( + resolveNextTurnMonthOffset({ + turnTime: new Date('2026-08-13T00:17:00.000Z'), + turnTick: lastTurnTick + 48_000_000n, + lastExecuted, + lastTurnTick, + turnSeconds: 600, + }) + ).toBe(1); + expect( + resolveNextTurnMonthOffset({ + turnTime: new Date('2026-08-13T00:10:00.000Z'), + turnTick: 1n, + lastExecuted, + lastTurnTick: -1n, + turnSeconds: 600, + }) + ).toBe(1); + }); + + it('keeps the same boundary for legacy Date-only schedules', () => { + const lastExecuted = new Date('2026-08-13T00:00:00.000Z'); + expect( + resolveNextTurnMonthOffset({ + turnTime: new Date('2026-08-13T00:07:00.000Z'), + lastExecuted, + turnSeconds: 600, + }) + ).toBe(0); + expect( + resolveNextTurnMonthOffset({ + turnTime: new Date('2026-08-13T00:10:00.000Z'), + lastExecuted, + turnSeconds: 600, + }) + ).toBe(1); + }); }); diff --git a/app/game-api/test/nationHtml.test.ts b/app/game-api/test/nationHtml.test.ts index 2dbd1f73..6dae4b9c 100644 --- a/app/game-api/test/nationHtml.test.ts +++ b/app/game-api/test/nationHtml.test.ts @@ -73,7 +73,7 @@ describe('nation HTML purification', () => { const source = [ '

', '방침', - '

방침.png', + '

방침.png', ].join(''); const clean = purifyNationHtml(source); @@ -83,6 +83,7 @@ describe('nation HTML purification', () => { 'style="font-family:Pretendard, sans-serif;font-size:22px;color:#123456;background-color:#fedcba"' ); expect(clean).toContain('
'); + expect(clean).toContain('class="custom-image-align-right"'); expect(clean).toContain( 'src="https://sam-image.hided.net/uploads/core2026/0123456789abcdef0123456789abcdef.webp"' ); diff --git a/app/game-frontend/e2e/mainNavigation.spec.ts b/app/game-frontend/e2e/mainNavigation.spec.ts index 33de76ef..0e0aa0ba 100644 --- a/app/game-frontend/e2e/mainNavigation.spec.ts +++ b/app/game-frontend/e2e/mainNavigation.spec.ts @@ -34,6 +34,7 @@ type NavigationFixture = { operations: string[]; generalName?: string; generalTurnTime?: string; + nextTurnMonthOffset?: 0 | 1; serverTime?: string; serverWallTime?: string; clockMode?: 'realtime' | 'manual'; @@ -440,6 +441,7 @@ const generalContext = (state: NavigationFixture) => ({ crewTypeName: '보병', traits: { personal: '대담', specialDomestic: '상재', specialWar: '무쌍' }, turnTime: state.generalTurnTime ?? '0185-01-01T00:00:00.000Z', + nextTurnMonthOffset: state.nextTurnMonthOffset ?? 0, }, city: { id: 1, @@ -1188,7 +1190,7 @@ test('desktop menus preserve ref columns, prefix-safe routes, and controlled dro await expect(page.locator('.legacy-game-info')).toContainText('현재: 185년 1월'); await expect(page.locator('.legacy-game-info')).toContainText('턴: 10분'); await expect(page.locator('.legacy-game-info')).not.toContainText('최근 턴:'); - await expect(page.locator('.execution-status')).toHaveText('동작 시각: 08-13 09:05'); + await expect(page.locator('.execution-status')).toHaveText('현재 시각: 08-13 09:00'); await expect(page.locator('.tournament-status')).toHaveText('토너먼트: 참가 모집중'); await expect(page.locator('.vote-status')).toHaveText('설문: 메뉴 설문'); const headerStatusGeometry = await page.locator('.main-page').evaluate((element) => { @@ -1623,6 +1625,105 @@ test('the repeated bottom global menu opens upward on the mobile document', asyn await persistArtifact(page, `${basePath.slice(1)}-mobile-bottom-dropup`); }); +test('first reserved month crosses December only after the general turn has passed', async ({ page }, testInfo) => { + const state: NavigationFixture = { + officerLevel: 0, + permission: 0, + nationLevel: 0, + stage: 0, + npcMode: 1, + generalMeCalls: 0, + operations: [], + currentYear: 179, + currentMonth: 12, + nextTurnMonthOffset: 0, + validMapImages: true, + reservedTurns: [ + { index: 0, action: '휴식', args: {} }, + { index: 1, action: '휴식', args: {} }, + ], + }; + await installRealtimeHarness(page); + await installFixture(page, state); + await page.setViewportSize({ width: 1200, height: 900 }); + await waitForMain(page); + await waitForMainRealtime(page); + + const map = page.locator('[data-main-target="map"] .map-viewer').first(); + const commandPanel = page.locator('[data-main-target="commands"]').first(); + const firstDate = commandPanel.locator('.date-column [data-turn-index="0"]'); + const secondDate = commandPanel.locator('.date-column [data-turn-index="1"]'); + + await expect(map).toContainText('179年 12月'); + await expect(firstDate).toHaveText('179年 12月'); + await expect(secondDate).toHaveText('180年 1月'); + const before = await firstDate.evaluate((element) => { + const rect = element.getBoundingClientRect(); + const style = getComputedStyle(element); + return { + rect: rect.toJSON(), + fontSize: style.fontSize, + lineHeight: style.lineHeight, + color: style.color, + documentScrollWidth: document.documentElement.scrollWidth, + viewportWidth: window.innerWidth, + }; + }); + await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-before.png') }); + + state.nextTurnMonthOffset = 1; + state.contextRevision = 'BBBBBBBBBBBBBBBBBBBBBB'; + state.contextOperations = [{ op: 'replace', path: '/general/nextTurnMonthOffset', value: 1 }]; + await emitReadModelInvalidation(page, readModelInvalidation({ context: true })); + + await expect(map).toContainText('179年 12月'); + await expect(firstDate).toHaveText('180年 1月'); + await expect(secondDate).toHaveText('180年 2月'); + await firstDate.hover(); + const after = await firstDate.evaluate((element) => { + const rect = element.getBoundingClientRect(); + const style = getComputedStyle(element); + return { + rect: rect.toJSON(), + fontSize: style.fontSize, + lineHeight: style.lineHeight, + color: style.color, + documentScrollWidth: document.documentElement.scrollWidth, + viewportWidth: window.innerWidth, + }; + }); + expect(after.rect.width).toBe(before.rect.width); + expect(after.rect.height).toBe(before.rect.height); + expect(after.rect.left).toBe(before.rect.left); + expect(after.rect.right).toBe(before.rect.right); + expect(after.fontSize).toBe(before.fontSize); + expect(after.lineHeight).toBe(before.lineHeight); + expect(after.color).toBe(before.color); + expect(before.documentScrollWidth).toBe(before.viewportWidth); + expect(after.documentScrollWidth).toBe(after.viewportWidth); + await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-after.png') }); + + await page.setViewportSize({ width: 390, height: 844 }); + await firstDate.scrollIntoViewIfNeeded(); + await expect(firstDate).toHaveText('180年 1月'); + const mobile = await firstDate.evaluate((element) => { + const rect = element.getBoundingClientRect(); + const style = getComputedStyle(element); + return { + rect: rect.toJSON(), + fontSize: style.fontSize, + lineHeight: style.lineHeight, + documentScrollWidth: document.documentElement.scrollWidth, + }; + }); + expect(mobile.rect.left).toBeGreaterThanOrEqual(0); + expect(mobile.rect.right).toBeLessThanOrEqual(500); + expect(mobile.fontSize).toBe(before.fontSize); + expect(mobile.lineHeight).toBe(before.lineHeight); + expect(mobile.documentScrollWidth).toBe(500); + await commandPanel.screenshot({ path: testInfo.outputPath('turn-month-mobile.png') }); +}); + test('main general card uses local turn time and command clock tracks corrected server time', async ({ page }) => { const state: NavigationFixture = { officerLevel: 0, @@ -1793,6 +1894,89 @@ test('main general card uses local turn time and command clock tracks corrected expect(state.operations).toHaveLength(operationsBeforePreopenBoundary); }); +test('main header clock follows minute boundaries only while game-server contact is recent', async ({ + page, +}, testInfo) => { + const state: NavigationFixture = { + officerLevel: 0, + permission: 0, + nationLevel: 0, + stage: 0, + npcMode: 1, + generalMeCalls: 0, + operations: [], + serverTime: '2026-08-13T00:00:35.000Z', + serverWallTime: '2026-08-13T00:00:00.000Z', + clockMode: 'realtime', + clockRunning: true, + }; + await installRealtimeHarness(page); + await installFixture(page, state); + await page.clock.install({ time: new Date('2026-08-13T00:00:00.000Z') }); + await page.setViewportSize({ width: 1200, height: 900 }); + await waitForMain(page); + await waitForMainRealtime(page); + + const clock = page.locator('.execution-status'); + const initialRequestCount = state.trpcRequests?.length ?? 0; + await expect(clock).toHaveText('현재 시각: 08-13 09:00'); + await expect(clock).not.toHaveClass(/execution-status--stale/u); + + await page.clock.runFor(25_000); + await expect(clock).toHaveText('현재 시각: 08-13 09:01'); + + await page.clock.runFor(21_000); + await expect(clock).toHaveClass(/execution-status--stale/u); + await expect(clock).toHaveAttribute('title', '최근 45초 동안 서버 통신이 없어 시각 갱신을 멈췄습니다.'); + await expect.poll(() => clock.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(255, 0, 255)'); + const staleDesktopGeometry = await clock.evaluate((element) => ({ + rect: element.getBoundingClientRect().toJSON(), + overflow: element.scrollWidth - element.clientWidth, + color: getComputedStyle(element).color, + fontSize: getComputedStyle(element).fontSize, + lineHeight: getComputedStyle(element).lineHeight, + })); + expect(staleDesktopGeometry.rect.width).toBeCloseTo(333.33, 0); + expect(staleDesktopGeometry.rect.height).toBeGreaterThanOrEqual(36); + expect(staleDesktopGeometry.overflow).toBeLessThanOrEqual(0); + await clock.screenshot({ path: testInfo.outputPath('main-header-clock-stale-desktop-1200.png') }); + await page.clock.runFor(60_000); + await expect(clock).toHaveText('현재 시각: 08-13 09:01'); + + await page.evaluate(() => { + (window as unknown as { __emitMainRealtime: (type: string, value: unknown) => void }).__emitMainRealtime( + 'ping', + {} + ); + }); + await expect(clock).toHaveText('현재 시각: 08-13 09:02'); + await expect(clock).not.toHaveClass(/execution-status--stale/u); + await page.clock.runFor(39_000); + await expect(clock).toHaveText('현재 시각: 08-13 09:03'); + await expect.poll(() => clock.evaluate((element) => getComputedStyle(element).color)).toBe('rgb(0, 255, 255)'); + + await page.setViewportSize({ width: 500, height: 900 }); + const freshMobileGeometry = await clock.evaluate((element) => ({ + rect: element.getBoundingClientRect().toJSON(), + overflow: element.scrollWidth - element.clientWidth, + color: getComputedStyle(element).color, + fontSize: getComputedStyle(element).fontSize, + lineHeight: getComputedStyle(element).lineHeight, + documentScrollWidth: document.documentElement.scrollWidth, + })); + expect(freshMobileGeometry.rect.width).toBeCloseTo(166.67, 0); + expect(freshMobileGeometry.overflow).toBeLessThanOrEqual(0); + expect(freshMobileGeometry.documentScrollWidth).toBe(500); + await Promise.all([ + clock.screenshot({ path: testInfo.outputPath('main-header-clock-fresh-mobile-500.png') }), + writeFile( + testInfo.outputPath('main-header-clock-geometry.json'), + `${JSON.stringify({ staleDesktopGeometry, freshMobileGeometry }, null, 2)}\n` + ), + ]); + expect(state.trpcRequests?.length ?? 0).toBe(initialRequestCount); +}); + test('message targets keep reply behavior and use nation-color contrast in labels and select options', async ({ page, }) => { diff --git a/app/game-frontend/e2e/nationOffices.spec.ts b/app/game-frontend/e2e/nationOffices.spec.ts index 8d309a53..d0dca454 100644 --- a/app/game-frontend/e2e/nationOffices.spec.ts +++ b/app/game-frontend/e2e/nationOffices.spec.ts @@ -626,6 +626,21 @@ test('finance editor preserves Ref formatting controls and uploads images throug expect(await editorFrame.evaluate((element) => getComputedStyle(element).backgroundColor)).toBe('rgba(0, 0, 0, 0)'); expect(await editor.evaluate((element) => getComputedStyle(element).backgroundColor)).toBe('rgba(0, 0, 0, 0)'); + await editor.fill('첫 번째 항목'); + await page.getByRole('button', { name: '번호 목록' }).click(); + await expect(editor.locator('ol')).toHaveCSS('list-style-type', 'decimal'); + await expect(editor.locator('li')).toContainText('첫 번째 항목'); + await screenshot(page, 'core-finance-numbered-list-desktop.png'); + await page.getByRole('button', { name: '번호 목록' }).click(); + + const alignmentIcons = await page + .getByRole('toolbar', { name: '서식' }) + .getByRole('button', { name: /^(왼쪽|가운데|오른쪽) 정렬$/ }) + .locator('svg') + .evaluateAll((icons) => icons.map((icon) => icon.innerHTML)); + expect(alignmentIcons).toHaveLength(3); + expect(new Set(alignmentIcons).size).toBe(3); + await editor.fill('서식 검증'); await editor.press('Control+A'); await page.getByRole('combobox', { name: '글꼴', exact: true }).selectOption('Gungsuh, serif'); @@ -663,11 +678,27 @@ test('finance editor preserves Ref formatting controls and uploads images throug await expect.poll(() => state.uploadDataUrl).toMatch(/^data:image\/png;base64,/); await expect(editor.locator('hr')).toHaveCount(1); - await expect(editor.locator('img')).toHaveAttribute( + const uploadedImage = editor.locator('img'); + await expect(uploadedImage).toHaveAttribute( 'src', 'https://sam-image.hided.net/uploads/core2026/0123456789abcdef0123456789abcdef.webp' ); + await uploadedImage.click(); + const imageToolbar = page.getByRole('toolbar', { name: '이미지 정렬' }); + await expect(imageToolbar).toBeVisible(); + await expect(imageToolbar.getByRole('button')).toHaveCount(5); + await screenshot(page, 'core-finance-image-toolbar-desktop.png'); + await imageToolbar.getByRole('button', { name: '이미지 오른쪽 정렬' }).click(); + await expect(uploadedImage).toHaveClass(/custom-image-align-right/); + await expect(uploadedImage).toHaveCSS('display', 'block'); + await expect(uploadedImage).toHaveCSS('margin-right', '0px'); + + await page.getByRole('toolbar', { name: '서식' }).getByRole('button', { name: '가운데 정렬' }).click(); + await expect(uploadedImage).toHaveClass(/custom-image-align-center/); + await uploadedImage.click(); + await imageToolbar.getByRole('button', { name: '이미지 오른쪽 정렬' }).click(); + const imageButton = page.getByRole('button', { name: '이미지', exact: true }); await imageButton.hover(); await expect(imageButton).toHaveCSS('border-color', 'rgb(157, 200, 240)'); @@ -693,11 +724,54 @@ test('finance editor preserves Ref formatting controls and uploads images throug expect(state.noticeMutationInput).toContain('background-color: rgb(254, 220, 186)'); expect(state.noticeMutationInput).toContain('text-align: center'); expect(state.noticeMutationInput).toContain('
'); + expect(state.noticeMutationInput).toContain('class="custom-image-align-right"'); expect(state.noticeMutationInput).toContain( 'https://sam-image.hided.net/uploads/core2026/0123456789abcdef0123456789abcdef.webp' ); }); +test('recruitment editor keeps the Ref 870px content width in desktop and scales it to 500px on mobile', async ({ + page, +}) => { + await installFixture(page, { role: 'head', rate: 20 }); + await page.setViewportSize({ width: 1000, height: 900 }); + await gotoOffice(page, 'nation/finance'); + await page.getByRole('button', { name: '임관 권유문 수정' }).click(); + + const form = page.locator('#scout-message-form'); + const editorFrame = form.locator('.legacy-html-editor'); + const desktop = await form.evaluate((element) => { + const frame = element.querySelector('.legacy-html-editor')!; + const formRect = element.getBoundingClientRect(); + const frameRect = frame.getBoundingClientRect(); + return { + formWidth: formRect.width, + frameWidth: frameRect.width, + leftInset: frameRect.left - formRect.left, + rightInset: formRect.right - frameRect.right, + }; + }); + expect(desktop.formWidth).toBe(1000); + expect(desktop.frameWidth).toBe(870); + expect(desktop.leftInset).toBe(130); + expect(desktop.rightInset).toBe(0); + + await page.setViewportSize({ width: 500, height: 900 }); + const mobile = await editorFrame.evaluate((element) => { + const rect = element.getBoundingClientRect(); + return { + visualWidth: rect.width, + sourceWidth: element.clientWidth, + toolbarWidth: element.querySelector('[role="toolbar"]')!.getBoundingClientRect().width, + }; + }); + expect(mobile.sourceWidth).toBe(870); + expect(mobile.visualWidth).toBeCloseTo(500, 1); + expect(mobile.toolbarWidth).toBeCloseTo(500, 1); + expect(await page.locator('.page-finance').evaluate((element) => element.scrollWidth)).toBeLessThanOrEqual(500); + await screenshot(page, 'core-finance-scout-editor-mobile.png'); +}); + test('finance adopts the server-purified notice and scout message before rendering the saved preview', async ({ page, }) => { diff --git a/app/game-frontend/src/components/main/CommandListPanel.vue b/app/game-frontend/src/components/main/CommandListPanel.vue index 260037dd..23588718 100644 --- a/app/game-frontend/src/components/main/CommandListPanel.vue +++ b/app/game-frontend/src/components/main/CommandListPanel.vue @@ -3,6 +3,7 @@ import { computed, onUnmounted, ref, watch } from 'vue'; import { addMinutes } from 'date-fns'; import ReservedCommandEditor from '../command/ReservedCommandEditor.vue'; import { formatLocalDateTime, formatLocalTimeSeconds } from '../../utils/legacyDateTime'; +import { projectServerClock, sampleServerClock, type SampledServerClock } from '../../utils/serverClockProjection'; import type { CommandMapData, CommandMapLayout, @@ -15,7 +16,7 @@ const props = defineProps<{ commandTable: CommandTable | null; loading: boolean; reservedGeneralTurns: Array<{ index: number; action: string; args?: unknown }> | null; - general: { id: number; turnTime?: string } | null; + general: { id: number; turnTime?: string; nextTurnMonthOffset?: 0 | 1 } | null; currentYear?: number; currentMonth?: number; turnTermMinutes?: number; @@ -44,13 +45,19 @@ const labelMap = computed(() => { return result; }); +const firstReservedMonth = computed( + () => + (props.currentYear ?? 0) * 12 + + (props.currentMonth ?? 1) - + 1 + + (props.general?.nextTurnMonthOffset ?? 0) +); + const rows = computed(() => { const base = props.general?.turnTime ? new Date(props.general.turnTime) : null; const term = props.turnTermMinutes ?? 0; - const baseYear = props.currentYear ?? 0; - const baseMonth = props.currentMonth ?? 1; return (props.reservedGeneralTurns ?? []).map((turn, offset) => { - const absoluteMonth = baseYear * 12 + baseMonth - 1 + offset; + const absoluteMonth = firstReservedMonth.value + offset; const date = base && Number.isFinite(base.getTime()) ? addMinutes(base, offset * term) : null; return { ...turn, @@ -70,9 +77,7 @@ const rows = computed(() => { const autonomousUntil = computed(() => { if (props.autorunLimit == null) return null; - const baseYear = props.currentYear ?? 0; - const baseMonth = props.currentMonth ?? 1; - const currentAbsoluteMonth = baseYear * 12 + baseMonth - 1; + const currentAbsoluteMonth = firstReservedMonth.value; const lastAutonomousMonth = props.autorunLimit - 1; if (lastAutonomousMonth < currentAbsoluteMonth) return null; @@ -90,27 +95,20 @@ const autonomousUntil = computed(() => { const currentServerTime = ref('--:--:--'); const MAX_SERVER_CLOCK_TIMER_DELAY_MS = 60_000; -let sampledServerTimeMs: number | null = null; -let sampledClientTimeMs = 0; -let sampledStartDelayMs: number | null = 0; +let serverClockSample: SampledServerClock | null = null; let serverClockTimer: ReturnType | undefined; const updateServerClock = () => { if (serverClockTimer !== undefined) clearTimeout(serverClockTimer); serverClockTimer = undefined; - if (sampledServerTimeMs === null) { + if (serverClockSample === null) { currentServerTime.value = '--:--:--'; return; } - const clientElapsedMs = Math.max(0, Date.now() - sampledClientTimeMs); - const elapsedGameMs = - props.clockMode === 'manual' || sampledStartDelayMs === null - ? 0 - : Math.max(0, clientElapsedMs - sampledStartDelayMs); - const projectedTime = new Date(sampledServerTimeMs + elapsedGameMs); + const { clientElapsedMs, time: projectedTime } = projectServerClock(serverClockSample); currentServerTime.value = formatLocalTimeSeconds(projectedTime); - if (props.clockMode !== 'manual' && sampledStartDelayMs !== null) { - const untilStartMs = sampledStartDelayMs - clientElapsedMs; + if (serverClockSample.clockMode !== 'manual' && serverClockSample.startDelayMs !== null) { + const untilStartMs = serverClockSample.startDelayMs - clientElapsedMs; serverClockTimer = setTimeout( updateServerClock, untilStartMs > 0 @@ -123,21 +121,7 @@ const updateServerClock = () => { watch( () => [props.serverTime, props.serverWallTime, props.clockMode, props.clockRunning, props.clockStartsAt] as const, ([serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt]) => { - const parsed = serverTime ? new Date(serverTime).getTime() : Number.NaN; - sampledServerTimeMs = Number.isFinite(parsed) ? parsed : null; - sampledClientTimeMs = Date.now(); - if (clockMode === 'manual') { - sampledStartDelayMs = null; - } else if (clockRunning !== false) { - sampledStartDelayMs = 0; - } else { - const wallTimeMs = serverWallTime ? new Date(serverWallTime).getTime() : Number.NaN; - const startsAtMs = clockStartsAt ? new Date(clockStartsAt).getTime() : Number.NaN; - sampledStartDelayMs = - Number.isFinite(wallTimeMs) && Number.isFinite(startsAtMs) - ? Math.max(0, startsAtMs - wallTimeMs) - : null; - } + serverClockSample = sampleServerClock({ serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt }); updateServerClock(); }, { immediate: true } diff --git a/app/game-frontend/src/components/main/MainFrontStatus.vue b/app/game-frontend/src/components/main/MainFrontStatus.vue index d4e5000f..b8e5d1d2 100644 --- a/app/game-frontend/src/components/main/MainFrontStatus.vue +++ b/app/game-frontend/src/components/main/MainFrontStatus.vue @@ -1,10 +1,26 @@