Click here for free DL of the app version that can save data.

No:182

259

←

Prev Next

→

cats cradle
Developer User2908｜Date and time 23/6/4 13:53:17
Build time 54.892 sec｜Game capacity 3.016KB｜

Script

あやとり

このゲームであなたはあやとりの達人になることができます！
スマホでの操作を前提にしていますので、画面の右下にある「あやとりを始める！」ボタンをタップして、ゲームを始めましょう。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>あやとり</title>
</head>
<body>
    <h1>あやとり</h1>
    <p>このゲームであなたはあやとりの達人になることができます！<br>
    スマホでの操作を前提にしていますので、画面の右下にある「あやとりを始める！」ボタンをタップして、ゲームを始めましょう。</p>

<button onclick="startGame()">あやとりを始める！</button>

canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

const stringLength = Math.floor(canvas.width / 10);
        let centerX = Math.floor(canvas.width / 2);
        let centerY = Math.floor(canvas.height / 2);

const emojis = ['🌺', '🐶', '🍕', '🎵', '🎨', '🚀', '🦄', '💡', '🔑'];

let currentString = '';
        let currentCharIndex = 0;
        let currentEmojiIndex = 0;
        let emojiX = 0;
        let emojiY = 0;

function drawString() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.font = 'bold 32px sans-serif';
            ctx.textAlign = 'center';
            ctx.textBaseline = 'middle';
            ctx.fillText(currentString, centerX, centerY - 32);

if (currentCharIndex >= currentString.length) {
                drawEmoji();
            } else {
                currentCharIndex++;
                setTimeout(drawString, 100);
            }
        }

function drawEmoji() {
            if (currentEmojiIndex >= emojis.length) {
                endGame();
            } else {
                const emoji = emojis[currentEmojiIndex];
                const emojiWidth = ctx.measureText(emoji).width;
                emojiX = Math.floor(Math.random() * (canvas.width - emojiWidth));
                emojiY = Math.floor(Math.random() * (canvas.height - 64)) + 32;

ctx.fillText(emoji, emojiX, emojiY);

currentString = emoji.repeat(stringLength);
                currentCharIndex = 0;
                currentEmojiIndex++;
                setTimeout(drawString, 1000);
            }
        }

function endGame() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.font = 'bold 64px sans-serif';
            ctx.textAlign = 'center';
            ctx.fillText('お疲れさまでした！', centerX, centerY);

setTimeout(() => {
                const playAgain = confirm('もう一度遊びますか？');
                if (playAgain) {
                    currentString = '';
                    currentCharIndex = 0;
                    currentEmojiIndex = 0;
                    drawString();
                }
            }, 2000);
        }

function startGame() {
            drawString();
        }
    </script>
</body>
</html>