index.original.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
  1. <!doctype html>
  2. <html lang="en" xml:lang="en">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=8,IE=9,IE=10" />
  6. <!-- ticket #4555 -->
  7. <meta
  8. name="viewport"
  9. content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
  10. />
  11. <meta name="apple-mobile-web-app-capable" content="yes" />
  12. <link href="./transmission-app.css" rel="stylesheet" />
  13. <link href="./images/favicon.ico" rel="icon" />
  14. <link href="./images/favicon.png" rel="shortcut icon" />
  15. <link rel="apple-touch-icon" href="./images/webclip-icon.png" />
  16. <script type="text/javascript" src="./transmission-app.js"></script>
  17. <title>Transmission Web Interface</title>
  18. </head>
  19. <body>
  20. <div id="app"></div>
  21. <div id="mainwin">
  22. <header class="mainwin-toolbar" id="mainwin-toolbar">
  23. <button
  24. aria-keyshortcuts="Alt+O"
  25. aria-label="Open torrent"
  26. class="toolbar-button"
  27. data-action="open-torrent"
  28. id="toolbar-open"
  29. tabindex="0"
  30. >
  31. <svg
  32. xmlns="http://www.w3.org/2000/svg"
  33. width="32"
  34. height="32"
  35. viewBox="0 0 24 24"
  36. fill="none"
  37. stroke="currentColor"
  38. stroke-width="2"
  39. stroke-linecap="round"
  40. stroke-linejoin="round"
  41. class="feather feather-folder-plus toolbar-icon"
  42. >
  43. <path
  44. d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"
  45. ></path>
  46. <line x1="12" y1="11" x2="12" y2="17"></line>
  47. <line x1="9" y1="14" x2="15" y2="14"></line>
  48. </svg>
  49. </button>
  50. <button
  51. aria-keyshortcuts="Alt+Delete"
  52. aria-label="Remove selected torrents"
  53. class="toolbar-button"
  54. data-action="remove-selected-torrents"
  55. id="toolbar-remove"
  56. tabindex="0"
  57. >
  58. <svg
  59. xmlns="http://www.w3.org/2000/svg"
  60. width="32"
  61. height="32"
  62. viewBox="0 0 24 24"
  63. fill="none"
  64. stroke="currentColor"
  65. stroke-width="2"
  66. stroke-linecap="round"
  67. stroke-linejoin="round"
  68. class="feather feather-trash-2 toolbar-icon"
  69. >
  70. <polyline points="3 6 5 6 21 6"></polyline>
  71. <path
  72. d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
  73. ></path>
  74. <line x1="10" y1="11" x2="10" y2="17"></line>
  75. <line x1="14" y1="11" x2="14" y2="17"></line>
  76. </svg>
  77. </button>
  78. <div class="toolbar-separator"></div>
  79. <button
  80. aria-keyshortcuts="Alt+R"
  81. aria-label="Resume selected torrents"
  82. class="toolbar-button"
  83. data-action="resume-selected-torrents"
  84. id="toolbar-start"
  85. tabindex="0"
  86. >
  87. <svg
  88. xmlns="http://www.w3.org/2000/svg"
  89. width="32"
  90. height="32"
  91. viewBox="0 0 24 24"
  92. fill="none"
  93. stroke="currentColor"
  94. stroke-width="2"
  95. stroke-linecap="round"
  96. stroke-linejoin="round"
  97. class="feather feather-play"
  98. >
  99. <polygon points="5 3 19 12 5 21 5 3"></polygon>
  100. </svg>
  101. </button>
  102. <button
  103. aria-keyshortcuts="Alt+P"
  104. aria-label="Pause selected torrents"
  105. class="toolbar-button"
  106. data-action="pause-selected-torrents"
  107. id="toolbar-pause"
  108. tabindex="0"
  109. >
  110. <svg
  111. xmlns="http://www.w3.org/2000/svg"
  112. width="32"
  113. height="32"
  114. viewBox="0 0 24 24"
  115. fill="none"
  116. stroke="currentColor"
  117. stroke-width="2"
  118. stroke-linecap="round"
  119. stroke-linejoin="round"
  120. class="feather feather-pause"
  121. >
  122. <rect x="6" y="4" width="4" height="16"></rect>
  123. <rect x="14" y="4" width="4" height="16"></rect>
  124. </svg>
  125. </button>
  126. <div class="toolbar-separator"></div>
  127. <button
  128. aria-keyshortcuts="Alt+I"
  129. aria-label="Toggle inspector"
  130. class="toolbar-button"
  131. data-action="show-inspector"
  132. id="toolbar-inspector"
  133. tabindex="0"
  134. >
  135. <svg
  136. version="1.1"
  137. xmlns="http://www.w3.org/2000/svg"
  138. xmlns:xl="http://www.w3.org/1999/xlink"
  139. xmlns:dc="http://purl.org/dc/elements/1.1/"
  140. viewBox="-1 -1 26 26"
  141. fill-opacity="1"
  142. stroke="currentColor"
  143. fill="none"
  144. width="26"
  145. height="26"
  146. >
  147. <g>
  148. <circle
  149. cx="12"
  150. cy="12"
  151. r="12.0000191748228"
  152. stroke-linecap="round"
  153. stroke-linejoin="round"
  154. stroke-width="2"
  155. />
  156. <path
  157. class="inspector-icon"
  158. d="M 11.88208 4.883789 C 12.326418 4.883789 12.702391 5.039305 13.01001 5.350342 C 13.317628 5.6613785 13.471436 6.035642 13.471436 6.4731445 C 13.471436 6.910647 13.31592 7.283202 13.004883 7.59082 C 12.693846 7.898439 12.319582 8.052246 11.88208 8.052246 C 11.444578 8.052246 11.072023 7.898439 10.764404 7.59082 C 10.456786 7.283202 10.302979 6.910647 10.302979 6.4731445 C 10.302979 6.035642 10.456786 5.6613785 10.764404 5.350342 C 11.072023 5.039305 11.444578 4.883789 11.88208 4.883789 Z M 13.317627 9.528809 L 13.317627 17.126953 C 13.317627 17.803714 13.39624 18.236083 13.553467 18.424072 C 13.710694 18.612061 14.018308 18.719726 14.476318 18.74707 L 14.476318 19.11621 L 9.298096 19.11621 L 9.298096 18.74707 C 9.721926 18.733398 10.036376 18.610353 10.241455 18.37793 C 10.378175 18.220702 10.446533 17.803714 10.446533 17.126953 L 10.446533 11.52832 C 10.446533 10.851559 10.367921 10.41919 10.210693 10.231201 C 10.053466 10.043212 9.74927 9.935547 9.298096 9.908203 L 9.298096 9.528809 Z"
  159. fill="currentColor"
  160. />
  161. </g>
  162. </svg>
  163. </button>
  164. <div class="toolbar-separator"></div>
  165. <!-- 切换到移动版 -->
  166. <a id="toolbar_mobile" href="javascript:location.href = 'index.mobile.html';" class="easyui-linkbutton"
  167. data-options="iconCls:'icon-mobile',plain:true" system-tip-lang="toolbar.tip['ui-mobile']"><span
  168. system-lang="toolbar['ui-mobile']"></span><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 48 48"><g fill="none" stroke-width="4"><path fill="#2F88FF" stroke="#000" stroke-linejoin="round" d="M8 30H40V42C40 43.1046 39.1046 44 38 44H10C8.89543 44 8 43.1046 8 42V30Z"/><path stroke="#000" stroke-linejoin="round" d="M40 30V6C40 4.89543 39.1046 4 38 4H10C8.89543 4 8 4.89543 8 6V30"/><path stroke="#fff" stroke-linecap="round" d="M22 37H26"/></g></svg>移动UI</a>
  169. <div class="toolbar-separator"></div>
  170. <!-- 切换到原版 -->
  171. <a id="" href="javascript:location.href = 'index.html';" class="easyui-linkbutton"
  172. data-options="iconCls:'icon-transmission',plain:true" system-tip-lang="toolbar.tip['ui-original']"><span
  173. system-lang="toolbar['ui-original']"></span><svg xmlns="http://www.w3.org/2000/svg" width="1.13em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M64 0C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h176l-10.7 32H160c-17.7 0-32 14.3-32 32s14.3 32 32 32h256c17.7 0 32-14.3 32-32s-14.3-32-32-32h-69.3L336 416h176c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64zm448 64v224H64V64z"/></svg>桌面UI</a>
  174. <div class="toolbar-separator"></div>
  175. <button
  176. aria-keyshortcuts="Alt+M"
  177. aria-label="Show sidebar menu"
  178. class="toolbar-button"
  179. data-action="show-overflow-menu"
  180. id="toolbar-overflow"
  181. tabindex="0"
  182. >
  183. <svg
  184. xmlns="http://www.w3.org/2000/svg"
  185. width="32"
  186. height="32"
  187. viewBox="0 0 24 24"
  188. fill="none"
  189. stroke="currentColor"
  190. stroke-width="2"
  191. stroke-linecap="round"
  192. stroke-linejoin="round"
  193. class="feather feather-menu"
  194. >
  195. <line x1="3" y1="12" x2="21" y2="12"></line>
  196. <line x1="3" y1="6" x2="21" y2="6"></line>
  197. <line x1="3" y1="18" x2="21" y2="18"></line>
  198. </svg>
  199. </button>
  200. </header>
  201. <header id="mainwin-statusbar">
  202. <span>Show</span>
  203. <select id="filter-mode">
  204. <option value="all">All</option>
  205. <option value="active">Active</option>
  206. <option value="downloading">Downloading</option>
  207. <option value="seeding">Seeding</option>
  208. <option value="paused">Paused</option>
  209. <option value="finished">Finished</option>
  210. </select>
  211. <select id="filter-tracker"></select>
  212. <input type="search" id="torrent-search" placeholder="Filter" />
  213. <span id="filter-count">&nbsp;</span>
  214. <span class="flexible-space"></span>
  215. <div class="speed-container">
  216. <div id="speed-dn-label"></div>
  217. <div id="speed-dn-icon">
  218. <svg
  219. xmlns="http://www.w3.org/2000/svg"
  220. width="32"
  221. height="32"
  222. viewBox="0 0 24 24"
  223. fill="none"
  224. stroke="currentColor"
  225. stroke-width="2"
  226. stroke-linecap="round"
  227. stroke-linejoin="round"
  228. class="feather feather-chevron-down"
  229. >
  230. <polyline points="6 9 12 15 18 9"></polyline>
  231. </svg>
  232. </div>
  233. </div>
  234. <div class="speed-container">
  235. <span class="flexible-space"></span>
  236. <div id="speed-up-label"></div>
  237. <div id="speed-up-icon">
  238. <svg
  239. xmlns="http://www.w3.org/2000/svg"
  240. width="32"
  241. height="32"
  242. viewBox="0 0 24 24"
  243. fill="none"
  244. stroke="currentColor"
  245. stroke-width="2"
  246. stroke-linecap="round"
  247. stroke-linejoin="round"
  248. class="feather feather-chevron-up"
  249. >
  250. <polyline points="18 15 12 9 6 15"></polyline>
  251. </svg>
  252. </div>
  253. </div>
  254. </header>
  255. <main id="mainwin-workarea">
  256. <div id="torrent-container">
  257. <ul class="flex" id="torrent-list"></ul>
  258. </div>
  259. </main>
  260. <div class="upload-div">
  261. <h2>Drag your torrent files here to add them to Transmission.</h2>
  262. </div>
  263. </div>
  264. </body>
  265. </html>