static/feather-icons/LICENSE

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2013-2017 Cole Bemis
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

static/feather-icons/copy.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-copy"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>

static/feather-icons/x.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>

static/index.html

@@ -17,10 +17,7 @@
 
       <button id="upload">Upload</button>
       <div id="download_link_container" style="display: none;">
-        <div id="download_link_main">
+        Download link: <span id="download_link"></span>
-          <div>Download link: <span id="download_link"></span></div><div class="copy_button"></div>
-        </div>
-        <div id="copied_message" style="display: none;">Copied!</div>
       </div>
       <div id="progress_container" style="display: none;">
         <div id="progress"></div>

static/transbeam.css

@@ -23,49 +23,6 @@ body {
     background-size: 0;
 }
 
-#download_link_container {
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    padding: 10px;
-    cursor: pointer;
-    width: fit-content;
-    margin: 10px auto;
-    position: relative;
-}
-
-#download_link_container:hover {
-    border-color: #777;
-}
-
-#download_link_main {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-}
-
-.copy_button {
-    width: 18px;
-    height: 18px;
-    background-color: #333;
-    mask-image: url("feather-icons/copy.svg");
-    mask-size: contain;
-    mask-repeat: no-repeat;
-}
-
-#download_link_container:hover .copy_button {
-    background-color: #000;
-}
-
-#copied_message {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    margin: auto;
-    height: fit-content;
-}
-
 table {
     border-collapse: collapse;
     margin: 20px auto;
@@ -85,21 +42,6 @@ td {
     padding: 10px;
 }
 
-td.file_delete {
-    background-color: #888;
-    mask-image: url("feather-icons/x.svg");
-    mask-size: contain;
-    mask-repeat: no-repeat;
-    mask-position: center;
-    padding-left: 15px;
-    padding-right: 15px;
-    cursor: pointer;
-}
-
-td.file_delete:hover {
-    background-color: #f00;
-}
-
 td.file_size {
     text-align: right;
 }

static/transbeam.js

@@ -11,9 +11,7 @@ const fileList = document.getElementById('file_list');
 const uploadButton = document.getElementById('upload');
 
 const downloadLinkContainer = document.getElementById('download_link_container');
-const downloadLinkMain = document.getElementById('download_link_main');
 const downloadLink = document.getElementById('download_link');
-const copiedMessage = document.getElementById('copied_message');
 
 const progressContainer = document.getElementById('progress_container');
 const progress = document.getElementById('progress');
@@ -121,8 +119,11 @@ function addListEntry(file) {
     const listEntry = document.createElement('tr');
 
     const deleteButtonCell = document.createElement('td');
-    deleteButtonCell.className = 'file_delete';
+    const deleteButton = document.createElement('button');
-    deleteButtonCell.addEventListener('click', () => {
+    deleteButtonCell.appendChild(deleteButton);
+    deleteButton.className = 'file_delete';
+    deleteButton.textContent = 'x';
+    deleteButton.addEventListener('click', () => {
         removeFile(file.name);
         listEntry.remove();
         updateFiles();
@@ -157,7 +158,7 @@ uploadButton.addEventListener('click', (e) => {
     if (files.length === 0) { return; }
 
     fileInputContainer.remove();
-    for (const button of Array.from(document.getElementsByTagName('button')).concat(...document.getElementsByClassName('file_delete'))) {
+    for (const button of Array.from(document.getElementsByTagName('button'))) {
         button.remove();
     }
 
@@ -175,14 +176,3 @@ uploadButton.addEventListener('click', (e) => {
         }
     });
 })
-
-downloadLinkContainer.addEventListener('click', (e) => {
-    navigator.clipboard.writeText(downloadLink.textContent);
-    downloadLinkMain.style.visibility = 'hidden';
-    copiedMessage.style.display = '';
-})
-
-downloadLinkContainer.addEventListener('mouseleave', (e) => {
-    copiedMessage.style.display = 'none';
-    downloadLinkMain.style.visibility = 'visible';
-});