242 lines
7.6 KiB
HTML
242 lines
7.6 KiB
HTML
<script>
|
|
// Voting
|
|
|
|
function post_vote(url, callback) {
|
|
var xhr = new XMLHttpRequest();
|
|
xhr.open("POST", url, true);
|
|
var form = new FormData()
|
|
form.append("formkey", formkey());
|
|
xhr.withCredentials=true;
|
|
|
|
xhr.onload = function() {
|
|
if (xhr.status==204) {}
|
|
else if (xhr.status >= 200 && xhr.status < 300) {
|
|
$('#toast-post-success').toast('dispose');
|
|
$('#toast-post-success').toast('show');
|
|
document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
|
|
callback(xhr)
|
|
return true
|
|
|
|
} else if (xhr.status >= 300 && xhr.status < 400) {
|
|
window.location.href = JSON.parse(xhr.response)["redirect"]
|
|
} else {
|
|
data=JSON.parse(xhr.response);
|
|
|
|
$('#toast-post-error').toast('dispose');
|
|
$('#toast-post-error').toast('show');
|
|
document.getElementById('toast-post-error-text').innerText = data["error"];
|
|
return false
|
|
|
|
}
|
|
};
|
|
|
|
xhr.send(form);
|
|
|
|
}
|
|
|
|
var upvote = function(event) {
|
|
|
|
var type = event.target.dataset.contentType;
|
|
var id = event.target.dataset.idUp;
|
|
|
|
var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
|
|
var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
|
|
var scoreText = document.getElementsByClassName(type + '-score-' + id);
|
|
|
|
for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
|
|
|
|
var thisUpvoteButton = upvoteButton[j];
|
|
var thisDownvoteButton = downvoteButton[j];
|
|
var thisScoreText = scoreText[j];
|
|
var thisScore = Number(thisScoreText.textContent);
|
|
|
|
if (thisUpvoteButton.classList.contains('active')) {
|
|
thisUpvoteButton.classList.remove('active')
|
|
thisScoreText.textContent = thisScore - 1
|
|
voteDirection = "0"
|
|
} else if (thisDownvoteButton.classList.contains('active')) {
|
|
thisUpvoteButton.classList.add('active')
|
|
thisDownvoteButton.classList.remove('active')
|
|
thisScoreText.textContent = thisScore + 2
|
|
voteDirection = "1"
|
|
} else {
|
|
thisUpvoteButton.classList.add('active')
|
|
thisScoreText.textContent = thisScore + 1
|
|
voteDirection = "1"
|
|
}
|
|
|
|
if (thisUpvoteButton.classList.contains('active')) {
|
|
thisScoreText.classList.add('score-up')
|
|
thisScoreText.classList.remove('score-down')
|
|
thisScoreText.classList.remove('score')
|
|
} else if (thisDownvoteButton.classList.contains('active')) {
|
|
thisScoreText.classList.add('score-down')
|
|
thisScoreText.classList.remove('score-up')
|
|
thisScoreText.classList.remove('score')
|
|
} else {
|
|
thisScoreText.classList.add('score')
|
|
thisScoreText.classList.remove('score-up')
|
|
thisScoreText.classList.remove('score-down')
|
|
}
|
|
}
|
|
|
|
post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
|
|
|
|
}
|
|
|
|
var downvote = function(event) {
|
|
|
|
var type = event.target.dataset.contentType;
|
|
var id = event.target.dataset.idDown;
|
|
|
|
var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
|
|
var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
|
|
var scoreText = document.getElementsByClassName(type + '-score-' + id);
|
|
|
|
for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
|
|
|
|
var thisUpvoteButton = upvoteButton[j];
|
|
var thisDownvoteButton = downvoteButton[j];
|
|
var thisScoreText = scoreText[j];
|
|
var thisScore = Number(thisScoreText.textContent);
|
|
|
|
if (thisDownvoteButton.classList.contains('active')) {
|
|
thisDownvoteButton.classList.remove('active')
|
|
thisScoreText.textContent = thisScore + 1
|
|
voteDirection = "0"
|
|
} else if (thisUpvoteButton.classList.contains('active')) {
|
|
thisDownvoteButton.classList.add('active')
|
|
thisUpvoteButton.classList.remove('active')
|
|
thisScoreText.textContent = thisScore - 2
|
|
voteDirection = "-1"
|
|
} else {
|
|
thisDownvoteButton.classList.add('active')
|
|
thisScoreText.textContent = thisScore - 1
|
|
voteDirection = "-1"
|
|
}
|
|
|
|
if (thisUpvoteButton.classList.contains('active')) {
|
|
thisScoreText.classList.add('score-up')
|
|
thisScoreText.classList.remove('score-down')
|
|
thisScoreText.classList.remove('score')
|
|
} else if (thisDownvoteButton.classList.contains('active')) {
|
|
thisScoreText.classList.add('score-down')
|
|
thisScoreText.classList.remove('score-up')
|
|
thisScoreText.classList.remove('score')
|
|
} else {
|
|
thisScoreText.classList.add('score')
|
|
thisScoreText.classList.remove('score-up')
|
|
thisScoreText.classList.remove('score-down')
|
|
}
|
|
}
|
|
|
|
post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
|
|
|
|
}
|
|
|
|
|
|
var register_votes = function() {
|
|
var upvoteButtons = document.getElementsByClassName('upvote-button')
|
|
|
|
var downvoteButtons = document.getElementsByClassName('downvote-button')
|
|
|
|
var voteDirection = 0
|
|
|
|
for (var i = 0; i < upvoteButtons.length; i++) {
|
|
upvoteButtons[i].addEventListener('click', upvote, false);
|
|
upvoteButtons[i].addEventListener('keydown', function(event) {
|
|
if (event.keyCode === 13) {
|
|
upvote(event)
|
|
}
|
|
}, false)
|
|
};
|
|
|
|
for (var i = 0; i < downvoteButtons.length; i++) {
|
|
downvoteButtons[i].addEventListener('click', downvote, false);
|
|
downvoteButtons[i].addEventListener('keydown', function(event) {
|
|
if (event.keyCode === 13) {
|
|
downvote(event)
|
|
}
|
|
}, false)
|
|
};
|
|
}
|
|
|
|
register_votes()
|
|
|
|
// award modal
|
|
|
|
function awardModal(link) {
|
|
var target = document.getElementById("awardTarget");
|
|
target.action = link;
|
|
}
|
|
|
|
function bruh(kind) {
|
|
document.getElementById('giveaward').disabled=false;
|
|
document.getElementById('kind').value=kind;
|
|
try {document.getElementsByClassName('picked')[0].classList.toggle('picked');} catch(e) {}
|
|
document.getElementById(kind).classList.toggle('picked')
|
|
}
|
|
</script>
|
|
|
|
<div class="modal fade" id="awardModal" tabindex="-1" role="dialog" aria-labelledby="awardModalTitle" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Give Award</h5>
|
|
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true"><i class="far fa-times"></i></span>
|
|
</button>
|
|
</div>
|
|
<div id="awardModalBody" class="modal-body">
|
|
<form id="awardTarget" class="pt-3 pb-0" action="" method="post">
|
|
<div class="card-columns awards-wrapper">
|
|
{% for award in v.user_awards %}
|
|
{% if award.owned %}
|
|
<a href="javascript:void(0)" id="{{award.kind}}" class="card" onclick="bruh('{{award.kind}}')">
|
|
{% else %}
|
|
<a href="javascript:void(0)" id="{{award.kind}}" class="card disabled">
|
|
{% endif %}
|
|
<i class="{{award.icon}} {{award.color}}"></i><br />
|
|
<span class="d-block pt-2" style="font-weight: bold; font-size: 14px; color:#E1E1E1">{{award.title}}</span>
|
|
<span class="text-muted">{{award.owned}} owned</span>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
<label for="note" class="pt-4">Note (optional):</label>
|
|
<input id="kind" name="kind" value="" hidden>
|
|
<textarea id="note" name="note" class="form-control" placeholder="Note to include in award notification"></textarea>
|
|
<input id="giveaward" class="btn btn-primary" style="float:right" type="submit" value="Give Award" disabled>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.awards-wrapper input[type="radio"] {
|
|
display: none;
|
|
}
|
|
|
|
.awards-wrapper a {
|
|
cursor: pointer;
|
|
padding: 15px;
|
|
text-align: center;
|
|
text-transform: none!important;
|
|
}
|
|
|
|
.awards-wrapper a i {
|
|
font-size: 45px;
|
|
}
|
|
|
|
.awards-wrapper a.disabled {
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.awards-wrapper a:hover, .picked {
|
|
background-color: var(--primary)!important;
|
|
}
|
|
|
|
.awards-wrapper input[type="radio"]:checked+a {
|
|
background-color: var(--primary)!important;
|
|
}
|
|
</style> |