Skip to content

Commit 9d2e202

Browse files
committed
JSファイル群の修正
1 parent ba8ee44 commit 9d2e202

File tree

3 files changed

+31
-62
lines changed

3 files changed

+31
-62
lines changed

src/iframe/life-game.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,6 @@ function renderBoard() {
8989
}
9090
}
9191
rerender();
92-
stop();
9392
} else {
9493
window.parent.postMessage(
9594
{
@@ -105,7 +104,7 @@ function renderBoard() {
105104
e.preventDefault();
106105
if (!isPlacingTemplate) {
107106
isDragging = true;
108-
board[i][j] = board[i][j] === 1 ? 0 : 1;
107+
board[i][j] = board[i][j] ? 0 : 1;
109108
dragMode = board[i][j];
110109
button.style.backgroundColor = board[i][j] ? aliveCellColor : deadCellColor;
111110
}

src/lib/assets/life-game-rules/lifespan.js

Lines changed: 14 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
"use strict";
22

3-
let timer = "stop";
43
let generationFigure = 0;
54
let isDragging = false;
65
let dragMode = 0; // 1: 黒にする, 0: 白にする
@@ -12,7 +11,7 @@ let previewCells = [];
1211

1312
//変数設定
1413
let boardSize = 20; //盤面の大きさ(20x20)
15-
const cellSize = 600 / boardSize; //セルの大きさ(px)
14+
const cellSize = 450 / boardSize; //セルの大きさ(px)
1615
const maxLifespan = 2; // セルの最大寿命
1716

1817
// around: 周囲の生きたセル数, currentLifespan: 現在の寿命
@@ -54,6 +53,14 @@ const table = document.getElementById("game-board");
5453

5554
//盤面をBoardに従って変更する関数達(Boardを変更したら実行する)
5655
function renderBoard() {
56+
// bodyを中央配置に設定
57+
document.body.style.display = "flex";
58+
document.body.style.justifyContent = "center";
59+
document.body.style.alignItems = "center";
60+
document.body.style.minHeight = "100vh";
61+
document.body.style.margin = "0";
62+
document.body.style.padding = "0";
63+
5764
// 初回の盤面生成
5865
table.innerHTML = "";
5966
for (let i = 0; i < boardSize; i++) {
@@ -97,7 +104,6 @@ function renderBoard() {
97104
}
98105
rerender();
99106
generationChange(0);
100-
stop();
101107
} else {
102108
window.parent.postMessage(
103109
{
@@ -111,16 +117,16 @@ function renderBoard() {
111117
};
112118
button.onmousedown = (e) => {
113119
e.preventDefault();
114-
if (timer === "stop" && !isPlacingTemplate) {
120+
if (!isPlacingTemplate) {
115121
isDragging = true;
116-
board[i][j] = !board[i][j];
122+
board[i][j] = board[i][j] ? 0 : 1;
117123
dragMode = board[i][j];
118124
button.lifespan = board[i][j] ? maxLifespan : 0;
119125
button.style.backgroundColor = getStyle(board[i][j], button.lifespan);
120126
}
121127
};
122128
button.onmouseenter = () => {
123-
if (isDragging && timer === "stop" && board[i][j] !== dragMode && !isPlacingTemplate) {
129+
if (isDragging && board[i][j] !== dragMode && !isPlacingTemplate) {
124130
board[i][j] = dragMode;
125131
button.lifespan = board[i][j] ? maxLifespan : 0;
126132
button.style.backgroundColor = getStyle(board[i][j], button.lifespan);
@@ -197,7 +203,6 @@ document.addEventListener("mouseup", () => {
197203
});
198204

199205
renderBoard();
200-
progressBoard();
201206

202207
function generationChange(num) {
203208
//現在の世代を表すgenerationFigureを変更し、文章も変更
@@ -271,14 +276,6 @@ on.progress = () => {
271276
progressBoard();
272277
};
273278

274-
on.play = () => {
275-
timer = "start";
276-
};
277-
278-
on.pause = () => {
279-
timer = "stop";
280-
};
281-
282279
on.board_reset = () => {
283280
//すべて白にBoardを変更
284281
board = Array.from({ length: boardSize }, () => Array.from({ length: boardSize }, () => 0));
@@ -295,18 +292,8 @@ on.board_randomize = () => {
295292
generationChange(0);
296293
};
297294

298-
on.request_sync = () => {
299-
window.parent.postMessage(
300-
{
301-
type: "sync",
302-
data: {
303-
generationFigure: generationFigure,
304-
boardSize: boardSize,
305-
},
306-
},
307-
"*",
308-
);
309-
console.log("generationFigure:", generationFigure, "boardSize:", boardSize);
295+
on.get_boardsize = () => {
296+
window.parent.postMessage({ type: "get_boardsize", data: boardSize }, "*");
310297
};
311298

312299
on.place_template = (template) => {
@@ -315,7 +302,6 @@ on.place_template = (template) => {
315302
patternWidth = patternShape[0].length;
316303
isPlacingTemplate = true;
317304
table.style.cursor = "crosshair";
318-
stop();
319305
};
320306

321307
on.save_board = async () => {
@@ -326,5 +312,4 @@ on.apply_board = (newBoard) => {
326312
board = newBoard;
327313
renderBoard();
328314
generationChange(0);
329-
stop();
330315
};

src/lib/assets/life-game-rules/probabilistics.js

Lines changed: 16 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
"use strict";
22

3-
let timer = "stop";
43
let generationFigure = 0;
54
let isDragging = false;
65
let dragMode = 0; // 1: 黒にする, 0: 白にする
@@ -12,17 +11,17 @@ let previewCells = [];
1211

1312
//変数設定
1413
let boardSize = 20; //盤面の大きさ(20x20)
15-
const cellSize = 600 / boardSize; //セルの大きさ(px)
14+
const cellSize = 450 / boardSize; //セルの大きさ(px)
1615

1716
// around: 周囲の生きたセル数 self: 自身が生きているかどうか
1817
function isNextAlive(around, self) {
1918
// 自身が生きている & 周囲が 2 か 3 で生存 50%の確率でこのルールに従う
2019
if (self && 2 <= around && around <= 3) {
21-
return Math.random() > 0.5 ? self : !self;
20+
return Math.random() > 0.5 ? 1 : 0;
2221
}
2322
// 自身が生きている & 周囲が2,3以外で死亡 50%の確率でこのルールに従う
2423
if (self && (around < 2 || around > 3)) {
25-
return Math.random() > 0.5 ? !self : self;
24+
return Math.random() > 0.5 ? 0 : 1;
2625
}
2726
// 自身が死んでいる & 周囲が 3 で誕生 50%の確率でこのルールに従う
2827
if (!self && around === 3) {
@@ -45,6 +44,14 @@ const table = document.getElementById("game-board");
4544

4645
//盤面をBoardに従って変更する関数達(Boardを変更したら実行する)
4746
function renderBoard() {
47+
// bodyを中央配置に設定
48+
document.body.style.display = "flex";
49+
document.body.style.justifyContent = "center";
50+
document.body.style.alignItems = "center";
51+
document.body.style.minHeight = "100vh";
52+
document.body.style.margin = "0";
53+
document.body.style.padding = "0";
54+
4855
// 初回の盤面生成
4956
table.innerHTML = "";
5057
for (let i = 0; i < boardSize; i++) {
@@ -80,7 +87,6 @@ function renderBoard() {
8087
}
8188
rerender();
8289
generationChange(0);
83-
stop();
8490
} else {
8591
window.parent.postMessage(
8692
{
@@ -94,15 +100,15 @@ function renderBoard() {
94100
};
95101
button.onmousedown = (e) => {
96102
e.preventDefault();
97-
if (timer === "stop" && !isPlacingTemplate) {
103+
if (!isPlacingTemplate) {
98104
isDragging = true;
99-
board[i][j] = !board[i][j];
105+
board[i][j] = board[i][j] ? 0 : 1;
100106
dragMode = board[i][j];
101107
button.style.backgroundColor = board[i][j] ? "black" : "white";
102108
}
103109
};
104110
button.onmouseenter = () => {
105-
if (isDragging && timer === "stop" && board[i][j] !== dragMode && !isPlacingTemplate) {
111+
if (isDragging && board[i][j] !== dragMode && !isPlacingTemplate) {
106112
board[i][j] = dragMode;
107113
button.style.backgroundColor = board[i][j] ? "black" : "white";
108114
}
@@ -177,7 +183,6 @@ document.addEventListener("mouseup", () => {
177183
});
178184

179185
renderBoard();
180-
progressBoard();
181186

182187
function generationChange(num) {
183188
//現在の世代を表すgenerationFigureを変更し、文章も変更
@@ -234,14 +239,6 @@ on.progress = () => {
234239
progressBoard();
235240
};
236241

237-
on.play = () => {
238-
timer = "start";
239-
};
240-
241-
on.pause = () => {
242-
timer = "stop";
243-
};
244-
245242
on.board_reset = () => {
246243
//すべて白にBoardを変更
247244
board = Array.from({ length: boardSize }, () => Array.from({ length: boardSize }, () => 0));
@@ -258,18 +255,8 @@ on.board_randomize = () => {
258255
generationChange(0);
259256
};
260257

261-
on.request_sync = () => {
262-
window.parent.postMessage(
263-
{
264-
type: "sync",
265-
data: {
266-
generationFigure: generationFigure,
267-
boardSize: boardSize,
268-
},
269-
},
270-
"*",
271-
);
272-
console.log("generationFigure:", generationFigure, "boardSize:", boardSize);
258+
on.get_boardsize = () => {
259+
window.parent.postMessage({ type: "get_boardsize", data: boardSize }, "*");
273260
};
274261

275262
on.place_template = (template) => {
@@ -278,7 +265,6 @@ on.place_template = (template) => {
278265
patternWidth = patternShape[0].length;
279266
isPlacingTemplate = true;
280267
table.style.cursor = "crosshair";
281-
stop();
282268
};
283269

284270
on.save_board = async () => {
@@ -289,5 +275,4 @@ on.apply_board = (newBoard) => {
289275
board = newBoard;
290276
renderBoard();
291277
generationChange(0);
292-
stop();
293278
};

0 commit comments

Comments
 (0)