Added countdown timer

This commit is contained in:
Pierre 2018-01-03 13:38:06 +01:00
parent c01f081135
commit eb860a5c23
5 changed files with 66 additions and 7 deletions

View File

@ -29,3 +29,8 @@
width: 100%; width: 100%;
height: 300px; height: 300px;
} }
.post .post-countdown {
text-align: center;
padding: 10px;
}

View File

@ -666,6 +666,14 @@ var ComunicWeb = {
textarea: { textarea: {
}, },
/**
* Countdown timer
*/
countdown: {
//TODO : implement
},
}, },
/** /**

View File

@ -0,0 +1,49 @@
/**
* Countdown timer component
*
* @author Pierre HUBERT
*/
ComunicWeb.components.countdown = {
/**
* Initializate countdown timer
*
* @param {int} time_end The end time for the countdown timer
* @param {HTMLElement} target The target for the countdown timer
*/
init: function(time_end, target){
//Initialise variable
var days, hours, minutes, seconds;
//Setup interval
var interval = setInterval(function(){
//Check if target still exists or not
if(!target.isConnected)
clearInterval(interval);
// find the amount of "seconds" between now and target
var current_date = parseInt(new Date().getTime() / 1000);
var seconds_left = time_end - current_date;
// do some time calculations
days = parseInt(seconds_left / 86400);
seconds_left = seconds_left % 86400;
hours = parseInt(seconds_left / 3600);
seconds_left = seconds_left % 3600;
minutes = parseInt(seconds_left / 60);
seconds = parseInt(seconds_left % 60);
// format countdown string + set tag value
target.innerHTML = '<span class="days">' + days + ' <b>Days</b></span> <span class="hours">' + hours + ' <b>Hours</b></span> <span class="minutes">'
+ minutes + ' <b>Minutes</b></span> <span class="seconds">' + seconds + ' <b>Seconds</b></span>';
}, 1000);
},
}

View File

@ -236,14 +236,8 @@ ComunicWeb.components.posts.ui = {
class: "post-countdown" class: "post-countdown"
}); });
//Set the date of the countdown time
var date = new Date();
date.setFullYear(infos.year_end);
date.setMonth(infos.month_end - 1); //Months starts from 0 (january) to 11 (december)
date.setDate(infos.day_end);
//Initialize countdown timer //Initialize countdown timer
ComunicWeb.components.countdown.init(date, target); ComunicWeb.components.countdown.init(infos.time_end, target);
} }
//If the kind of post was not implemented //If the kind of post was not implemented

View File

@ -201,6 +201,9 @@ class Dev {
//Modern textarea handler //Modern textarea handler
"js/components/textarea.js", "js/components/textarea.js",
//Countdown timer
"js/components/countdown.js",
//User scripts //User scripts
"js/user/loginTokens.js", "js/user/loginTokens.js",
"js/user/userLogin.js", "js/user/userLogin.js",