-import * as DOM from "../services/dom";
-import Clipboard from "clipboard/dist/clipboard.min";
-import {Component} from "./component";
-
+import * as DOM from '../services/dom';
+import {Component} from './component';
+import {copyTextToClipboard} from '../services/clipboard';
export class Pointer extends Component {
setup() {
this.container = this.$el;
+ this.input = this.$refs.input;
+ this.button = this.$refs.button;
this.pageId = this.$opts.pageId;
// Instance variables
this.pointerSectionId = '';
this.setupListeners();
-
- // Set up clipboard
- new Clipboard(this.container.querySelector('button'));
}
setupListeners() {
+ // Copy on copy button click
+ this.button.addEventListener('click', () => {
+ copyTextToClipboard(this.input.value);
+ });
+
// Select all contents on input click
- DOM.onChildEvent(this.container, 'input', 'click', (event, input) => {
- input.select();
+ this.input.addEventListener('click', event => {
+ this.input.select();
event.stopPropagation();
});
});
// Hide pointer when clicking away
- DOM.onEvents(document.body, ['click', 'focus'], event => {
+ DOM.onEvents(document.body, ['click', 'focus'], () => {
if (!this.showing || this.isSelection) return;
this.hidePointer();
});
updateForTarget(element) {
let inputText = this.pointerModeLink ? window.baseUrl(`/link/${this.pageId}#${this.pointerSectionId}`) : `{{@${this.pageId}#${this.pointerSectionId}}}`;
if (this.pointerModeLink && !inputText.startsWith('http')) {
- inputText = window.location.protocol + "//" + window.location.host + inputText;
+ inputText = `${window.location.protocol}//${window.location.host}${inputText}`;
}
- this.container.querySelector('input').value = inputText;
+ this.input.value = inputText;
// Update anchor if present
const editAnchor = this.container.querySelector('#pointer-edit');
if (editAnchor && element) {
- const editHref = editAnchor.dataset.editHref;
+ const {editHref} = editAnchor.dataset;
const elementId = element.id;
// get the first 50 characters.
editAnchor.href = `${editHref}?content-id=${elementId}&content-text=${encodeURIComponent(queryContent)}`;
}
}
-}
\ No newline at end of file
+
+}