Level maker with color palettes's game

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

No:51939

120

←

Prev Next

→

Level maker with color palettes
Developer User21691｜Date and time 24/3/17 3:56:40
Build time 5.654 sec｜Game capacity 1.167KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>Level Maker Game</title>
</head>
<body>
  <canvas id="levelCanvas" width="400" height="400"></canvas>
  
  <script>
    const canvas = document.getElementById('levelCanvas');
    const ctx = canvas.getContext('2d');
    
    let selectedColor = 'red';
    let mouseDown = false;
    
    canvas.addEventListener('mousedown', function(event) {
      mouseDown = true;
      drawLevel(event.offsetX, event.offsetY);
    });
    
    canvas.addEventListener('mousemove', function(event) {
      if(mouseDown) {
        drawLevel(event.offsetX, event.offsetY);
      }
    });
    
    canvas.addEventListener('mouseup', function(event) {
      mouseDown = false;
    });
    
    function drawLevel(x, y) {
      ctx.fillStyle = selectedColor;
      ctx.fillRect(x, y, 10, 10);
    }
    
    function selectColor(color) {
      selectedColor = color;
    }
  </script>
  
  <div>
    <button onclick="selectColor('red')">🟥</button>
    <button onclick="selectColor('green')">🟩</button>
    <button onclick="selectColor('blue')">🟦</button>
    <button onclick="selectColor('yellow')">🟨</button>
  </div>
</body>
</html>