killemov / shift Goto Github PK
View Code? Open in Web Editor NEWA minimalistic approach to maximum control of your Transmission. (Web UI)
Home Page: https://forum.transmissionbt.com/viewtopic.php?f=8&t=12555
A minimalistic approach to maximum control of your Transmission. (Web UI)
Home Page: https://forum.transmissionbt.com/viewtopic.php?f=8&t=12555
The instructions at the bottom of the manual work for showing the done/completed date of finished torrents, but not the ETA of torrents currently downloading. How do you show the ETA?
It would be nice to have Shift handling the magnet:
protocol directly.
After updating to commit 761918b the Torrents tab doesn't appear to function at all for me, it doesn't load downloading torrents, and attempting to change status filter gives the following error.
The error also happens when you switch to the session tab (appears to function correctly, can see all the options), and then click on the torrents tab to attempt to go back to torrent list. (doesn't actually switch to torrents tab)
If I downgrade to commit 9712a3d, the web ui functions normally.
OS: Windows 10
Browser: Chrome Version 47.0.2526.69 beta-m (64-bit)
I'm running Manjaro Linux. Will this run on my system?
Line 254 in c56c5d6
Suggest this that also matches parenthesis:
const torrentRegExp = /(\b(https?|ftp|magnet):\/?\/?[\-A-Z0-9()[\]+&@#\/%?=~_|!:,.;]*[\-A-Z0-9()[\]+&@#\/%=~_|])/ig;
Hey,
Great work on this interface! However, i don't manage to remove a tracker from a torrent. When i click on the tracker and choose the menu 'remove', nothing happens.
Any idea?
Thanks!
Do you have a demo or at least some screen shots avaible?
Changed a few values in the shift.css to make it a bit darker. Kinda shit but sorta matches my browser theme so meh.
/**
* Shift: a Transmission web interface.
*
* © 2014 Killemov.
*
* This work is licensed under the Creative Commons Attribution-ShareAlike 3.0 Unported License.
* To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/3.0/ or send a
* letter to Creative Commons, 444 Castro Street, Suite 900, Mountain View, California, 94041, USA.
*/
a {
color: #778C9E;
}
body {
background-color: #212122;
color: #DADADA;
font-family: Arial, sans-serif;
font-size: 11pt;
padding: 0;
margin: 8px;
}
input {
color: #DADADA;
font-family: Arial, sans-serif;
font-size: 11pt;
}
h1 {
font-size: 28pt;
margin: 8px 0;
text-align: center;
}
select {
color: #DADADA;
font-family: Arial, sans-serif;
font-size: 11pt;
}
ul#menu {
background-attachment: scroll;
background-clip: border-box;
background-color: #212122;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAABACAYAAAAwJqZDAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3ggVCSkQ5XePkwAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAAjElEQVQoz42R0Q3DIAxEH5HV/UfpCN2g26RSVe76AYECidQvTs8+w5l0fzxvQA4Sb4BIJIooJ2G7CiqRitxg7sm1FGquE1FdH2kcGHi25+ZaJmsl7nNSJWyAQ1IqwiVhGAtwWIcAD0/tAff9tURmXMu6jR9y6Qo68VXPQU5v99/NjfSS5s/tJS4DNvEFcGh2gWjOH3gAAAAASUVORK5CYII=");
background-origin: padding-box;
background-position: 0 0;
background-repeat: repeat-x;
background-size: 100% 100%;
border-radius: 4px;
display: block;
font-weight: bold;
margin: 0 0 8px;
padding: 8px;
}
ul#menu li {
background-color: rgba( 255, 255, 255, 0.2 );
border-color: #212122 #212122 #212122 #212122;
border-style: solid;
border-radius: 4px;
border-width: 1px;
color: #DADADA;
display: inline-block;
margin-right: 2px;
padding: 0.5em 1em;
text-align: center;
}
ul#menu li:hover {
cursor: pointer;
}
ul#menu li.selected {
background-color: rgba( 63, 63, 63, 0.2 );
border-color: #1C1C1C #1C1C1C #1C1C1C #1C1C1C;
border-radius: 4px;
color: #ECF3F7;
}
ul#menu li.sub {
padding: 0.2em 1em;
vertical-align: bottom;
}
div#filterContainer {
background-color: #303030;
border-color: #1C1C1C #1C1C1C #1C1C1C #1C1C1C;
border-radius: 4px;
border-style: solid;
border-width: 1px;
margin: 0 4px 4px;
}
div.filter {
margin: 2px 8px;
}
span.filterInput {
width: 256px;
display: inline-block;
}
span.filterLabel {
width: 64px;
display: inline-block;
}
div.name {
width: 100px;
}
div#outside {
background-color: transparent;
display: none;
height: 100%;
left: 0;
position: fixed;
top: 0;
width: 100%;
}
div#popups {
background-color: transparent;
display: none;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
div.popup div {
display: block;
position: relative;
}
.popup {
background-color: #353535;
border-color: #ECF3F7 #9DB2C4 #9DB2C4 #ECF3F7;
border-style: solid;
border-width: 0px;
display: none;
position: absolute;
}
.popup:hover {
cursor: pointer;
}
.popup ul {
display: block;
padding: 0;
margin: 0;
}
.popup ul li {
border: 0px solid #9DB2C4;
display: block;
font-weight: bold;
padding-left: 4px;
padding-right: 4px;
margin: 0;
}
div#popupAbout {
height: 300px;
padding: 8px;
position: fixed;
text-align: center;
width: 368px;
}
div#popupAdd {
position: fixed;
height: 196px;
width: 368px;
}
span#labelDir {
padding-left: 21px;
}
li#high, li#normal, li#low, li#none {
display: inline-block;
padding: 0;
}
.styled {
border: 0px solid #9DB2C4;
}
input.styled, textarea.styled {
background: inherit;
border-color: #9DB2C4 #9DB2C4 #9DB2C4 #9DB2C4;
}
input.styled.number {
text-align: right;
width: 6em;
}
input.styled[type=button] {
background-color: #4D4D4E;
border-color: #1C1C1C #1C1C1C #1C1C1C #1C1C1C;
border-radius: 0px;
border-style: none;
border-width: 0px;
color: #DADADA;
margin-right: 2px;
padding: 0.2em 1em;
font-weight: bold;
width: 6em;
}
input.styled[type=button].upload {
position: absolute;
right: 4px;
}
select.styled {
background: inherit;
height: 1.6em;
}
select.styled option {
border: 0px solid #9DB2C4;
}
textarea.styled {
border-width: 0;
color: inherit;
font-family: inherit;
font-size: inherit;
resize: none;
width: 100%;
}
span.led {
background-color: #6A6A6A;
border: 0px solid #FF0000;
border-radius: 8px;
color: #333333;
display: inline-block;
font-size: 1.1em;
font-weight: 900;
height: 12px;
margin: 2px;
overflow: hidden;
vertical-align: text-bottom;
width: 12px;
}
span.led:hover {
cursor: pointer;
}
span.led[readonly]:hover {
cursor: auto;
}
span.led.high {
color: #778C9E;
line-height: 12px;
text-align: center;
}
span.led.low {
color: #778C9E;
line-height: 10px;
padding-left: 3px;
text-align: left;
width: 9px;
}
span.led.none {
background-color: #2B2B2D;
}
span.upload {
display: inline-block;
width: 30px;
}
table {
background-color: #1C1C1C;
border: 0;
border-collapse: collapse;
border-radius: 4px;
table-layout: fixed;
width: 100%;
}
table thead tr th {
padding: 2px;
text-align: left;
white-space: nowrap;
}
table tbody tr td {
padding: 0 4px;
}
table#fileTable tbody tr td {
white-space: nowrap;
}
table#torrentTable tbody tr td {
white-space: nowrap;
}
tbody tr:nth-child( even ) {
background-color: #1C1C1C;
}
tbody tr:nth-child( odd ) {
background-color: #303030;
}
col.address {
width: 128px;
}
col.announce, col.clientName, col.name, col.value {
width: auto;
}
col.flagStr {
width: 64px;
}
col.key {
width: 256px;
}
col.doneDate, col.lastAnnounceTime, col.nextAnnounceTime, col.lastScrapeTime, col.nextScrapeTime {
width: 152px;
}
col.length, col.sizeWhenDone, col.uploadedEver {
width: 84px;
}
col.menu, col.priority {
width: 20px;
}
col.percentDone {
width: 66px;
}
col.port {
width: 56px;
}
col.progress, col.rateDownload, col.rateToClient, col.rateToPeer, col.rateUpload {
width: 72px;
}
col.queuePosition {
width: 56px;
}
col.status {
width: 120px;
}
td[readonly] {
color: #DADADA;
}
td.announce, td.name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
td.length, td.percentDone, td.port, td.progress, td.queuePosition, td.rateDownload, td.rateToClient, td.rateToPeer, td.rateUpload, td.sizeWhenDone, td.uploadedEver {
text-align: right;
}
table#detailsTable input {
border-width: 0;
width: 100%;
}
table#detailsTable input[type=button] {
border-width: 1px;
width: 6em;
}
table#sessionTable input {
border-width: 0;
width: 100%;
}
table#sessionTable input[type=button] {
border-width: 1px;
width: 6em;
}
table#shiftTable input {
border-width: 0;
width: 100%;
}
table#shiftTable input[type=button] {
border-width: 1px;
width: 6em;
}
table#shiftTable input[type=button]#tracker {
margin-left: 20px;
width: auto;
}
div#stats {
background-color: rgba( 33, 33, 34, 0.2 );
border-color: #758A9C #ECF3F7 #ECF3F7 #758A9C;
border-radius: 4px;
border-style: none;
border-width: 1px;
color: #DADADA;
float: right;
font-weight: bold;
font-size: 8pt;
padding: 0 4px;
margin-top: 4px;
margin-right: 9px;
width: 20em;
}
div#stats span {
display: inline-block;
font-weight: inherit;
font-size: inherit;
}
div#stats span.label {
width: 3.5em;
}
table#trackerTable tfoot tr td {
padding: 0 4px;
}
table#trackerTable textarea.styled {
background-color: #ECF3F7;
border: 0px solid #9DB2C4;
}
span.drop {
display: block;
}
td#d_errorString {
font-weight: bold;
}
If a custom rpc-url is specified in the daemon settings shift doesn't work any more. It might be as simple as using
rpcUrl: "../rpc",
in shift.js
Requested, as discussed here:
https://forum.transmissionbt.com/viewtopic.php?t=21198&sid=db7e625642a6585e22d4110387360bf7
A method to do batch substitution for download location paths, with arbitrary search and replace, such that, for example:
/Volumes/OldDrive/Books/a/b/c/file.epub
could be changed to point to, for example:
/Volumes/NewDrive/NewSubPath/Books/a/b/c/file.epub
/Users/user/Downloads/Torrents/Books/a/b/c/file.epub
… by searching and replacing the beginning of the path:
i.e. everything in:
/Volumes/OldDrive/Books/
is now here:
/Volumes/NewDrive/NewSubPath/Books/
... because getErrorData()
and updateTorrents()
call the other one indefinitly.
so I have tried the above and it's not working
some info:
any ideas what I could be doing wrong? Thanks
Hi!
First of all, i love your web interface, the tracker management features is very useful.
Can you add the current global ratio like original transmission interface in the main page?
Can you add the ratio of single file in the torrent info in the main page (ex. up, down, name, RATIO)?
Thank you and sorry for my bad English :)
Hello, First of all thanks for this webui for transmission.
I would like to see an active status like in the original transmission webui that show currently active torrent (uploading and downloading)
Hi!
I think that its better for this project to make support for other language.
Its not too hard to make, you must only create a "lang" folder and you create the first file like EN.cfg with the word and you have a list in the configuration setting wich you see all cfg in the folder "lang".
After some user like me create a DE.cfg or FR.cfg with the word in their language for obtain a Shift in French or Germain.
the EN.cfg conf file is like this
add = add
start_all = start all
stop_all = stop all
session = session
about = about
and the FR.cfg is like
add = ajouter
start_all = Tout lancer
stop_all = Tout stopper
session = configuration
about = A propos
After some user can send to you their language file and you add to your repository!
Please provide release zip to easy install and maintain docker container.
haugene/docker-transmission-openvpn#1835
The fileLink feature works great if you only use 1 downloadDir.
If you use multiple, it would be great if you could do something like:
{
"fileLink": "https://example.com/{torrent.downloadDir}",
}
In this setup files could be accessed with:
/storageA/torrent1/file.txt --> https://example.com/storageA/torrent1/file.txt
/storageA/torrent2/file.txt --> https://example.com/storageA/torrent2/file.txt
/storageB/torrent3/file.txt --> https://example.com/storageB/torrent3/file.txt
Is this something you would be willing to implement?
This change in the most-recent commit broke the display of names for any torrents labels:
Lines 1600 to 1608 in 2e72390
Specifically, the return = "";
on line 1605 results in blanking out the name column for any torrents that have one or more labels set, due to updateElement()
seeing that the ""
returned from this doesn't match the cell.innerHTML
, wherein it replaces the cell contents with ""
. Mixing imperative and functional behaviour in a single function has a tendency to lead to this kind of problem.
Without re-structuring the code, the simplest fix is to just replace line 1605 with return cell.innerHTML;
, but this is a bit cursed.
Torrents are starting when added despite start-added-torrents being set to false.
This setting is observed whilst using other interfaces or apps so I assume Shift is causing it to be ignored.
Links Files and folders in torrents can be downloaded or displayed directly from Shift, even if the files are not 100% complete. Go to Session/Shift to configure a base URL to be used as a prefix for the content or folders, ftp://myname@myserver/mydownloads/ for example. To make the complete URLs work you still need to install and configure a web/ftp/... server such as Lighty to serve the file. Be warned that this is not for the novice user. For testing purposes you could use transmission-daemon itself to serve the linked file. You need file-system access and enough permissions for some clever file placement and/or symbolic linking to make that work, though. Hint: The files that make up the web interface for transmission-daemon are also stored somewhere on the server.
Could write something more about serving files by transmission-daemon.
The title says it all. It doesn't list any of the torrents currently active or inactive.
Hi,
I've come to the opinion that Shift is the best web UI for touch input but larger targets for certain elements would make it easier to use.
I'd most like to see larger toggle switches (or at least the area around them) for selecting torrents and changing settings as these are the smallest elements on the screen to hit.
I've also had a few issues with the 'add a torrent' window.
Whilst using an Android device it is impossible to paste a link in to the window because the keyboard pops up obscuring the window and hiding the 'Paste' context button.
This isn't an issue on an iOS device because the keyboard doesn't pop up whilst long pressing an input field.
Finally, this is just a UI fix but I've noticed that the backgroud of the 'add a torrent' window is misaligned whilst viewed on an Android or iOS device.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.