47 lines
2.2 KiB
Plaintext
47 lines
2.2 KiB
Plaintext
<div class="modal-header">
|
|
<h2 class="modal-title fs-5 verse-dialog-ref" id="verse-dialog-ref">{{ verse.ref }}</h2>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"
|
|
aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<label class="visually-hidden" for="verse-dialog-url">Link to {{ verse.ref }}</label>
|
|
<input class="verse-dialog-url form-control form-control-sm" id="verse-dialog-url"
|
|
type="text" readonly value="{{ verse.url }}">
|
|
</div>
|
|
<div class="modal-footer">
|
|
<form class="verse-dialog-actions d-flex flex-wrap gap-2 m-0"
|
|
hx-post="api/bookmark" hx-target="#bookmark" hx-swap="outerHTML">
|
|
<input type="hidden" name="ref" value="{{ verse.ref }}">
|
|
<input type="hidden" name="href" value="{{ verse.href }}">
|
|
<button class="btn btn-outline-secondary" type="button"
|
|
hx-on:click="var button = this;
|
|
var field = document.getElementById('verse-dialog-url');
|
|
var toast = function (say) {
|
|
htmx.ajax('GET', 'api/toast?say=' + say,
|
|
{ target: '#toasts', swap: 'beforeend' });
|
|
};
|
|
var copied = function () {
|
|
toast('copied');
|
|
button.dispatchEvent(
|
|
new CustomEvent('verse-done', { bubbles: true }));
|
|
};
|
|
var select = function () {
|
|
field.focus();
|
|
field.select();
|
|
};
|
|
var refused = function () {
|
|
select();
|
|
toast('copy-refused');
|
|
};
|
|
if (navigator.clipboard) {
|
|
navigator.clipboard.writeText(field.value)
|
|
.then(copied, refused);
|
|
} else {
|
|
select();
|
|
if (document.execCommand('copy')) copied();
|
|
else toast('copy-refused');
|
|
}">Copy link</button>
|
|
<button class="btn btn-primary" type="submit">Set bookmark</button>
|
|
</form>
|
|
</div>
|