Jorge Manrubia
61 lines
1.3 KiB
JavaScript
61 lines
1.3 KiB
JavaScript
import { Controller } from "@hotwired/stimulus"
|
|
import { debounce, nextFrame } from "helpers/timing_helpers"
|
|
|
|
export default class extends Controller {
|
|
static targets = ["input"]
|
|
static values = { key: String }
|
|
|
|
initialize() {
|
|
this.save = debounce(this.save.bind(this), 300)
|
|
}
|
|
|
|
connect() {
|
|
this.restoreContent()
|
|
}
|
|
|
|
submit({ detail: { success } }) {
|
|
if (success) {
|
|
this.#clear()
|
|
}
|
|
}
|
|
|
|
save() {
|
|
const content = this.inputTarget.value
|
|
if (content) {
|
|
localStorage.setItem(this.keyValue, content)
|
|
} else {
|
|
this.#clear()
|
|
}
|
|
}
|
|
|
|
async restoreContent() {
|
|
await nextFrame()
|
|
let savedContent = localStorage.getItem(this.keyValue)
|
|
|
|
if (savedContent) {
|
|
savedContent = `<div>${savedContent}</div>` // temporary for old markdown saves
|
|
console.debug("Es", savedContent);
|
|
this.inputTarget.value = savedContent
|
|
this.#triggerChangeEvent(savedContent)
|
|
}
|
|
}
|
|
|
|
// Private
|
|
|
|
#clear() {
|
|
localStorage.removeItem(this.keyValue)
|
|
}
|
|
|
|
#triggerChangeEvent(newValue) {
|
|
if (this.inputTarget.tagName === "LEXICAL-EDITOR") {
|
|
this.inputTarget.dispatchEvent(new CustomEvent('actiontext:change', {
|
|
bubbles: true,
|
|
detail: {
|
|
previousContent: '',
|
|
newContent: newValue
|
|
}
|
|
}))
|
|
}
|
|
}
|
|
}
|