Added navigation to top/bottom, normalized toplevel node parent to root node

This commit is contained in:
Magnus Åhall 2025-02-09 11:14:26 +01:00
parent 8192f49558
commit e276e6d156
3 changed files with 54 additions and 11 deletions

View file

@ -336,7 +336,13 @@ export class Node {
this.data = nodeData this.data = nodeData
this.UUID = nodeData.UUID this.UUID = nodeData.UUID
this.ParentUUID = nodeData.ParentUUID
// Toplevel nodes are normalized to have the ROOT_NODE as parent.
if (nodeData.UUID !== ROOT_NODE && nodeData.ParentUUID === '') {
this.ParentUUID = ROOT_NODE
this.data.ParentUUID = ROOT_NODE
} else
this.ParentUUID = nodeData.ParentUUID
this._children_fetched = false this._children_fetched = false
this.Children = [] this.Children = []

View file

@ -222,11 +222,9 @@ export class NodeStore {
}//}}} }//}}}
async getTreeNodes(parent, newLevel) {//{{{ async getTreeNodes(parent, newLevel) {//{{{
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// Parent of toplevel nodes is '' in indexedDB, // Parent of toplevel nodes is ROOT_NODE in indexedDB.
// but can also be set to the ROOT_NODE uuid. // Only the root node has '' as parent.
let storeParent = parent let storeParent = parent
if (parent === ROOT_NODE)
storeParent = ''
const trx = this.db.transaction('nodes', 'readonly') const trx = this.db.transaction('nodes', 'readonly')
const nodeStore = trx.objectStore('nodes') const nodeStore = trx.objectStore('nodes')
@ -305,7 +303,7 @@ export class NodeStore {
.transaction('nodes', 'readonly') .transaction('nodes', 'readonly')
.objectStore('nodes') .objectStore('nodes')
if (node.ParentUUID === '') { if (node.ParentUUID === ROOT_NODE) {
resolve(accumulated) resolve(accumulated)
return return
} }

View file

@ -123,7 +123,7 @@ class Tree extends Component {
// The root node isn't supposed to be shown in the tree. // The root node isn't supposed to be shown in the tree.
if (node.UUID === ROOT_NODE) if (node.UUID === ROOT_NODE)
continue continue
if (node.ParentUUID === '') if (node.ParentUUID === ROOT_NODE)
this.treeTrunk.push(node) this.treeTrunk.push(node)
} }
this.forceUpdate() this.forceUpdate()
@ -203,6 +203,16 @@ class Tree extends Component {
this.setNodeExpanded(n.UUID, !expanded) this.setNodeExpanded(n.UUID, !expanded)
break break
case 'g':
case 'Home':
this.navigateTop()
break
case 'G':
case 'End':
this.navigateBottom()
break
case 'j': case 'j':
case 'ArrowDown': case 'ArrowDown':
await this.navigateDown(this.selectedNode) await this.navigateDown(this.selectedNode)
@ -234,6 +244,9 @@ class Tree extends Component {
} }
}//}}} }//}}}
async navigateLeft(n) {//{{{ async navigateLeft(n) {//{{{
if (n === null)
return
const expanded = this.getNodeExpanded(n.UUID) const expanded = this.getNodeExpanded(n.UUID)
if (expanded && n.hasChildren()) { if (expanded && n.hasChildren()) {
this.setNodeExpanded(n.UUID, false) this.setNodeExpanded(n.UUID, false)
@ -256,6 +269,9 @@ class Tree extends Component {
await _notes2.current.goToNode(n.getSiblingBefore()?.UUID, true, true) await _notes2.current.goToNode(n.getSiblingBefore()?.UUID, true, true)
}//}}} }//}}}
async navigateRight(n) {//{{{ async navigateRight(n) {//{{{
if (n === null)
return
const siblingAfter = n.getSiblingAfter() const siblingAfter = n.getSiblingAfter()
const expanded = this.getNodeExpanded(n.UUID) const expanded = this.getNodeExpanded(n.UUID)
@ -278,6 +294,9 @@ class Tree extends Component {
await _notes2.current.goToNode(n.getSiblingAfter()?.UUID, true, true) await _notes2.current.goToNode(n.getSiblingAfter()?.UUID, true, true)
}//}}} }//}}}
async navigateUp(n) {//{{{ async navigateUp(n) {//{{{
if (n === null)
return
let parent = null let parent = null
const siblingBefore = n.getSiblingBefore() const siblingBefore = n.getSiblingBefore()
let siblingExpanded = false let siblingExpanded = false
@ -303,14 +322,15 @@ class Tree extends Component {
} }
}//}}} }//}}}
async navigateDown(n) {//{{{ async navigateDown(n) {//{{{
if (n === null)
return
const nodeExpanded = this.getNodeExpanded(n.UUID) const nodeExpanded = this.getNodeExpanded(n.UUID)
// Last node, not expanded, so it matters not whether it has children or not. // Last node, not expanded, so it matters not whether it has children or not.
// Traverse upward to nearest parent with next sibling. // Traverse upward to nearest parent with next sibling.
if (!nodeExpanded && n.isLastSibling()) { if (!nodeExpanded && n.isLastSibling()) {
const wantedNode = this.getParentWithNextSibling(n) const wantedNode = this.getParentWithNextSibling(n)
if (wantedNode?.UUID === ROOT_NODE)
return
await _notes2.current.goToNode(wantedNode?.UUID, true, true) await _notes2.current.goToNode(wantedNode?.UUID, true, true)
return return
} }
@ -320,11 +340,10 @@ class Tree extends Component {
await _notes2.current.goToNode(wantedNode?.UUID, true, true) await _notes2.current.goToNode(wantedNode?.UUID, true, true)
return return
} }
// Node not expanded. Go to this node's next sibling. // Node not expanded. Go to this node's next sibling.
// GoToNode will abort if given null. // GoToNode will abort if given null.
if (!nodeExpanded || !n.hasChildren()) { if (!nodeExpanded || !n.hasChildren()) {
if (n.getSiblingAfter()?.UUID === ROOT_NODE)
return
await _notes2.current.goToNode(n.getSiblingAfter()?.UUID, true, true) await _notes2.current.goToNode(n.getSiblingAfter()?.UUID, true, true)
return return
} }
@ -336,6 +355,26 @@ class Tree extends Component {
return return
} }
}//}}} }//}}}
async navigateTop() {//{{{
const root = await nodeStore.get(ROOT_NODE)
if (root.Children.length === 0)
return
await _notes2.current.goToNode(root.Children[0]?.UUID, true, true)
}//}}}
async navigateBottom() {//{{{
const root = await nodeStore.get(ROOT_NODE)
if (root.Children.length === 0)
return
const toplevel = root.Children[root.Children.length - 1]
const toplevelExpanded = this.getNodeExpanded(toplevel?.UUID)
if (toplevelExpanded) {
const lastnode = this.getLastExpandedNode(toplevel)
await _notes2.current.goToNode(lastnode?.UUID, true, true)
} else
await _notes2.current.goToNode(root.Children[root.Children.length - 1]?.UUID, true, true)
}//}}}
} }
class TreeNode extends Component { class TreeNode extends Component {