89 lines
2.8 KiB
JavaScript
89 lines
2.8 KiB
JavaScript
const bookmarkMenuHrefTemplate = '/hyperapi/bookmarks-dropdown'
|
|
|
|
export default class {
|
|
async showBookmarkMenu(ev, el) {
|
|
if ((ev.sender.dataset.bookmarkId === el.getString('bookmarkId')) && el.childElementCount === 0) {
|
|
const searchParams = new URLSearchParams({
|
|
'id': ev.sender.dataset.conceptId,
|
|
'require_reload': el.dataset.requireReload,
|
|
});
|
|
const bookmarkMenuHref = `${bookmarkMenuHrefTemplate}/${ev.sender.dataset.bookmarkType}?${searchParams}`;
|
|
const res = await this.api.getHTML(bookmarkMenuHref);
|
|
if (res.error) {
|
|
return;
|
|
}
|
|
const frag = res.value;
|
|
el.appendChild(frag);
|
|
const menu = el.childNodes[0];
|
|
menu.showPopover();
|
|
|
|
const bRect = el.getBoundingClientRect();
|
|
const menuRect = menu.getBoundingClientRect();
|
|
const preferredLeft = bRect.right - menuRect.width;
|
|
const preferredRight = bRect.right;
|
|
const enoughSpace = preferredLeft >= 0;
|
|
const scrollY = window.scrollY || window.pageYOffset;
|
|
if (enoughSpace) {
|
|
menu.style.left = `${preferredLeft}px`;
|
|
} else {
|
|
menu.style.left = `${bRect.left}px`;
|
|
}
|
|
menu.style.top = `${bRect.bottom + scrollY}px`;
|
|
|
|
menu.addEventListener('beforetoggle', (e) => {
|
|
if (e.newState === 'closed') {
|
|
// if it's still in the tree, remove it
|
|
// the delay is required to make sure its removed instantly when
|
|
// clicking the button when the menu is open
|
|
setTimeout(() => {menu.remove()}, 100);
|
|
};
|
|
}, { once: true });
|
|
|
|
} else if (el.childElementCount > 0) {
|
|
el.removeChild(el.childNodes[0]);
|
|
}
|
|
}
|
|
|
|
selectBookmarkCollection(ev, el) {
|
|
const clicked = ev.sender;
|
|
|
|
if (ev.sender === el) {
|
|
if (clicked.classList.contains('selected')) {
|
|
clicked.classList.remove('selected');
|
|
} else {
|
|
clicked.classList.add('selected');
|
|
}
|
|
} else {
|
|
el.classList.remove('selected');
|
|
}
|
|
}
|
|
|
|
async saveBookmarks(ev, el) {
|
|
const bookmarkHref = el.getString('bookmarkEndpoint');
|
|
const collection = el.querySelector('.bookmark-dropdown-item.selected');
|
|
let data = {};
|
|
if (collection) {
|
|
data['operation'] = 'move';
|
|
data['collection_id'] = collection.dataset.collectionId;
|
|
data['memo'] = el.querySelector('.bookmark-memo-input').value;
|
|
} else {
|
|
data['operation'] = 'remove';
|
|
data['collection_id'] = el.getString('originallyContainedIn');
|
|
}
|
|
|
|
const options = {
|
|
method: 'POST',
|
|
body: JSON.stringify(data),
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
}
|
|
const requireReload = el.getInt('requireReload') !== 0;
|
|
el.remove();
|
|
await fetch(bookmarkHref, options);
|
|
if (requireReload) {
|
|
window.location.reload();
|
|
}
|
|
}
|
|
}
|