X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/d084f225a0e1dd52e11e3fd96bdce59703a71eff..refs/pull/3617/head:/resources/js/components/pointer.js diff --git a/resources/js/components/pointer.js b/resources/js/components/pointer.js index d1967acd0..a60525cb4 100644 --- a/resources/js/components/pointer.js +++ b/resources/js/components/pointer.js @@ -1,13 +1,14 @@ import * as DOM from "../services/dom"; -import Clipboard from "clipboard/dist/clipboard.min"; +import {Component} from "./component"; +import {copyTextToClipboard} from "../services/clipboard"; -/** - * @extends Component - */ -class Pointer { + +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 @@ -17,15 +18,17 @@ class Pointer { this.pointerSectionId = ''; this.setupListeners(); - - // Set up clipboard - new Clipboard(this.container.querySelector('button')); } setupListeners() { + // Copy on copy button click + this.button.addEventListener('click', event => { + 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(); }); @@ -113,7 +116,7 @@ class Pointer { 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'); @@ -126,6 +129,4 @@ class Pointer { editAnchor.href = `${editHref}?content-id=${elementId}&content-text=${encodeURIComponent(queryContent)}`; } } -} - -export default Pointer; \ No newline at end of file +} \ No newline at end of file