From 5866a14ca1b82c9d28990286ff3a9c00a102f074 Mon Sep 17 00:00:00 2001 From: dginovker Date: Wed, 9 Dec 2020 10:40:53 -0500 Subject: [PATCH] Started modularizing + push old CSS --- services/m=hiscore/helpers.js | 37 +++++++++++++++++++++ services/m=hiscore/hiscores.html | 3 +- services/m=hiscore/hiscores.js | 57 ++++++++++++-------------------- site/css/hiscores-17.css | 16 ++++++--- 4 files changed, 71 insertions(+), 42 deletions(-) create mode 100644 services/m=hiscore/helpers.js diff --git a/services/m=hiscore/helpers.js b/services/m=hiscore/helpers.js new file mode 100644 index 000000000..fb74a3c43 --- /dev/null +++ b/services/m=hiscore/helpers.js @@ -0,0 +1,37 @@ +var REQUIRE = REQUIRE || {}; +REQUIRE.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" +] + +REQUIRE.linkLeftTabSkillNames = () => { + REQUIRE.sName.forEach((skill, index) => { + row = document.getElementsByClassName(` ${skill} ico`)[0].addEventListener("click", function (e) { + e.preventDefault(); + console.log(skill, index); + loadSkillTable(index); + }); + }); +} \ No newline at end of file diff --git a/services/m=hiscore/hiscores.html b/services/m=hiscore/hiscores.html index 6730a0586..3c82b4ff3 100644 --- a/services/m=hiscore/hiscores.html +++ b/services/m=hiscore/hiscores.html @@ -622,7 +622,7 @@ English - +
Compare Users
@@ -698,6 +698,7 @@ English + \ No newline at end of file diff --git a/services/m=hiscore/hiscores.js b/services/m=hiscore/hiscores.js index 33b36e209..8b786ea21 100644 --- a/services/m=hiscore/hiscores.js +++ b/services/m=hiscore/hiscores.js @@ -1,35 +1,12 @@ +var REQUIRE = REQUIRE || {}; + 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 = []; +let defaultTableData = []; function loadDefaultHSTable() { fetch(`${apiURL}/highscores/getPlayersByTotal`) @@ -37,6 +14,7 @@ function loadDefaultHSTable() { .then(result => { console.log(result[0]); tableData = result; + defaultTableData = result; populateDefaultHSTable(); }) .catch(error => console.log('error', error)); @@ -77,6 +55,7 @@ function loadUserTable(username) { console.log(result[0]); tableData = result; populatePlayerHSTable(); + document.getElementById("scores_head_skill").innerText = username + "'s "; }) .catch(error => { document.getElementById('search_name').style.color = 'red'; @@ -94,7 +73,7 @@ function populatePlayerHSTable() { row.childNodes[3].replaceWith(document.createElement("td")); row.childNodes[3].className = "alL"; - row.childNodes[3].innerHTML = `${sName[i - 1]}`; + row.childNodes[3].innerHTML = `${REQUIRE.sName[i - 1]}`; row.childNodes[3].addEventListener("click", e => { e.preventDefault(); loadSkillTable(i - 1); @@ -123,8 +102,8 @@ function loadSkillTable(skillId) { } 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`; + document.getElementById("scores_head_skill").innerText = REQUIRE.sName[currentSkillId]; + document.getElementById("scores_head_icon").src = `../../site/img/hiscores/skill_icon_${REQUIRE.sName[currentSkillId].toLowerCase()}1eccb.gif`; for (let i = 1; i <= 24; i++) { row = document.getElementsByClassName(`row row${i}`)[0]; @@ -177,14 +156,20 @@ 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); - }); +document.getElementById("search_rank_submit").addEventListener("click", function (e) { + e.preventDefault(); + if (document.getElementById('search_rank').value) { + loadUserTable(defaultTableData[document.getElementById('search_rank').value - 1].username) + document.getElementById("scores_head_skill").innerText = defaultTableData[document.getElementById('search_rank').value - 1].username + "'s "; + } + else { + loadDefaultHSTable(); + } }); +// Handle Skill Names +REQUIRE.linkLeftTabSkillNames(); + + loadDefaultHSTable(); diff --git a/site/css/hiscores-17.css b/site/css/hiscores-17.css index fd344cd3e..e69043f2b 100644 --- a/site/css/hiscores-17.css +++ b/site/css/hiscores-17.css @@ -223,6 +223,12 @@ .row22 { background-color: #423419; } + .row23 { + background-color: #534221; + } + .row24 { + background-color: #423419; + } @@ -396,10 +402,10 @@ height: 27px; } #button-up { - top: 165px; + top: 180px; } #button-down { - top: 170px; + top: 185px; } #button-up span.lev1_arrow { background-image: url('../img/hiscores/arrow_upeccb.gif?3'); @@ -486,7 +492,7 @@ #playerList_back { float: left; width: 371px; - height: 466px; + height: 505px; margin-right: 5px; } #table_friend { @@ -536,7 +542,7 @@ .arrow_back { width: 25px; background-color: #3B2B0F; - height: 419px; + height: 457px; float: right; } #arrow_up { @@ -583,7 +589,7 @@ #search_back { float: left; width: 156px; - height: 466px; + height: 505px; } .search_small, .search_large { margin-bottom: 2px;