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

No:43030

Playable Unique Farm simulator with neat squares l..ALL
Developer User19052｜Date and time 24/2/14 0:10:59
Build time 17.729 sec｜Game capacity 4.082KB｜

Script

农场模拟器

金钱: 0

可制种植物

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
<style>
    body {
      font-family: Arial, sans-serif;
    }

h1 {
      text-align: center;
    }

#land {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
    }

.square {
      width: 80px;
      height: 80px;
      border: 1px solid black;
      text-align: center;
      cursor: pointer;
    }

.plant {
      font-size: 30px;
    }

#money {
      text-align: center;
    }

#plants {
      padding-top: 20px;
    }

#plant-list {
      overflow-y: scroll;
      height: 200px;
      max-height: 200px;
    }

.plant-item {
      display: flex;
      align-items: center;
      padding: 5px;
      cursor: pointer;
    }

.plant-icon {
      width: 40px;
      height: 40px;
      margin-right: 10px;
    }
</style>
</head>
<body>
  <h1>农场模拟器</h1>
  <div id="land"></div>
  <div id="money">金钱: <span id="money-value">0</span></div>
  <div id="plants">
    <h3>可制种植物</h3>
    <div id="plant-list"></div>
  </div>

let landSize = 4; // Initial land size
    let money = 0; // Initial money value

// Generate initial land squares with soil
    function generateLand() {
      const land = document.getElementById("land");
      land.innerHTML = "";
      for (let i = 0; i < landSize; i++) {
        for (let j = 0; j < landSize; j++) {
          const square = document.createElement("div");
          square.classList.add("square");
          square.dataset.planted = false;
          square.addEventListener("click", plantCrop);
          land.appendChild(square);
        }
      }
    }

// Update money value on the page
    function updateMoneyValue() {
      document.getElementById("money-value").textContent = money;
    }

// Generate the plant list with available plants to choose from
    function generatePlantList() {
      const plantList = document.getElementById("plant-list");
      plantList.innerHTML = "";
      plants.forEach((plant) => {
        const plantItem = document.createElement("div");
        plantItem.classList.add("plant-item");
        plantItem.addEventListener("click", selectPlant);
        plantItem.innerHTML = `<div class="plant-icon">${plant.icon}</div><div>${plant.name} - 价格: ${plant.price}</div>`;
        plantList.appendChild(plantItem);
      });
    }

// Plant a crop on a square if it is not already planted
    function plantCrop() {
      if (!this.dataset.planted) {
        const selectedPlant = document.querySelector(".selected-plant");
        if (selectedPlant) {
          const plantIcon = selectedPlant.querySelector(".plant-icon").textContent;
          const plantPrice = parseInt(selectedPlant.querySelector("div:last-child").textContent.replace("价格: ", ""));
          if (money >= plantPrice) {
            money -= plantPrice;
            updateMoneyValue();
            this.innerHTML = `<div class="plant">${plantIcon}</div>`;
            this.dataset.planted = true;
          } else {
            alert("金钱不足!");
          }
        } else {
          alert("请选择要种植的植物!");
        }
      } else {
        alert("这个土地已经被种植了!");
      }
    }

// Select a plant from the plant list
    function selectPlant() {
      const selectedPlant = document.querySelector(".selected-plant");
      if (selectedPlant) {
        selectedPlant.classList.remove("selected-plant");
      }
      this.classList.add("selected-plant");
    }

// Initialize the game
    function startGame() {
      generateLand();
      generatePlantList();
      updateMoneyValue();
    }

startGame();
  </script>
</body>
</html>