Atlas48/grungnet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add fallback for copy paste API when unavailable

Browse Source
This commit is contained in:
Mitchell McCaffrey 2021-08-06 13:02:44 +10:00
parent 1182c9fe1e
commit 5948b45b72
1 changed files with 28 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/components/selection/SelectionMenu.tsx
View File

@ -123,11 +123,17 @@ function SelectionMenu({
openOnDownRef.current = isOpen || !!selection; openOnDownRef.current = isOpen || !!selection;
downPositionRef.current = { x: event.clientX, y: event.clientY }; downPositionRef.current = { x: event.clientX, y: event.clientY };
} }
function handleMapElementClick(event: MouseEvent) { function handlePointerUp(event: MouseEvent | TouchEvent) {
const deltaPosition = Vector2.distance( let position;
{ x: event.clientX, y: event.clientY }, if (event instanceof MouseEvent) {
downPositionRef.current position = { x: event.clientX, y: event.clientY };
); } else {
position = {
x: event.changedTouches[0].clientX,
y: event.changedTouches[0].clientY,
};
}
const deltaPosition = Vector2.distance(position, downPositionRef.current);
if ( if (
!openOnDownRef.current && !openOnDownRef.current &&
!selection && !selection &&
@ -139,11 +145,13 @@ function SelectionMenu({
} }
const mapElement = document.querySelector<HTMLElement>(".map"); const mapElement = document.querySelector<HTMLElement>(".map");
mapElement?.addEventListener("pointerdown", handlePointerDown); mapElement?.addEventListener("pointerdown", handlePointerDown);
mapElement?.addEventListener("click", handleMapElementClick); mapElement?.addEventListener("mouseup", handlePointerUp);
mapElement?.addEventListener("touchend", handlePointerUp);
return () => { return () => {
mapElement?.removeEventListener("pointerdown", handlePointerDown); mapElement?.removeEventListener("pointerdown", handlePointerDown);
mapElement?.removeEventListener("click", handleMapElementClick); mapElement?.removeEventListener("mouseup", handlePointerUp);
mapElement?.removeEventListener("touchend", handlePointerUp);
}; };
}, [isOpen, active, selection, onRequestOpen]); }, [isOpen, active, selection, onRequestOpen]);
@ -241,6 +249,8 @@ function SelectionMenu({
} }
} }
// Keep a local copy of the clipboard if the device doesn't support the clipboard api i.e. iOS
const localClipboardDataRef = useRef<string>("");
async function handleCopy() { async function handleCopy() {
let version = process.env.REACT_APP_VERSION; let version = process.env.REACT_APP_VERSION;
if (!version || !selection || !mapState) { if (!version || !selection || !mapState) {
@ -265,7 +275,11 @@ function SelectionMenu({
clipboard.data.notes[item.id] = mapState.notes[item.id]; clipboard.data.notes[item.id] = mapState.notes[item.id];
} }
} }
if (navigator.clipboard) {
await navigator.clipboard.writeText(JSON.stringify(clipboard)); await navigator.clipboard.writeText(JSON.stringify(clipboard));
} else {
localClipboardDataRef.current = JSON.stringify(clipboard);
}
addSuccessToast("Copied", clipboard.data.tokens, clipboard.data.notes); addSuccessToast("Copied", clipboard.data.tokens, clipboard.data.notes);
} }
@ -276,7 +290,12 @@ function SelectionMenu({
return; return;
} }
try { try {
const clipboardText = await navigator.clipboard.readText(); let clipboardText;
if (navigator.clipboard) {
clipboardText = await navigator.clipboard.readText();
} else {
clipboardText = localClipboardDataRef.current;
}
const clipboard = JSON.parse(clipboardText); const clipboard = JSON.parse(clipboardText);
if ( if (
clipboard.version === version && clipboard.version === version &&