113 lines
4 KiB
HTML
113 lines
4 KiB
HTML
{{define "title"}}{{.note.Title}}{{end}}
|
|
{{define "main"}}
|
|
<style>
|
|
li:has(> input[type="checkbox"]) {
|
|
padding-top: 0.1em;
|
|
padding-bottom: 0.1em;
|
|
cursor: default;
|
|
}
|
|
</style>
|
|
<div id="noteContent">
|
|
{{.note.BodyRendered}}
|
|
</div>
|
|
<div class="d-flex justify-content-between">
|
|
<a class="btn btn-primary" href="{{.urlEdit}}">Edit</a>
|
|
<a class="btn btn-danger" href="{{.urlDelete}}">Delete</a>
|
|
</div>
|
|
{{ if .isOwner }}
|
|
<div class="accordion mt-3" id="supplementaryAccordion">
|
|
<div class="accordion-item">
|
|
<h3 class="accordion-header">
|
|
<button class="accordion-button collapsed"
|
|
type="button"
|
|
data-bs-toggle="collapse"
|
|
data-bs-target="#collapseOwnership"
|
|
aria-expanded="false"
|
|
aria-controls="collapseOwnership">
|
|
Ownership
|
|
</button>
|
|
</h3>
|
|
<div id="collapseOwnership" class="accordion-collapse collapse" data-bs-parent="#supplementaryAccordion">
|
|
<div class="accordion-body">
|
|
{{if .note.Viewers}}
|
|
<p>This note is owned by <em>{{.note.Owner}}</em> and is further visible to</p>
|
|
<form action="{{.urlUnshare}}" method="POST">
|
|
<table class="table vertical-align-middle">
|
|
{{range .viewers}}
|
|
<tr>
|
|
<td>{{.}}</td>
|
|
<td class="text-end">
|
|
<button class="btn btn-outline-warning btn-sm" type="submit" name="viewer" value="{{.}}">Un-Share</button>
|
|
</td>
|
|
</tr>
|
|
{{end}}
|
|
</table>
|
|
</form>
|
|
{{else}}
|
|
<p>This note is owned by <em>{{.note.Owner}}</em>.</p>
|
|
{{end}}
|
|
|
|
<form action="{{.urlShare}}" method="POST">
|
|
<div class="mb-3">
|
|
<input type="text" class="form-control" id="viewerInput" name="viewer" aria-described-by="viewerHelp" />
|
|
<div id="viewerHelp" class="form-text">Share with other user</div>
|
|
</div>
|
|
<button class="btn btn-primary" type="submit">Share</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="accordion-item">
|
|
<h3 class="accordion-header">
|
|
<button class="accordion-button collapsed"
|
|
type="button"
|
|
data-bs-toggle="collapse"
|
|
data-bs-target="#collapseTags"
|
|
aria-expanded="false"
|
|
aria-controls="collapseTags">
|
|
Tags
|
|
</button>
|
|
</h3>
|
|
<div id="collapseTags" class="accordion-collapse collapse" data-bs-parent="#supplementaryAccordion">
|
|
<div class="accordion-body">
|
|
<form action="{{.urlSetTags}}" method="POST">
|
|
<div class="mb-3">
|
|
<input type="text" class="form-control" id="tagInput" name="tags" aria-described-by="tagHelp" value="{{.tags}}"/>
|
|
<div id="tagHelp" class="form-text">Tags</div>
|
|
</div>
|
|
<button class="btn btn-primary" type="submit">Set Tags</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
<script>
|
|
let checkBoxes = document.querySelectorAll('input[type=checkbox]');
|
|
let noteContentWrapper = document.querySelector('#noteContent');
|
|
console.log(checkBoxes.keys())
|
|
|
|
for (const i of checkBoxes.keys()) {
|
|
let box = checkBoxes[i]
|
|
let parent = box.parentNode
|
|
box.disabled = false
|
|
|
|
box.onclick = function(event) {
|
|
return false;
|
|
}
|
|
|
|
parent.onclick = function(event) {
|
|
let form = new FormData();
|
|
form.append("box", i);
|
|
|
|
fetch("togglebox/", {method: "POST", body: form}).then((response) => {
|
|
return response.json();
|
|
}).then((json) => {
|
|
box.checked = json.checked;
|
|
})
|
|
}
|
|
}
|
|
|
|
</script>
|
|
{{end}}
|