diff --git a/funnel/assets/js/shortlink_form.js b/funnel/assets/js/shortlink_form.js index b84f89a9c..754e60076 100644 --- a/funnel/assets/js/shortlink_form.js +++ b/funnel/assets/js/shortlink_form.js @@ -1,4 +1,5 @@ import toastr from 'toastr'; +import Utils from './utils/helper'; $(() => { async function getShortlink(url) { @@ -25,29 +26,13 @@ $(() => { $('.js-copy-shortlink').on('click', function clickCopyLink(event) { event.preventDefault(); - const url = $('.js-generated-url').text(); - if (navigator.clipboard) { - navigator.clipboard.writeText(url).then( - () => toastr.success(window.gettext('Link copied')), - () => toastr.success(window.gettext('Could not copy link')) - ); - } else { - const selection = window.getSelection(); - const range = document.createRange(); - range.selectNodeContents(url[0]); - selection.removeAllRanges(); - selection.addRange(range); - if (document.execCommand('copy')) { - toastr.success(window.gettext('Link copied')); - } else { - toastr.error(window.gettext('Could not copy link')); - } - selection.removeAllRanges(); - } + Utils.copyToClipboard('.js-generated-url'); }); $('#js-generate-shortlink').on('submit', (event) => { event.preventDefault(); + $('.js-generated-url').text(); + const url = $('.js-campaign-url').val(); const id = $('.js-campaign-id').val(); const source = $('.js-campaign-source').val(); diff --git a/funnel/assets/js/utils/helper.js b/funnel/assets/js/utils/helper.js index ecd116762..9093db0d7 100644 --- a/funnel/assets/js/utils/helper.js +++ b/funnel/assets/js/utils/helper.js @@ -1,4 +1,6 @@ /* global gettext */ +import toastr from 'toastr'; + const Utils = { // convert array of objects into hashmap tohashMap(objectArray, key) { @@ -227,6 +229,28 @@ const Utils = { }, }); }, + copyToClipboard(elem) { + const textElem = document.querySelector(elem); + const stringToCopy = textElem.innerHTML; + if (navigator.clipboard) { + navigator.clipboard.writeText(stringToCopy).then( + () => toastr.success(window.gettext('Link copied')), + () => toastr.success(window.gettext('Could not copy link')) + ); + } else { + const selection = window.getSelection(); + const range = document.createRange(); + range.selectNodeContents(textElem); + selection.removeAllRanges(); + selection.addRange(range); + if (document.execCommand('copy')) { + toastr.success(window.gettext('Link copied')); + } else { + toastr.error(window.gettext('Could not copy link')); + } + selection.removeAllRanges(); + } + }, }; export default Utils; diff --git a/funnel/assets/js/utils/webshare.js b/funnel/assets/js/utils/webshare.js index c989b2f95..54625b114 100644 --- a/funnel/assets/js/utils/webshare.js +++ b/funnel/assets/js/utils/webshare.js @@ -1,4 +1,3 @@ -/* global gettext */ import toastr from 'toastr'; import Utils from './helper'; @@ -43,35 +42,14 @@ const WebShare = { $('body').on('click', '.js-copy-link', function clickCopyLink(event) { event.preventDefault(); const linkElem = this; - const copyLink = () => { - const url = $(linkElem).find('.js-copy-url').first().text(); - if (navigator.clipboard) { - navigator.clipboard.writeText(url).then( - () => toastr.success(gettext('Link copied')), - () => toastr.success(gettext('Could not copy link')) - ); - } else { - const selection = window.getSelection(); - const range = document.createRange(); - range.selectNodeContents($(linkElem).find('.js-copy-url')[0]); - selection.removeAllRanges(); - selection.addRange(range); - if (document.execCommand('copy')) { - toastr.success(gettext('Link copied')); - } else { - toastr.error(gettext('Could not copy link')); - } - selection.removeAllRanges(); - } - }; if ($(linkElem).attr('data-shortlink')) { - copyLink(); + Utils.copyToClipboard('.js-copy-url'); } else { Utils.fetchShortUrl($(linkElem).find('.js-copy-url').first().html()) .then((shortlink) => { $(linkElem).find('.js-copy-url').text(shortlink); $(linkElem).attr('data-shortlink', true); - copyLink(); + Utils.copyToClipboard('.js-copy-url'); }) .catch((errMsg) => { toastr.error(errMsg);