Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html lang="pl">
<head>
  <meta charset="UTF-8">
  <title>Panel administratora</title>
  <style>
    body { font-family: sans-serif; padding: 20px; background: #f9f9f9; }
    input, button { padding: 10px; margin: 10px 0; width: 300px; }
    .team { background: #fff; padding: 10px; margin: 10px 0; border: 1px solid #ccc; }
    .hidden { display: none; }
  </style>
</head>
<body>
  <h2>Logowanie administratora</h2>
  <input id="accessCode" placeholder="Kod dostępu (np. 001)">
  <button onclick="login()">Zaloguj</button>
  <p id="error" style="color: red;"></p>
​
  <div id="adminPanel" class="hidden">
    <h2>Dodaj drużynę</h2>
    <input id="teamName" placeholder="Nazwa drużyny">
    <input id="teamLeader" placeholder="Przywódca">
    <input id="teamMembers" placeholder="Członkowie">
    <input id="teamPoints" type="number" placeholder="Punkty" value="0">
    <input id="teamRoom" placeholder="Escape room">
    <button onclick="addTeam()">Dodaj drużynę</button>
​
    <div id="teams"></div>
  </div>
​
  <script>
    let teams = JSON.parse(localStorage.getItem("teams")) || [];
​
    function login() {
      const code = document.getElementById("accessCode").value;
      if (code === "001" || code === "002") {
        document.getElementById("adminPanel").classList.remove("hidden");
        renderTeams();
      } else {
        document.getElementById("error").textContent = "Niepoprawny kod.";
      }
    }
​
    function addTeam() {
      const t = {
        name: document.getElementById("teamName").value,
        leader: document.getElementById("teamLeader").value,
        members: document.getElementById("teamMembers").value,
        points: parseInt(document.getElementById("teamPoints").value),
        room: document.getElementById("teamRoom").value,
        history: []
      };
      teams.push(t);
      localStorage.setItem("teams", JSON.stringify(teams));
      renderTeams();
    }
​
    function adjustPoints(i, val) {
      const reason = prompt("Podaj powód:");
      if (!reason) return;
      teams[i].points += val;
      teams[i].history.push((val > 0 ? "+" : "") + val + " pkt: " + reason);
      localStorage.setItem("teams", JSON.stringify(teams));
      renderTeams();
    }
​
    function renderTeams() {
      const out = document.getElementById("teams");
      out.innerHTML = "";
      teams.forEach((t, i) => {
        const div = document.createElement("div");
        div.className = "team";
        div.innerHTML = `<strong>${t.name}</strong> (${t.points} pkt)<br>
        Przywódca: ${t.leader}<br>Pokój: ${t.room}<br>
        <button onclick="adjustPoints(${i}, 10)">+10 pkt</button>
        <button onclick="adjustPoints(${i}, -10)">-10 pkt</button>
        <details><summary>Historia</summary>${t.history.join("<br>")}</details>`;
        out.appendChild(div);
      });
    }
​
    if (teams.length === 0) {
      teams = [
        { name: "Kaktusy", leader: "Ola", members: "Ala, Ela", points: 50, room: "Dżungla", history: ["+50 pkt: start"] },
        { name: "Rakiety", leader: "Kuba", members: "Jasiek, Franek", points: 30, room: "Kosmos", history: ["+30 pkt: start"] },
        { name: "Smoki", leader: "Kasia", members: "Zosia, Wojtek", points: 40, room: "Zamek", history: ["+40 pkt: start"] }
      ];
      localStorage.setItem("teams", JSON.stringify(teams));
    }
  </script>
</body>
</html>
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
webctplpro
0viewers