1
0
Fork 0
mirror of https://github.com/transmission/transmission synced 2024-12-24 00:34:04 +00:00
transmission/web/index.html
Jordan Lee d67fc13da4 (trunk web) the preferences dialog is now activated from a toolbar button.
This is in preparation for merging about 80% of the scss code between the default and mobile versions of Clutch. Previously the mobile client had the prefs button in the footer and the default client had it in the popup menu. Now both have it in the toolbar instead.
2011-10-26 23:19:38 +00:00

465 lines
23 KiB
HTML
Executable file

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8,IE=9"><!-- ticket #4555 -->
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<link href="./images/favicon.ico" rel="icon" />
<link href="./images/favicon.png" rel="shortcut icon" />
<link rel="apple-touch-icon" href="./images/webclip-icon.png"/>
<script type="text/javascript" src="./javascript/jquery/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="./javascript/jquery/jqueryui-1.8.16.min.js"></script>
<link rel="stylesheet" href="./style/jqueryui/jqueryui-1.8.16.css" type="text/css" media="all" />
<!--
<link media="screen" href="./style/transmission/mobile.css" type= "text/css" rel="stylesheet" />
-->
<link media="only screen and (max-device-width: 480px)" href="./style/transmission/mobile.css" type= "text/css" rel="stylesheet" />
<link media="screen and (min-device-width: 481px)" href="./style/transmission/common.css" type="text/css" rel="stylesheet" />
<!--[if IE 8]>
<link media="screen" href="./style/transmission/common.css" type="text/css" rel="stylesheet" />
<![endif]-->
<script type="text/javascript" src="./javascript/jquery/jquery.transmenu.min.js"></script>
<script type="text/javascript" src="./javascript/jquery/jquery.contextmenu.min.js"></script>
<script type="text/javascript" src="./javascript/jquery/jquery.form.min.js"></script>
<script type="text/javascript" src="./javascript/jquery/json2.min.js"></script>
<script type="text/javascript" src="./javascript/common.js"></script>
<script type="text/javascript" src="./javascript/inspector.js"></script>
<script type="text/javascript" src="./javascript/prefs-dialog.js"></script>
<script type="text/javascript" src="./javascript/remote.js"></script>
<script type="text/javascript" src="./javascript/transmission.js"></script>
<script type="text/javascript" src="./javascript/torrent.js"></script>
<script type="text/javascript" src="./javascript/torrent-row.js"></script>
<script type="text/javascript" src="./javascript/file-row.js"></script>
<script type="text/javascript" src="./javascript/dialog.js"></script>
<script type="text/javascript" src="./javascript/formatter.js"></script>
<title>Transmission Web Interface</title>
</head>
<body id="transmission_body">
<div id="toolbar">
<div id="toolbar-open" title="Open Torrent"></div>
<div id="toolbar-remove" title="Remove Selected Torrents"></div>
<div id="toolbar-start" title="Start Selected Torrents"></div>
<div id="toolbar-pause" title="Pause Selected Torrents"></div>
<div id="toolbar-select" title="Toggle Selection"></div>
<div id="toolbar-inspector" title="Toggle Inspector"></div>
<div id="toolbar-prefs" title="Edit Preferences..."></div>
</div>
<div id="statusbar">
<input type="search" id="torrent_search" placeholder="Filter" />
<div id='filter-button'></div>
<div id='speed-info'>
<div id='speed-dn-container'>
<div id='speed-dn-icon'></div>
<div id='speed-dn-label'></div>
</div>
<div id='speed-up-container'>
<div id='speed-up-icon'></div>
<div id='speed-up-label'></div>
</div>
</div>
</div>
<div id="filter-popup" style="display:none;">
<div id='filter-popup-workarea'>
<div id='filter-by-state'></div>
<div id='filter-by-tracker'></div>
</div>
</div>
<div id="prefs-dialog" style="display:none;">
<ul>
<li id="prefs-tab-general"><a href="#prefs-page-torrents">Torrents</a></li>
<li id="prefs-tab-speed"><a href="#prefs-page-speed">Speed</a></li>
<li id="prefs-tab-peers"><a href="#prefs-page-peers">Peers</a></li>
<li id="prefs-tab-network"><a href="#prefs-page-network">Network</a></li>
<li class="ui-tab-dialog-close"></li>
</ul>
<div>
<div id="prefs-page-torrents">
<div class="prefs-section">
<div class="title">Downloading</div>
<div class="row"><div class="key">Download to:</div><div class="value"><input type="text" id="download-dir"/></div></div>
<div class="checkbox-row"><input type="checkbox" id="start-added-torrents"/><label for="start-added-torrents">Start when added</label></div>
<div class="checkbox-row"><input type="checkbox" id="rename-partial-files"/><label for="rename-partial-files">Append &quot;.part&quot; to incomplete files' names</label></div>
</div>
<div class="prefs-section">
<div class="title">Seeding</div>
<div class="row"><div class="key"><input type="checkbox" id="seedRatioLimited"/><label for="seedRatioLimited">Stop seeding at ratio:</label></div>
<div class="value"><input type="text" class="numberinput" id="seedRatioLimit"/></div></div>
<div class="row"><div class="key"><input type="checkbox" id="idle-seeding-limit-enabled"/><label for="idle-seeding-limit-enabled">Stop seeding if idle for (min):</label></div>
<div class="value"><input type="text" class="numberinput" id="idle-seeding-limit"/></div></div>
</div>
</div>
<div id="prefs-page-speed">
<div class="prefs-section">
<div class="title">Speed Limits</div>
<div class="row"><div class="key"><input type="checkbox" id="speed-limit-up-enabled"/><label for="speed-limit-up-enabled">Upload (kB/s):</label></div>
<div class="value"><input type="text" class="numberinput" id="speed-limit-up"/></div></div>
<div class="row"><div class="key"><input type="checkbox" id="speed-limit-down-enabled"/><label for="speed-limit-down-enabled">Download (kB/s):</label></div>
<div class="value"><input type="text" class="numberinput" id="speed-limit-down"/></div></div>
</div>
<div class="prefs-section">
<div class="title"><div id="alternative-speed-limits-title">Alternative Speed Limits</div></div>
<div class="row" style="font-size: smaller; padding-bottom: 4px;">Override normal speed limits manually or at scheduled times</div>
<div class="row"><div class="key">Upload (kB/s):</div>
<div class="value"><input type="text" class="numberinput" id="alt-speed-up"/></div></div>
<div class="row"><div class="key">Download (kB/s):</div>
<div class="value"><input type="text" class="numberinput" id="alt-speed-down"/></div></div>
<div class="checkbox-row"><input type="checkbox" id="alt-speed-time-enabled"/><label for="alt-speed-time-enabled">Scheduled Times</label></div>
<div class="row"><div class="key">From:</div>
<div class="value"><select id="alt-speed-time-begin"></select></div></div>
<div class="row"><div class="key">To:</div>
<div class="value"><select id="alt-speed-time-end"></select></div></div>
<div class="row"><div class="key"><label for="alt-speed-time-day">On days:</label></div>
<div class="value"><select id="alt-speed-time-day">
<option value="127">Everyday</option>
<option value="62">Weekdays</option>
<option value="65">Weekends</option>
<option value="1">Sunday</option>
<option value="2">Monday</option>
<option value="4">Tuesday</option>
<option value="8">Wednesday</option>
<option value="16">Thursday</option>
<option value="32">Friday</option>
<option value="64">Saturday</option></select></div></div>
</div>
</div>
<div id="prefs-page-peers">
<div class="prefs-section">
<div class="title">Connections</div>
<div class="row"><div class="key"><label for="peer-limit-per-torrent">Max peers per torrent:</label></div>
<div class="value"><input type="text" class="numberinput" id="peer-limit-per-torrent"/></div></div>
<div class="row"><div class="key"><label for="peer-limit-global">Max peers overall:</label></div>
<div class="value"><input type="text" class="numberinput" id="peer-limit-global"/></div></div>
</div>
<div class="prefs-section">
<div class="title">Options</div>
<div class="row"><div class="key">Encryption mode:</div>
<div class="value"><select id="encryption">
<option value="tolerated">Allow encryption</option>
<option value="preferred">Prefer encryption</option>
<option value="required">Require encryption</option></select></div></div>
<div class="checkbox-row"><input type="checkbox" id="pex-enabled" title="PEX is a tool for exchanging peer lists with the peers you're connected to."/>
<label for="pex-enabled" title="PEX is a tool for exchanging peer lists with the peers you're connected to.">Use PEX to find more peers</label></div>
<div class="checkbox-row"><input type="checkbox" id="dht-enabled" title="DHT is a tool for finding peers without a tracker."/>
<label for="dht-enabled" title="DHT is a tool for finding peers without a tracker.">Use DHT to find more peers</label></div>
<div class="checkbox-row"><input type="checkbox" id="lpd-enabled" title="LPD is a tool for finding peers on your local network."/>
<label for="lpd-enabled" title="LPD is a tool for finding peers on your local network.">Use LPD to find more peers</label></div>
</div>
<div class="prefs-section">
<div class="title">Blocklist</div>
<div class="row"><div class="key"><input type="checkbox" id="blocklist-enabled"/><label for="blocklist-enabled">Enable blocklist:</label></div>
<div class="value"><input type="url" id="blocklist-url"/></div></div>
<div class="row"><div class="key" style="margin-top: 3px; font-size: smaller;">Blocklist has <span id="blocklist-size">?</span> rules</div>
<div class="value"><input type="button" id="blocklist-update-button" value="Update"/></div></div>
</div>
</div>
<div id="prefs-page-network">
<div class="prefs-section">
<div class="title">Listening Port</div>
<div class="row"><div class="key"><label for="peer-port">Peer listening port:</label></div>
<div class="value"><input type="text" class="numberinput" id="peer-port"/></div></div>
<div class="row"><div class="key">&nbsp;</div>
<div class="value"><span id="port-label">Status: Unknown</span></div></div>
<div class="checkbox-row"><input type="checkbox" id="peer-port-random-on-start"/><label for="peer-port-random-on-start">Randomize port on launch</label></div>
<div class="checkbox-row"><input type="checkbox" id="port-forwarding-enabled"/><label for="port-forwarding-enabled">Use port forwarding from my router</label></div>
</div>
<div class="prefs-section">
<div class="title">Options</div>
<div class="checkbox-row"><input type="checkbox" id="utp-enabled" title="uTP is a tool for reducing network congestion."/>
<label for="utp-enabled" title="uTP is a tool for reducing network congestion.">Enable uTP for peer communication</label></div>
</div>
</div>
</div>
</div>
<div id="torrent_inspector" style="display:none;">
<div id="inspector-tabs-wrapper">
<div id="inspector-tabs">
<div class="inspector-tab selected" id="inspector-tab-info" title="Info"><a href="#info"></a></div><div class="inspector-tab" id="inspector-tab-activity" title="Activity"><a href="#activity"></a></div><div class="inspector-tab" id="inspector-tab-peers" title="Peers"><a href="#peers"></a></div><div class="inspector-tab" id="inspector-tab-trackers" title="Trackers"><a href="#trackers"></a></div><div class="inspector-tab" id="inspector-tab-files" title="Files"><a href="#files"></a></div>
</div><!-- inspector-tabs -->
</div><!-- inspector-tabs-wrapper -->
<div id="inspector_header">
<div id="torrent_inspector_name"></div>
<span id="torrent_inspector_size"></span>
</div>
<div class="inspector-page" id="inspector-page-info">
<div class="inspector_group">
<div class="inspector_group_label">Information</div>
<div class="inspector_row">
<div class="inspector_label">Pieces:</div>
<div id="torrent_inspector_pieces"></div>
</div>
<div class="inspector_row">
<div class="inspector_label">Hash:</div>
<div id="torrent_inspector_hash"></div>
</div>
<div class="inspector_row">
<div class="inspector_label">Secure:</div>
<div id="torrent_inspector_secure"></div>
</div>
<div class="inspector_row">
<div class="inspector_label">Comment:</div>
<div id="torrent_inspector_comment"></div>
</div>
</div><!-- class="inspector_group"-->
<div class="inspector_group">
<div class="inspector_group_label">Created By</div>
<div class="inspector_row">
<div class="inspector_label">Creator:</div>
<div id="torrent_inspector_creator">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Date:</div>
<div id="torrent_inspector_creator_date">N/A</div>
</div>
</div><!-- class="inspector_group"-->
<div class="inspector_group">
<div class="inspector_group_label">Where</div>
<div class="inspector_row">
<div class="inspector_label">Download Dir:</div>
<div id="torrent_inspector_download_dir">N/A</div>
</div>
</div><!-- class="inspector_group"-->
</div><!-- id="inspector_tab_info_container" -->
<div style="display:none;" class="inspector-page" id="inspector-page-activity">
<div class="inspector_group">
<div class="inspector_group_label">Activity</div>
<div class="inspector_row">
<div class="inspector_label">State:</div>
<div id="torrent_inspector_state">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Progress:</div>
<div id="torrent_inspector_progress">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Have:</div>
<div id="torrent_inspector_have">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Availability:</div>
<div id="torrent_inspector_availability">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Downloaded:</div>
<div id="torrent_inspector_downloaded">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Uploaded:</div>
<div id="torrent_inspector_uploaded">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Ratio:</div>
<div id="torrent_inspector_ratio">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">Error:</div>
<div id="torrent_inspector_error">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">DL Speed:</div>
<div id="torrent_inspector_download_speed">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">UL Speed:</div>
<div id="torrent_inspector_upload_speed">N/A</div>
</div>
</div><!-- class="inspector_group"-->
<div class="inspector_group">
<div class="inspector_group_label">Peers</div>
<div class="inspector_row">
<div class="inspector_label">UL To:</div>
<div id="torrent_inspector_upload_to">N/A</div>
</div>
<div class="inspector_row">
<div class="inspector_label">DL From:</div>
<div id="torrent_inspector_download_from">N/A</div>
</div>
</div><!-- class="inspector_group"-->
</div><!-- id="inspector_tab_activity_container" -->
<div style="display:none;" class="inspector-page" id="inspector-page-peers">
<div id="inspector_peers_list">
</div>
</div><!-- id="inspector_tab_peers_container" -->
<div style="display:none;" class="inspector-page" id="inspector-page-trackers">
<div id="inspector_trackers_list">
</div>
</div><!-- id="inspector_tab_trackers_container" -->
<div style="display:none;" class="inspector-page" id="inspector-page-files">
<ul id="inspector_file_list">
</ul>
</div><!-- id="inspector_tab_files_container" -->
</div>
<div id="torrent_container">
<ul class="torrent_list" id="torrent_list"></ul>
</div>
<div class="dialog_container" id="dialog_container" style="display:none;">
<div class="dialog_top_bar"></div>
<div class="dialog_window">
<div class="dialog_logo" id="dialog_logo"></div>
<h2 class="dialog_heading" id="dialog_heading"></h2>
<div class="dialog_message" id="dialog_message"></div>
<a href="#confirm" id="dialog_confirm_button">Confirm</a>
<a href="#cancel" id="dialog_cancel_button">Cancel</a>
</div>
</div>
<div id="about-dialog" style="display:none;">
<p id="about-logo"></p>
<p id="about-title">Transmission X</p>
<p id="about-blurb">A fast and easy BitTorrent client</p>
<p id="about-copyright">Copyright (c) The Transmission Project</p>
</div>
<div id="stats-dialog" style="display:none;">
<div class="prefs-section">
<div class="title">Current Session</div>
<div class="row"><div class="key">Uploaded:</div><div class="value" id='stats-session-uploaded'>&nbsp;</div></div>
<div class="row"><div class="key">Downloaded:</div><div class="value" id='stats-session-downloaded'>&nbsp;</div></div>
<div class="row"><div class="key">Ratio:</div><div class="value" id='stats-session-ratio'>&nbsp;</div></div>
<div class="row"><div class="key">Running Time:</div><div class="value" id='stats-session-duration'>&nbsp;</div></div>
</div>
<div class="prefs-section">
<div class="title">Total</div>
<div class="row"><div class="key">Started:</div><div class="value" id='stats-total-count'>&nbsp;</div></div>
<div class="row"><div class="key">Uploaded:</div><div class="value" id='stats-total-uploaded'>&nbsp;</div></div>
<div class="row"><div class="key">Downloaded:</div><div class="value" id='stats-total-downloaded'>&nbsp;</div></div>
<div class="row"><div class="key">Ratio:</div><div class="value" id='stats-total-ratio'>&nbsp;</div></div>
<div class="row"><div class="key">Running Time:</div><div class="value" id='stats-total-duration'>&nbsp;</div></div>
</div>
</div>
<div class="dialog_container" id="upload_container" style="display:none;">
<div class="dialog_top_bar"></div>
<div class="dialog_window">
<div class="dialog_logo" id="upload_dialog_logo"></div>
<h2 class="dialog_heading">Upload Torrent Files</h2>
<form action="#" method="post" id="torrent_upload_form"
enctype="multipart/form-data" target="torrent_upload_frame">
<div class="dialog_message">
<label for="torrent_upload_file">Please select a torrent file to upload:</label>
<input type="file" name="torrent_files[]" id="torrent_upload_file" multiple="multiple" />
<label for="torrent_upload_url">Or enter a URL:</label>
<input type="url" id="torrent_upload_url"/>
<input type="checkbox" id="torrent_auto_start" />
<label for="torrent_auto_start" id="auto_start_label">Start when added</label>
</div>
<a href="#upload" id="upload_confirm_button">Upload</a>
<a href="#cancel" id="upload_cancel_button">Cancel</a>
</form>
</div>
</div>
<div class="torrent_footer">
<ul id="settings_menu" title="Settings Menu">
<li id="button">&nbsp;
<ul id="footer_super_menu">
<li id="about-button">About</li>
<li class="separator"></li>
<li id="homepage">Transmission Homepage</li>
<li id="tipjar">Transmission Tip Jar</li>
<li class="separator"></li>
<li id="statistics">Statistics</li>
<li class="separator"></li>
<li>Total Download Rate
<ul id="footer_download_rate_menu">
<li id="unlimited_download_rate">Unlimited</li>
<li id="limited_download_rate">Limit (10 kB/s)</li>
<li class="separator"></li>
<li class='download-speed'>5 kB/s</li>
<li class='download-speed'>10 kB/s</li>
<li class='download-speed'>20 kB/s</li>
<li class='download-speed'>30 kB/s</li>
<li class='download-speed'>40 kB/s</li>
<li class='download-speed'>50 kB/s</li>
<li class='download-speed'>75 kB/s</li>
<li class='download-speed'>100 kB/s</li>
<li class='download-speed'>150 kB/s</li>
<li class='download-speed'>200 kB/s</li>
<li class='download-speed'>250 kB/s</li>
<li class='download-speed'>500 kB/s</li>
<li class='download-speed'>750 kB/s</li>
</ul>
</li>
<li>Total Upload Rate
<ul id="footer_upload_rate_menu">
<li id="unlimited_upload_rate">Unlimited</li>
<li id="limited_upload_rate">Limit (10 kB/s)</li>
<li class="separator"></li>
<li class='upload-speed'>5 kB/s</li>
<li class='upload-speed'>10 kB/s</li>
<li class='upload-speed'>20 kB/s</li>
<li class='upload-speed'>30 kB/s</li>
<li class='upload-speed'>40 kB/s</li>
<li class='upload-speed'>50 kB/s</li>
<li class='upload-speed'>75 kB/s</li>
<li class='upload-speed'>100 kB/s</li>
<li class='upload-speed'>150 kB/s</li>
<li class='upload-speed'>200 kB/s</li>
<li class='upload-speed'>250 kB/s</li>
<li class='upload-speed'>500 kB/s</li>
<li class='upload-speed'>750 kB/s</li>
</ul>
</li>
<li class="separator"></li>
<li>Sort Transfers By
<ul id="footer_sort_menu">
<li class='sort-mode' id="sort_by_activity">Activity</li>
<li class='sort-mode' id="sort_by_age">Age</li>
<li class='sort-mode' id="sort_by_name">Name</li>
<li class='sort-mode' id="sort_by_percent_completed">Progress</li>
<li class='sort-mode' id="sort_by_ratio">Ratio</li>
<li class='sort-mode' id="sort_by_queue_order">Queue Order</li>
<li class='sort-mode' id="sort_by_state">State</li>
<li class="separator"></li>
<li id="reverse_sort_order">Reverse Sort Order</li>
</ul>
</li>
</ul>
</li>
</ul>
<div id="turtle-button" title="Alternative Speed Limits">&nbsp;</div>
<div id="compact-button" title="Compact View">&nbsp;</div>
</div>
<div class="contextMenu" id="torrent_context_menu">
<ul>
<li id="context_pause_selected" class="disabled context_pause_selected">Pause</li>
<li id="context_resume_selected" class="disabled context_resume_selected">Resume</li>
<li id="context_resume_now_selected" class="disabled context_resume_selected">Resume Now</li>
<li class="separator"></li>
<li id="context_move_top">Move to Top</li>
<li id="context_move_up">Move Up</li>
<li id="context_move_down">Move Down</li>
<li id="context_move_bottom">Move to Bottom</li>
<li class="separator"></li>
<li id="context_remove">Remove From List...</li>
<li id="context_removedata">Trash Data & Remove From List...</li>
<li class="separator"></li>
<li id="context_verify">Verify Local Data</li>
<li class="separator"></li>
<li id="context_reannounce">Ask tracker for more peers</li>
</ul>
</div>
<iframe name="torrent_upload_frame" id="torrent_upload_frame" src="about:blank" ></iframe>
</body>
</html>