94 lines
1.7 KiB
JavaScript
94 lines
1.7 KiB
JavaScript
import markoWidgets from 'marko-widgets'
|
|
import template from './template.marko'
|
|
|
|
import timeFilter from '../../util/time-filter'
|
|
|
|
const length = 25 * 60 * 1000
|
|
|
|
export default markoWidgets.defineComponent({
|
|
template,
|
|
|
|
componentDidMount() {
|
|
this.reset()
|
|
},
|
|
|
|
start(e) {
|
|
this.setState({
|
|
startTime: Date.now()
|
|
})
|
|
|
|
this.interval = setInterval(this.updateTimer.bind(this), 10)
|
|
},
|
|
|
|
pause(e) {
|
|
clearInterval(this.interval)
|
|
},
|
|
|
|
reset(e) {
|
|
clearInterval(this.interval)
|
|
|
|
this.setState({
|
|
time: length,
|
|
totalTime: length,
|
|
startTime: undefined
|
|
})
|
|
},
|
|
|
|
updateTimer() {
|
|
let time = this.state.totalTime - (Date.now() - this.state.startTime)
|
|
|
|
if (time <= 0) {
|
|
this.pause()
|
|
|
|
this.end()
|
|
|
|
time = 0
|
|
}
|
|
|
|
document.title = timeFilter(time).slice(0, 5)
|
|
|
|
this.setState({
|
|
time
|
|
})
|
|
},
|
|
|
|
end(time) {
|
|
const data = {
|
|
startTime: this.state.startTime,
|
|
endTime: new Date()
|
|
}
|
|
|
|
document.title = 'Pling!'
|
|
|
|
if (Notification.permission !== 'granted')
|
|
Notification.requestPermission()
|
|
else {
|
|
const notification = new Notification('Pomodoro complete!', {
|
|
icon: 'https://www.planetnatural.com/wp-content/uploads/2014/03/tomato-supplies.jpg',
|
|
body: 'Time for a break!',
|
|
})
|
|
}
|
|
|
|
fetch('/api/pomodoros', {
|
|
method: 'POST',
|
|
body: JSON.stringify(data),
|
|
headers: {
|
|
'Accept': 'application/json',
|
|
'Content-Type': 'application/json'
|
|
}
|
|
})
|
|
.then((response) => response.json())
|
|
.then((json) => {
|
|
console.log('succes')
|
|
})
|
|
},
|
|
|
|
getInitialState(input) {
|
|
return {
|
|
time: length,
|
|
totalTime: length,
|
|
startTime: undefined
|
|
}
|
|
}
|
|
})
|