diff --git a/src/life-game/LifeGameFunctions/PlayAndPause.js b/src/life-game/LifeGameFunctions/PlayAndPause.js
index d200c54..e592e9d 100644
--- a/src/life-game/LifeGameFunctions/PlayAndPause.js
+++ b/src/life-game/LifeGameFunctions/PlayAndPause.js
@@ -1,5 +1,11 @@
+let timerId = 0;
+
window.addEventListener("message", (event) => {
- if (event.data.type === "play-pause") {
- console.log("Play/Pause toggled");
+ if (event.data.type === "play") {
+ timer = "start";
+ timerId = setInterval(progressBoard, 1000);
+ } else if (event.data.type === "pause") {
+ timer = "stop";
+ clearInterval(timerId);
}
});
diff --git a/src/life-game/life-game.html b/src/life-game/life-game.html
index 6ec8751..c0099b7 100644
--- a/src/life-game/life-game.html
+++ b/src/life-game/life-game.html
@@ -6,17 +6,14 @@
第0世代
- 停止中
ボードのサイズ:
-
+
+
diff --git a/src/life-game/life-game.js b/src/life-game/life-game.js
index 3ee8f19..0254ebd 100644
--- a/src/life-game/life-game.js
+++ b/src/life-game/life-game.js
@@ -1,5 +1,5 @@
"use strict";
-let timerId = 0;
+
let timer = "stop";
let generationFigure = 0;
@@ -40,10 +40,7 @@ function deadCellJudge(around) {
}
const generation = document.getElementById("generation"); //世代を表す文（第+数字+世代)
-const isProgress = document.getElementById("timer"); //進行中かを表す文(再生中/停止中)
//BUTTON
-const startButton = document.getElementById("startbutton");
-const stopButton = document.getElementById("stopbutton");
const randomButton = document.getElementById("randombutton");
const resetButton = document.getElementById("resetbutton");
const sizeChangeButton = document.getElementById("sizeChangeButton");
@@ -88,7 +85,9 @@ function renderBoard() {
table.appendChild(tr);
}
}
+
renderBoard();
+progressBoard();
randomButton.onclick = () => {
//白黒ランダムにBoardを変更
@@ -108,35 +107,12 @@ resetButton.onclick = () => {
stop();
};
-startButton.onclick = start;
-stopButton.onclick = stop;
-
-function timerChange(sentence) {
- //現在再生中かを表すtimer変数を変更し、文章も変更
- timer = sentence;
- isProgress.textContent = timer === "start" ? "再生中" : "停止中";
-}
-
function generationChange(num) {
//現在の世代を表すgenerationFigureを変更し、文章も変更
generationFigure = num;
generation.textContent = "第" + generationFigure + "世代";
}
-function start() {
- if (timer === "stop") {
- timerId = setInterval(progressBoard, 1000);
- timerChange("start");
- }
-}
-
-function stop() {
- if (timer === "start") {
- clearInterval(timerId);
- timerChange("stop");
- }
-}
-
function progressBoard() {
const newBoard = structuredClone(board);
for (let i = 0; i < boardSize; i++) {
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 8277def..75c361f 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -4,7 +4,9 @@
import lgjs from "../life-game/life-game.js?raw";
import PlayandPause from "../life-game/LifeGameFunctions/PlayAndPause.js?raw";
- let code = $state(
+ let code = $state(lgjs);
+
+ let previewDoc = $derived(
lghtml.replace(
/