2019-10-15 23:42:47 -03:00
< head >
< title > Comments< / title >
< meta charset = "utf-8" >
2021-07-04 15:50:49 -04:00
< link href = "../assets/css/browser.css" type = "text/css" rel = "stylesheet" >
2019-10-15 23:42:47 -03:00
< 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/like.png" >
< meta id = "meta-title" property = "og:title" content = "Level Comments" >
< meta id = "meta-desc" property = "og:description" content = "View the comments of a Geometry Dash level!" >
< meta id = "meta-image" name = "og:image" itemprop = "image" content = "https://gdbrowser.com/assets/like.png" >
2021-01-21 22:28:04 -03:00
< meta name = "twitter:card" content = "summary" >
2019-10-15 23:42:47 -03:00
< / head >
2019-10-22 20:54:19 -03:00
< body class = "levelBG" onbeforeunload = "saveUrl()" >
2019-10-15 23:42:47 -03:00
< div id = "everything" >
2019-11-17 19:00:19 -03:00
< div class = "popup" id = "postComment" >
< div class = "brownbox bounce center supercenter" style = "height: 80%; width: 110vh" >
2019-11-17 19:13:42 -03:00
< p style = "position:absolute; right: 1vh; margin-top: 0; text-align: left" id = "charcount" > 150< / p >
2019-11-18 20:39:17 -03:00
< h1 class = "smaller center" style = "font-size: 5.5vh" > Add Comment< / h1 >
2019-11-17 19:00:19 -03:00
< textarea placeholder = "Insert comment" id = "content" maxlength = "150" style = "margin: 2% 0%" > < / textarea > < br >
2019-11-18 20:39:17 -03:00
< form action = "nothing lol" >
2019-11-17 19:00:19 -03:00
< h3 class = "center" > GD Username< / h3 >
2019-11-18 20:39:17 -03:00
< input type = "text" name = "gdbrowser" id = "username" maxlength = "50" style = "height: 8vh; width: 90%; text-align: center; margin-top: 0.5%" >
2019-11-17 19:00:19 -03:00
< h3 class = "center" style = "margin-top: 2%" > GD Password< / h3 >
2019-11-18 20:39:17 -03:00
< input type = "password" id = "password" maxlength = "50" style = "height: 8vh; width: 90%; text-align: center; margin-top: 0.5%" >
2019-11-17 19:00:19 -03:00
< / form >
< div style = "min-height: 16%; max-height: 16%" >
< p id = "message" style = "padding: 0% 10%; margin-top: 1.5%" > < / p >
< / div >
< img src = "../assets/btn-cancel.png" height = 10%; class = "postButton gdButton center" style = "margin-right: 1%" onclick = "$('#postComment').hide(); $('textarea').val('')" >
< img src = "../assets/btn-submit.png" type = "submit" height = 10%; class = "postButton gdButton center" style = "margin-left: 1%" id = "submitComment" >
< / div >
< / div >
2019-11-18 20:39:17 -03:00
< div class = "popup" id = "likeComment" >
< div class = "brownbox bounce center supercenter" style = "height: 75%; width: 100vh" >
< h1 class = "smaller center" style = "font-size: 5.5vh" > Vote< / h1 >
< img src = "../assets/smashLike.png" id = "likebtn" class = "inline gdButton likeButton" > <!--
-->< img src = "../assets/smashDislike.png" id = "dislikebtn" class = "inline gdButton likeButton youAreNotTheOne" >
< form action = "nothing lol" >
< h3 class = "center" > GD Username< / h3 >
< input type = "text" name = "gdbrowser" id = "like-username" maxlength = "50" style = "height: 8vh; width: 90%; text-align: center; margin-top: 0.5%" >
< h3 class = "center" style = "margin-top: 2%" > GD Password< / h3 >
< input type = "password" id = "like-password" maxlength = "50" style = "height: 8vh; width: 90%; text-align: center; margin-top: 0.5%" >
< / form >
< div style = "min-height: 18%; max-height: 18%" >
< p id = "likeMessage" style = "padding: 0% 10%; margin-top: 2.5%" > < / p >
< / div >
< img src = "../assets/btn-cancel.png" height = 10%; class = "postButton gdButton center" style = "margin-right: 1%" onclick = "$('#likeComment').hide(); $('#likebtn').trigger('click');" >
< img src = "../assets/btn-submit.png" type = "submit" height = 10%; class = "postButton gdButton center" style = "margin-left: 1%" id = "submitVote" >
< / div >
< / div >
2019-10-15 23:42:47 -03:00
< div style = "position:absolute; bottom: 0%; left: 0%; width: 100%" >
2019-10-18 17:48:33 -03:00
< img class = "cornerPiece" src = "../assets/corner.png" width = 7%; >
2019-10-15 23:42:47 -03:00
< / div >
< div style = "position:absolute; bottom: 0%; right: 0%; width: 100%; text-align: right;" >
2019-10-18 17:48:33 -03:00
< img class = "cornerPiece" src = "../assets/corner.png" width = 7%; style = "transform: scaleX(-1)" >
2019-10-15 23:42:47 -03:00
< / div >
2020-09-29 22:42:18 -03:00
< div style = "text-align: right; position:absolute; top: 1%; right: 1.25%" >
< h2 class = "smallGold" id = "pagenum" > < / h2 >
< / div >
< div class = "brownBox center supercenter" style = "width: 135vh; height: 82%; margin-top: -0.25%" >
2019-10-15 23:42:47 -03:00
< div class = "lightBox center dragscroll" id = "commentBox" style = "margin: 4.5% auto; width: 115vh; height: 86%; background-color: #934E27" > < / div >
2020-09-29 22:42:18 -03:00
< div class = "supercenter" style = "left: 97%; top: 15.5%; height: 8.5%" >
< img class = "gdButton" id = "lastPage" src = "../assets/double-arrow.png" height = "90%" >
< / div >
< div class = "supercenter" id = "firstPage" style = "left: 97%; top: 27.5%; height: 8.5%; display: none;" >
< img class = "gdButton refreshBtn" src = "../assets/double-arrow.png" style = "transform: scaleX(-1);" height = "90%" >
< / div >
< div class = "supercenter" id = "refreshButton" style = "left: 97%; top: 27.5%; height: 10%" >
< img class = "gdButton refreshBtn" src = "../assets/refresh.png" height = "90%" >
2019-10-15 23:42:47 -03:00
< / div >
2019-10-23 19:40:31 -03:00
< div class = "supercenter" style = "left: 3%; top: 15%; height: 10%" >
2019-10-15 23:42:47 -03:00
< img class = "gdButton" id = "topSort" src = "../assets/sort-likes.png" height = "90%" >
< / div >
2019-10-23 19:40:31 -03:00
< div class = "supercenter" style = "left: 3%; top: 25.5%; height: 10%" >
2020-09-28 14:05:59 -03:00
< img class = "gdButton" id = "timeSort" src = "../assets/sort-time.png" height = "90%" >
2019-10-15 23:42:47 -03:00
< / div >
2020-09-29 22:42:18 -03:00
< div class = "supercenter" style = "left: 3%; top: 36%; height: 10%" >
2019-10-23 19:40:31 -03:00
< img class = "gdButton" id = "compactMode" src = "../assets/compact-off.png" height = "90%" >
< / div >
2020-09-29 22:42:18 -03:00
< div class = "supercenter" style = "left: 3%; top: 63%; height: 11%" >
< img class = "gdButton" id = "autoMode" src = "../assets/playbutton.png" height = "90%" >
2020-09-28 14:05:59 -03:00
< / div >
2019-10-15 23:42:47 -03:00
< div class = "supercenter" id = "pageDown" style = "left: 3%; top: 50%; height: 10%; display: none;" >
< img class = "gdButton" src = "../assets/arrow-left.png" height = "95%" >
< / div >
< div class = "supercenter" id = "pageUp" style = "left: 97%; top: 50%; height: 10%;" >
< img class = "gdButton" src = "../assets/arrow-right.png" height = "95%" >
< / div >
2020-09-29 22:42:18 -03:00
< div class = "supercenter" style = "top: 4.8%; height: 10%; width: 100%;" >
2020-09-28 14:05:59 -03:00
< h2 class = "smallGold inline" id = "liveText" style = "display: none; font-size: 4vh; color:red; margin: 0.4vh 3vh 0 0" > [LIVE]< / h2 >
2019-10-15 23:42:47 -03:00
< h1 class = "smaller inline" id = "levelName" > < / h1 >
2019-11-02 13:05:22 -03:00
< a id = "authorLink" > < h2 class = "smallGold inline gdButton" id = "levelAuthor" style = "margin: 0.8vh 0 0 3vh" > < / h2 > < / a >
2019-10-15 23:42:47 -03:00
< / div >
2020-09-29 22:42:18 -03:00
< div class = "supercenter" style = "top: 100%; height: 10%; width: 100%;" >
2019-10-15 23:42:47 -03:00
< h2 class = "smallGold inline" id = "levelVersion" > < / h2 >
2019-11-02 13:05:22 -03:00
< a id = "levelLink" > < h2 class = "smallGold inline gdButton" id = "levelID" style = "margin-left: 6vh" > < / h2 > < / a >
2019-10-15 23:42:47 -03:00
< / div >
2019-11-17 19:00:19 -03:00
2019-11-18 20:39:17 -03:00
< div id = "leaveComment" style = "position:absolute;bottom: 0%;right: 0%;width: 14%;text-align: right;transform: translate(30%, 40%);" >
2019-11-20 01:53:24 -03:00
< img class = "gdButton" src = "../assets/comment.png" width = "60%" onclick = "$('#content').trigger('input'); $('#postComment').show();" >
2019-11-17 19:00:19 -03:00
< / div >
2019-10-15 23:42:47 -03:00
< / div >
2019-11-17 19:16:11 -03:00
< 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()" >
< / div >
2019-10-15 23:42:47 -03:00
< / div >
< / body >
2019-10-21 12:20:25 -03:00
< script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" > < / script >
2021-01-18 23:54:18 -03:00
< script type = "text/javascript" src = "../sizecheck.js?" > < / script >
2021-01-04 12:21:58 -03:00
< script type = "text/javascript" src = "../dragscroll.js" > < / script >
2019-10-15 23:42:47 -03:00
< script >
2019-10-24 01:51:20 -03:00
let {mode, compact} = JSON.parse(localStorage.getItem('commentPreset') || '{"mode": "top", "compact": true}')
2021-02-03 15:50:19 -03:00
let messageText = 'Your < cy > Geometry Dash password< / cy > will < cg > not be stored< / cg > anywhere on the site, both < ca > locally and server-side.< / ca > You can view the code used for posting a comment < a class = "menuLink" target = "_blank" href = "https://github.com/GDColon/GDBrowser/blob/master/api/post/postComment.js" > here< / a > .'
2019-11-17 19:00:19 -03:00
$('#message').html(messageText)
2019-11-18 20:39:17 -03:00
$('#likeMessage').html(messageText.replace("posting", "liking").replace("postComment", "like"))
2019-10-24 00:33:20 -03:00
2019-10-15 23:42:47 -03:00
let lvlID = window.location.pathname.split('/')[2]
2019-11-18 20:39:17 -03:00
let history = false
2019-10-24 00:33:20 -03:00
let page = 0
2019-11-02 13:05:22 -03:00
let loadingComments = true
2019-11-18 20:39:17 -03:00
let like = true
2020-09-29 22:42:18 -03:00
let lastPage = 0
2020-09-28 14:05:59 -03:00
let auto = false
let interval = null
2021-10-07 11:19:43 -03:00
let commentCache = {}
2019-10-23 19:40:31 -03:00
2019-10-15 23:42:47 -03:00
let target = `../api/level/${lvlID}`
2019-11-18 20:39:17 -03:00
if (lvlID > 999999999 || lvlID < -999999999 ) window . location . href = window.location.href.replace("comments", " search " )
2019-11-02 02:20:23 -03:00
if (!Number.isInteger(+lvlID)) {history = true; target = `../api/profile/${lvlID}`}
else lvlID = Math.round(+lvlID)
2019-10-15 23:42:47 -03:00
2020-09-29 22:42:18 -03:00
if (mode == "top") { mode = "top"; $('#topSort').attr('src', "../assets/sort-likes-on.png") }
2020-09-28 14:05:59 -03:00
else $('#timeSort').attr('src', "../assets/sort-time-on.png")
function clean(text) {return text.replace(/& /g, "& ").replace(/< /g, "< ").replace(/>/g, "> ").replace(/=/g, "= ").replace(/"/g, "" ").replace(/'/g, "' ")}
$('#compactMode').attr('src', `../assets/compact-${compact ? "on" : "off"}.png`)
2021-01-18 23:54:18 -03:00
Fetch(target).then(lvl => {
if (gdps) {
$('#leaveComment').hide()
$('#postComment').remove()
}
2019-10-15 23:42:47 -03:00
if (history) {
2019-10-22 12:31:04 -03:00
2020-09-28 14:05:59 -03:00
$('#autoMode').remove()
2020-09-29 22:58:25 -03:00
$('#lastPage').hide()
2020-09-28 14:05:59 -03:00
2019-10-22 12:31:04 -03:00
if (!lvl.username) return window.location.href = window.location.href.replace("comments", "search")
2019-10-15 23:42:47 -03:00
$('#levelName').text(lvl.username + "'s comments")
2019-11-18 20:39:17 -03:00
$('#leaveComment').hide()
2019-10-15 23:42:47 -03:00
document.title = lvl.username + "'s comments"
$('#meta-title').attr('content', lvl.username + "'s comment history")
$('#meta-desc').attr('content', `View all of ${lvl.username}'s Geometry Dash comments!`)
}
else {
2019-11-05 20:43:04 -03:00
if (lvl.accountID == undefined) $('#levelAuthor').remove()
2019-11-05 22:46:13 -03:00
else if (lvl.accountID == 0) {
$('#levelAuthor').addClass("green").addClass("unregistered")
2021-01-21 19:15:31 -03:00
$('#authorLink').attr('href', '../search/' + lvl.playerID + "?user")
2019-11-05 22:46:13 -03:00
}
2021-04-02 21:50:22 -03:00
else $('#authorLink').attr('href', `../u/${lvl.accountID}.`)
2019-10-15 23:42:47 -03:00
$('#levelName').text(lvl.name || ("Nonexistent level " + lvlID))
2020-04-10 22:04:59 -04:00
if (!lvl.name) $('#leaveComment').hide()
2019-10-15 23:42:47 -03:00
$('#levelAuthor').text("By " + (lvl.author || "-"))
$('#levelID').text("ID: " + lvlID)
2019-11-05 22:46:13 -03:00
if (lvl.accountID & & lvl.author != "-")
2019-11-02 13:05:22 -03:00
if (lvl.id) $('#levelLink').attr('href', '../' + lvl.id)
else $('#levelID').removeClass("gdButton")
2019-10-15 23:42:47 -03:00
$('#levelVersion').text("Version: " + (lvl.version || 0))
document.title = "Comments for " + (lvl.name || lvlID)
if (lvl.name) {
$('#meta-title').attr('content', `Comments for ${lvl.name}`)
$('#meta-desc').attr('content', `View all the comments for ${lvl.name} by ${lvl.author || "Unknown"}!`)
}
}
2021-10-07 11:19:43 -03:00
function appendComments(auto, noCache) {
2019-10-23 19:40:31 -03:00
2020-09-28 14:05:59 -03:00
if (loadingComments) return;
2019-10-15 23:42:47 -03:00
else loadingComments = true;
2020-09-28 14:05:59 -03:00
if (!auto) $('#commentBox').html(`< div class = "supercenter" id = "loading" style = "height: 12%;" > < img class = "spin noSelect" src = "../assets/loading.png" height = "105%" > < / div > `)
2019-10-15 23:42:47 -03:00
2020-09-29 22:42:18 -03:00
if (page == 0) {
$('#pageDown').hide()
$('#firstPage').hide()
$('#refreshButton').show()
}
else {
$('#pageDown').show()
2020-09-29 22:58:25 -03:00
if (!history) {
$('#firstPage').show()
$('#refreshButton').hide()
}
2020-09-29 22:42:18 -03:00
}
2019-10-15 23:42:47 -03:00
2021-10-07 11:19:43 -03:00
if (!noCache & & commentCache[page]) addComments(commentCache[page])
fetch(`../api${!history ? window.location.pathname : "/comments/" + lvl.playerID}?count=${compact & & !auto ? 20 : 10}& page=${page}${history ? "& type=commentHistory" : ""}& ${mode}`).then(res => res.json()).then(addComments)
function addComments(res) {
2019-10-15 23:42:47 -03:00
2020-09-28 14:05:59 -03:00
if (history & & lvl.commentHistory != "all") $('#pageUp').hide()
2019-10-15 23:42:47 -03:00
2019-11-16 21:05:40 -03:00
if (res == -1 || (history & & lvl.commentHistory != "all")) {
2019-11-17 01:56:18 -03:00
loadingComments = false; return $('#loading').hide()
2019-10-15 23:42:47 -03:00
}
2021-10-07 11:19:43 -03:00
commentCache[page] = res
2020-09-28 14:05:59 -03:00
res.forEach((x, index) => {
$(`#date-${x.ID}`).html(x.date)
2020-11-27 00:45:11 -03:00
$(`#likes-${x.ID}`).html(x.likes)
2020-12-08 23:28:09 -03:00
$(`#thumb-${x.ID}`).attr('style', x.likes < 0 ? ` transform: translateY ( $ { compact ? ' 15 ' : ' 25 ' } % ) ; margin-right: 0 . 4 % ` : ' ' ) . attr ( ' src ' , ` . . / assets / $ { x . likes < 0 ? " dis " : " " } like . png ` )
2020-09-28 14:05:59 -03:00
if ($(`.comment[commentID=${x.ID}]`).length) return // auto mode, ignore duplicates
let bgCol = index % 2 ? "evenComment" : "oddComment"
if (auto) bgCol = $('.commentBG').first().hasClass('oddComment') ? "evenComment" : "oddComment"
2019-12-08 19:07:55 -03:00
let userName = !history ? x.username : lvl.username
2020-02-20 22:09:40 -03:00
let modNumber = x.moderator || lvl.moderator
2019-12-08 19:07:55 -03:00
2020-09-28 14:05:59 -03:00
if (x.pages) {
2020-09-29 22:42:18 -03:00
lastPage = x.pages
$('#pagenum').html(`Page ${page+1} of ${x.pages}`)
if (page+1 >= x.pages) $('#pageUp').hide()
2020-09-28 14:05:59 -03:00
else $('#pageUp').show()
}
2019-10-23 19:40:31 -03:00
////// NORMAL MODE //////
2020-09-28 14:05:59 -03:00
commentHTML = !compact ? `
< div class = "commentBG ${bgCol}" >
< div class = "comment" commentID = "${x.ID}" >
2020-11-12 22:32:15 -03:00
< img class = "inline" src = "../icon/icon?form=${x.icon.form}&icon=${x.icon.icon}&col1=${x.icon.col1}&col2=${x.icon.col2}&glow=${x.icon.glow}&size=auto" height = 21% style = "margin-right: 0.8%" >
2021-04-02 21:50:22 -03:00
< a href = ../${x.accountID = = " 0 " ? ` search / $ { x . playerID } ? user ` : ` . . / u / $ { x . accountID } . ` } >
2019-12-08 19:07:55 -03:00
< h2 class = "inline gdButton ${x.accountID == " 0 " ? " green unregistered " : " " } " > ${userName}< / h2 > < / a >
2021-01-23 00:28:26 -03:00
${modNumber > 0 ? `< img class = "inline" src = "../assets/mod${modNumber > 2 ? " -extra " : modNumber = = 2 ? " -elder " : " " } . png " height = 18% style = "margin-left: 0.6%;" > ` : ""}
2019-10-15 23:42:47 -03:00
< p class = "commentPercent inline" > ${x.percent ? x.percent + "%" : ""}< / p >
< div class = "commentAlign" >
2021-01-21 19:15:31 -03:00
< p class = "pre commentText" style = "color: rgb(${!history && x.playerID == lvl.playerID ? " 255 , 255 , 75 " : x . browserColor ? " 255 , 180 , 255 " : x . color } ) " > ${clean(x.content)}< / p >
2019-10-15 23:42:47 -03:00
< / div >
< / div >
2020-09-28 14:05:59 -03:00
< p class = "commentDate" id = "date-${x.ID}" > ${x.date}< / p >
2019-10-15 23:42:47 -03:00
< div class = "commentLikes" >
${history ? `< h3 style = "margin-right: 1.5vh; pointer-events: all;" class = "gold inline" > < a href = "../${x.levelID}" > (${x.levelID})< / a > < / h3 > ` : ""}
2019-11-18 20:39:17 -03:00
< div class = "inline gdButton likeComment" commentID = "${x.ID}" $ { x . levelID ? ` levelID = "${x.levelID}" ` : " " } " >
2020-11-27 00:45:11 -03:00
< img id = "thumb-${x.ID}" class = "inline gdButton" $ { x . likes < 0 ? " style = 'transform: translateY(25%); margin-right: 0.4%' " : " " } src = "../assets/${x.likes < 0 ? " dis " : " " } like . png " height = 20% >
2019-11-18 20:39:17 -03:00
< / div >
2020-11-27 00:45:11 -03:00
< h3 id = "likes-${x.ID}" class = "inline" > ${x.likes}< / h3 >
2019-10-15 23:42:47 -03:00
< / div >
2020-09-28 14:05:59 -03:00
< / div > `
////// COMPACT MODE //////
: `
< div class = "commentBG compactBG ${bgCol}" >
< div class = "comment compact" commentID = "${x.ID}" >
2020-11-12 22:32:15 -03:00
< img class = "inline" src = "../icon/icon?form=${x.icon.form}&icon=${x.icon.icon}&col1=${x.icon.col1}&col2=${x.icon.col2}&glow=${x.icon.glow}&size=auto" height = 21% style = "margin-right: 0.8%" >
2021-04-02 21:50:22 -03:00
< a href = ../${x.accountID = = " 0 " ? ` search / $ { x . playerID } ? user ` : ` . . / u / $ { x . accountID } . ` } >
2019-12-08 19:07:55 -03:00
< h2 class = "inline gdButton ${x.accountID == " 0 " ? " green unregistered " : " " } " > ${userName}< / h2 > < / a >
2021-01-23 00:28:26 -03:00
${modNumber > 0 ? `< img class = "inline" src = "../assets/mod${modNumber > 2 ? " -extra " : modNumber = = 2 ? " -elder " : " " } . png " height = 18% style = "margin-left: 0.6%;" > ` : ""}
2019-10-23 19:40:31 -03:00
< p class = "commentPercent inline" > ${x.percent ? x.percent + "%" : ""}< / p >
< div class = "commentAlign" >
2021-01-21 19:15:31 -03:00
< p class = "pre commentText" style = "color: rgb(${!history && x.playerID == lvl.playerID ? " 255 , 255 , 75 " : x . browserColor ? " 255 , 180 , 255 " : x . color } ) " > ${clean(x.content)}< / p >
2019-10-23 19:40:31 -03:00
< / div >
< / div >
2020-09-28 14:05:59 -03:00
< p class = "commentDate compactDate" id = "date-${x.ID}" > ${x.date}< / p >
2019-11-20 01:53:24 -03:00
< div class = "commentLikes" >
2019-10-23 19:40:31 -03:00
${history ? `< h3 style = "margin-right: 0.5vh; pointer-events: all;" class = "gold inline" > < a href = "../${x.levelID}" > (${x.levelID})< / a > < / h3 > ` : ""}
2019-11-20 01:53:24 -03:00
< div class = "inline gdButton likeComment" commentID = "${x.ID}" $ { x . levelID ? ` levelID = "${x.levelID}" ` : " " } >
2020-11-27 00:45:11 -03:00
< img id = "thumb-${x.ID}" class = "inline" $ { x . likes < 0 ? " style = 'transform: translateY(15%); margin-right: 0.4%' " : " " } src = "../assets/${x.likes < 0 ? " dis " : " " } like . png " height = 27% >
2019-11-18 20:39:17 -03:00
< / div >
2020-11-27 00:45:11 -03:00
< h3 id = "likes-${x.ID}" class = "inline" > ${x.likes}< / h3 >
2019-10-23 19:40:31 -03:00
< / div >
2020-09-28 14:05:59 -03:00
< / div > `
if (auto) $('#commentBox').prepend(commentHTML)
else $('#commentBox').append(commentHTML)
2019-10-23 19:40:31 -03:00
2019-10-15 23:42:47 -03:00
})
$('.commentText').each(function() {
2020-09-29 22:42:18 -03:00
if ($(this).text().length > 100) {
let overflow = ($(this).text().length - 100) * 0.01
$(this).css('font-size', (3.5 - (overflow)) + 'vh')
2019-10-15 23:42:47 -03:00
}
2019-10-23 19:40:31 -03:00
});
2019-10-24 00:33:20 -03:00
$('#loading').hide()
2019-11-02 13:05:22 -03:00
return loadingComments = false;
2021-10-07 11:19:43 -03:00
}
2019-10-15 23:42:47 -03:00
}
2019-11-02 13:05:22 -03:00
loadingComments = false
2019-10-15 23:42:47 -03:00
appendComments()
2019-11-02 13:05:22 -03:00
$('#pageUp').click(function() {if (loadingComments) return; page += 1; appendComments()})
$('#pageDown').click(function() {if (loadingComments) return; page -= 1; appendComments()})
2020-09-29 22:42:18 -03:00
$('#lastPage').click(function() {if (loadingComments || auto) return; page = lastPage - 1; appendComments()})
2019-10-15 23:42:47 -03:00
2020-09-28 14:05:59 -03:00
function resetSort() {
page = 0
auto = false
clearInterval(interval)
2021-10-07 11:19:43 -03:00
commentCache = {}
2020-09-28 14:05:59 -03:00
$('#liveText').hide()
$('#autoMode').attr('src', `../assets/playbutton.png`)
}
2019-10-15 23:42:47 -03:00
$('#topSort').click(function() {
2019-11-02 13:05:22 -03:00
if (mode == "top" || loadingComments) return;
2020-09-28 14:05:59 -03:00
resetSort()
2019-10-15 23:42:47 -03:00
mode = "top";
$('#timeSort').attr('src', "../assets/sort-time.png")
$('#topSort').attr('src', "../assets/sort-likes-on.png")
appendComments()
})
$('#timeSort').click(function() {
2019-11-02 13:05:22 -03:00
if (mode == "time" || loadingComments) return;
2020-09-28 14:05:59 -03:00
resetSort()
2019-10-15 23:42:47 -03:00
mode = "time";
$('#timeSort').attr('src', "../assets/sort-time-on.png")
$('#topSort').attr('src', "../assets/sort-likes.png")
appendComments()
})
2019-10-23 19:40:31 -03:00
$('#compactMode').click(function() {
2019-11-02 13:05:22 -03:00
if (loadingComments) return;
2019-10-23 19:40:31 -03:00
compact = !compact
2020-09-29 22:42:18 -03:00
lastPage = 0;
2019-10-23 19:40:31 -03:00
page = 0;
$('#compactMode').attr('src', `../assets/compact-${compact ? "on" : "off"}.png`)
appendComments()
})
2020-09-28 14:05:59 -03:00
$('#autoMode').click(function() {
if (loadingComments) return;
auto = !auto
mode = "time"
page = 0;
$('#timeSort').attr('src', "../assets/sort-time-on.png")
$('#topSort').attr('src', "../assets/sort-likes.png")
2020-09-29 22:42:18 -03:00
2020-09-28 14:05:59 -03:00
if (auto) {
2020-09-29 22:42:18 -03:00
document.title = "[LIVE] " + document.title
2020-09-28 14:05:59 -03:00
$('#liveText').show()
$('#autoMode').attr('src', `../assets/stopbutton.png`)
2020-11-12 22:32:15 -03:00
interval = setInterval(function() { appendComments(true) }, 3000)
2020-09-28 14:05:59 -03:00
}
else {
2020-09-29 22:42:18 -03:00
document.title = document.title.slice(6)
2020-09-28 14:05:59 -03:00
$('#liveText').hide()
$('#autoMode').attr('src', `../assets/playbutton.png`)
clearInterval(interval)
}
2021-10-07 11:19:43 -03:00
appendComments(true, true)
2020-09-28 14:05:59 -03:00
})
2020-09-29 22:42:18 -03:00
$(document).on('click', '.refreshBtn', function () {
2019-11-02 13:05:22 -03:00
if (loadingComments) return
2020-09-29 22:42:18 -03:00
lastPage = 0;
2019-10-15 23:42:47 -03:00
page = 0;
2021-10-07 11:19:43 -03:00
appendComments(false, true)
2019-10-15 23:42:47 -03:00
})
2019-11-17 19:13:42 -03:00
$('#content').on('input', function() {
2019-11-17 19:16:11 -03:00
let remaining = 150-$('#content').val().length
$('#charcount').text(remaining)
2019-11-17 19:13:42 -03:00
})
2019-11-17 19:00:19 -03:00
$('#submitComment').click(function() {
let comment = $('#content').val()
let username = $('#username').val()
let password = $('#password').val()
let levelID = window.location.pathname.split('/')[2]
let accountID = 0
if (!content || !username || !password || loadingComments) return $('#postComment').hide()
$('#message').text("Posting comment...")
$('.postbutton').hide()
allowEsc = false
fetch(`../api/profile/${username}`).then(res => res.json()).then(res => {
2019-12-15 21:11:35 -03:00
if (!res || res == "-1") {allowEsc = true; $('.postbutton').show(); return $('#message').text("The username you provided doesn't exist!")}
2019-11-17 19:00:19 -03:00
else accountID = res.accountID
2019-11-29 22:36:00 -03:00
$.post("../postComment", {comment, username, password, levelID, accountID, color: true})
2019-11-17 19:00:19 -03:00
.done(x => {
$('#content').val("")
$('#postComment').hide()
$('.postbutton').show()
$('#message').html(messageText)
$('#timeSort').attr('src', "../assets/sort-time-on.png")
$('#topSort').attr('src', "../assets/sort-likes.png")
allowEsc = true
mode = "time"
page = 0
appendComments()
})
2019-12-15 21:11:35 -03:00
.fail(e => {allowEsc = true; $('.postbutton').show();$('#message').text(e.responseText.includes("DOCTYPE") ? "Something went wrong..." : e.responseText)})
2019-11-17 19:00:19 -03:00
})
})
2019-11-18 20:39:17 -03:00
$('#likebtn').click(function() {
$('#likebtn').removeClass('youAreNotTheOne')
$('#dislikebtn').addClass('youAreNotTheOne')
like = true
})
$('#dislikebtn').click(function() {
$('#likebtn').addClass('youAreNotTheOne')
$('#dislikebtn').removeClass('youAreNotTheOne')
like = false
})
let commentID = 0
let lvID = 0
let likeCount, likeImg;
let likedComments;
$(document).on('click', '.likeComment', function(cmnt) {
2021-01-18 23:54:18 -03:00
if (gdps) return
2019-11-18 20:39:17 -03:00
commentID = $(this).attr('commentID')
likedComments = localStorage.likedComments ? JSON.parse(localStorage.likedComments) : []
if (likedComments.includes(commentID)) return;
lvID = $(this).attr('levelID') || 0
likeImg = $(this).find('img')
likeCount = $(this).parent().find('h3:not(.gold)')
$('#likeComment').show()
})
$('#submitVote').click(function() {
if (likedComments.includes(commentID)) return $('#likeMessage').text("You've already liked/disliked this comment!");
let ID = commentID
let username = $('#like-username').val()
let password = $('#like-password').val()
let extraID = lvID || window.location.pathname.split('/')[2]
let accountID = 0
let likeType = like ? "1" : "0"
2019-11-20 01:53:24 -03:00
2019-11-18 20:39:17 -03:00
if (!ID || !username || !password || loadingComments) return $('#postComment').hide()
$('#likeMessage').text(like ? "Liking..." : "Disliking... :(")
$('.postbutton').hide()
allowEsc = false
fetch(`../api/profile/${username}`).then(res => res.json()).then(res => {
2019-12-15 21:11:35 -03:00
if (!res || res == "-1") {allowEsc = true; $('.postbutton').show(); return $('#likeMessage').text("The username you provided doesn't exist!")}
2019-11-18 20:39:17 -03:00
else accountID = res.accountID
$.post("../like", { ID, accountID, password, like: likeType, type: 2, extraID })
.done(x => {
let newCount = parseInt(likeCount.text()) + (like ? 1 : -1)
likeCount.text(newCount)
if (newCount < 0 ) likeImg . attr ( ' src ' , ' . . / assets / dislike . png ' ) . css ( ' transform ' , compact ? ' translateY ( 15 % ) ' : ' translateY ( 25 % ) ' )
else likeImg.attr('src', '../assets/like.png').removeAttr('style')
$('#likeComment').hide()
$('#likebtn').trigger('click')
$('.postbutton').show()
$('#likeMessage').html(messageText.replace("posting", "liking").replace("postComment", "like"))
allowEsc = true
likedComments.push(commentID)
localStorage.setItem('likedComments', JSON.stringify(likedComments))
})
2019-12-15 21:11:35 -03:00
.fail(e => {allowEsc = true; $('.postbutton').show();$('#likeMessage').text(e.responseText.includes("DOCTYPE") ? "Something went wrong..." : e.responseText)})
2019-11-18 20:39:17 -03:00
})
})
$(window).on('beforeunload ', function() {
2019-12-08 19:07:55 -03:00
localStorage.setItem('commentPreset', JSON.stringify({mode, compact}))
2019-10-24 00:33:20 -03:00
})
2019-12-29 20:59:29 -03:00
$('#postComment').on("change keyup keydown paste click", "textarea", function () {
$('#content').val($('#content').val().replace(/[^\S ]+/g, ""))
2019-11-29 22:40:52 -03:00
})
2019-11-02 13:05:22 -03:00
$(document).keydown(function(k) {
2019-12-29 20:59:29 -03:00
if ($('#content').is(':visible')) {
if (k.which == 13) k.preventDefault() //enter
}
2019-11-20 01:53:24 -03:00
if (loadingComments || $('.popup').is(":visible")) return;
2019-11-02 13:05:22 -03:00
if (k.which == 37 & & $('#pageDown').is(":visible")) { //left
$('#pageDown').trigger('click')
}
if (k.which == 39 & & $('#pageUp').is(":visible")) { //right
$('#pageUp').trigger('click')
}
});
2019-10-22 20:54:19 -03:00
});
2019-10-15 23:42:47 -03:00
< / script >
