diff --git a/frontend/src/upload.js b/frontend/src/upload.js
index 1ae58428..f13bf94f 100644
--- a/frontend/src/upload.js
+++ b/frontend/src/upload.js
@@ -18,6 +18,21 @@ if (storage.has('referrer')) {
window.referrer = 'external';
}
+const allowedCopy = () => {
+ const support = !!document.queryCommandSupported;
+ return support ? document.queryCommandSupported('copy') : false;
+}
+
+const copyToClipboard = (value) => {
+ const aux = document.createElement('input');
+ aux.setAttribute('value', value);
+ document.body.appendChild(aux);
+ aux.select();
+ const result = document.execCommand('copy');
+ document.body.removeChild(aux);
+ return result;
+}
+
$(document).ready(function() {
$('#page-one').removeAttr('hidden');
$('#file-upload').change(onUpload);
@@ -49,7 +64,7 @@ $(document).ready(function() {
$('body').on('dragover', allowDrop).on('drop', onUpload);
// reset copy button
const $copyBtn = $('#copy-btn');
- $copyBtn.attr('disabled', false);
+ $copyBtn.attr('disabled', !allowedCopy());
$('#link').attr('disabled', false);
$copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
@@ -67,35 +82,34 @@ $(document).ready(function() {
// copy link to clipboard
$copyBtn.click(() => {
- // record copied event from success screen
- sendEvent('sender', 'copied', {
- cd4: 'success-screen'
- });
- const aux = document.createElement('input');
- aux.setAttribute('value', $('#link').attr('value'));
- document.body.appendChild(aux);
- aux.select();
- document.execCommand('copy');
- document.body.removeChild(aux);
- //disable button for 3s
- $copyBtn.attr('disabled', true);
- $('#link').attr('disabled', true);
- $copyBtn.html(
- ''
- );
- window.setTimeout(() => {
- $copyBtn.attr('disabled', false);
- $('#link').attr('disabled', false);
- $copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
- }, 3000);
+ if (allowedCopy() && copyToClipboard($('#link').attr('value'))) {
+ // record copied event from success screen
+ sendEvent('sender', 'copied', {
+ cd4: 'success-screen'
+ });
+
+ //disable button for 3s
+ $copyBtn.attr('disabled', true);
+ $('#link').attr('disabled', true);
+ $copyBtn.html(
+ ''
+ );
+ window.setTimeout(() => {
+ $copyBtn.attr('disabled', false);
+ $('#link').attr('disabled', false);
+ $copyBtn.attr('data-l10n-id', 'copyUrlFormButton');
+ }, 3000);
+ }
});
- $('.upload-window').on('dragover', () => {
- $('.upload-window').addClass('ondrag');
- });
- $('.upload-window').on('dragleave', () => {
- $('.upload-window').removeClass('ondrag');
+ const $uploadWindow = $('.upload-window');
+ $uploadWindow.on('dragover', () => {
+ $uploadWindow.addClass('ondrag');
+ })
+ .on('dragleave', () => {
+ $uploadWindow.removeClass('ondrag');
});
+
//initiate progress bar
$('#ul-progress').circleProgress({
value: 0.0,
@@ -122,14 +136,14 @@ $(document).ready(function() {
let file = '';
if (event.type === 'drop') {
if (!event.originalEvent.dataTransfer.files[0]) {
- $('.upload-window').removeClass('ondrag');
+ $uploadWindow.removeClass('ondrag');
return;
}
if (
event.originalEvent.dataTransfer.files.length > 1 ||
event.originalEvent.dataTransfer.files[0].size === 0
) {
- $('.upload-window').removeClass('ondrag');
+ $uploadWindow.removeClass('ondrag');
document.l10n.formatValue('uploadPageMultipleFilesAlert').then(str => {
alert(str);
});
@@ -335,8 +349,10 @@ $(document).ready(function() {
const $copyIcon = $('', {
src: '/resources/copy-16.svg',
class: 'icon-copy',
- 'data-l10n-id': 'copyUrlHover'
+ 'data-l10n-id': 'copyUrlHover',
+ disabled: !allowedCopy()
});
+
const expiry = document.createElement('td');
const del = document.createElement('td');
const $delIcon = $('', {
@@ -372,17 +388,12 @@ $(document).ready(function() {
link.style.color = '#0A8DFF';
//copy link to clipboard when icon clicked
- $copyIcon.click(function() {
+ $copyIcon.on('click', function() {
// record copied event from upload list
sendEvent('sender', 'copied', {
cd4: 'upload-list'
});
- const aux = document.createElement('input');
- aux.setAttribute('value', url);
- document.body.appendChild(aux);
- aux.select();
- document.execCommand('copy');
- document.body.removeChild(aux);
+ copyToClipboard(url);
document.l10n.formatValue('copiedUrl').then(translated => {
link.innerHTML = translated;
});
diff --git a/public/main.css b/public/main.css
index 0960ea61..b3541e23 100644
--- a/public/main.css
+++ b/public/main.css
@@ -272,6 +272,11 @@ tbody {
cursor: pointer;
}
+.icon-copy[disabled="disabled"] {
+ pointer-events: none;
+ opacity: 0.3;
+}
+
/* Popup container */
.popup {
position: absolute;
@@ -504,6 +509,7 @@ tbody {
background: #05a700;
border: 1px solid #05a700;
cursor: auto;
+ opacity: 0.3;
}
#delete-file {