Transmission/transmission
1
0
Fork 0
mirror of https://github.com/transmission/transmission.git synced 2025-12-20 02:18:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: remove per-torrent start/pause button from web client (#7292)

Browse Source
This commit is contained in:
Rukario
2024-12-25 11:08:20 -08:00
committed by GitHub
parent dc6c761c29
commit c3b48882b8
9 changed files with 3 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/CMakeLists.txt
View File

@@ -43,10 +43,6 @@ set(WEB_IMAGES
assets/img/modern-tortoise.png
assets/img/music.svg
assets/img/package.svg
assets/img/pause-circle-active.svg
assets/img/pause-circle-idle.svg
assets/img/play-circle-active.svg
assets/img/play-circle-idle.svg
assets/img/README.md
assets/img/router.svg
assets/img/type.svg)

33
web/assets/css/transmission-app.scss
View File

@@ -26,7 +26,6 @@
--dialog-logo-padding: calc(var(--dialog-padding) * 0.66);
--dialog-padding: 20px;
--logo-size: 64px;
--pauseresume-size: 20px;
--popup-top: 82px; // TODO: ugly that this is hardcoded
--toolbar-height: 50px;
@@ -65,10 +64,6 @@
--image-chevron-up: url('../img/chevron-up.svg');
--image-lock-fill: url('../img/lock-fill.svg');
--image-magnet: url('../img/magnet.svg');
--image-pause-circle-active: url('../img/pause-circle-active.svg');
--image-pause-circle-idle: url('../img/pause-circle-idle.svg');
--image-play-circle-active: url('../img/play-circle-active.svg');
--image-play-circle-idle: url('../img/play-circle-idle.svg');
--app-image-url: url('../img/box.svg');
--audio-image-url: url('../img/music.svg');
@@ -622,7 +617,7 @@ a {
grid-area: peers;
}
.torrent-progress {
.torrent-progress-bar {
display: flex;
flex-direction: row;
grid-area: progressbar;
@@ -664,32 +659,6 @@ a {
background-repeat: no-repeat;
}
.torrent-pauseresume-button {
background-position: center center;
background-repeat: no-repeat;
background-size: var(--pauseresume-size);
margin-left: calc(var(--pauseresume-size) / 2);
width: var(--pauseresume-size);
&[data-action='pause'] {
background-image: var(--image-pause-circle-idle);
&:active,
&:hover {
background-image: var(--image-pause-circle-active);
}
}
&[data-action='resume'] {
background-image: var(--image-play-circle-idle);
&:active,
&:hover {
background-image: var(--image-play-circle-active);
}
}
}
.torrent-progress-bar {
font-size: 14px;
position: relative;

4
web/assets/img/README.md
View File

@@ -7,10 +7,6 @@
license: Apache-2.0 license
- horizontal-rule.svg
- pause-circle-active.svg
- pause-circle-idle.svg
- play-circle-active.svg
- play-circle-idle.svg
- router.svg
## [Feather Icons](https://github.com/feathericons/feather)

39
web/assets/img/pause-circle-active.svg
View File

@@ -1,39 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
version="1.1"
id="svg1"
width="60"
height="60"
viewBox="0 0 60 60"
sodipodi:docname="pause.png"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<g
inkscape:groupmode="layer"
inkscape:label="Image"
id="g1">
<image
width="60"
height="60"
preserveAspectRatio="none"
style="image-rendering:optimizeQuality"
xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAABGdBTUEAALGPC/xhBQAAACBjSFJN&#10;AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAUGVYSWZNTQAqAAAACAACARIA&#10;AwAAAAEAAQAAh2kABAAAAAEAAAAmAAAAAAADoAEAAwAAAAEAAQAAoAIABAAAAAEAAAA8oAMABAAA&#10;AAEAAAA8AAAAAJkCx0IAAAIwaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8eDp4bXBtZXRhIHht&#10;bG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJYTVAgQ29yZSA2LjAuMCI+CiAgIDxyZGY6&#10;UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5z&#10;IyI+CiAgICAgIDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiCiAgICAgICAgICAgIHhtbG5z&#10;OmV4aWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vZXhpZi8xLjAvIgogICAgICAgICAgICB4bWxuczp0&#10;aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDxleGlmOlBpeGVs&#10;WURpbWVuc2lvbj42MDwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgICAgIDxleGlmOlBpeGVs&#10;WERpbWVuc2lvbj42MDwvZXhpZjpQaXhlbFhEaW1lbnNpb24+CiAgICAgICAgIDxleGlmOkNvbG9y&#10;U3BhY2U+MTwvZXhpZjpDb2xvclNwYWNlPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90&#10;aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8&#10;L3g6eG1wbWV0YT4KQTteaQAABE5JREFUaAXlW09IFFEcfquZlFkdtjrkQmm1omBsURRIUnYOCmoL&#10;OkRERAQSRJIRIkhECxUSRNChWiJq65aHDtUeCpNy0S7ZoXIjFqXCba02JbPvm3VkWWdy58/uzux8&#10;8Plm35/f+33z3rx585vRJXKLZTDvA2unuRxp5TT/IB2b5iek78BBMAImQdugEZ5eAgfAv+CURv5G&#10;/WfgWbAGtCTc8Ooc+B7UKnCu+s9h8xBYBhYcnKIB8Ac4l+NGy6Po4zg4H8w7StDjCTAOGhWitT2v&#10;82Ywb1iHnl6BWh01u/5t+MAFMKfYD+sJ0Gzn9drjyr4+V4rPW0ho+gn6Bb92mSm6FMZuWFSsLJz3&#10;9MNmiHbByC2Li5VFMzUs+qKNxFIwR1r39D5iM7HySPOabgA1gQ3YUDZit5Sr96JsFZejIm/udhOZ&#10;6e/NbAW3F4FYWfz2uUSvQQU+rcgN7J6+hZb/7r3vFJFYebCOQZMi1iKXy7pcsVjSj9A0T1Y8c4CM&#10;0yB3VbrhdrtFW1ub8Hq9orQ0ZSqZTIpwOCy6urrE1BTP4WxUVFSI1tZW4fP5RFlZ6rF3YmJC9Pb2&#10;ikAgIHhsAKvQ9gAYTLexED8YbjE0qsFgEJqU4ff7VW13dnYqN0JuS0uLajsN/oZRVwKfa4k9YNb3&#10;LamFwp/6+nqF3FSW3rK6ujpVmxoKtqHuataXBfs1NFat6nJx660MvWUlJbKLynazzKVj+1iX1ngd&#10;N/FHkaOZ+ih4M5jzyAE7KzAa0X85BW8psCP56n4BOmqgYAbJnYJaCvY6RS10SoI9DhJcxRF2woIl&#10;j+lipwmupGDSKZC2MdxDOwVjHF3HCR52yvBC5zBHmAE7p2DQaYLfUfBrhwwvw1f9FPwCHHeAaL7T&#10;llZpfjHT4wDBT6iRI0w8SCXW+4uwlllOPaQhWfBdHBsKDdLY0NAQE0XoLYtGo4r2NGa+Qf1+tpHD&#10;spzW/HTAUMSsr69PVFdXC8ah4vG4GB0dFbFYTIRCISncOjk5yT5nIRKJCI/HI4VoE4mE1G5kZER0&#10;d3eLjo4OMT5ueIm5gE5fZna8CRlmhEStZuMbdM1EZOUpTfFcxR7zoMhwBXr4HZkiOMqcd1YbJb3+&#10;cNu8RFFpWua1IhJ8ME2X6uFSlPDM6D2rVmn3VFWhQsFO5Nl5an+B/1UKumZuS5llH5DBW1ZTZoEN&#10;fnOG7QUjWn3lCh4CrTJFs/XjlFah6fXL8YN70Gw7K3S9QLrzeo8ZxrWD6MvwU/31pUb1/DDkPljo&#10;EVTr/4xGPVlV5zXdDlpp9f4Of7hA5RQ7YD0Gqp3tfOUzUlOTU6VpxrlduwoWYrT5gfpJUH7Sw2H+&#10;sAFdPQLzMap8RrwOrgQLDv4zFoMIfK42W/xX2OQKrLhzQn5BwX34UZCPmT9BveK5NbwH7gZ5hzAN&#10;pt23FDyio1vBjWDtNFcg5X2d5PXP1zy8Jj+DfCFA9oADIE+W6fgHx/XhAwJBPHEAAAAASUVORK5C&#10;YII=&#10;"
id="image1" />
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 3.7 KiB

11
web/assets/img/pause-circle-idle.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 62 KiB

39
web/assets/img/play-circle-active.svg
View File

@@ -1,39 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
version="1.1"
id="svg1"
width="60"
height="60"
viewBox="0 0 60 60"
sodipodi:docname="play.png"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<g
inkscape:groupmode="layer"
inkscape:label="Image"
id="g1">
<image
width="60"
height="60"
preserveAspectRatio="none"
style="image-rendering:optimizeQuality"
xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAABGdBTUEAALGPC/xhBQAAACBjSFJN&#10;AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAUGVYSWZNTQAqAAAACAACARIA&#10;AwAAAAEAAQAAh2kABAAAAAEAAAAmAAAAAAADoAEAAwAAAAEAAQAAoAIABAAAAAEAAAA8oAMABAAA&#10;AAEAAAA8AAAAAJkCx0IAAAIwaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8eDp4bXBtZXRhIHht&#10;bG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJYTVAgQ29yZSA2LjAuMCI+CiAgIDxyZGY6&#10;UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5z&#10;IyI+CiAgICAgIDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiCiAgICAgICAgICAgIHhtbG5z&#10;OmV4aWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vZXhpZi8xLjAvIgogICAgICAgICAgICB4bWxuczp0&#10;aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDxleGlmOlBpeGVs&#10;WURpbWVuc2lvbj42MDwvZXhpZjpQaXhlbFlEaW1lbnNpb24+CiAgICAgICAgIDxleGlmOlBpeGVs&#10;WERpbWVuc2lvbj42MDwvZXhpZjpQaXhlbFhEaW1lbnNpb24+CiAgICAgICAgIDxleGlmOkNvbG9y&#10;U3BhY2U+MTwvZXhpZjpDb2xvclNwYWNlPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90&#10;aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8&#10;L3g6eG1wbWV0YT4KQTteaQAABRFJREFUaAXdWl9IJVUc/u21vBZuZag9uEKypeuDm1uGFYJYgiCi&#10;9FAm+BChEZVaEElK7JMhLhRIEGFCBRrqi2CgBZYPkQ/Gwiq4N8SiTFmwsFq1smz6vovnMl3v9c6f&#10;M/fO+IOPc2bmnO/8vjkzc37nnDkj3loB6C8BF45QiPTsEf5BevMIPyL9FogAV4E/gMBYDTx9G7gG&#10;/AsYNvEnyn8J9APnAV9aPrx6E1gH7ApMVf4rcD4L3Apk3PiIXgF2gVSOu73+A9p4EcgG0m4htPgy&#10;8CvgVojd+nzPnwDSZqVoaQmw66ju8h/DB34APbVnwP47oNt5p3z8sj/gleK3fCTUfIP24VezTtFZ&#10;IPvAp2KVcI7pz+kQfQYkH/lcrBLN1LXooQCJpWD2tOPHuyNgYlVP852+CNgyVmBFRRK0lF/vXKuK&#10;wyjIwT1oIuP9/dCq4MunQKwSX5dK9H0owNmKqhD09Dq0nBh7j50isaqzXoCmhHY/zvKzrgqelvR7&#10;aLpFKeasR9nryDCqcm01NTWyubkpu7u7Mjw8LHl5ea45XRDci7pt8fVvxwkut2jp1ampKcNs29vb&#10;RkdHhxEKhbTwO/BzAXX+Z+040ubMzMyMWW8sv7S0ZFRXV2trx4bPXGoqoWL1SLfywGurqqqSxcVF&#10;GR0dlcLCQq+bM/NzTvC0OsEXWuscN1kPx7oamZ2dHaO7u9vIyspKV49/rgQ/hozWRq0IVuKXl5eN&#10;2tpare0n0cNQOcxH+hEgY1ZRUSELCwsyPj4uRUVFXvpxG8gvUjAXyTNubW1tEolEpLe3V7KzTwyO&#10;3Ph6gYLL3DDorJubmyuDg4OysrIiDQ0NOqkVV1RwsTryS1paWipzc3MyPT0tJSXR0USXa+fYw54v&#10;dTr1tqWlRVZXV6Wvr88pRXy9O3wtmN7m5OTIwMCANDU1xTvv5PgsBRO+t/x8bl+5thDFMob2tc3P&#10;z8vk5KQOH2/6WvDW1pa0t7dLfX297O8zbnBtUcE3XNNoJjg4OJChoSEpKyuTsTGuSWizG4yjuWBX&#10;rY3SJdHs7Kz09PTI2tqaS6aE1SN8pCk447a+vi7Nzc3S2NjolVhq5PKt1ANag3c7k4e9vT2jv7/f&#10;CIfDWn1IoOlvnIvGHAyqta5UWhU8MTFhFBcXey1U8X8NndExmH/MLPIgXcZYua6uTlpbW2VjYyNd&#10;zc6bG3oJB+pOuE6T9TAn/V1dXemc9Ju1VJoF342Dv3SJRtCv5vfR9PDw0BgZGTEKCgrMDqQzz1+o&#10;jtkUzmhxorOzMyYYa1gG1rK08Lrw75VjanHiYReExwSVl5cblZWVx87rbMMi1y8ol3Qncc4iiR+E&#10;WPWBP8wlNfbyIWCVzO/lGDbfmVTt0YX3TpFgbjCktLtQgnfG772Xyr8vUio1FWC4GeRHexv+nzPp&#10;iWWT7RZ+hxK8VhsrGZwMe/4p4KpdlzmT0jY2gyvVI6jr+mt2hZrL8wcXxqC6nPGa54rZead5TqmC&#10;IPod+MldQi3GvQ+uonndQ07539CiMo6E7/RlwE9f79/gDz9QntrjYN8CnPaGrnrfwIfznio1kTNc&#10;exfIRG9z8/5VINmQikve2YOg/hTQ1Wsn8XC+/j7g6SYy+C3ZJZT6BOBy0UlOO7n2Mzj5BU4YOeF8&#10;Ro1x+PPAZ8Ae4EQg6zA0nACeBDhCaDNt41YCj+joo8BDAP8yIO4BOK4TfP+5r8V38ieA6+MEFxSv&#10;ARSu3f4DFAR8/czUm8MAAAAASUVORK5CYII=&#10;"
id="image1" />
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 3.9 KiB

11
web/assets/img/play-circle-idle.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

Before

Width:  |  Height:  |  Size: 44 KiB

25
web/src/torrent-row.js
View File

@@ -217,14 +217,7 @@ export class TorrentRendererFull {
render(controller, torrent, root) {
const is_stopped = torrent.isStopped();
root.classList.toggle('paused', is_stopped);
const {
button,
labels,
name,
peer_details,
progressbar,
progress_details,
} = root;
const { labels, name, peer_details, progressbar, progress_details } = root;
// name
setTextContent(name, torrent.getName());
@@ -243,10 +236,6 @@ export class TorrentRendererFull {
TorrentRendererHelper.renderProgressbar(controller, torrent, progressbar);
progressbar.classList.add('full');
// pause/resume button
button.alt = is_stopped ? 'Resume' : 'Pause';
button.dataset.action = is_stopped ? 'resume' : 'pause';
// peer details
TorrentRendererFull.renderPeerDetails(torrent, peer_details);
}
@@ -261,7 +250,7 @@ export class TorrentRendererFull {
['name', 'torrent-name'],
['labels', 'torrent-labels'],
['progress_details', 'torrent-progress-details'],
['progress', 'torrent-progress'],
['progressbar', 'torrent-progress-bar full'],
['peer_details', 'torrent-peer-details'],
];
@@ -274,16 +263,6 @@ export class TorrentRendererFull {
TorrentRendererHelper.updateIcon(root.icon, torrent);
const progressbar = document.createElement('div');
progressbar.className = 'torrent-progress-bar full';
const button = document.createElement('a');
button.className = 'torrent-pauseresume-button';
root.progress.append(progressbar, button);
root.progressbar = progressbar;
root.button = button;
return root;
}
}

14
web/src/transmission.js
View File

@@ -781,20 +781,6 @@ TODO: fix this when notifications get fixed
this.setCurrentPopup(null);
}
// handle the per-row pause/resume button
if (event_.target.classList.contains('torrent-pauseresume-button')) {
switch (event_.target.dataset.action) {
case 'pause':
this._stopTorrents([row.getTorrent()]);
break;
case 'resume':
this._startTorrents([row.getTorrent()]);
break;
default:
break;
}
}
// Prevents click carrying to parent element
// which deselects all on click
event_.stopPropagation();