Creator following + more search buttons

- You can now follow creators via their profile. Saved in localStorage
- Added buttons to search by awarded, featured, or followed
- Remade the search button images in higher quality

api/search.js

@@ -24,6 +24,7 @@ module.exports = async (app, req, res) => {
         gauntlet: req.query.gauntlet || 0,
         len: req.query.length,
         song: req.query.songID,
+        followed: req.query.creators,
 
         featured: req.query.hasOwnProperty("featured") ? 1 : 0,
         originalOnly: req.query.hasOwnProperty("original") ? 1 : 0,
@@ -66,6 +67,8 @@ module.exports = async (app, req, res) => {
         if (!req.params.text.match(/^[0-9]*$/)) return app.run.profile(app, req, res, null, req.params.text)
     } 
 
+    if (req.query.hasOwnProperty("creators")) filters.type = 12
+
     if (req.params.text == "*") delete filters.str
 
 

html/api.html

@@ -241,7 +241,7 @@
 			<p>Use an asterisk (*) as your search query if you do not wish to search by level name (if you intend on using filters)</p>
 
 			<br>
-			<p class="reveal" onclick="$('#params-search').slideToggle(100)"><b>Parameters (17)</b></p>
+			<p class="reveal" onclick="$('#params-search').slideToggle(100)"><b>Parameters (18)</b></p>
 			<div class="subdiv" id="params-search">
 				<p>Buckle up... there's a lot</p>
 
@@ -259,6 +259,7 @@
 				<br>
 				<p><b>Params that require a string</b> (e.g. ?type=trending)</p>
 				<p>type: The type of search to perform, see <u>search types</u> below</p>
+				<p>creators: A comment seperated list of account IDs. Only levels by those players will be returned</p>
 
 				<br>
 				<p><b>Params that require anything</b> (e.g. ?mappack=yes or ?mappack)</p>

html/filters.html

@@ -36,7 +36,7 @@
 		<img class="cornerPiece" src="../assets/corner.png" width=7%; style="transform: scaleX(-1)">
 	</div>
 
-	<div class="transparentBox center" style="width: 115vh; height: 9%; margin: 1.5% auto 3% auto; padding-bottom: 0.2%">
+	<div class="transparentBox center" style="width: 115vh; height: 9%; margin: 1.5% auto 1% auto; padding-bottom: 0.2%">
 		<div>
 		<input type="text" id="levelName" placeholder="Enter a level, user, or ID" maxlength=20>
 		<img search="0" src="../assets/search.png" id="searchBtn" width="20%" class="valign gdButton levelSearch" style="margin-left: 1%; margin-bottom: 2.2%">
@@ -48,14 +48,18 @@
 		<h1 class="smaller">Quick Search</h1>
 	</div>
 
-	<div class="transparentBox center" style="width: 115vh; height: 23%; margin: 0.5% auto 3% auto; padding-top: 1%">
-		<img src="../assets/search-top.png" height="40%" class="valign gdButton spaced levelSearch" search="mostdownloaded">
+	<div class="transparentBox center" style="width: 115vh; height: 35%; margin: 0.5% auto 1% auto; padding-top: 1.1%">
+		<img src="../assets/btn-top.png" height="27%" class="valign gdButton spaced levelSearch" search="mostdownloaded">
 		<span style="margin-right: 3%"></span>
-		<img src="../assets/search-liked.png" height="40%" class="valign gdButton spaced levelSearch" search="mostliked">
+		<img src="../assets/btn-liked.png" height="27%" class="valign gdButton spaced levelSearch" search="mostliked">
 		<br>
-		<img src="../assets/search-trending.png" height="40%" class="valign gdButton levelSearch" search="trending">
-		<img src="../assets/search-recent.png" height="40%" class="valign gdButton levelSearch" search="recent" style="margin: 0% 1.2%">
-		<img src="../assets/search-magic.png" height="40%" class="valign gdButton levelSearch" search="magic">
+		<img src="../assets/btn-trending.png" height="27%" class="valign gdButton spaced levelSearch" search="trending">
+		<img src="../assets/btn-recent.png" height="27%" class="valign gdButton spaced levelSearch" search="recent" style="margin-left: 2%; margin-right: 2%">
+		<img src="../assets/btn-magic.png" height="27%" class="valign gdButton spaced levelSearch" search="magic">
+		<br>
+		<img src="../assets/btn-awarded.png" height="27%" class="valign gdButton levelSearch" search="awarded">
+		<img src="../assets/btn-featured.png" height="27%" class="valign gdButton levelSearch" search="featured" style="margin: 0% 2%">
+		<img src="../assets/btn-followed.png" height="27%" class="valign gdButton levelSearch" search="followed">
 	</div>
 
 	<div class="center">

html/profile.html

@@ -110,11 +110,12 @@
 			<img src="../assets/friends.png" height="10%" id="friendButton" class="sideSpace gdButton" onclick="$('#settingsDiv').show()">
 		</div>
 
-		<div style="position: absolute; bottom: 0%; left: 5%">
+		<div style="position: absolute; bottom: 0%; left: 12%">
 			<p style="text-align: left; font-size: 2.2vh; color: rgba(0, 0, 0, 0.5)">Account ID: [[ACCOUNTID]]<br>Player ID: [[PLAYERID]]</p>
 		</div>
 
-		<!-- <img src="../assets/follow-off.png" class="gdButton" style="position: absolute; left: 0.5%; bottom: 1%; width: 6%"> -->
+		<img src="../assets/follow-off.png" id="followOff" class="gdButton" style="position: absolute; left: 4.5%; bottom: 1%; width: 6%">
+		<img src="../assets/follow-on.png"  id="followOn"  class="gdButton" style="position: absolute; left: 4.5%; bottom: 1%; width: 6%; display: none">
 	
 		<a id="commentA"><img src="../assets/comments.png" class="gdButton" id="commentButton" style="position: absolute; right: 0.5%; bottom: 50%; width: 6%" onclick="$('#settingsDiv').show()"></a>
 		<a href="../search/[[USERNAME]]?user"><img src="../assets/levels.png" class="gdButton" style="position: absolute; right: 0.5%; bottom: 1%; width: 6%"></a>
@@ -160,6 +161,22 @@ $('#collectibles').html($('#collectibles').html().split('	0 <img class="valign"
 $('#modBadge[[MODERATOR]]').show()
 $('#globalrank[[RANK]]').hide()
 
+let followed = localStorage.followed ? JSON.parse(localStorage.followed) : []
+if (followed.includes([[ACCOUNTID]])) {$('#followOff').hide(); $('#followOn').show()}
+
+$('#followOff').click(function() {
+	followed.push([[ACCOUNTID]])
+	localStorage.followed = JSON.stringify(followed)
+	$('#followOff').hide()
+	$('#followOn').show()
+})
+
+$('#followOn').click(function() {
+	localStorage.followed = JSON.stringify(followed.filter(x => x != [[ACCOUNTID]]))
+	$('#followOff').show()
+	$('#followOn').hide()
+})
+
 if (`[[YOUTUBE]]` != "null") $('#youtube').show()
 if (`[[TWITTER]]` != "null") $('#twitter').show()
 if (`[[TWITCH]]` != "null")  $('#twitch').show()

html/search.html

@@ -129,7 +129,12 @@ let results = 0
 let legalPages = true
 let superSearch = ['*', '*?type=mostliked', '*?type=mostdownloaded', '*?type=recent'].includes(window.location.href.split('/')[4].toLowerCase())
 
-let searchFilters = `../api/search/${type == 'saved' ? JSON.parse(localStorage.getItem('saved') || '[]').reverse().toString() : accID || path}?page=[PAGE]${window.location.search.replace("?", "&").replace("page", "nope")}`
+let searchFilters = `../api/search/${type == 'saved' ? JSON.parse(localStorage.getItem('saved') || '[]').reverse().toString() : accID || path}?page=[PAGE]${window.location.search.replace(/\?/g, "&").replace("page", "nope")}`
+
+if (type == "followed") {
+	let followed = localStorage.followed ? JSON.parse(localStorage.followed) : []
+	searchFilters += ("&creators=" + followed.join()) 
+}
 
 function Append(firstLoad) {
 
@@ -220,6 +225,7 @@ 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 (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"}!`)