Initial commit
This is a first attempt at tracking an interactive todo list. It's currently built around the idea that you'll have items that repeat on a daily basis, so every day at midnight it will rotate out the previous day and in the current day. Completed todos are currently only stored as local storage on the browser, but should probably eventually be sent to another server somewhere that can coordinate the list of todos. This would more easily allow family members to add todos from their phone or similar. Lots more to do here, including making the way it tracks daily items smarter. This is a good first step, though.
This commit is contained in:
90
MMM-todo.js
Normal file
90
MMM-todo.js
Normal file
@ -0,0 +1,90 @@
|
||||
Module.register("MMM-todo", {
|
||||
defaults: {
|
||||
todos: []
|
||||
},
|
||||
|
||||
start: function() {
|
||||
var self = this
|
||||
setTimeout(function() {
|
||||
self.dailyUpdate()
|
||||
}, self.getTimeToMidnight() - new Date())
|
||||
},
|
||||
|
||||
dailyUpdate: function() {
|
||||
var self = this
|
||||
self.updateDom()
|
||||
setTimeout(function() {
|
||||
self.dailyUpdate()
|
||||
}, 24 * 60 * 60 * 1000)
|
||||
},
|
||||
|
||||
getDom: function() {
|
||||
var self = this
|
||||
|
||||
var today = new Date()
|
||||
var todayStr = self.getDateString(today)
|
||||
|
||||
var yesterday = new Date()
|
||||
yesterday.setDate(today.getDate() - 1)
|
||||
var yesterdayStr = self.getDateString(yesterday)
|
||||
|
||||
var wrapper = document.createElement("div")
|
||||
self.config.todos.forEach(element => {
|
||||
var id = element.id
|
||||
// this is ugly. do better.
|
||||
if (element.isToday) {
|
||||
id = id + "_" + todayStr
|
||||
} else if (element.isYesterday) {
|
||||
id = id + "_" + yesterdayStr
|
||||
}
|
||||
|
||||
wrapper.appendChild(self.getCheckbox(element.label, id))
|
||||
});
|
||||
|
||||
return wrapper
|
||||
},
|
||||
|
||||
getDateString(date) {
|
||||
var td = String(date.getDate()).padStart(2, '0')
|
||||
var tm = String(date.getMonth() + 1).padStart(2, '0')
|
||||
var ty = date.getFullYear()
|
||||
|
||||
return ty + tm + td
|
||||
},
|
||||
|
||||
getTimeToMidnight() {
|
||||
var timeToMidnight = new Date()
|
||||
timeToMidnight.setHours(24, 0, 0, 0)
|
||||
return timeToMidnight
|
||||
},
|
||||
|
||||
getCheckbox: function(label, id) {
|
||||
var container = document.createElement("label")
|
||||
container.className = "container"
|
||||
container.innerText = label
|
||||
|
||||
var cb = document.createElement("input")
|
||||
cb.type = "checkbox"
|
||||
if (id !== undefined) {
|
||||
cb.id = id
|
||||
}
|
||||
if (localStorage.getItem(cb.id)) {
|
||||
cb.checked = true
|
||||
}
|
||||
cb.onclick = function(ev) {
|
||||
localStorage.setItem(ev.target.id, cb.checked)
|
||||
}
|
||||
|
||||
var cm = document.createElement("span")
|
||||
cm.className = "checkmark"
|
||||
|
||||
container.appendChild(cb)
|
||||
container.appendChild(cm)
|
||||
|
||||
return container
|
||||
},
|
||||
|
||||
getStyles: function() {
|
||||
return [this.file("MMM-todo.css")]
|
||||
}
|
||||
})
|
Reference in New Issue
Block a user