Fixed crumbs

This commit is contained in:
Magnus Åhall 2024-12-19 23:13:41 +01:00
parent 147dc12e99
commit e07258e014
3 changed files with 31 additions and 13 deletions

View file

@ -14,11 +14,12 @@ export class NodeUI extends Component {
this.nodeModified = signal(false)
this.keys = signal([])
this.page = signal('node')
this.crumbs = []
window.addEventListener('popstate', evt => {
if (evt.state?.hasOwnProperty('nodeUUID'))
this.goToNode(evt.state.nodeUUID, true)
_notes2.current.goToNode(evt.state.nodeUUID, true)
else
this.goToNode(0, true)
_notes2.current.goToNode('00000000-0000-0000-0000-000000000000', true)
})
window.addEventListener('keydown', evt => this.keyHandler(evt))
@ -32,13 +33,23 @@ export class NodeUI extends Component {
const nodeModified = this.nodeModified.value ? 'node-modified' : ''
const crumbDivs = [
html`<div class="crumb" onclick=${() => _notes2.current.goToNode(ROOT_NODE)}>Start</div>`
]
for (let i = this.crumbs.length-1; i >= 0; i--) {
const crumbNode = this.crumbs[i]
crumbDivs.push(html`<div class="crumb" onclick=${() => _notes2.current.goToNode(crumbNode.UUID)}>${crumbNode.get('Name')}</div>`)
}
if (node.UUID !== ROOT_NODE)
crumbDivs.push(
html`<div class="crumb" onclick=${() => _notes2.current.goToNode(node.UUID)}>${node.get('Name')}</div>`
)
return html`
<div id="crumbs" onclick=${()=>this.saveNode()}>
<div id="crumbs" onclick=${() => this.saveNode()}>
<div class="crumbs ${nodeModified}">
<div class="crumb" onclick=${()=>_notes2.current.goToNode(ROOT_NODE)}>Start</div>
<div class="crumb">Minnie</div>
<div class="crumb">Fluffy</div>
<div class="crumb">Chili</div>
${crumbDivs}
</div>
</div>
<div id="name">${node.get('Name')}</div>
@ -149,6 +160,9 @@ export class NodeUI extends Component {
this.nodeModified.value = false
this.node.value = node
}//}}}
setCrumbs(nodes) {//{{{
this.crumbs = nodes
}//}}}
async saveNode() {//{{{
if (!this.nodeModified.value)
return
@ -242,13 +256,13 @@ class NodeContent extends Component {
`
}
let element
/*
let element
if (node.RenderMarkdown.value)
element = html`<${MarkdownContent} key='markdown-content' content=${content} />`
else
*/
element = html`
const element = html`
<div class="grow-wrap">
<textarea id="node-content" class="node-content" ref=${this.contentDiv} oninput=${evt => this.contentChanged(evt)} required rows=1>${content}</textarea>
</div>
@ -338,7 +352,6 @@ export class Node {
this._children_fetched = true
return this.Children
}//}}}
content() {//{{{
/* TODO - implement crypto
if (this.CryptoKeyID != 0 && !this._decrypted)