feat: apply feedback updates and streamline online delivery
Publish GitHub Pages output / publish (push) Successful in 34s

This commit is contained in:
2026-09-01 22:21:45 +09:00
parent 98d5575463
commit c0f4060dec
36 changed files with 447 additions and 471 deletions
+1 -74
View File
@@ -1,23 +1,9 @@
<script lang="ts">
import { onMount } from 'svelte';
import { dev } from '$app/environment';
import updateHistoryMarkdown from '../../../UPDATES.md?raw';
import { renderReleaseMarkdown } from '$lib/release-notes/markdown';
import { currentAppVersion, releaseNotes } from '$lib/release-notes/release-note-store';
import { versionTagIsNewer } from '$lib/release-notes/version';
import { parseUpdateHistoryDocument } from '$lib/update-history-document.ts';
let previewUpdate = false;
const updateHistoryDocument = parseUpdateHistoryDocument(updateHistoryMarkdown);
onMount(() => {
previewUpdate = dev && new URLSearchParams(window.location.search).get('previewUpdate') === '1';
void releaseNotes.load();
});
$: latestRelease = $releaseNotes.releases[0] ?? null;
$: updateAvailable = latestRelease !== null && (previewUpdate || versionTagIsNewer(latestRelease.tagName, currentAppVersion));
function updatedDateTime(value: string | null): string {
if (!value) return '시각 미등록';
const date = new Date(value);
@@ -32,91 +18,32 @@
}).format(date);
}
function publishedDate(value: string): string {
const date = new Date(value);
if (Number.isNaN(date.getTime())) return value;
return new Intl.DateTimeFormat('ko-KR', {
year: 'numeric',
month: 'long',
day: 'numeric'
}).format(date);
}
</script>
<aside class:available={updateAvailable} class="update-notice" aria-live="polite">
<aside class="update-notice" aria-live="polite">
<div class="notice-header">
<div class="version-summary">
<span class="label">최근 업데이트</span>
<strong><time datetime={updateHistoryDocument.updatedAt ?? undefined}>{updatedDateTime(updateHistoryDocument.updatedAt)}</time></strong>
{#if previewUpdate}
<span class="status"><b>업데이트 알림 미리보기</b></span>
{:else if updateAvailable}
<span class="status"><b>{latestRelease.tagName}</b> 업데이트를 사용할 수 있습니다.</span>
{/if}
</div>
<a class="action" href="/updates">업데이트 내역 확인 <span aria-hidden="true">→</span></a>
</div>
{#if updateAvailable && latestRelease}
<section class="latest-note" aria-labelledby="latest-release-title">
<header>
<div>
<span class="release-tag">{latestRelease.tagName}</span>
<h2 id="latest-release-title">{latestRelease.name}</h2>
</div>
<time datetime={latestRelease.publishedAt}>{publishedDate(latestRelease.publishedAt)}</time>
</header>
{#if latestRelease.body.trim()}
<div class="markdown-body">{@html renderReleaseMarkdown(latestRelease.body)}</div>
{:else}
<p class="no-notes">작성된 릴리즈 노트가 없습니다.</p>
{/if}
</section>
{/if}
</aside>
<style>
.update-notice { margin-bottom: 12px; border: 1px solid #2c3440; border-radius: 12px; background: #151a22; overflow: hidden; }
.update-notice.available { border-color: rgb(237 139 181 / 38%); background: rgb(237 139 181 / 6%); }
.notice-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 18px; }
.version-summary { display: flex; align-items: baseline; min-width: 0; gap: 10px; }
.label { color: #7f8998; font-size: 13px; font-weight: 800; }
strong { color: #eef1f5; font-size: 15px; }
.status { color: #a4adba; font-size: 14px; }
.status b { color: #f0a1c3; }
.action { flex: 0 0 auto; color: #aab3c0; font-size: 14px; font-weight: 800; text-decoration: none; }
.available .action { color: #f2a6c6; }
.action span { margin-left: 4px; }
.action:hover { color: #ffd0e2; }
.action:focus-visible { outline: 3px solid rgb(239 139 182 / 28%); outline-offset: 3px; }
.latest-note { padding: 24px 26px 28px; border-top: 1px solid rgb(237 139 181 / 20%); background: rgb(13 16 22 / 38%); }
.latest-note > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid rgb(255 255 255 / 8%); }
.release-tag { color: #f0a1c3; font-size: 13px; font-weight: 900; }
.latest-note h2 { margin: 6px 0 0; color: #edf0f5; font-size: 22px; letter-spacing: -.025em; }
.latest-note time { flex: 0 0 auto; color: #858f9e; font-size: 13px; }
.markdown-body { padding-top: 18px; color: #b7bfca; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.markdown-body :global(:first-child) { margin-top: 0; }
.markdown-body :global(:last-child) { margin-bottom: 0; }
.markdown-body :global(h1), .markdown-body :global(h2), .markdown-body :global(h3), .markdown-body :global(h4) { margin: 1.35em 0 .5em; color: #eef1f5; line-height: 1.35; }
.markdown-body :global(h1) { font-size: 22px; }
.markdown-body :global(h2) { font-size: 19px; }
.markdown-body :global(h3) { font-size: 17px; }
.markdown-body :global(p), .markdown-body :global(ul), .markdown-body :global(ol), .markdown-body :global(blockquote), .markdown-body :global(pre) { margin: .75em 0; }
.markdown-body :global(ul), .markdown-body :global(ol) { padding-left: 1.5em; }
.markdown-body :global(a) { color: #f0a1c3; text-underline-offset: 3px; }
.markdown-body :global(code) { padding: 2px 5px; border-radius: 5px; color: #e8b3ca; background: #202631; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .9em; }
.markdown-body :global(pre) { padding: 14px; border: 1px solid #303846; border-radius: 9px; background: #10141a; overflow-x: auto; }
.markdown-body :global(pre code) { padding: 0; color: #c9d0da; background: transparent; }
.markdown-body :global(blockquote) { padding-left: 14px; border-left: 3px solid #596475; color: #929cab; }
.markdown-body :global(img) { max-width: 100%; border-radius: 9px; }
.no-notes { margin: 18px 0 0; color: #818b99; font-size: 14px; }
@media (max-width: 680px) {
.notice-header { align-items: flex-start; flex-direction: column; gap: 8px; }
.version-summary { align-items: flex-start; flex-wrap: wrap; }
.latest-note { padding: 22px 18px 24px; }
.latest-note > header { flex-direction: column; gap: 8px; }
}
</style>
+14 -14
View File
@@ -264,8 +264,8 @@
"difficulty": "expert",
"difficultyLevel": 25,
"durationSeconds": 108,
"scoreRatio": 265.0822413749041,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 252.13563829787233,
"scoreCalibrationSource": "measured",
"totalNotes": 877,
"singerType": "solo",
"singerCharacterIds": [
@@ -744,8 +744,8 @@
"difficulty": "expert",
"difficultyLevel": 24,
"durationSeconds": 97,
"scoreRatio": 192.63348422390104,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 195.1219628964692,
"scoreCalibrationSource": "measured",
"totalNotes": 596,
"singerType": "solo",
"singerCharacterIds": [
@@ -840,8 +840,8 @@
"difficulty": "expert",
"difficultyLevel": 25,
"durationSeconds": 133,
"scoreRatio": 280.8271276035182,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 280.4822485207101,
"scoreCalibrationSource": "measured",
"totalNotes": 1022,
"singerType": "solo",
"singerCharacterIds": [
@@ -1000,8 +1000,8 @@
"difficulty": "expert",
"difficultyLevel": 24,
"durationSeconds": 130,
"scoreRatio": 279.0075534874758,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 290.2132653061224,
"scoreCalibrationSource": "measured",
"totalNotes": 947,
"singerType": "solo",
"singerCharacterIds": [
@@ -2538,8 +2538,8 @@
"difficulty": "expert",
"difficultyLevel": 26,
"durationSeconds": 139,
"scoreRatio": 379.73397776840375,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 373.73061760841,
"scoreCalibrationSource": "measured",
"totalNotes": 1159,
"singerType": "solo",
"singerCharacterIds": [
@@ -5252,8 +5252,8 @@
"difficulty": "expert",
"difficultyLevel": 27,
"durationSeconds": 136,
"scoreRatio": 313.7465654376337,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 316.33724653148346,
"scoreCalibrationSource": "measured",
"totalNotes": 1088,
"singerType": "group",
"singerCharacterIds": [
@@ -5356,8 +5356,8 @@
"difficulty": "expert",
"difficultyLevel": 26,
"durationSeconds": 104,
"scoreRatio": 305.22427442474174,
"scoreCalibrationSource": "local-estimated-v1",
"scoreRatio": 292.9459119496856,
"scoreCalibrationSource": "measured",
"totalNotes": 921,
"singerType": "solo",
"singerCharacterIds": [
+15
View File
@@ -0,0 +1,15 @@
import test from 'node:test';
import assert from 'node:assert/strict';
import { cardMatchesSearch } from './card-search.ts';
test('IRyS와 AZKi를 한글 별칭으로 검색한다', () => {
assert.equal(cardMatchesSearch({ name: 'IRyS' }, '아이리스'), true);
assert.equal(cardMatchesSearch({ name: 'AZKi' }, '아즈키'), true);
});
test('기존 영문 이름과 버전 검색을 유지한다', () => {
assert.equal(cardMatchesSearch({ name: 'IRyS', versionName: '수영복' }, 'irys'), true);
assert.equal(cardMatchesSearch({ name: 'IRyS', versionName: '수영복' }, '수영복'), true);
assert.equal(cardMatchesSearch({ name: 'IRyS' }, '이리스'), false);
assert.equal(cardMatchesSearch({ name: 'IRyS' }, '아즈키'), false);
});
+24
View File
@@ -0,0 +1,24 @@
export type SearchableCard = {
name: string;
versionName?: string | null;
};
const memberAliases: Readonly<Record<string, readonly string[]>> = {
irys: ['아이리스'],
azki: ['아즈키']
};
function normalizeSearchText(value: string): string {
return value.trim().toLocaleLowerCase('ko-KR').replace(/\s+/g, ' ');
}
export function cardMatchesSearch(card: SearchableCard, query: string): boolean {
const normalizedQuery = normalizeSearchText(query);
if (!normalizedQuery) return true;
const aliases = memberAliases[normalizeSearchText(card.name)] ?? [];
const nativeText = normalizeSearchText([card.name, card.versionName ?? ''].join(' '));
return (
nativeText.includes(normalizedQuery) ||
aliases.some((alias) => normalizeSearchText(alias).startsWith(normalizedQuery))
);
}
+10 -1
View File
@@ -1,7 +1,7 @@
import test from 'node:test';
import assert from 'node:assert/strict';
import { events } from '../data/events.ts';
import { activeEventAt, eventBonusBreakdown, eventChallengeSongScoreBonusPercent, eventPointIndex } from './event-optimization.ts';
import { activeEventAt, eventBonusBreakdown, eventChallengeSongScoreBonusPercent, eventOptimizationCardEligible, eventPointIndex } from './event-optimization.ts';
const currentEvent = events[0];
@@ -11,6 +11,15 @@ test('이벤트 기간 안에서만 진행 중 이벤트를 반환한다', () =>
assert.equal(activeEventAt(events, Date.parse('2026-09-06T11:00:00.000Z')), null);
});
test('이벤트 최적화는 모든 4·5성과 보너스 멤버의 저등급 카드를 후보로 사용한다', () => {
const bonusCharacters = new Set(['bonus']);
assert.equal(eventOptimizationCardEligible({ id: 'five', characterId: 'other', rarity: 5 }, bonusCharacters), true);
assert.equal(eventOptimizationCardEligible({ id: 'four', characterId: 'other', rarity: 4 }, bonusCharacters), true);
assert.equal(eventOptimizationCardEligible({ id: 'bonus-three', characterId: 'bonus', rarity: 3 }, bonusCharacters), true);
assert.equal(eventOptimizationCardEligible({ id: 'regular-three', characterId: 'other', rarity: 3 }, bonusCharacters), false);
});
test('편성·신규 카드·개화 보너스를 카드별로 합산한다', () => {
const cards = [
{ id: currentEvent.featuredCardIds[0], characterId: currentEvent.bonusCharacterIds[0], rarity: 5 },
+4
View File
@@ -25,6 +25,10 @@ export type EventBonusBreakdown = {
totalPercent: number;
};
export function eventOptimizationCardEligible(card: EventCard, bonusCharacterIds: ReadonlySet<string>): boolean {
return card.rarity === 5 || card.rarity === 4 || bonusCharacterIds.has(card.characterId);
}
export function activeEventAt(events: readonly EventDefinition[], now: number): EventDefinition | null {
return events.find((event) => Date.parse(event.startsAt) <= now && now <= Date.parse(event.endsAt)) ?? null;
}
+1
View File
@@ -1,5 +1,6 @@
export * from './active-probability.ts';
export * from './card-adapter.ts';
export * from './card-search.ts';
export * from './combination-search.ts';
export * from './awakening-requirements.ts';
export * from './board-effects.ts';
@@ -1,67 +0,0 @@
import assert from 'node:assert/strict';
import test from 'node:test';
import { renderReleaseMarkdown } from './markdown.ts';
import { ReleaseNoteService, type ReleaseNoteConfig } from './release-note-service.ts';
import { versionTagIsNewer, versionTagMatches } from './version.ts';
const config: ReleaseNoteConfig = {
owner: 'owner',
repo: 'repo',
includePrereleases: false,
perPage: 30,
timeoutMs: 100
};
function response(payload: unknown, ok = true): Response {
return { ok, json: async () => payload } as Response;
}
test('정식 릴리즈만 최신순으로 변환하고 앱 실행 중 결과를 재사용한다', async () => {
let requests = 0;
const service = new ReleaseNoteService(config, async () => {
requests += 1;
return response([
{ id: 1, tag_name: 'v1.0.0', name: null, published_at: '2026-01-01T00:00:00Z', body: null, html_url: 'https://example.com/1', draft: false, prerelease: false },
{ id: 3, tag_name: 'v1.2.0-beta', name: 'beta', published_at: '2026-03-01T00:00:00Z', body: '', html_url: 'https://example.com/3', draft: false, prerelease: true },
{ id: 2, tag_name: 'v1.1.0', name: 'one one', published_at: '2026-02-01T00:00:00Z', body: '# 변경', html_url: 'https://example.com/2', draft: false, prerelease: false },
{ id: 4, tag_name: 'v9.0.0', name: 'draft', published_at: '2026-04-01T00:00:00Z', body: '', html_url: 'https://example.com/4', draft: true, prerelease: false }
]);
});
const first = await service.load({ online: true });
const second = await service.load({ online: true });
assert.equal(requests, 1);
assert.deepEqual(first, second);
assert.deepEqual(first?.map((release) => release.tagName), ['v1.1.0', 'v1.0.0']);
assert.equal(first?.[1].name, 'v1.0.0');
assert.equal(first?.[1].body, '');
});
test('오프라인 및 API 실패는 예외 없이 unavailable 값으로 캐시한다', async () => {
let requests = 0;
const service = new ReleaseNoteService(config, async () => {
requests += 1;
return response({}, false);
});
assert.equal(await service.load({ online: false }), null);
assert.equal(await service.load({ online: true }), null);
assert.equal(requests, 0);
});
test('현재 버전 표시는 v 접두사와 빌드 메타데이터를 무시한다', () => {
assert.equal(versionTagMatches('v1.0.4', '1.0.4'), true);
assert.equal(versionTagMatches('1.0.4+offline', 'v1.0.4'), true);
assert.equal(versionTagMatches('v1.0.3', '1.0.4'), false);
assert.equal(versionTagIsNewer('v1.1.0', '1.0.4'), true);
assert.equal(versionTagIsNewer('v1.0.4', '1.0.4'), false);
assert.equal(versionTagIsNewer('v1.0.3', '1.0.4'), false);
});
test('릴리즈 Markdown의 원문 HTML과 위험한 링크를 실행 가능한 태그로 만들지 않는다', () => {
const rendered = renderReleaseMarkdown('<script>alert(1)</script> [위험](javascript:alert(1))');
assert.equal(rendered.includes('<script>'), false);
assert.equal(rendered.includes('href="javascript:'), false);
assert.match(rendered, /&lt;script&gt;/);
});
@@ -1,137 +0,0 @@
export type ReleaseNote = {
id: number;
tagName: string;
name: string;
publishedAt: string;
body: string;
url: string;
};
export type ReleaseNoteConfig = {
owner: string;
repo: string;
includePrereleases: boolean;
perPage: number;
timeoutMs: number;
};
type GitHubRelease = {
id?: unknown;
tag_name?: unknown;
name?: unknown;
published_at?: unknown;
body?: unknown;
html_url?: unknown;
draft?: unknown;
prerelease?: unknown;
};
type LoadOptions = {
online?: boolean;
};
export const RELEASE_NOTE_CONFIG: ReleaseNoteConfig = {
owner: 'DD4SN',
repo: 'HolodoriCalc',
// 정식 릴리즈만 노출한다. 베타 릴리즈도 보여주려면 true로 변경한다.
includePrereleases: false,
perPage: 30,
timeoutMs: 6_000
};
export const RELEASES_PAGE_URL = `https://github.com/${RELEASE_NOTE_CONFIG.owner}/${RELEASE_NOTE_CONFIG.repo}/releases`;
function browserIsOnline(): boolean {
return typeof navigator !== 'undefined'
&& navigator.onLine
&& typeof location !== 'undefined'
&& location.protocol !== 'file:';
}
function toReleaseNote(value: GitHubRelease): ReleaseNote | null {
if (typeof value.id !== 'number'
|| typeof value.tag_name !== 'string'
|| typeof value.published_at !== 'string'
|| typeof value.html_url !== 'string') return null;
return {
id: value.id,
tagName: value.tag_name,
name: typeof value.name === 'string' && value.name.trim() ? value.name : value.tag_name,
publishedAt: value.published_at,
body: typeof value.body === 'string' ? value.body : '',
url: value.html_url
};
}
export class ReleaseNoteService {
private readonly config: ReleaseNoteConfig;
private readonly fetcher: typeof fetch | undefined;
private cached: ReleaseNote[] | null | undefined;
private pending: Promise<ReleaseNote[] | null> | null = null;
constructor(
config: ReleaseNoteConfig = RELEASE_NOTE_CONFIG,
fetcher: typeof fetch | undefined = globalThis.fetch?.bind(globalThis)
) {
this.config = config;
this.fetcher = fetcher;
}
get releasesUrl(): string {
return `https://github.com/${this.config.owner}/${this.config.repo}/releases`;
}
async load(options: LoadOptions = {}): Promise<ReleaseNote[] | null> {
if (this.cached !== undefined) return this.cached;
if (this.pending) return this.pending;
const online = options.online ?? browserIsOnline();
if (!online || !this.fetcher) {
this.cached = null;
return null;
}
this.pending = this.request();
try {
this.cached = await this.pending;
return this.cached;
} finally {
this.pending = null;
}
}
private async request(): Promise<ReleaseNote[] | null> {
const controller = new AbortController();
const timeout = setTimeout(() => controller.abort(), this.config.timeoutMs);
const apiUrl = `https://api.github.com/repos/${this.config.owner}/${this.config.repo}/releases?per_page=${this.config.perPage}`;
try {
const response = await this.fetcher!(apiUrl, {
headers: {
accept: 'application/vnd.github+json',
'X-GitHub-Api-Version': '2022-11-28'
},
signal: controller.signal
});
if (!response.ok) return null;
const payload: unknown = await response.json();
if (!Array.isArray(payload)) return null;
return payload
.filter((release): release is GitHubRelease => Boolean(release) && typeof release === 'object')
.filter((release) => release.draft !== true)
.filter((release) => this.config.includePrereleases || release.prerelease !== true)
.map(toReleaseNote)
.filter((release): release is ReleaseNote => release !== null)
.sort((left, right) => Date.parse(right.publishedAt) - Date.parse(left.publishedAt));
} catch {
return null;
} finally {
clearTimeout(timeout);
}
}
}
export const releaseNoteService = new ReleaseNoteService();
@@ -1,34 +0,0 @@
import { writable } from 'svelte/store';
import packageInfo from '../../../package.json';
import { releaseNoteService, type ReleaseNote } from './release-note-service';
import { versionTagMatches } from './version';
export type ReleaseNoteStatus = 'idle' | 'loading' | 'available' | 'unavailable';
export type ReleaseNoteState = {
status: ReleaseNoteStatus;
releases: ReleaseNote[];
};
const state = writable<ReleaseNoteState>({ status: 'idle', releases: [] });
let loadStarted = false;
export const currentAppVersion = packageInfo.version;
export const releaseNotes = {
subscribe: state.subscribe,
async load(): Promise<void> {
if (loadStarted) return;
loadStarted = true;
state.set({ status: 'loading', releases: [] });
const loaded = await releaseNoteService.load();
state.set(loaded && loaded.length > 0
? { status: 'available', releases: loaded }
: { status: 'unavailable', releases: [] });
}
};
export function isCurrentVersionTag(tagName: string, currentVersion = currentAppVersion): boolean {
return versionTagMatches(tagName, currentVersion);
}
-20
View File
@@ -1,20 +0,0 @@
export function normalizedVersion(version: string): string {
return version.trim().replace(/^v/i, '').split('+', 1)[0];
}
export function versionTagMatches(tagName: string, currentVersion: string): boolean {
return normalizedVersion(tagName) === normalizedVersion(currentVersion);
}
export function versionTagIsNewer(tagName: string, currentVersion: string): boolean {
const candidate = normalizedVersion(tagName).split('-', 1)[0].split('.').map((part) => Number.parseInt(part, 10) || 0);
const current = normalizedVersion(currentVersion).split('-', 1)[0].split('.').map((part) => Number.parseInt(part, 10) || 0);
const length = Math.max(candidate.length, current.length, 3);
for (let index = 0; index < length; index += 1) {
const difference = (candidate[index] ?? 0) - (current[index] ?? 0);
if (difference !== 0) return difference > 0;
}
return false;
}