Automatic SQL updates

This commit is contained in:
Magnus Åhall 2023-06-18 22:05:10 +02:00
parent 1812873e33
commit 85a2d0683e
8 changed files with 331 additions and 24 deletions

View file

@ -6,6 +6,7 @@ const html = htm.bind(h)
export class NodeUI extends Component {
constructor() {//{{{
super()
this.menu = signal(false)
this.node = signal(null)
this.nodeContent = createRef()
window.addEventListener('popstate', evt=>{
@ -42,14 +43,26 @@ export class NodeUI extends Component {
modified = 'modified';
return html`
<div id="menu-blackout" class="${this.menu.value ? 'show' : ''}" onclick=${()=>this.menu.value = false}></div>
<div id="menu" class="${this.menu.value ? 'show' : ''}">
<div class="item" onclick=${()=>this.renameNode()}>Rename</div>
<div class="item" onclick=${()=>this.deleteNode()}>Delete</div>
</div>
<header class="${modified}" onclick=${()=>this.saveNode()}>
<div class="name">Notes</div>
<div class="add" onclick=${()=>this.createNode()}>+</div>
<div class="menu" onclick=${()=>this.showMenu()}></div>
</header>
<div class="crumbs">${crumbs}</crumbs>
${children.length > 0 ? html`<div class="child-nodes">${children}</div>` : html``}
<div class="node-name">${node.Name}</div>
<${NodeContent} key=${node.ID} content=${node.Content} ref=${this.nodeContent} />
${node.ID > 0 ? html`
<div class="node-name">${node.Name}</div>
<${NodeContent} key=${node.ID} content=${node.Content} ref=${this.nodeContent} />
` : html``}
`
}//}}}
componentDidMount() {//{{{
@ -61,6 +74,11 @@ export class NodeUI extends Component {
this.node.value = node
})
}//}}}
showMenu() {//{{{
this.menu.value = true
}//}}}
goToNode(nodeID, dontPush) {//{{{
if(this.props.app.nodeModified.value) {
if(!confirm("Changes not saved. Do you want to discard changes?"))
@ -89,7 +107,7 @@ export class NodeUI extends Component {
})
.catch(this.props.app.responseError)
}//}}}
saveNode() {
saveNode() {//{{{
let content = this.nodeContent.current.contentDiv.current.innerText
this.props.app.request('/node/update', {
NodeID: this.node.value.ID,
@ -99,7 +117,35 @@ export class NodeUI extends Component {
this.props.app.nodeModified.value = false
})
.catch(this.props.app.responseError)
}
}//}}}
renameNode() {//{{{
let name = prompt("New name")
if(!name)
return
this.props.app.request('/node/rename', {
Name: name.trim(),
NodeID: this.node.value.ID,
})
.then(_=>{
this.goToNode(this.node.value.ID)
this.menu.value = false
})
.catch(this.props.app.responseError)
}//}}}
deleteNode() {//{{{
if(!confirm("Do you want to delete this note and all sub-notes?"))
return
this.props.app.request('/node/delete', {
NodeID: this.node.value.ID,
})
.then(_=>{
this.goToNode(this.node.value.ParentID)
this.menu.value = false
})
.catch(this.props.app.responseError)
}//}}}
}
class NodeContent extends Component {