AI game creator

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

No:21250

157

←

Prev Next

→

Ragdoll sandbox
Developer User9091｜Date and time 23/10/14 8:39:50
Build time 109.582 sec｜Game capacity 5.776KB｜

Script

Sure! Here's an example of a simple ragdoll sandbox game implemented as a single HTML file:

This HTML file creates a canvas element that represents the game area. The game logic is implemented using JavaScript enclosed within the `
` tags. In this game, the user can interact with the ragdoll's body parts by clicking and dragging them with the mouse. The ragdoll is affected by gravity, causing its legs to swing back and forth. Please note that this is a basic implementation, and you can enhance it further to add more features, interactions, and visual elements using additional JavaScript and CSS.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

Sure! Here's an example of a simple ragdoll sandbox game implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>

<head>
  <title>Ragdoll Sandbox Game</title>
  <style>
    canvas {
      border: 1px solid #000;
    }
  </style>
</head>

// Ragdoll object
    const ragdoll = {
      head: { x: 200, y: 100, radius: 20 },
      body: { x: 200, y: 200, width: 40, height: 100 },
      leftArm: { x: 150, y: 200, length: 70, angle: -45 },
      rightArm: { x: 250, y: 200, length: 70, angle: 45 },
      leftLeg: { x: 180, y: 350, length: 100, angle: -30 },
      rightLeg: { x: 220, y: 350, length: 100, angle: 30 }
    };

// Canvas setup
    const canvas = document.getElementById("gameCanvas");
    const ctx = canvas.getContext("2d");
    canvas.width = canvasWidth;
    canvas.height = canvasHeight;

// Event listeners
    canvas.addEventListener("mousedown", handleMouseDown);
    canvas.addEventListener("mousemove", handleMouseMove);
    canvas.addEventListener("mouseup", handleMouseUp);

// Mouse variables
    let mousePressed = false;
    let selectedBodyPart = null;
    let offsetX = 0;
    let offsetY = 0;

// Game loop
    function gameLoop() {
      clearCanvas();
      update();
      draw();
      requestAnimationFrame(gameLoop);
    }

// Update game logic
    function update() {
      if (mousePressed && selectedBodyPart) {
        // Move selected body part with the mouse
        selectedBodyPart.x = offsetX;
        selectedBodyPart.y = offsetY;
      }

// Apply gravity to the ragdoll's limbs
      ragdoll.leftLeg.angle += gravity;
      ragdoll.rightLeg.angle += gravity;
    }

// Draw game objects
    function draw() {
      // Draw ragdoll's head
      ctx.beginPath();
      ctx.arc(ragdoll.head.x, ragdoll.head.y, ragdoll.head.radius, 0, 2 * Math.PI);
      ctx.stroke();

// Draw ragdoll's body
      ctx.beginPath();
      ctx.rect(ragdoll.body.x - ragdoll.body.width / 2, ragdoll.body.y - ragdoll.body.height / 2, ragdoll.body.width, ragdoll.body.height);
      ctx.stroke();

// Draw ragdoll's limbs
      ctx.beginPath();
      ctx.moveTo(ragdoll.body.x, ragdoll.body.y + ragdoll.body.height / 2);
      ctx.lineTo(ragdoll.leftArm.x, ragdoll.leftArm.y);
      ctx.lineTo(ragdoll.leftArm.x, ragdoll.leftArm.y + ragdoll.leftArm.length);
      ctx.stroke();

ctx.beginPath();
      ctx.moveTo(ragdoll.body.x, ragdoll.body.y + ragdoll.body.height / 2);
      ctx.lineTo(ragdoll.rightArm.x, ragdoll.rightArm.y);
      ctx.lineTo(ragdoll.rightArm.x, ragdoll.rightArm.y + ragdoll.rightArm.length);
      ctx.stroke();

ctx.beginPath();
      ctx.moveTo(ragdoll.body.x, ragdoll.body.y + ragdoll.body.height);
      ctx.lineTo(ragdoll.leftLeg.x, ragdoll.leftLeg.y);
      ctx.lineTo(ragdoll.leftLeg.x, ragdoll.leftLeg.y + ragdoll.leftLeg.length);
      ctx.stroke();

ctx.beginPath();
      ctx.moveTo(ragdoll.body.x, ragdoll.body.y + ragdoll.body.height);
      ctx.lineTo(ragdoll.rightLeg.x, ragdoll.rightLeg.y);
      ctx.lineTo(ragdoll.rightLeg.x, ragdoll.rightLeg.y + ragdoll.rightLeg.length);
      ctx.stroke();
    }

// Clear the canvas
    function clearCanvas() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
    }

// Mouse event handlers
    function handleMouseDown(event) {
      mousePressed = true;
      selectedBodyPart = getSelectedBodyPart(event.offsetX, event.offsetY);
      offsetX = event.offsetX;
      offsetY = event.offsetY;
    }

function handleMouseMove(event) {
      if (mousePressed) {
        offsetX = event.offsetX;
        offsetY = event.offsetY;
      }
    }

function handleMouseUp() {
      mousePressed = false;
      selectedBodyPart = null;
    }

// Get the selected body part based on mouse position
    function getSelectedBodyPart(x, y) {
      const { head, body, leftArm, rightArm, leftLeg, rightLeg } = ragdoll;

if (isPointInsideCircle(x, y, head.x, head.y, head.radius)) {
        return head;
      } else if (isPointInsideRect(x, y, body.x - body.width / 2, body.y - body.height / 2, body.width, body.height)) {
        return body;
      } else if (isPointInsideRect(x, y, leftArm.x, leftArm.y, 10, leftArm.length)) {
        return leftArm;
      } else if (isPointInsideRect(x, y, rightArm.x, rightArm.y, 10, rightArm.length)) {
        return rightArm;
      } else if (isPointInsideRect(x, y, leftLeg.x, leftLeg.y, 10, leftLeg.length)) {
        return leftLeg;
      } else if (isPointInsideRect(x, y, rightLeg.x, rightLeg.y, 10, rightLeg.length)) {
        return rightLeg;
      }

return null;
    }

// Check if a point is inside a circle
    function isPointInsideCircle(x, y, cx, cy, radius) {
      const dx = x - cx;
      const dy = y - cy;
      return dx * dx + dy * dy <= radius * radius;
    }

// Check if a point is inside a rectangle
    function isPointInsideRect(x, y, rx, ry, width, height) {
      return x >= rx && x <= rx + width && y >= ry && y <= ry + height;
    }

// Start the game loop
    gameLoop();
  </script>
</body>

</html>
```

This HTML file creates a canvas element that represents the game area. The game logic is implemented using JavaScript enclosed within the `<script>` tags. In this game, the user can interact with the ragdoll's body parts by clicking and dragging them with the mouse. The ragdoll is affected by gravity, causing its legs to swing back and forth.

Please note that this is a basic implementation, and you can enhance it further to add more features, interactions, and visual elements using additional JavaScript and CSS.