Widget:Calculator/Combat/Level: Difference between revisions

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
+<html>
+<form id="lookup-form" style="margin-bottom: 20px;">
+  <label>
+    Username:
+    <input type="text" id="username" placeholder="Enter player name" />
+    <button type="button" onclick="lookupStats()">Lookup</button>
+  </label>
+</form>
+<form id="combat-form">
+  <label>Hitpoints: <input type="number" id="stat-hp" value="10" min="1" max="99" /></label><br />
+  <label>Accuracy: <input type="number" id="stat-accuracy" value="1" min="1" max="99" /></label><br />
+  <label>Strength: <input type="number" id="stat-strength" value="1" min="1" max="99" /></label><br />
+  <label>Defense: <input type="number" id="stat-defense" value="1" min="1" max="99" /></label><br />
+  <label>Magic: <input type="number" id="stat-magic" value="1" min="1" max="99" /></label><br />
+  <label>Range: <input type="number" id="stat-range" value="1" min="1" max="99" /></label><br /><br />
+  <b>Combat Level:</b> <span id="combat-result">—</span><br />
+  <div id="level-hints" style="margin-top: 10px; font-style: italic; color: #555;">—</div>
+</form>
+<script>
+function calculateCombatLevel() {
+  const hp = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-hp").value) || 1));
+  const acc = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-accuracy").value) || 1));
+  const str = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-strength").value) || 1));
+  const def = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-defense").value) || 1));
+  const mag = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-magic").value) || 1));
+  const rng = Math.min(99, Math.max(1, parseInt(document.getElementById("stat-range").value) || 1));
+  // Set clamped values back to inputs
+  document.getElementById("stat-hp").value = hp;
+  document.getElementById("stat-accuracy").value = acc;
+  document.getElementById("stat-strength").value = str;
+  document.getElementById("stat-defense").value = def;
+  document.getElementById("stat-magic").value = mag;
+  document.getElementById("stat-range").value = rng;
+  const base = hp + acc + str + def + mag / 4 + rng / 4;
+  const combat = base / 3.75;
+  document.getElementById("combat-result").textContent = combat.toFixed(2);
+  const nextLevel = Math.floor(combat) + 1;
+  if (combat >= nextLevel) {
+    document.getElementById("level-hints").textContent = "You have reached or exceeded the next combat level!";
+    return;
+  }
+  const needed = (nextLevel * 3.75) - base;
+  // Calculate needed points per stat
+  const neededHP = Math.max(1, Math.ceil(needed));
+  const neededAcc = neededHP;
+  const neededStr = neededHP;
+  const neededDef = neededHP;
+  const neededMag = Math.max(1, Math.ceil(needed * 4));
+  const neededRng = neededMag;
+  const hints = [
+    `+${neededHP} Hitpoints`,
+    `+${neededAcc} Accuracy`,
+    `+${neededStr} Strength`,
+    `+${neededDef} Defense`,
+    `+${neededMag} Magic`,
+    `+${neededRng} Range`
+  ];
+  document.getElementById("level-hints").textContent = `To reach level ${nextLevel}: ${hints.join(" or ")}`;
+}
+function getStatFromDom(doc, skillName) {
+  const nameDivs = doc.querySelectorAll('.hs_data__row__name');
+  for (const nameDiv of nameDivs) {
+    if (nameDiv.textContent.toLowerCase().includes(skillName.toLowerCase())) {
+      const levelDiv = nameDiv.parentElement.querySelector('.hs_data__row__level');
+      if (levelDiv) {
+        const lvl = parseInt(levelDiv.textContent.trim());
+        if (!isNaN(lvl)) return lvl;
+      }
+    }
+  }
+  return 1; // fallback
+}
+function lookupStats() {
+  const username = document.getElementById("username").value.trim();
+  if (!username) {
+    alert("Please enter a username.");
+    return;
+  }
+  fetch(`https://highspell.com/hiscores/player/${encodeURIComponent(username)}`)
+    .then(response => {
+      if (!response.ok) throw new Error("Failed to fetch hiscores");
+      return response.text();
+    })
+    .then(html => {
+      const doc = new DOMParser().parseFromString(html, "text/html");
+      document.getElementById("stat-hp").value = getStatFromDom(doc, "Hitpoints");
+      document.getElementById("stat-accuracy").value = getStatFromDom(doc, "Accuracy");
+      document.getElementById("stat-strength").value = getStatFromDom(doc, "Strength");
+      document.getElementById("stat-defense").value = getStatFromDom(doc, "Defense");
+      document.getElementById("stat-magic").value = getStatFromDom(doc, "Magic");
+      document.getElementById("stat-range").value = getStatFromDom(doc, "Range");
+      calculateCombatLevel();
+    })
+    .catch(err => {
+      alert("Lookup failed. Please check the username or try again later.");
+      console.error(err);
+    });
+}
+document.querySelectorAll('#combat-form input').forEach(input => {
+  input.addEventListener('input', calculateCombatLevel);
+});
+document.addEventListener('DOMContentLoaded', calculateCombatLevel);
+</script>
+</html>