Fixes to missing link marking

This commit is contained in:
Zef Hemel
2022-11-30 15:28:43 +01:00
parent 477f021644
commit a41695bc67
4 changed files with 66 additions and 54 deletions
+24 -21
View File
@@ -56,27 +56,30 @@ export function linkPlugin(editor: Editor) {
widgets.push(
Decoration.widget({
widget: new LinkWidget(
cleanAnchor,
`Click to visit ${cleanLink}`,
"sb-link",
(e) => {
if (e.altKey) {
// Move cursor into the link, approximate location
return view.dispatch({
selection: { anchor: from + 1 },
});
}
// Dispatch click event to navigate there without moving the cursor
const clickEvent: ClickEvent = {
page: editor.currentPage!,
ctrlKey: e.ctrlKey,
metaKey: e.metaKey,
altKey: e.altKey,
pos: from,
};
editor.dispatchAppEvent("page:click", clickEvent).catch(
console.error,
);
{
text: cleanAnchor,
title: `Click to visit ${cleanLink}`,
cssClass: "sb-link",
href: cleanLink,
callback: (e) => {
if (e.altKey) {
// Move cursor into the link, approximate location
return view.dispatch({
selection: { anchor: from + 1 },
});
}
// Dispatch click event to navigate there without moving the cursor
const clickEvent: ClickEvent = {
page: editor.currentPage!,
ctrlKey: e.ctrlKey,
metaKey: e.metaKey,
altKey: e.altKey,
pos: from,
};
editor.dispatchAppEvent("page:click", clickEvent).catch(
console.error,
);
},
},
),
}).range(from),
+13 -9
View File
@@ -11,26 +11,30 @@ import {
WidgetType,
} from "../deps.ts";
type LinkOptions = {
text: string;
href?: string;
title: string;
cssClass: string;
callback: (e: MouseEvent) => void;
};
export class LinkWidget extends WidgetType {
constructor(
readonly text: string,
readonly title: string,
readonly cssClass: string,
readonly callback: (e: MouseEvent) => void,
readonly options: LinkOptions,
) {
super();
}
toDOM(): HTMLElement {
const anchor = document.createElement("a");
anchor.className = this.cssClass;
anchor.textContent = this.text;
anchor.className = this.options.cssClass;
anchor.textContent = this.options.text;
anchor.addEventListener("click", (e) => {
e.preventDefault();
e.stopPropagation();
this.callback(e);
this.options.callback(e);
});
anchor.setAttribute("title", this.title);
anchor.href = "#";
anchor.setAttribute("title", this.options.title);
anchor.href = this.options.href || "#";
return anchor;
}
}
+28 -23
View File
@@ -89,29 +89,34 @@ export function cleanWikiLinkPlugin(editor: Editor) {
widgets.push(
Decoration.widget({
widget: new LinkWidget(
linkText,
pageExists ? `Navigate to ${page}` : `Create ${page}`,
pageExists
? "sb-wiki-link-page"
: "sb-wiki-link-page-missing",
(e) => {
if (e.altKey) {
// Move cursor into the link
return view.dispatch({
selection: { anchor: from + 2 },
});
}
// Dispatch click event to navigate there without moving the cursor
const clickEvent: ClickEvent = {
page: editor.currentPage!,
ctrlKey: e.ctrlKey,
metaKey: e.metaKey,
altKey: e.altKey,
pos: from,
};
editor.dispatchAppEvent("page:click", clickEvent).catch(
console.error,
);
{
text: linkText,
title: pageExists
? `Navigate to ${page}`
: `Create ${page}`,
href: `/${page.replaceAll(" ", "_")}`,
cssClass: pageExists
? "sb-wiki-link-page"
: "sb-wiki-link-page-missing",
callback: (e) => {
if (e.altKey) {
// Move cursor into the link
return view.dispatch({
selection: { anchor: from + 2 },
});
}
// Dispatch click event to navigate there without moving the cursor
const clickEvent: ClickEvent = {
page: editor.currentPage!,
ctrlKey: e.ctrlKey,
metaKey: e.metaKey,
altKey: e.altKey,
pos: from,
};
editor.dispatchAppEvent("page:click", clickEvent).catch(
console.error,
);
},
},
),
}).range(from),