nzambello/newyear-countdown
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

fix: generalization countdown for any year

Browse source
This commit is contained in:
Nicola Zambello 2021-01-01 00:00:39 +01:00
parent 8f0f843ddd
commit 1d38a9b2b7
1 changed files with 40 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
src/App/index.js
View file

@ -1,45 +1,54 @@
import React, { Component } from 'react'; import React, { Component } from 'react'
import './index.scss'; import './index.scss'
const _second = 1000; const _second = 1000
const _minute = _second * 60; const _minute = _second * 60
const _hour = _minute * 60; const _hour = _minute * 60
const _day = _hour * 24; const _day = _hour * 24
class App extends Component { class App extends Component {
constructor() { constructor() {
super(); super()
const now = new Date(); const now = new Date()
let imWaitingForDrinking = true; // of course default to true let imWaitingForDrinking = true // of course default to true
let year = now.getFullYear() + 1; let year = now.getFullYear() + 1
let countdownData = {} let countdownData = {}
if (now.getMonth() === 0 && now.getDate() === 1) { if (now.getMonth() === 0 && now.getDate() === 1) {
imWaitingForDrinking = false; imWaitingForDrinking = false
year = now.getFullYear(); year = now.getFullYear()
} } else {
else { countdownData = this.getMissingTime(now)
countdownData = this.getMissingTime(now);
} }
this.state = { this.state = {
isNewYear: !imWaitingForDrinking, isNewYear: !imWaitingForDrinking,
newYear: year, newYear: year,
countdownID: null, countdownID: null,
countdownData: countdownData, countdownData: countdownData
}; }
} }
getMissingTime = now => { getMissingTime = (now) => {
const midnight = new Date('2019-01-01 00:00'); const newYear = now.getFullYear() + 1
const delta = midnight - now;
if (this.state && this.state.newYear && this.state.newYear === now.getFullYear()) {
this.setState({
isNewYear: true
})
return this.state.countdownData
} else {
const midnight = new Date(`${newYear}-01-01 00:00`)
const delta = midnight - now
return { return {
days: Math.floor(delta / _day), days: Math.floor(delta / _day),
hours: Math.floor((delta % _day) / _hour), hours: Math.floor((delta % _day) / _hour),
minutes: Math.floor((delta % _hour) / _minute), minutes: Math.floor((delta % _hour) / _minute),
seconds: Math.floor((delta % _minute) / _second), seconds: Math.floor((delta % _minute) / _second)
}
} }
} }
@ -90,8 +99,8 @@ class App extends Component {
</p> </p>
</div> </div>
<div className="pyro"> <div className="pyro">
<div className="before"></div> <div className="before" />
<div className="after"></div> <div className="after" />
</div> </div>
</React.Fragment> </React.Fragment>
)} )}
@ -99,7 +108,7 @@ class App extends Component {
<div className="text-wrapper"> <div className="text-wrapper">
<p>Countdown to {newYear}</p> <p>Countdown to {newYear}</p>
<div className="countdown"> <div className="countdown">
{getCountdownMarkup(countdownData['days'], 's')} {getCountdownMarkup(countdownData['days'], 'd')}
{getCountdownMarkup(countdownData['hours'], 'h')} {getCountdownMarkup(countdownData['hours'], 'h')}
{getCountdownMarkup(countdownData['minutes'], 'm')} {getCountdownMarkup(countdownData['minutes'], 'm')}
{getCountdownMarkup(countdownData['seconds'], 's')} {getCountdownMarkup(countdownData['seconds'], 's')}
@ -107,8 +116,8 @@ class App extends Component {
</div> </div>
)} )}
</div> </div>
); )
} }
} }
export default App; export default App