magnus/Notes2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Tree expansion and keyboard navigation works

Browse source
This commit is contained in:
Magnus Åhall 2025-06-16 21:30:46 +02:00
parent 23307d7967
commit dd27be67b9
7 changed files with 433 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

6
static/js/notes2.mjs
View file

@ -3,6 +3,7 @@ import { signal } from 'preact/signals'
import htm from 'htm'
import { Node, NodeUI } from 'node'
import { ROOT_NODE } from 'node_store'
import { TreeNative, TreeNodeNative } from 'tree'
const html = htm.bind(h)
export class Notes2 extends Component {
@ -14,6 +15,7 @@ export class Notes2 extends Component {
startNode: null,
}
this.op = signal('')
this.treeNative = new TreeNative()
window._sync = new Sync()
window._sync.run()
@ -76,6 +78,7 @@ export class Notes2 extends Component {
this.nodeUI.current.setNode(node)
this.nodeUI.current.setCrumbs(ancestors)
this.tree.setSelected(node, dontExpand)
this.treeNative.setSelected(node, dontExpand)
}//}}}
logout() {//{{{
localStorage.removeItem('session.UUID')
@ -107,6 +110,7 @@ class Tree extends Component {
this.treeNodeComponents[node.UUID] = createRef()
return html`<${TreeNode} key=${`treenode_${node.UUID}`} tree=${this} node=${node} ref=${this.treeNodeComponents[node.UUID]} selected=${node.UUID === app.state.startNode?.UUID} />`
})
return html`
<div id="tree" ref=${this.treeDiv} tabindex="0">
<div id="logo" onclick=${() => _notes2.current.goToNode(ROOT_NODE)}><img src="/images/${_VERSION}/logo.svg" /></div>
@ -118,7 +122,7 @@ class Tree extends Component {
</div>`
}//}}}
componentDidMount() {//{{{
this.treeDiv.current.addEventListener('keydown', event => this.keyHandler(event))
//this.treeDiv.current.addEventListener('keydown', event => this.keyHandler(event))
// This will show and select the treenode that is selected in the node UI.
const node = _notes2.current?.nodeUI.current?.node.value