Skirda/LiveAtlas
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use clipboard util methods in LinkControl

Browse Source
This commit is contained in:
James Lyne 2022-06-21 23:24:43 +01:00
parent ac9d5242bd
commit 4d0e481f74
4 changed files with 14 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/map/MapContextMenu.vue
View File

@ -218,8 +218,8 @@ export default defineComponent({
messageCopyLink,
messageCenterHere,
copySuccess: clipboardSuccess(),
copyError: clipboardError(),
copySuccess: clipboardSuccess(store),
copyError: clipboardError(store),
menuVisible,
menuElement,

4
src/components/sidebar/FollowTargetSection.vue
View File

@ -91,8 +91,8 @@ export default defineComponent({
messageHidden,
status,
location,
copySuccess: clipboardSuccess(),
copyError: clipboardError(),
copySuccess: clipboardSuccess(store),
copyError: clipboardError(store),
}
},
});

17
src/leaflet/control/LinkControl.ts
View File

@ -21,8 +21,7 @@ import {Control, ControlOptions, DomUtil} from 'leaflet';
import {useStore} from "@/store";
import '@/assets/icons/link.svg';
import { toClipboard } from '@soerenmartius/vue3-clipboard';
import {notify} from "@kyvg/vue3-notification";
import {computed} from "@vue/runtime-core";
import {clipboardError, clipboardSuccess} from "@/util";
/**
* Leaflet map control providing a button for copying a link for the current map view to the clipboard
@ -38,8 +37,8 @@ export class LinkControl extends Control {
const store = useStore(),
linkButton = DomUtil.create('button',
'leaflet-control-button leaflet-control-link') as HTMLButtonElement,
copySuccessMessage = computed(() => store.state.messages.copyToClipboardSuccess),
copyErrorMessage = computed(() => store.state.messages.copyToClipboardError);
copySuccess = clipboardSuccess(store),
copyError = clipboardError(store);
linkButton.type = 'button';
linkButton.title = store.state.messages.linkTitle;
@ -50,13 +49,9 @@ export class LinkControl extends Control {
linkButton.addEventListener('click', e => {
e.preventDefault();
toClipboard(window.location.href.split("#")[0] + store.getters.url).then(() => {
notify(copySuccessMessage.value);
}).catch((e) => {
notify({ type: 'error', text: copyErrorMessage.value });
console.error('Error copying to clipboard', e);
});
toClipboard(window.location.href.split("#")[0] + store.getters.url)
.then(copySuccess)
.catch(copyError)
});
return linkButton;

8
src/util.ts
View File

@ -14,7 +14,6 @@
* limitations under the License.
*/
import {useStore} from "@/store";
import LiveAtlasMapDefinition from "@/model/LiveAtlasMapDefinition";
import {
Coordinate,
@ -26,6 +25,7 @@ import {
} from "@/index";
import {notify} from "@kyvg/vue3-notification";
import {globalMessages, serverMessages} from "../messages";
import {Store} from "@/store";
const documentRange = document.createRange(),
brToSpaceRegex = /<br \/>/g;
@ -228,14 +228,14 @@ export const stripHTML = (text: string) => {
* Default success callback function for VueClipboard, will display a notification with the configured copy success
* message
*/
export const clipboardSuccess = () => () => notify(useStore().state.messages.copyToClipboardSuccess);
export const clipboardSuccess = (store: Store) => () => notify(store.state.messages.copyToClipboardSuccess);
/**
* Default error callback function for VueClipboard, will display a notification with the configured copy error
* message
*/
export const clipboardError = () => (e: Error) => {
notify({ type: 'error', text: useStore().state.messages.copyToClipboardError });
export const clipboardError = (store: Store) => (e: Error) => {
notify({ type: 'error', text: store.state.messages.copyToClipboardError });
console.error('Error copying to clipboard', e);
};