// -- The main (so far only) Vue instance --
var app = new Vue({
// In the html file, need to enclose in an element with the class specified
// here, if we want Vue to know where to put it.
el: '.app16',
data: {
appTitle: 'We can save these tiddlers in a downloaded file',
tiddlers: [],
currentCreated: undefined,
emptyTiddler: {
text: '',
tags: []
},
currentTiddler: {
text: '',
tags: []
},
editFlag: false
},
template: `
Tiddler text:
Add a tag:
{{appTitle}}
Tiddler list
Created: {{localFromUTC(tiddler)}}
`,
methods: {
updateTiddlerText(ev) {
this.currentTiddler.text = ev.target.innerText
},
addNewTag(ev) {
this.currentTiddler.tags.push(ev.target.textContent)
this.currentTiddler.tags = [...new Set(this.currentTiddler.tags)]
ev.target.textContent = ''
},
removeTag(tag) {
this.currentTiddler.tags.splice(this.currentTiddler.tags.indexOf(tag), 1)
},
selectTiddler(tiddler) {
this.currentTiddler = JSON.parse(JSON.stringify(tiddler))
this.currentCreated = tiddler.created
this.editFlag = true
},
submitTiddler(tiddler) {
if (this.editFlag == true) {
this.updateTiddler()
} else {
this.addTiddler()
}
this.resetTiddler()
},
isTheTiddler(tiddler) {
return tiddler.created === this.currentCreated
},
updateTiddler() {
var tiddler = this.tiddlers.find(this.isTheTiddler)
var idx = this.tiddlers.indexOf(tiddler)
this.tiddlers.splice(idx, 1, this.currentTiddler)
},
addTiddler() {
this.currentTiddler.created = moment().utc().format('YYYYMMDDHHmmssSSS') // In TW, times are stored in UTC
this.currentTiddler.utcOffset = moment().utcOffset()
this.tiddlers.push(this.currentTiddler)
},
resetTiddler() {
this.currentTiddler = JSON.parse(JSON.stringify(this.emptyTiddler))
this.currentCreated = undefined
this.editFlag = false
},
removeTiddler() {
if (this.currentCreated != undefined && confirm("Delete this tiddler?")) {
var tiddler = this.tiddlers.find(this.isTheTiddler)
var idx = this.tiddlers.indexOf(tiddler)
this.tiddlers.splice(idx, 1)
this.resetTiddler()
}
},
localFromUTC(tiddler) {
var timeInt = moment.utc(tiddler.created, 'YYYYMMDDHHmmssSSS')
var localInt = timeInt.add(tiddler.utcOffset, 'minute')
var localTime = localInt.format('YYYY-MM-DD, hh:mm a')
return localTime
},
saveToLocalStorage() {
localStorage.setItem('stored_tiddlers', JSON.stringify(this.tiddlers))
},
loadFromLocalStorage() {
if (localStorage.getItem('stored_tiddlers')) {
this.tiddlers = JSON.parse(localStorage.getItem('stored_tiddlers'))
}
},
saveFile() {
var blob = new Blob([JSON.stringify(this.tiddlers)], {type: "application/json"})
var createdTime = moment.utc().format('YYYYMMDDHHmmss')
var fileName = 'tiddlers_' + createdTime + '.json'
console.log(fileName)
saveAs(blob, fileName)
}
}
})