Add per skill HS

This commit is contained in:
dginovker 2020-12-09 10:10:01 -05:00
parent 432b59cc84
commit 9000be0296
2 changed files with 83 additions and 39 deletions

View File

@ -217,7 +217,7 @@ English
<div id="skillsList">
<ul>
<li style="background-color:#4c350a">
<a href="http://services/m=hiscore/overall.ws?table=0&amp;category_type=0"
<a href="./hiscores.html"
class=" Overall ico">
Overall
</a>
@ -364,7 +364,7 @@ English
</li>
<li>
<a href="http://services/m=hiscore/overall.ws?table=21&amp;category_type=0"
class=" Runecraft ico">
class=" Runecrafting ico">
Runecrafting
</a>
@ -390,13 +390,6 @@ English
Summoning
</a>
</li>
<li>
<a href="http://services/m=hiscore/overall.ws?table=25&amp;category_type=0"
class=" Dungeoneering ico">
Dungeoneering
</a>
</li>
</ul>
</div>
</div>
@ -415,9 +408,9 @@ English
</div>
<div id="playerList_back" class="brown_box">
<div id="scores_head" class="subsectionHeader" style="padding: 0px;">
<img style="margin-top: 3px;" class="miniimg_list" id="image_caption"
src="../../site/img/hiscores/skill_icon_overall1eccb.gif" alt="Overall Icon">
Overall
<img id="scores_head_icon" style="margin-top: 3px;" class="miniimg_list" id="image_caption"
src="../../site/img/hiscores/skill_icon_overall1eccb.gif" alt="Skill Icon">
<span id="scores_head_skill">Overall</span>
Hiscores
</div>
<table class="table_back">

View File

@ -1,6 +1,33 @@
let page = 0;
let currentSkillId = "";
const apiURL = "http://localhost:3000";
const sName = [
"Attack",
"Defence",
"Strength",
"Constitution",
"Ranged",
"Prayer",
"Magic",
"Cooking",
"Woodcutting",
"Fletching",
"Fishing",
"Firemaking",
"Crafting",
"Smithing",
"Mining",
"Herblore",
"Agility",
"Thieving",
"Slayer",
"Farming",
"Runecrafting",
"Hunter",
"Construction",
"Summoning"
]
let tableData = [];
@ -57,33 +84,6 @@ function loadUserTable(username) {
});
}
sName = [
"Attack",
"Defence",
"Strength",
"Constitution",
"Ranged",
"Prayer",
"Magic",
"Cooking",
"Woodcutting",
"Fletching",
"Fishing",
"Firemaking",
"Crafting",
"Smithing",
"Mining",
"Herblore",
"Agility",
"Thieving",
"Slayer",
"Farming",
"Runecrafting",
"Hunter",
"Construction",
"Summoning"
]
function populatePlayerHSTable() {
for (let i = 1; i <= 24; i++) {
row = document.getElementsByClassName(`row row${i}`)[0];
@ -106,6 +106,47 @@ function populatePlayerHSTable() {
}
}
function loadSkillTable(skillId) {
fetch(`${apiURL}/highscores/playersBySkill/${skillId}`)
.then(response => response.json())
.then(result => {
console.log(result[0]);
tableData = result;
currentSkillId = skillId;
populateSkillHSTable();
})
.catch(error => console.log('error', error));
}
function populateSkillHSTable() {
document.getElementById("scores_head_skill").innerText = sName[currentSkillId];
document.getElementById("scores_head_icon").src = `../../site/img/hiscores/skill_icon_${sName[currentSkillId].toLowerCase()}1eccb.gif`;
for (let i = 1; i <= 24; i++) {
row = document.getElementsByClassName(`row row${i}`)[0];
const playerData = tableData[i + 24 * page - 1];
row.childNodes[1].replaceWith(document.createElement("td"));
row.childNodes[1].className = "rankCol";
row.childNodes[1].innerHTML = i + 24 * page;
row.childNodes[3].replaceWith(document.createElement("td"));
row.childNodes[3].className = "alL";
row.childNodes[3].innerHTML = `<a href="./hiscores.html">${playerData ? playerData.username : ""}</a>`;
row.childNodes[3].addEventListener("click", function (e) {
e.preventDefault();
loadUserTable(playerData.username);
});
row.childNodes[5].replaceWith(document.createElement("td"));
row.childNodes[5].className = "alL";
row.childNodes[5].innerHTML = playerData ? playerData.level : "";
row.childNodes[7].replaceWith(document.createElement("td"));
row.childNodes[7].className = "alL";
row.childNodes[7].innerHTML = playerData ? Math.floor(playerData.xp).toLocaleString() : "";
}
}
// Handle page arrows
document.getElementById("button-up").addEventListener("click", function (e) {
@ -132,4 +173,14 @@ document.getElementById("search_button").addEventListener("click", function (e)
}
});
// Handle Skill Names
sName.forEach((skill, index) => {
row = document.getElementsByClassName(` ${skill} ico`)[0].addEventListener("click", function (e) {
e.preventDefault();
console.log(skill, index);
loadSkillTable(index);
});
});
loadDefaultHSTable();