JavaScript/janken/a.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <title>じゃんけん</title>
        <script type="text/javascript">
            var intervalId;
            var computer;

            function roll()
            {
                var img = {
                    1: 'stone.png', 2: 'cissor.png', 3: 'paper.png',
                };
                computer = Math.floor(Math.random() * 3) + 1;
                var elem = document.getElementById('computer');
                elem.innerHTML = '<img src="' + img[computer] + '"/>';
            }
            function pong(hand)
            {
                clearInterval(intervalId);
                intervalId = null;

                var elem = document.getElementById('status');
                if (computer == hand) {
                    elem.innerHTML = 'あいこ';
                } else if (computer == 1 && hand == 3
                || computer == 2 && hand == 1
                || computer == 3 && hand == 2) {
                    elem.innerHTML = 'あなたの勝ち！';
                } else {
                    elem.innerHTML = 'あなたの負け';
                }
                elem.innerHTML += '(ここをクリックでもう一度)';
            }
            function start()
            {
                if (intervalId) {
                    return;
                }
                var elem = document.getElementById('status');
                elem.innerHTML = 'じゃーんけん';
                roll();
                intervalId = setInterval(roll, 100);
            }
            window.onload = function()
            {
                start();
            };
        </script>
    </head>
    <body>
        <div id="computer"></div>
        <div id="status" onclick="start();"></div>
        <div>
            <img src="stone.png" onclick="pong(1)"/>
            <img src="cissor.png" onclick="pong(2);"/>
            <img src="paper.png" onclick="pong(3);"/>
        </div>
    </body>
</html>