onClick()}
- on:keypress|preventDefault={(_) => onClick()}
+ on:click|preventDefault={onClick}
+ on:keypress|preventDefault={onClick}
+ role="button"
+ tabindex="0"
>
) {
this.id = id;
@@ -44,9 +44,9 @@ class Node {
* edges between them, whose uniqueness needs to be accounted for.
*/
class Edge {
- start: Node;
- end: Node;
- key: EdgeKeyType;
+ readonly start: Node;
+ readonly end: Node;
+ readonly key: EdgeKeyType;
constructor(node1: Node, node2: Node, key: Readonly) {
this.start = node1;
this.end = node2;
@@ -100,7 +100,7 @@ export default class Graph {
// case two: cycle of len 2
const start = this.getNode(startId);
- const endToEdge: Map = new Map();
+ const endToEdge = new Map();
for (const edge of start.edges) {
if (endToEdge.has(edge.end)) {
@@ -115,12 +115,12 @@ export default class Graph {
// case three: cycle of len > 2
const q = [start];
- const layers: Map = new Map(); // maps node to layer
- const prev: Map = new Map(); // maps node to its associated edge
+ const layers = new Map(); // maps node to layer
+ const prev = new Map(); // maps node to its associated edge
layers.set(start, 0);
prev.set(start, null);
- while (q !== undefined && q.length > 0) {
+ while (q.length > 0) {
const curr = q.shift() as Node;
const layer = layers.get(curr) as number;
diff --git a/src/lib/games/quantum-tictactoe/OfflineApp.svelte b/src/lib/games/quantum-tictactoe/OfflineApp.svelte
index d23a689..99423b7 100644
--- a/src/lib/games/quantum-tictactoe/OfflineApp.svelte
+++ b/src/lib/games/quantum-tictactoe/OfflineApp.svelte
@@ -35,44 +35,46 @@ let message = state.status;
$: choices =
state.collapseSquare !== null && state.cycleMarks !== null
- ? ((
- state.qSquares[state.collapseSquare] as Exclude, []> as string[]
- )?.filter((choice) =>
- (state.cycleMarks as Exclude).includes(choice as MarkType)
+ ? ((state.qSquares[state.collapseSquare] as Exclude, []>).filter(
+ (choice) => (state.cycleMarks as Exclude).includes(choice)
) as MaxLengthArray | undefined)
: undefined;
-function handleSquareClick(i: SquareType) {
+const handleSquareClick = (i: SquareType): void => {
const status = game.handleSquareClick(i);
if (import.meta.env.DEV) console.table(game.state);
state = { ...game.state };
message = status;
-}
+ return;
+};
-function handleCollapse(mark: MarkType) {
+const handleCollapse = (mark: MarkType): void => {
const status = game.handleCollapse(mark);
state = { ...game.state };
message = status;
-}
+ return;
+};
-function handleNextGameClick() {
+const handleNextGameClick = (): void => {
game = new Game();
game.setState({ scores: { ...state.scores } });
gameCount += 1;
state = { ...game.state };
message = `The ${getOrdinal(gameCount)} game!\n${game.state.status}`;
-}
+ return;
+};
-function handleResetGameClick() {
+const handleResetGameClick = (): void => {
game = new Game();
gameCount = 1;
state = { ...game.state };
message = game.state.status;
-}
+ return;
+};
diff --git a/src/lib/games/quantum-tictactoe/GameInfo.svelte b/src/lib/games/quantum-tictactoe/GameInfo.svelte
index 9976e97..01cd2c5 100644
--- a/src/lib/games/quantum-tictactoe/GameInfo.svelte
+++ b/src/lib/games/quantum-tictactoe/GameInfo.svelte
@@ -40,6 +40,11 @@ export let onNextGameClick: () => void;
// Reset scores & Go to new game
export let onResetGameClick: () => void;
+
+// click a square
+const onClick = (choice: MarkType) => (): void => {
+ onChoiceClick(choice);
+};
diff --git a/src/lib/games/quantum-tictactoe/Graph.ts b/src/lib/games/quantum-tictactoe/Graph.ts
index 755f0d5..a0400eb 100644
--- a/src/lib/games/quantum-tictactoe/Graph.ts
+++ b/src/lib/games/quantum-tictactoe/Graph.ts
@@ -32,7 +32,7 @@ type EdgesType = {
};
class Node {
- id: NodeIdType;
+ readonly id: NodeIdType;
edges: Edge[];
constructor(id: Readonly
@@ -49,8 +54,10 @@ export let onResetGameClick: () => void;
{#each choices as choice (choice)}
@@ -70,6 +79,8 @@ export let onResetGameClick: () => void;
class="btn reset-game"
on:click|preventDefault={onResetGameClick}
on:keypress|preventDefault={onResetGameClick}
+ role="button"
+ tabindex="0"
>
Reset
onChoiceClick(choice)}
- on:keypress|preventDefault={(_) => onChoiceClick(choice)}
+ on:click|preventDefault={onClick(choice)}
+ on:keypress|preventDefault={onClick(choice)}
+ role="button"
+ tabindex="0"
>
{choice[0]}{choice[1]}
@@ -63,6 +70,8 @@ export let onResetGameClick: () => void;
class="btn next-game"
on:click|preventDefault={onNextGameClick}
on:keypress|preventDefault={onNextGameClick}
+ role="button"
+ tabindex="0"
>
Next
diff --git a/src/lib/games/quantum-tictactoe/QuantumTTT.ts b/src/lib/games/quantum-tictactoe/QuantumTTT.ts
index b5fff5f..078bece 100644
--- a/src/lib/games/quantum-tictactoe/QuantumTTT.ts
+++ b/src/lib/games/quantum-tictactoe/QuantumTTT.ts
@@ -32,10 +32,10 @@ import type {
import Graph from './Graph';
export default class QuantumTTT {
- g: Graph;
+ protected _g: Graph;
state: StateType;
constructor() {
- this.g = new Graph();
+ this._g = new Graph();
this.timer = this.timer.bind(this);
this.state = {
cSquares: [null, null, null, null, null, null, null, null, null],
@@ -122,19 +122,19 @@ export default class QuantumTTT {
(qSquares[i] as Exclude<(typeof qSquares)[typeof i], []>).push(marker);
else qSquares[i] = [marker];
- if (!this.g.hasNode(i)) this.g.addNode(i);
- if (this.isSecondMove()) this.g.addEdge(this.state.lastMove as SquareType, i, marker);
+ if (!this._g.hasNode(i)) this._g.addNode(i);
+ if (this.isSecondMove()) this._g.addEdge(this.state.lastMove as SquareType, i, marker);
// if cycle is not null, there is a cyclic entanglement.
- const cycle = this.g.getCycle(i);
+ const cycle = this._g.getCycle(i);
if (cycle) {
const msg =
'循環もつれが発生しました！\n' +
`プレイヤー${this.notWhoseTurn()}はマークを確定させるマスを選択してください。`;
this.setState({
qSquares,
- cycleSquares: cycle && (cycle[0] as MaxLengthArray),
- cycleMarks: cycle && (cycle[1] as MaxLengthArray),
+ cycleSquares: cycle[0] as MaxLengthArray,
+ cycleMarks: cycle[1] as MaxLengthArray,
lastMove: i
});
return `${msg}`;
@@ -203,7 +203,7 @@ export default class QuantumTTT {
return status;
}
- private _handleCollapseHelper(mark: MarkType, i: number, visited: Set) {
+ private _handleCollapseHelper(mark: MarkType, i: number, visited: Set): void {
const cSquares: StateType['cSquares'] = [...this.state.cSquares];
const qSquares: StateType['qSquares'] = [...this.state.qSquares];
cSquares[i] = mark;
@@ -211,12 +211,13 @@ export default class QuantumTTT {
this.setState({ cSquares, qSquares });
- for (const edge of this.g.getNode(i).edges) {
+ for (const edge of this._g.getNode(i).edges) {
if (!visited.has(edge.key)) {
visited.add(edge.key);
this._handleCollapseHelper(edge.key, edge.end.id, visited);
}
}
+ return;
}
isSecondMove(): boolean {
@@ -225,32 +226,11 @@ export default class QuantumTTT {
}
// pure functions to help with game logic in index.js
-function _getWinnerMsg(scores: Readonly<{ X: number; Y: number }>) {
- const winner = scores.X > scores.Y ? 'X' : 'Y';
- const loser = winner === 'X' ? 'Y' : 'X';
-
- if (scores.X + scores.Y === 1)
- return `${winner}の勝利です！！\n ${winner}は1.0ポイント \n ${loser}は0ポイント`;
-
- if (scores.X === 1.5 || scores.Y === 1.5)
- return (
- `${winner}が同時に2つの列を完成させました！！\n ${winner}は 1.5ポイント\n` +
- `${loser}は 0ポイント`
- );
-
- if (scores.X + scores.Y === 1.5)
- return (
- `両プレイヤーが同時に1列を完成させました。しかし、${winner}が先に並べました！` +
- ` ${winner}は 1.0ポイント` +
- `\n ${loser}は 0.5ポイント`
- );
-
- return 'どのプレイヤーも列を完成できていません';
-}
-
-type WinnersType = Array<[TurnNumType, PlayerType, ConstArray]>;
+type LineType = ConstArray;
+type WinnerType = [TurnNumType, PlayerType, LineType];
+type WinnersType = WinnerType[];
function _calculateWinners(squares: Readonly>): WinnersType {
- const lines: ConstArray, 8> = [
+ const lines = [
[0, 1, 2],
[3, 4, 5],
[6, 7, 8],
@@ -259,12 +239,12 @@ function _calculateWinners(squares: Readonly>): W
[2, 5, 8],
[0, 4, 8],
[2, 4, 6]
- ];
+ ] satisfies ConstArray;
const winners: WinnersType = [];
-
for (const line of lines) {
const [s1, s2, s3] = [squares[line[0]], squares[line[1]], squares[line[2]]];
+ // eslint-disable-next-line @typescript-eslint/prefer-string-starts-ends-with
if (s1 && s2 && s3 && s1[0] === s2[0] && s1[0] === s3[0]) {
const subscripts = [s1[1], s2[1], s3[1]].map(Number) as ConstArray;
winners.push([Math.max(...subscripts) as TurnNumType, s1[0] as PlayerType, line]);
@@ -274,25 +254,48 @@ function _calculateWinners(squares: Readonly>): W
return winners;
}
-function _calculateScores(squares: Readonly>) {
+type OneGameScoresType = Record;
+function _calculateScores(
+ squares: Readonly>
+): null | OneGameScoresType {
const winners = _calculateWinners(squares);
if (winners.length === 0 && squares.filter((x) => !x).length > 1) return null;
- winners.sort((line1, line2) => {
+ winners.sort((line1: Readonly, line2: Readonly): -1 | 0 | 1 => {
if (line1[0] < line2[0]) return 1;
if (line1[0] > line2[0]) return -1;
if (line1[1] === 'X') return -1;
return 0;
});
- const scores: {
- X: 0 | 0.5 | 1 | 1.5;
- Y: 0 | 0.5 | 1 | 1.5;
- } = { X: 0, Y: 0 };
+ const scores: OneGameScoresType = { X: 0, Y: 0 };
if (winners.length >= 1) scores[winners[0][1]] = 1;
if (winners.length >= 2) scores[winners[1][1]] += 0.5;
if (winners.length === 3) scores[winners[2][1]] += 0.5;
return scores;
}
+
+function _getWinnerMsg(scores: Readonly): StatusType {
+ const winner = scores.X > scores.Y ? 'X' : 'Y';
+ const loser = winner === 'X' ? 'Y' : 'X';
+
+ if (scores.X + scores.Y === 1)
+ return `${winner}の勝利です！！\n ${winner}は1.0ポイント \n ${loser}は0ポイント`;
+
+ if (scores.X === 1.5 || scores.Y === 1.5)
+ return (
+ `${winner}が同時に2つの列を完成させました！！\n ${winner}は 1.5ポイント\n` +
+ `${loser}は 0ポイント`
+ );
+
+ if (scores.X + scores.Y === 1.5)
+ return (
+ `両プレイヤーが同時に1列を完成させました。しかし、${winner}が先に並べました！` +
+ ` ${winner}は 1.0ポイント` +
+ `\n ${loser}は 0.5ポイント`
+ );
+
+ return 'どのプレイヤーも列を完成できていません';
+}
diff --git a/src/lib/types/svelte-scrollto.d.ts b/src/lib/types/svelte-scrollto.d.ts
deleted file mode 100644
index 1f89471..0000000
--- a/src/lib/types/svelte-scrollto.d.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import type * as SvelteEasing from 'svelte/easing';
-import type * as SvelteInternal from 'svelte/internal';
-
-declare module 'svelte-scrollto' {
- type ScrollToOption = Readonly<
- Partial<{
- container: string /** html tag */;
- duration: number /** milliseconds */;
- delay: number /** milliseconds */;
- offset: number /** pixels */;
- easing: SvelteEasing;
- onStart: SvelteInternal;
- onDone: SvelteInternal;
- onAborting: SvelteInternal;
- scrollX: boolean;
- scrollY: boolean;
- }>
- >;
- declare function scrollTo(option: ScrollToOption): void;
-}
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 02577d3..9d7002f 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
@@ -25,17 +33,7 @@ let footerHeight: number;
通常の（古典）三目並べと同じように、古典マークが１列に３つ並んだ時点でゲームは終了します。自分の古典マークを３つ並べたプレイヤーの勝利です‼ ただし、量子三目並べでは collapse - の後、いくつかの列に同時に古典マークが並ぶことがあります。この場合、できた列に最もあとのターンのマークを有している方の負けとなります。 + >です‼ +
+ ただし、量子三目並べでは collapse の後、いくつかの列に同時に古典マークが並ぶことがあります。この場合、できた列に最もあとのターンのマークを有している方の負けとなります。
diff --git a/src/routes/global.css b/src/routes/global.css
new file mode 100644
index 0000000..e72e457
--- /dev/null
+++ b/src/routes/global.css
@@ -0,0 +1,30 @@
+:root {
+ --theme-color: #1a5086;
+ --theme-color-rgb: 26, 80, 134;
+ --theme-light-color: #7a9de3;
+ --accent-color: #e45355;
+ --bg-light-color: #f0f7ff;
+ --bg-color: #ffffff;
+
+ --header-height: 64px;
+ --contents-width: 712px;
+ --contents-width-text: 512px;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+}
+
+#svelte {
+ width: 100%;
+ height: 100%;
+ min-height: 100vh;
+ box-sizing: border-box;
+ position: relative;
+ top: 0;
+}
+
+a {
+ text-decoration: none;
+}
diff --git a/src/service-worker/index.ts b/src/service-worker/index.ts
index ed2ced2..4be6104 100644
--- a/src/service-worker/index.ts
+++ b/src/service-worker/index.ts
@@ -11,7 +11,7 @@ self.addEventListener('install', (event) => {
event.waitUntil(
caches
.open(ASSETS)
- .then((cache) => cache.addAll(build))
+ .then(async (cache) => cache.addAll(build))
.then(() => {
void self.skipWaiting();
})
diff --git a/vite.config.ts b/vite.config.ts
index 0bdd88b..676378a 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -41,6 +41,7 @@ export default defineConfig({
enabled: true,
all: true,
reportsDirectory: './coverage',
+ reportOnFailure: true,
exclude: VITEST_COVERAGE_IGNORE_PATTERNS
},
typecheck: {
通常の（古典）三目並べと同じように、古典マークが１列に３つ並んだ時点でゲームは終了します。自分の古典マークを３つ並べたプレイヤーの勝利です‼ ただし、量子三目並べでは collapse - の後、いくつかの列に同時に古典マークが並ぶことがあります。この場合、できた列に最もあとのターンのマークを有している方の負けとなります。 + >です‼ +
+ ただし、量子三目並べでは collapse の後、いくつかの列に同時に古典マークが並ぶことがあります。この場合、できた列に最もあとのターンのマークを有している方の負けとなります。