A lot of refactoring, and etc #232
1 changed files with 29 additions and 34 deletions
|
@ -1,9 +1,9 @@
|
|||
<head>
|
||||
<title>Achievements</title>
|
||||
<meta charset="utf-8">
|
||||
<link href="/assets/css/browser.css?v=1" type="text/css" rel="stylesheet">
|
||||
<link href="../assets/css/browser.css?v=1" type="text/css" rel="stylesheet">
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-135255146-3"></script><script>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('config', 'UA-135255146-3');</script>
|
||||
<link rel="icon" href="/assets/trophies/1.png">
|
||||
<link rel="icon" href="../assets/trophies/1.png">
|
||||
<meta id="meta-title" property="og:title" content="Achievements">
|
||||
<meta id="meta-desc" property="og:description" content="View the list of achievements in Geometry Dash!">
|
||||
<meta id="meta-image" name="og:image" itemprop="image" content="https://gdbrowser.com/assets/trophies/1.png">
|
||||
|
@ -16,44 +16,44 @@
|
|||
|
||||
<div id="filters" class="popup">
|
||||
<div class="brownBox bounce center supercenter" style="width: 110vh; height: 75%; padding-top: 0.3%; padding-bottom: 3.5%">
|
||||
<img class="gdButton" src="/assets/close.png" width="10%" style="position: absolute; top: -7.5%; left: -5.5vh" onclick="$('#filters').hide()">
|
||||
<img class="gdButton" src="../assets/close.png" width="10%" style="position: absolute; top: -7.5%; left: -5.5vh" onclick="$('#filters').hide()">
|
||||
<h2 class="small" style="margin-bottom: 0%">Filters</h2><br>
|
||||
|
||||
<div id="rewardLabel">
|
||||
<img filter="rewardFilter" class="achSelect selectAll" style="margin: 0% 2% 1.9% 0%" class="gdButton inline" src="/assets/select-all.png" height="5%">
|
||||
<img filter="rewardFilter" class="achSelect selectAll" style="margin: 0% 2% 1.9% 0%" class="gdButton inline" src="../assets/select-all.png" height="5%">
|
||||
<h1 class="smaller inline" style="margin-bottom: 1.5%">Reward</h1>
|
||||
<img filter="rewardFilter" class="achSelect selectNone" style="margin: 0% 0% 1.9% 2%" class="gdButton inline" src="/assets/select-none.png" height="5%">
|
||||
<img filter="rewardFilter" class="achSelect selectNone" style="margin: 0% 0% 1.9% 2%" class="gdButton inline" src="../assets/select-none.png" height="5%">
|
||||
</div>
|
||||
<div id="forms"></div>
|
||||
|
||||
<div id="typeLabel">
|
||||
<img filter="typeFilter" class="achSelect selectAll" style="margin: 0% 2% 1.4% 0%" class="gdButton inline" src="/assets/select-all.png" height="5%">
|
||||
<img filter="typeFilter" class="achSelect selectAll" style="margin: 0% 2% 1.4% 0%" class="gdButton inline" src="../assets/select-all.png" height="5%">
|
||||
<h1 class="smaller inline" style="margin-top: 3%; margin-bottom: 1%">Requirement</h1>
|
||||
<img filter="typeFilter" class="achSelect selectNone" style="margin: 0% 0% 1.4% 2%" class="gdButton inline" src="/assets/select-none.png" height="5%">
|
||||
<img filter="typeFilter" class="achSelect selectNone" style="margin: 0% 0% 1.4% 2%" class="gdButton inline" src="../assets/select-none.png" height="5%">
|
||||
</div>
|
||||
<div id="types"></div>
|
||||
|
||||
<div id="gameLabel">
|
||||
<img filter="gameFilter" class="achSelect selectAll" style="margin: 0% 2% 1.8% 0%" class="gdButton inline" src="/assets/select-all.png" height="5%">
|
||||
<img filter="gameFilter" class="achSelect selectAll" style="margin: 0% 2% 1.8% 0%" class="gdButton inline" src="../assets/select-all.png" height="5%">
|
||||
<h1 class="smaller inline" style="margin-top: 1%; margin-bottom: 1.3%">Game</h1>
|
||||
<img filter="gameFilter" class="achSelect selectNone" style="margin: 0% 0% 1.8% 2%" class="gdButton inline" src="/assets/select-none.png" height="5%">
|
||||
<img filter="gameFilter" class="achSelect selectNone" style="margin: 0% 0% 1.8% 2%" class="gdButton inline" src="../assets/select-none.png" height="5%">
|
||||
</div>
|
||||
<div id="games">
|
||||
<img class="gdButton achFilter gameFilter" src="/assets/achievements/gd.png" height="12%" style="margin: 0% 1%" title="Geometry Dash" filter="gd">
|
||||
<img class="gdButton achFilter gameFilter" src="/assets/achievements/gdm.png" height="12%" style="margin: 0% 1%" title="Geometry Dash Meltdown" filter="meltdown">
|
||||
<img class="gdButton achFilter gameFilter" src="/assets/achievements/gdw.png" height="12%" style="margin: 0% 1%" title="Geometry Dash World" filter="world">
|
||||
<img class="gdButton achFilter gameFilter" src="/assets/achievements/gds.png" height="12%" style="margin: 0% 1%" title="Geometry Dash Subzero" filter="subzero">
|
||||
<img class="gdButton achFilter gameFilter" src="../assets/achievements/gd.png" height="12%" style="margin: 0% 1%" title="Geometry Dash" filter="gd">
|
||||
<img class="gdButton achFilter gameFilter" src="../assets/achievements/gdm.png" height="12%" style="margin: 0% 1%" title="Geometry Dash Meltdown" filter="meltdown">
|
||||
<img class="gdButton achFilter gameFilter" src="../assets/achievements/gdw.png" height="12%" style="margin: 0% 1%" title="Geometry Dash World" filter="world">
|
||||
<img class="gdButton achFilter gameFilter" src="../assets/achievements/gds.png" height="12%" style="margin: 0% 1%" title="Geometry Dash Subzero" filter="subzero">
|
||||
</div>
|
||||
<img id="submitFilters" class="gdButton" style="margin: 2.5% 0.7%" src="/assets/btn-submit.png" height="10%">
|
||||
<img id="submitFilters" class="gdButton" style="margin: 2.5% 0.7%" src="../assets/btn-submit.png" height="10%">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="position:absolute; bottom: 0%; left: 0%; width: 100%">
|
||||
<img class="cornerPiece" src="/assets/corner.png" width=7%;>
|
||||
<img class="cornerPiece" src="../assets/corner.png" width=7%;>
|
||||
</div>
|
||||
|
||||
<div style="position:absolute; bottom: 0%; right: 0%; width: 100%; text-align: right;">
|
||||
<img class="cornerPiece" src="/assets/corner.png" width=7%; style="transform: scaleX(-1)">
|
||||
<img class="cornerPiece" src="../assets/corner.png" width=7%; style="transform: scaleX(-1)">
|
||||
</div>
|
||||
|
||||
<div id="searchBox" class="supercenter dragscroll" style="width: 128vh">
|
||||
|
@ -67,12 +67,12 @@
|
|||
</div>
|
||||
|
||||
<div style="position:absolute; top: 2%; left: 1.5%; width: 10%; height: 25%; pointer-events: none">
|
||||
<img class="gdButton yesClick" id="backButton" src="/assets/back.png" height="30%" onclick="backButton()">
|
||||
<img class="gdButton yesClick" id="backButton" src="../assets/back.png" height="30%" onclick="backButton()">
|
||||
</div>
|
||||
|
||||
<div style="position:absolute; top: 2%; right: 1.5%; width: 9%; text-align: right">
|
||||
<img class="gdButton" style="margin-bottom: 15%" src="/assets/plus.png" width="60%" onclick="$('#filters').show()">
|
||||
<img id="check" class="gdButton" style="margin-bottom: 15%" src="/assets/check-off.png" width="60%"">
|
||||
<img class="gdButton" style="margin-bottom: 15%" src="../assets/plus.png" width="60%" onclick="$('#filters').show()">
|
||||
<img id="check" class="gdButton" style="margin-bottom: 15%" src="../assets/check-off.png" width="60%"">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -92,7 +92,7 @@ let completed = false
|
|||
|
||||
let formStr = ["Icon", "Ship", "Ball", "UFO", "Wave", "Robot", "Spider", "Trail", "Death Effect", "Primary Color", "Secondary Color", "Misc"]
|
||||
forms.concat(["trail", "deathEffect", "color1", "color2", "misc"]).forEach((x, y) => {
|
||||
$('#forms').append(`<img class="gdButton achFilter rewardFilter" filter="${x}" title="${formStr[y]}" src="/assets/${y > 8 ? "achievements" : "iconkitbuttons"}/${x}_on.png" height=9.5%" style="margin: 0% 0.75%">`)
|
||||
$('#forms').append(`<img class="gdButton achFilter rewardFilter" filter="${x}" title="${formStr[y]}" src="../assets/${y > 8 ? "achievements" : "iconkitbuttons"}/${x}_on.png" height=9.5%" style="margin: 0% 0.75%">`)
|
||||
})
|
||||
|
||||
function append(reset=true) {
|
||||
|
@ -126,11 +126,10 @@ function append(reset=true) {
|
|||
fetch('./api/achievements').then(res => res.json().then(ach => {
|
||||
|
||||
Object.keys(ach.types).forEach(x => {
|
||||
$('#types').append(`<img class="gdButton achFilter typeFilter" filter="${ach.types[x][1].join(" ")}" src="/assets/achievements/${x}.png" title="${ach.types[x][0]}" height="8.5%" style="margin: 0.6% 0.4%">`)
|
||||
$('#types').append(`<img class="gdButton achFilter typeFilter" filter="${ach.types[x][1].join(" ")}" src="../assets/achievements/${x}.png" title="${ach.types[x][0]}" height="8.5%" style="margin: 0.6% 0.4%">`)
|
||||
})
|
||||
|
||||
achievements = ach.achievements
|
||||
colors = ach.colors
|
||||
{achievements, colors} = ach
|
||||
append()
|
||||
|
||||
function label(labelName) {
|
||||
|
@ -163,9 +162,8 @@ function label(labelName) {
|
|||
})
|
||||
}
|
||||
|
||||
label("reward")
|
||||
label("type")
|
||||
label("game")
|
||||
const labels = ['reward', 'type', 'game']
|
||||
labels.forEach(label)
|
||||
|
||||
$(document).on('click', '.selectNone', function() { $(`.${$(this).attr('filter')}:not(.achDeselected)`).trigger('click'); $('#selectNone').hide(); $('#selectAll').show() })
|
||||
$(document).on('click', '.selectAll', function() { $(`.${$(this).attr('filter')}.achDeselected`).trigger('click'); $('#selectNone').show(); $('#selectAll').hide() })
|
||||
|
@ -174,9 +172,9 @@ $('#submitFilters').click(function() {
|
|||
|
||||
$('.popup').hide()
|
||||
|
||||
if (!$('.rewardFilter:not(.achDeselected)').length) $('#rewardLabel .selectAll').trigger('click')
|
||||
if (!$('.typeFilter:not(.achDeselected)').length) $('#typeLabel .selectAll').trigger('click')
|
||||
if (!$('.gameFilter:not(.achDeselected)').length) $('#gameLabel .selectAll').trigger('click')
|
||||
labels.forEach(x => {
|
||||
if (!$(`.${x}Filter:not(.achDeselected)`).length) $(`#${x}Label .selectAll`).trigger('click')
|
||||
})
|
||||
|
||||
achievements = ach.achievements
|
||||
.filter(x => !disabledFilters.reward.includes(x.rewardType))
|
||||
|
@ -185,12 +183,9 @@ $('#submitFilters').click(function() {
|
|||
append()
|
||||
})
|
||||
|
||||
$('#check').click(function() {
|
||||
completed = !completed
|
||||
if (completed) $('#check').attr('src', '/assets/check-on.png')
|
||||
else $('#check').attr('src', '/assets/check-off.png')
|
||||
$('#check').click(() => {
|
||||
$('#check').attr('src', `../assets/check-o${completed = !completed ? 'n' : 'ff'}.png`)
|
||||
append(false)
|
||||
})
|
||||
}))
|
||||
|
||||
</script>
|
Loading…
Add table
Reference in a new issue