BDEMetz
/
bde-liste
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

POOUPUPPPPPPPPPPPPP

master
johan 3 years ago
parent
b18d476c8c
commit
4cae1a7325
3 changed files with 170 additions and 10 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 52
      static/css/main.css
  2. 31
      static/index.html
  3. 97
      static/js/main.js

52
static/css/main.css
View File

@ -260,10 +260,60 @@ button[type="submit"]:hover {
margin-left: 10px;
}
#error-message, #error-message-demande {
#error-message, #error-message-demande, #error-message-register {
color: red;
}
.treasure {
padding: 5px;
}
.treasure-submitted {
color: rgba(254, 181, 35, 0.471)
}
.treasure-accepted {
background-color: rgba(0, 255, 0, 0.46);
}
.overlay {
z-index: 99;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
opacity: 0;
visibility: hidden;
}
#treasure-popup {
margin: 70px auto;
padding: 20px;
background: #fff;
border-radius: 5px;
width: calc(100% - 10vw);
position: relative;
transition: all 5s ease-in-out;
}
.close {
position: absolute;
top: 20px;
right: 30px;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #333;
}
.close:hover {
color: #d75b00;
text-decoration: none;
}
@media screen and (max-width: 800px) {
.bg-full {
display: none;

31
static/index.html
View File

@ -153,7 +153,7 @@
<input type="text" class="form-control" placeholder="Lieu de livraison" id="demande-where">
</div>
<div class="form-group">
<input type="number" class="form-control" placeholder="Quantité" id="demande-amount">
<input type="number" class="form-control" placeholder="Quantité" max="8" id="demande-amount">
</div>
<div class="form-group">
<select class="form-control" id="demande-supp">
@ -173,11 +173,17 @@
<p id="error-message-demande"></p>
</div>
</div>
<div class="spacer colum-section"></div>
<div class="column-section">
<h2>Chasse au trésor</h2>
</div>
<hr/>
<div class="column-section">
<h2>Chasse au trésor</h2>
<p>Retrouve ici toutes les énigmes. Celles en vert sont déjà resolues alors dépéchez vous de résoudre les autres !</p>
<div class="column-section" id="treasure-list">
</div>
</div>
<hr/>
<div class="column-section">
<h1>Vos demandes en cours</h1>
@ -186,6 +192,23 @@
</div> <!-- end demande page -->
</div>
<div class="overlay">
<div id="treasure-popup">
<div class="column-section">
<h2>Soumettre la résolution d'une énigme !</h2>
<a class="close" href="#">&times;</a>
<p id="treasure-popup-title"></p>
<input type="hidden" id="treasure-popup-uid">
<div class="form-group">
<input type="file" id="treasure-popup-image" >
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary" id="treasure-popup-button">Envoyer</button>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/typeit@8.7.0/dist/index.umd.js"></script>
<script src="js/main.js" defer></script>

97
static/js/main.js
View File

@ -85,7 +85,7 @@ $("#register-button").click(function (e) {
});
if( $("#register-password-confirm").val() != $("#register-password").val()) {
t = new TypeIt('#error-message-register', {
speed: 110,
speed: 100,
lifeLike: true
})
.type("Oups, les 2 mots de passe ne correspondent pas !")
@ -598,8 +598,17 @@ function refreshListener() {
});
});
$(".treasure-btn-submit").click((e) => {
let uid = e.target.parentNode.parentNode.id;
$('.overlay').css({"opacity": 1, "visibility": "visible"});
});
}
$('.close').click((e) => {
$('.overlay').css({"opacity": 0, "visibility": "hidden"});
});
$('#demande-button').click(function () {
$.ajax({
type: "POST",
@ -688,12 +697,85 @@ function updateDemandes() {
if (data.why == "Not authentificated") {
show_page('#login-page');
} else {
alert(data.why);
console.alert(data.why);
}
}
}
});
$.ajax({
type: "POST",
url: base_url + "get",
data: JSON.stringify({
uid: localStorage.getItem('user'),
token: localStorage.getItem('token'),
type: "activity"
}),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
if(data.success) {
$('#treasure-list').html('');
let ad = data.activityData;
for(const ad_uid in ad) {
if(ad[ad_uid].type == "treasure") {
$('#treasure-list').append(`
<span id="${ad_uid}" class="treasure ${ad[ad_uid].treasureState == "Accepted" ? "treasure-accepted" : ""}">
<h2 class="treasure-title">${ad[ad_uid].title}</h2>
<div class="treasure-desc">Indice: ${ad[ad_uid].desc}</div>
<div class="treasure-status">Statue: ${ad[ad_uid].treasureState}</div>
${ (ad[ad_uid].treasureState != "Accepted" && ad[ad_uid].treasureState != "Refused" ) ?
`<span class="treasure-btn">
<div class="treasure-btn-submit">Soumettre sa résolution</div>
</span>`
: ''
}
</span>
`)
}
}
refreshListener();
}
else {
console.alert(data.why);
}
}
});
$.ajax({
type: "POST",
url: base_url + "get",
data: JSON.stringify({
uid: localStorage.getItem('user'),
token: localStorage.getItem('token'),
type: "treasure"
}),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
if(data.success) {
let td = data.treasureData;
for(const td_uid in td) {
$elem = $('#' + td_uid);
$elem.addClass('treasure-submitted');
$elem.children(".treasure-button-submit").text('Editer la soumission');
$elem.children('.treasure-desc').insertAfter(`<div class="treasure-image">Image: <a href="${base_url}images/${td[td_uid].image}.html" target="_blank"> Lien</a></div>`)
}
refreshListener();
}
else {
console.alert(data.why);
}
}
});
}
}
@ -739,7 +821,7 @@ function updateNextActivity() {
let h = Math.trunc(diff / 3600) - days*24
let m = Math.trunc(diff / 60) - (h + days*24)*60
let s = diff - h*3600 - m*60 - days*24*3600
$('#timer').text(days + " jours " + (new Date('December 17, 1995 ' + [h, m, s].join(':'))).toLocaleTimeString('default', {
$('#timer').text((days == 0 ? "" : days + " jours ") + (new Date('December 17, 1995 ' + [h, m, s].join(':'))).toLocaleTimeString('default', {
hour: '2-digit',
minute: '2-digit',
second: '2-digit'
@ -764,8 +846,13 @@ $(window).on("load", function() {
/* load timer */
window.setInterval(function() {
var b = $("#timer").text().split(' jours ');
var time = b[1];
var days = b[0];
if(b.length == 2) {
var time = b[1];
var days = b[0];
} else {
var time = b[0];
var days = 0;
}
var t = time.split(":").map(t => parseInt(t));
t[2] -= 1;

Write Preview
Loading…
Cancel
Save