romanmir/TorrentParts
1
0
Fork 0
mirror of https://github.com/leoherzog/TorrentParts.git synced 2026-01-25 12:48:07 -08:00
Code Issues Packages Projects Releases Wiki Activity

Improve accessibility

Browse Source
This commit is contained in:
Leo Herzog
2020-11-10 16:04:43 -05:00
parent 8135012c2c
commit 9a50bf75e7
5 changed files with 41 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
bundle.js
View File

@@ -33783,6 +33783,8 @@ function parseRemote(toLoad) {
resetProperties(); resetProperties();
return; return;
} }
originalSourceIcon.innerHTML = '<span class="fad fa-file fa-fw"></span>';
originalSourceIcon.title = 'Currently loaded information sourced from remotely fetched Torrent file';
parsed = result; parsed = result;
display(); display();
}); });
@@ -33814,6 +33816,7 @@ function display() {
tracker.value = parsed.announce[i]; tracker.value = parsed.announce[i];
tracker.dataset.index = i; tracker.dataset.index = i;
tracker.dataset.group = 'announce'; tracker.dataset.group = 'announce';
tracker.setAttribute('aria-label', 'Tracker URL #' + i);
tracker.addEventListener('input', propertyChange); tracker.addEventListener('input', propertyChange);
row.appendChild(tracker); row.appendChild(tracker);
let remove = document.createElement('a'); let remove = document.createElement('a');
@@ -33839,6 +33842,7 @@ function display() {
webseed.value = parsed.urlList[i]; webseed.value = parsed.urlList[i];
webseed.dataset.index = i; webseed.dataset.index = i;
webseed.dataset.group = 'urlList'; webseed.dataset.group = 'urlList';
webseed.setAttribute('aria-label', 'Webseed URL #' + i);
webseed.addEventListener('input', propertyChange); webseed.addEventListener('input', propertyChange);
row.appendChild(webseed); row.appendChild(webseed);
let remove = document.createElement('a'); let remove = document.createElement('a');
@@ -33866,10 +33870,10 @@ function display() {
} else { } else {
if (client.torrents.length > 0) { if (client.torrents.length > 0) {
getFiles.style.display = "none"; getFiles.style.display = "none";
files.innerHTML = '<input type="text" placeholder="Attempting fetching files from Webtorrent..." disabled>'; files.innerHTML = '<input type="text" placeholder="Attempting fetching files from Webtorrent..." aria-label="Attempting fetching files from Webtorrent..." disabled>';
} else { } else {
getFiles.style.display = "block"; getFiles.style.display = "block";
files.innerHTML = '<input type="text" placeholder="Not included in the URL/File provided" disabled>'; files.innerHTML = '<input type="text" placeholder="Not included in the URL/File provided" aria-label="Files information not included in the URL/File provided" disabled>';
} }
downloadTorrent.removeEventListener('click', saveTorrent); downloadTorrent.removeEventListener('click', saveTorrent);
downloadTorrent.disabled = true; downloadTorrent.disabled = true;

2
bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

25
index.html
View File

@@ -1,5 +1,6 @@
<!DOCTYPE html lang="en"> <!DOCTYPE html>
<html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
@@ -33,8 +34,11 @@
</header> </header>
<div id="startButtons"> <div id="startButtons">
<input id="magnet" type="text" placeholder="Enter Magnet URL" /> <input id="magnet" type="text" placeholder="Enter Magnet URL" aria-label="Enter Magnet URL and press enter" />
<input id="torrent" type="file" /> <label for="magnet" style="display:none">
Enter Magnet link and press enter
</label>
<input id="torrent" type="file" aria-label="Select Torrent file" />
<label for="torrent"> <label for="torrent">
<span class="fas fa-cloud-upload"></span> Select Torrent File <span class="fas fa-cloud-upload"></span> Select Torrent File
</label> </label>
@@ -43,18 +47,18 @@
<div id="properties" style="display:none"> <div id="properties" style="display:none">
<button id="reset"> <button id="reset" aria-label="Reset the page">
<span class="far fa-times"></span> <span class="far fa-times"></span>
</button> </button>
<div id="download"> <div id="share">
<button id="copyURL"> <button id="copyURL" aria-label="Copy this torrent.parts link to the clipboard">
<span class="fas fa-share-alt fa-2x" data-fa-transform="left-1"></span> <span class="fas fa-share-alt fa-2x" data-fa-transform="left-1"></span>
</button> </button>
<button id="copyMagnet"> <button id="copyMagnet" aria-label="Copy this Magnet URL to the clipboard">
<span class="fas fa-magnet fa-2x" data-fa-transform="down-1"></span> <span class="fas fa-magnet fa-2x" data-fa-transform="down-1"></span>
</button> </button>
<button id="downloadTorrent"> <button id="downloadTorrent" aria-label="Download this as a Torrent file">
<span class="fas fa-file-download fa-2x"></span> <span class="fas fa-file-download fa-2x"></span>
</button> </button>
</div> </div>
@@ -80,11 +84,12 @@
<div class="property"> <div class="property">
<div class="labels"> <div class="labels">
<label for="created">Created</label> <label for="created">Created</label>
<label for="createdBy" style="display:none">Created By</label>
</div> </div>
<div class="content"> <div class="content">
<input id="created" type="text" placeholder="Creation time unspecified" disabled /> <input id="created" type="text" placeholder="Creation time unspecified" aria-label="Creation time" disabled />
<br /> <br />
<input id="createdBy" type="text" placeholder="Creation client unspecified" disabled /> <input id="createdBy" type="text" placeholder="Creation client unspecified" aria-label="Creation client" disabled />
</div> </div>
</div> </div>

8
parse.js
View File

@@ -120,6 +120,8 @@ function parseRemote(toLoad) {
resetProperties(); resetProperties();
return; return;
} }
originalSourceIcon.innerHTML = '<span class="fad fa-file fa-fw"></span>';
originalSourceIcon.title = 'Currently loaded information sourced from remotely fetched Torrent file';
parsed = result; parsed = result;
display(); display();
}); });
@@ -151,6 +153,7 @@ function display() {
tracker.value = parsed.announce[i]; tracker.value = parsed.announce[i];
tracker.dataset.index = i; tracker.dataset.index = i;
tracker.dataset.group = 'announce'; tracker.dataset.group = 'announce';
tracker.setAttribute('aria-label', 'Tracker URL #' + i);
tracker.addEventListener('input', propertyChange); tracker.addEventListener('input', propertyChange);
row.appendChild(tracker); row.appendChild(tracker);
let remove = document.createElement('a'); let remove = document.createElement('a');
@@ -176,6 +179,7 @@ function display() {
webseed.value = parsed.urlList[i]; webseed.value = parsed.urlList[i];
webseed.dataset.index = i; webseed.dataset.index = i;
webseed.dataset.group = 'urlList'; webseed.dataset.group = 'urlList';
webseed.setAttribute('aria-label', 'Webseed URL #' + i);
webseed.addEventListener('input', propertyChange); webseed.addEventListener('input', propertyChange);
row.appendChild(webseed); row.appendChild(webseed);
let remove = document.createElement('a'); let remove = document.createElement('a');
@@ -203,10 +207,10 @@ function display() {
} else { } else {
if (client.torrents.length > 0) { if (client.torrents.length > 0) {
getFiles.style.display = "none"; getFiles.style.display = "none";
files.innerHTML = '<input type="text" placeholder="Attempting fetching files from Webtorrent..." disabled>'; files.innerHTML = '<input type="text" placeholder="Attempting fetching files from Webtorrent..." aria-label="Attempting fetching files from Webtorrent..." disabled>';
} else { } else {
getFiles.style.display = "block"; getFiles.style.display = "block";
files.innerHTML = '<input type="text" placeholder="Not included in the URL/File provided" disabled>'; files.innerHTML = '<input type="text" placeholder="Not included in the URL/File provided" aria-label="Files information not included in the URL/File provided" disabled>';
} }
downloadTorrent.removeEventListener('click', saveTorrent); downloadTorrent.removeEventListener('click', saveTorrent);
downloadTorrent.disabled = true; downloadTorrent.disabled = true;

23
style.css
View File

@@ -5,7 +5,7 @@ html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:b
--gradient: linear-gradient(180deg, #152332, #24384D); --gradient: linear-gradient(180deg, #152332, #24384D);
--dark-blue: #102030; --dark-blue: #102030;
--light-blue: #495563; --light-blue: #495563;
--accent: #63A079; --accent: #46835C;
--grey: #BDBDBD; --grey: #BDBDBD;
--white: #FFF; --white: #FFF;
background: #24384D; background: #24384D;
@@ -15,7 +15,7 @@ html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:b
overflow-x: hidden; overflow-x: hidden;
} }
:root:-webkit-scrollbar { /* WebKit */ :root:-webkit-scrollbar {
display: none; display: none;
} }
@@ -31,7 +31,7 @@ body {
overflow-x: hidden; overflow-x: hidden;
} }
body:-webkit-scrollbar { /* WebKit */ body:-webkit-scrollbar {
display: none; display: none;
} }
@@ -157,12 +157,13 @@ label[for="torrent"] {
height: 32px; height: 32px;
border-radius: 50%; border-radius: 50%;
text-align: center; text-align: center;
line-height: 50%;
position: absolute; position: absolute;
top: -12px; top: -12px;
right: -12px; right: -12px;
} }
#download { #share {
position: absolute; position: absolute;
top: 0; top: 0;
left: -28px; left: -28px;
@@ -170,11 +171,12 @@ label[for="torrent"] {
flex-direction: column; flex-direction: column;
} }
#download > * { #share > * {
width: 60px; width: 64px;
height: 60px; height: 64px;
border-radius: 50%; border-radius: 50%;
text-align: center; text-align: center;
line-height: 50%;
margin: 4px 0; margin: 4px 0;
} }
@@ -242,7 +244,7 @@ input {
right: 8px; right: 8px;
} }
#download { #share {
justify-content: center; justify-content: center;
width: 95%; width: 95%;
top: auto; top: auto;
@@ -252,7 +254,7 @@ input {
flex-direction: row; flex-direction: row;
} }
#download > * { #share > * {
margin: 0 4px; margin: 0 4px;
} }
@@ -266,7 +268,8 @@ input {
#startButtons { #startButtons {
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: space-between;
height: 90px;
} }
#properties { #properties {