Added interface for custom lists!
This commit is contained in:
GDColon
parent
6782ba7877
commit
301e32f8b9
5 changed files with 103 additions and 30 deletions
|
|
@ -218,7 +218,7 @@ textarea {
|
|||
|
||||
textarea::-webkit-scrollbar {
|
||||
height: 8%;
|
||||
width: 2.2%;
|
||||
width: 1.5vh;
|
||||
background: #6d3c24;
|
||||
}
|
||||
|
||||
|
|
@ -257,6 +257,11 @@ textarea::placeholder {
|
|||
font-size: 3vh;
|
||||
}
|
||||
|
||||
#listLevels::placeholder {
|
||||
color: rgba(211, 211, 211, 0.5);
|
||||
font-size: 2.5vh;
|
||||
}
|
||||
|
||||
input:focus, textarea:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
|
@ -1077,6 +1082,10 @@ input::-webkit-inner-spin-button {
|
|||
outline-offset: -0.4vh;
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ff0000 !important;
|
||||
}
|
||||
|
||||
.yellow {
|
||||
color: #ffde00;
|
||||
}
|
||||
|
|
|
|||
BIN
assets/listbutton.png
Normal file
BIN
assets/listbutton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
BIN
assets/menubutton.png
Normal file
BIN
assets/menubutton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
|
|
@ -28,6 +28,27 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div id="customlist" class="popup">
|
||||
<div class="brownBox bounce center supercenter" style="width: 100vh; height: 56%; padding-top: 0.3%; padding-bottom: 3.5%; padding-left: 1%">
|
||||
<img class="gdButton" src="../assets/close.png" width="9%" style="position: absolute; top: -8.5%; left: -5.5vh" onclick="$('#filters').hide()">
|
||||
<h1>Custom List</h1><br>
|
||||
<p id="listInfo" style="margin-top: 1%; margin-bottom: 1.5%">Paste a <span style="color: yellow">comma-seperated</span> list of <span style="color: cyan">Level IDs</span> to create a custom list!</p>
|
||||
<textarea id="listLevels" placeholder="18025697, 23189196, 27786218, 27728679, 25706351" style="margin-bottom: 2%; font-size: 2.5vh"></textarea>
|
||||
|
||||
<div class="inline" style="width: 60%">
|
||||
<h1 class="smaller lessSpaced">List Name</h1>
|
||||
<input id="listName" type="text" placeholder="Custom List" style="font-size: 4vh; height: 13%; width: 90%; text-align: center;" maxlength="32">
|
||||
</div>
|
||||
<div class="inline" style="width: 39%; margin-bottom: 3%">
|
||||
<h1 class="smaller lessSpaced">Page Size</h1>
|
||||
<input id="pageSize" type="number" value="10" style="font-size: 4vh; height: 13%; width: 45%; text-align: center;">
|
||||
</div>
|
||||
|
||||
<a id="listLink"><img src="../assets/btn-submit.png" type="submit" height=12.5%; class="disabled gdButton" style="margin-left: 1%" id="createList"></a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="position:absolute; bottom: 0%; left: 0%; width: 100%">
|
||||
<img class="cornerPiece" src="../assets/corner.png" width=7%;>
|
||||
</div>
|
||||
|
|
@ -100,7 +121,8 @@
|
|||
</div>
|
||||
|
||||
<div style="position:absolute; top: 2%; right: 1.5%; width: 10%; text-align: right">
|
||||
<img class="gdButton" src="../assets/plus.png" width="60%" onclick="$('#filters').show()">
|
||||
<img class="gdButton" style="margin-bottom: 15%" src="../assets/plus.png" width="60%" onclick="$('#filters').show()">
|
||||
<img class="gdButton" src="../assets/listbutton.png" width="60%" onclick="$('#customlist').show()">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -115,6 +137,11 @@ let minusCheck = []
|
|||
let demons = []
|
||||
let demonMode = false;
|
||||
|
||||
function undupe(array) {
|
||||
if (!Array.isArray(array)) return array
|
||||
else return array.filter((x, y) => array.indexOf(x) == y)
|
||||
}
|
||||
|
||||
$('#userSearch').click(function() {
|
||||
let query = encodeURIComponent($('#levelName').val()).replace(/%2F/gi, "")
|
||||
if (query) window.location.href = "./u/" + query
|
||||
|
|
@ -194,9 +221,40 @@ $('.lengthDiv').click(function() {
|
|||
})
|
||||
|
||||
$(document).keydown(function(k) {
|
||||
if (k.which == 13 && $('#filters').is(':hidden')) $('#searchBtn').trigger('click') //enter
|
||||
if (k.which == 13) {
|
||||
if (!$('#customlist').is(':hidden')) k.preventDefault();
|
||||
else if ($('#filters').is(':hidden')) $('#searchBtn').trigger('click') //enter
|
||||
}
|
||||
});
|
||||
|
||||
$('#pageSize').on('input blur', function (event) {
|
||||
var x = +$(this).val(); var max = 100; var min = 1
|
||||
if (event.type == "input") { if (x > max || x < min) $(this).addClass('red'); else $(this).removeClass('red')}
|
||||
else {
|
||||
$(this).val(Math.max(Math.min(Math.floor(x), max), min));
|
||||
$(this).removeClass('red')
|
||||
}
|
||||
$('#listLevels').trigger('input')
|
||||
})
|
||||
|
||||
let listMsg = $('#listInfo').html()
|
||||
$('#listLevels, #listName').on('input blur', function (event) {
|
||||
let levels = $('#listLevels').val().replace(/\n| /g, ",").split(",").map(x => x.replace(/[^0-9]/g, "")).filter(x => +x > 0 && +x < 100000000000)
|
||||
levels = undupe(levels)
|
||||
|
||||
</script>
|
||||
if (levels.length > 1 && levels.length <= 100) {
|
||||
$('#listInfo').html(`A list of <span style='color: yellow'>${levels.length}</span> levels will be created.`)
|
||||
$('#listLink').attr('href', `./${levels.join(",")}?list&count=${+$('#pageSize').val()}${$('#listName').val().length ? `&header=${encodeURIComponent($('#listName').val())}` : ""}`)
|
||||
$('#createList').removeClass('disabled')
|
||||
}
|
||||
|
||||
else {
|
||||
$('#createList').addClass('disabled')
|
||||
if (levels.length > 100) $('#listInfo').html('Custom lists have a max of 100 levels!')
|
||||
else if (levels.length == 1) $('#listInfo').html("Please enter more than one level!")
|
||||
else $('#listInfo').html(listMsg)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
</script>
|
||||
|
|
@ -122,6 +122,7 @@ let userMode = url.searchParams.get('user')
|
|||
let type = url.searchParams.get('type')
|
||||
let list = url.searchParams.get('list')
|
||||
let count = url.searchParams.get('count')
|
||||
let header = url.searchParams.get('header')
|
||||
let loading = false;
|
||||
let gauntlets = ["Fire", "Ice", "Poison", "Shadow", "Lava", "Bonus", "Chaos", "Demon", "Time", "Crystal", "Magic", "Spike", "Monster", "Doom", "Death"]
|
||||
|
||||
|
|
@ -151,19 +152,10 @@ function Append(firstLoad) {
|
|||
|
||||
fetch(searchFilters.replace("[PAGE]", page)).then(res => res.json()).then(res => {
|
||||
|
||||
if (res == '-1' || (res.length < 9 && type != "recent")) $('#pageUp').hide()
|
||||
else $('#pageUp').show()
|
||||
|
||||
if (res == '-1' || res.length == 0) { $('#loading').hide(); return loading = false }
|
||||
|
||||
if (firstLoad) {
|
||||
pages = res[0].pages
|
||||
results = res[0].results
|
||||
if (res.length < 9 && res.length > 0) {
|
||||
pages = 1
|
||||
results = res.length
|
||||
}
|
||||
else if (pages > 999 || pages < 1) {
|
||||
if (pages > 999 || pages < 1) {
|
||||
pages = null
|
||||
if (!superSearch) $('#shuffle').addClass('grayscale')
|
||||
else $('#shuffle').css('filter', 'hue-rotate(100deg)')
|
||||
|
|
@ -172,6 +164,11 @@ function Append(firstLoad) {
|
|||
$('#pagenum').text(`Page 1${pages ? ` of ${pages}` : ""}`)
|
||||
}
|
||||
|
||||
if (res == '-1' || (pages && page >= pages) || (!pages && res.length < 9 && type != "recent")) $('#pageUp').hide()
|
||||
else $('#pageUp').show()
|
||||
|
||||
if (res == '-1' || res.length == 0) { $('#loading').hide(); return loading = false }
|
||||
|
||||
res.forEach((x, y) => {
|
||||
let hasAuthor = (x.accountID != "0")
|
||||
if (y == 0 && (type == 5 || typeof userMode == 'string')) {
|
||||
|
|
@ -219,19 +216,27 @@ $('#pageUp').click(function() {page += 1; if (!loading) Append()})
|
|||
$('#pageDown').click(function() {page -= 1; if (!loading) Append()})
|
||||
$('#pageJump').click(function() {if (loading) return; page = parseInt(($('#pageSelect').val() || 1) - 1); Append()})
|
||||
|
||||
if (type == 1 || type == 'mostdownloaded') $('#header').text("Most Downloaded")
|
||||
if (type == 2 || type == 'mostliked') $('#header').text("Most Liked")
|
||||
if (type == 3 || type == 'trending') $('#header').text("Trending Levels")
|
||||
if (type == 4 || type == 'recent') $('#header').text("Recent Levels")
|
||||
if (type == 6 || type == 'featured') $('#header').text("Featured")
|
||||
if (type == 7 || type == 'magic') $('#header').text("Magic Levels")
|
||||
if (type == 11 || type == 'awarded' || type == 'starred') $('#header').text("Awarded Levels")
|
||||
if (type == 16 || type == 'halloffame' || type == 'hof') $('#header').text("Hall of Fame")
|
||||
if (path != "*" && (type == 10 || list != null)) $('#header').text("List of Levels")
|
||||
if (type == 'followed') $('#header').text("Followed Creators")
|
||||
document.title = $('#header').text() || "Level Search"
|
||||
$('#meta-title').attr('content', $('#header').text() || "Level Search")
|
||||
if ($('#header').text()) $('#meta-desc').attr('content', `View Geometry Dash's ${$('#header').text()}${$('#header').text() == "Hall of Fame" ? "" : "list"}!`)
|
||||
if (header) {
|
||||
header = header.slice(0, 32) || "Level Search"
|
||||
$('#header').text(header)
|
||||
document.title = header
|
||||
}
|
||||
|
||||
else {
|
||||
if (type == 1 || type == 'mostdownloaded') $('#header').text("Most Downloaded")
|
||||
if (type == 2 || type == 'mostliked') $('#header').text("Most Liked")
|
||||
if (type == 3 || type == 'trending') $('#header').text("Trending Levels")
|
||||
if (type == 4 || type == 'recent') $('#header').text("Recent Levels")
|
||||
if (type == 6 || type == 'featured') $('#header').text("Featured")
|
||||
if (type == 7 || type == 'magic') $('#header').text("Magic Levels")
|
||||
if (type == 11 || type == 'awarded' || type == 'starred') $('#header').text("Awarded Levels")
|
||||
if (type == 16 || type == 'halloffame' || type == 'hof') $('#header').text("Hall of Fame")
|
||||
if (path != "*" && (type == 10 || list != null)) $('#header').text("Custom List")
|
||||
if (type == 'followed') $('#header').text("Followed Creators")
|
||||
document.title = $('#header').text() || "Level Search"
|
||||
$('#meta-title').attr('content', $('#header').text() || "Level Search")
|
||||
if ($('#header').text()) $('#meta-desc').attr('content', `View Geometry Dash's ${$('#header').text()}${$('#header').text() == "Hall of Fame" ? "" : "list"}!`)
|
||||
}
|
||||
|
||||
if (type == 'saved') {
|
||||
$('#header').text("Saved Levels")
|
||||
|
|
@ -288,10 +293,11 @@ $('#shuffle').click(function() {
|
|||
}
|
||||
else if (pages) {
|
||||
let random = {}
|
||||
let pageCount = +count || 10
|
||||
randomResult = Math.floor(Math.random() * (results)) + 1
|
||||
randomPage = Math.ceil(randomResult / 10)
|
||||
randomIndex = randomResult % 10
|
||||
if (randomIndex == 0) randomIndex = 10
|
||||
randomPage = Math.ceil(randomResult / pageCount)
|
||||
randomIndex = randomResult % pageCount
|
||||
if (randomIndex == 0) randomIndex = pageCount
|
||||
$('#searchBox').html('<div style="height: 4.5%"></div>')
|
||||
$('#loading').show()
|
||||
fetch(searchFilters.replace('[PAGE]', randomPage-1)).then(res => res.json()).then(res => {
|
||||
|
|
|
|||
Loading…
Reference in a new issue