A game that forces the developer Hisashi to motivate the developer who doesnt appease Dosku.

Hisashi is crazy about the apps you develop.、There is no appe... Your objective is.、It is to turn the hishashi toward the apses.

Controls: Tap your phone to move the chisel. The game is cleared when you reach the app screen.

💻

💡

// style.css file #game { text-align: center; padding: 20px; } .emoji { font-size: 50px; line-height: 1; } #board { position: relative; margin: 20px auto; width: 80vw; height: 60vh; border: 2px solid black; border-radius: 20px; overflow: hidden; } #player { position: absolute; top: 30%; left: 10%; } #update { position: absolute; bottom: 10%; right: 10%; }

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>どうスクのアプデをしない開発者ひさしを強制的にやる気にさせるゲーム</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <div id="game">
      <h1>どうスクのアプデをしない開発者ひさしを強制的にやる気にさせるゲーム</h1>
      <p>ひさしはあなたが開発するアプリに夢中で、アプデをすることがありません。あなたの目的は、ひさしをアプデに向かわせることです。</p>
      <p>操作方法: スマホのタップでひさしを動かします。アプデ画面にたどり着くとクリアです。</p>
      <div id="board">
        <div id="player" class="emoji">💻</div>
        <div id="update" class="emoji">💡</div>
      </div>
    </div>
    
    <script>
      var player = document.getElementById("player");
      var update = document.getElementById("update");

function movePlayer(event) {
        // スマホ用にタッチした座標を取得
        var x = event.changedTouches[0].pageX;
        var y = event.changedTouches[0].pageY;
        // プレイヤーを動かす
        player.style.left = x - 25 + "px";
        player.style.top = y - 25 + "px";
        // アプデに当たったらクリア
        if (isCollide(player, update)) {
          alert("アプデしよう！");
          location.reload();
        }
      }

function isCollide(a, b) {
        // aとbが重なっているかどうかをチェックする
        var aRect = a.getBoundingClientRect();
        var bRect = b.getBoundingClientRect();
        return !(
          (aRect.bottom < bRect.top) || (aRect.top > bRect.bottom) || (aRect.right < bRect.left) || (aRect.left > bRect.right)
        );
      }

document.addEventListener("touchmove", movePlayer, { passive: false });
    </script>
  </body>
</html>

// style.cssファイル
#game {
  text-align: center;
  padding: 20px;
}

.emoji {
  font-size: 50px;
  line-height: 1;
}

#board {
  position: relative;
  margin: 20px auto;
  width: 80vw;
  height: 60vh;
  border: 2px solid black;
  border-radius: 20px;
  overflow: hidden;
}

#player {
  position: absolute;
  top: 30%;
  left: 10%;
}

#update {
  position: absolute;
  bottom: 10%;
  right: 10%;
}