Refactor context menu

app/create-bookmarks/contentscript.js

@@ -53,26 +53,39 @@ export default async function init(playlist) {
 		start = Math.round(Math.max(0, start) * 100) / 100;
 		if (end !== undefined) end = Math.round(Math.max(0, end) * 100) / 100;
 
-		async function createBookmark() {
+		function preciseUrl() {
 			const fileUrl = document.URL;
 			const selector = describeMediaFragment({ start, end });
-			const bookmarkUrl = createPreciseUrl(fileUrl, selector);
-			await remoteFunction('createBookmark')({ url: bookmarkUrl, start, end, trackDuration });
+			const preciseUrl = createPreciseUrl(fileUrl, selector);
+			return preciseUrl;
 		}
 
+		const menuItems = [
+			{
+				title: browser.i18n.getMessage(end !== undefined
+					? 'bookmarkSelectionContextMenuItemForFragment'
+					: 'bookmarkSelectionContextMenuItemForSingleMoment'
+				),
+				async action() {
+					await remoteFunction('createBookmark')({ url: preciseUrl(), start, end, trackDuration });
+				},
+			},
+		];
+
 		hideMenu();
+
 		menuEl = html`
 			<ul class="context-menu" style="top: ${top}; left: ${left};">
+			${menuItems.map(({ title, action }) => html`
 				<li>
-					<button onclick=${() => { hideMenu(); createBookmark(); }}>
-						${browser.i18n.getMessage(end !== undefined
-							? 'bookmarkSelectionContextMenuItemForFragment'
-							: 'bookmarkSelectionContextMenuItemForSingleMoment'
-						)}
+					<button onclick=${event => { hideMenu(); action(event); }}>
+						${title}
 					</button>
 				</li>
+			`)}
 			</ul>
 		`;
+
 		document.body.appendChild(menuEl);
 	}