From: Jordan Lee <jordan@transmissionbt.com>
Date: Wed, 14 Sep 2011 05:10:51 +0000 (+0000)
Subject: (trunk web) refactor the preferences dialog into its own class. Make the prefs dialog... 
X-Git-Tag: 2.40b1~40
X-Git-Url: https://granicus.if.org/sourcecode?a=commitdiff_plain;h=6b8a224059abb81120c3c581a79e2bc53584f5a1;p=transmission

(trunk web) refactor the preferences dialog into its own class. Make the prefs dialog invokable on iPhones/Androids (#1131) and add stop ratio functionality (#2006).
---

diff --git a/web/images/graphics/Makefile.am b/web/images/graphics/Makefile.am
index 541032669..9165c0726 100644
--- a/web/images/graphics/Makefile.am
+++ b/web/images/graphics/Makefile.am
@@ -1,6 +1,7 @@
 datadir = ${datarootdir}/${PACKAGE_NAME}/${subdir}
 
 dist_data_DATA = \
+  blue-turtle.png \
   chrome.png \
   filter_bar.png \
   filter_icon.png \
diff --git a/web/images/graphics/blue-turtle.png b/web/images/graphics/blue-turtle.png
new file mode 100644
index 000000000..dd9e7e59b
Binary files /dev/null and b/web/images/graphics/blue-turtle.png differ
diff --git a/web/images/graphics/chrome.png b/web/images/graphics/chrome.png
index 3dac5b0ec..d5aa04e0b 100644
Binary files a/web/images/graphics/chrome.png and b/web/images/graphics/chrome.png differ
diff --git a/web/index.html b/web/index.html
index 30ca6e127..9414630ff 100755
--- a/web/index.html
+++ b/web/index.html
@@ -11,6 +11,7 @@
 		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
 		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
 		<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" /> 
+
 <!--
 		<link media="screen" href="./stylesheets/mobile.css" type= "text/css" rel="stylesheet" />
 -->
@@ -23,11 +24,11 @@
 		<!--[if IE 7]><link media="screen" href="./stylesheets/ie7.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/menu.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>
@@ -69,6 +70,113 @@
 			</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-privacy"><a href="#prefs-page-privacy">Privacy</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 N minutes:</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"><img src="images/graphics/blue-turtle.png" width="16" height="9" style="padding-right: 10px;"/>Alternative Speed Limits</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-privacy">
+					<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="text" 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 class="prefs-section">
+						<div class="title">Privacy</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>
+				<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:</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">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="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 style="display:none;" class="inspector_close" id="inspector_close"><img id="inspector_close_image" src="./images/buttons/cancel.png"/></div>
@@ -223,180 +331,6 @@
 			</div>
 		</div>
 
-		<div class="dialog_container" id="prefs_container" style="display:none;">
-			<div class="dialog_top_bar"></div>
-			<div class="dialog_window">
-				<h2 class="dialog_heading">Preferences</h2>
-				<div id="pref_error"></div>
-				<form action="" id="prefs_form">
-					<div id="prefs_tabs">
-						<ul>
-							<li id="prefs-tab-general" class="prefs-tab selected">General</li>
-							<li id="prefs-tab-speed" class="prefs-tab">Speed</li>
-							<li id="prefs-tab-peers" class="prefs-tab">Peers</li>
-							<li id="prefs-tab-network" class="prefs-tab">Network</li>
-						</ul>
-						<div id="prefs-page-general" class="prefs-page">
-							<div class="preference download_location">
-								<label class="category">Add transfers:</label>
-								<div class="formdiv">
-									<label for="download_location" class="item">Download to:</label>
-									<input type="text" name="download_location" id="download_location"/>
-								</div>
-								<div class="formdiv checkbox auto_start">
-									<input type="checkbox" name="auto_start" id="auto_start"/>
-									<label for="auto_start" class="item">Start transfers when added</label>
-								</div>
-							</div>
-							<div class="preference encryption">
-								<label class="category">Encryption:</label>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="encryption" id="encryption"/>
-									<label for="encryption" class="item">Ignore unencrypted peers</label>
-								</div>
-							</div>
-							<div class="preference web_gui">
-								<label class="category">Web Client:</label>
-								<div class="formdiv">
-									<label for="refresh_rate" class="item">Refresh Rate:</label>
-									<input type="text" name="refresh_rate" id="refresh_rate" class="numberinput"/>
-									<label class="suffix">seconds</label>
-								</div>
-							</div>
-							<div style="clear: both; visibility: hidden;"></div>
-						</div>
-						<div id="prefs-page-speed" class="prefs-page" style="display: none;">
-							<div class="preference limit_total">
-								<label class="category">Speed Limits:</label>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="limit_download" id="limit_download"/>
-									<label for="limit_download" class="item">Download Rate:</label>
-									<input type="text" name="download_rate" id="download_rate" class="numberinput"/>
-									<label class="suffix">kB/s</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="limit_upload" id="limit_upload"/>
-									<label for="limit_upload" class="item">Upload Rate:</label>
-									<input type="text" name="upload_rate" id="upload_rate" class="numberinput"/>
-									<label class="suffix">kB/s</label>
-								</div>
-							</div>
-							<div class="preference limit_turtle">
-								<label class="category">Temporary Speed Limits: (Turtle)</label>
-								<label>Override normal speed limits manually or at scheduled times</label>
-								<div class="formdiv">
-									<label for="turtle_download_rate" class="item">Download Rate:</label>
-									<input type="text" name="turtle_download_rate" id="turtle_download_rate" class="numberinput"/>
-									<label class="suffix">kB/s</label>
-								</div>
-								<div class="formdiv">
-									<label for="turtle_upload_rate" class="item">Upload Rate:</label>
-									<input type="text" name="turtle_upload_rate" id="turtle_upload_rate" class="numberinput"/>
-									<label class="suffix">kB/s</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="turtle_schedule" id="turtle_schedule"/>
-									<label for="turtle_schedule" class="item">Scheduled times:</label>
-									<select name="turtle_start_time" id="turtle_start_time" size="1">
-									</select>
-									<select name="turtle_end_time" id="turtle_end_time" size="1">
-									</select>
-								</div>
-								<div class="formdiv">
-									<label for="turtle_days" class="item">On days:</label>
-									<select name="turtle_days" id="turtle_days" size="1">
-										<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 style="clear: both; visibility: hidden;"></div>
-						</div>
-						<div id="prefs-page-peers" class="prefs-page" style="display: none;">
-							<div class="preference peers_conn">
-								<label class="category">Connections:</label>
-								<div class="formdiv">
-									<label for="conn_global" class="item">Global maximum connections:</label>
-									<input type="text" name="conn_global" id="conn_global" class="numberinput"/>
-									<label class="suffix">peers</label>
-								</div>
-								<div class="formdiv">
-									<label for="conn_torrent" class="item">Maximum connections for new transfers:</label>
-									<input type="text" name="conn_torrent" id="conn_torrent" class="numberinput"/>
-									<label class="suffix">peers</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="conn_pex" id="conn_pex"/>
-									<label for="conn_pex" class="item">Use peer exchange (PEX) for public torrents</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="conn_dht" id="conn_dht"/>
-									<label for="conn_dht" class="item">Use distributed hash table (DHT) for public torrents</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="conn_lpd" id="conn_lpd"/>
-									<label for="conn_lpd" class="item">Use local peer discovery for public torrents</label>
-								</div>
-							</div>
-							<div class="preference block_conn">
-								<label class="category">Blocklist:</label>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="block_enable" id="block_enable"/>
-									<label for="block_enable" class="item">Prevent peers in blocklist from connecting</label>
-								</div>
-								<div class="formdiv block_url">
-									<label for="block_url" class="item">URL:</label>
-									<input type="text" name="block_url" id="block_url"/>
-								</div>
-								<div class="formdiv">
-									<input type="button" name="block_update_button" id="block_update_button" value="Update"/>
-									<label class="suffix" id="block_size">IP rules in the list</label>
-								</div>
-							</div>
-							<div style="clear: both; visibility: hidden;"></div>
-						</div>
-						<div id="prefs-page-network" class="prefs-page" style="display: none;">
-							<div class="preference utp">
-								<label class="category">Peer communication:</label>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="network_utp" id="network_utp"/>
-									<label for="network_utp" class="item">Enable Micro Transport Protocol (µTP)</label>
-								</div>
-							</div>
-							<div class="preference port">
-								<label class="category">Peer listening port:</label>
-								<div class="formdiv">
-									<label for="port" class="item">Incoming TCP Port:</label>
-									<input type="text" id="port" name="port" class="numberinput"/>
-									<label class="suffix" id="port_test"></label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="port_rand" id="port_rand"/>
-									<label for="port_rand" class="item">Randomize port on launch</label>
-								</div>
-								<div class="formdiv checkbox">
-									<input type="checkbox" name="port_forward" id="port_forward"/>
-									<label for="port_forward" class="item">Automatically map port</label>
-								</div>
-							</div>
-							<div style="clear: both; visibility: hidden;"></div>
-						</div>
-					</div>
-					<span id="transmission_version"></span>
-					<a href="#save" id="prefs_save_button">Save</a>
-					<a href="#cancel" id="prefs_cancel_button">Cancel</a>
-				</form>
-			</div>
-		</div>
-
 		<div class="dialog_container" id="stats_container" style="display:none;">
 			<div class="dialog_top_bar"></div>
 			<div class="dialog_window">
@@ -486,19 +420,19 @@
 								<li id="unlimited_download_rate">Unlimited</li>
 								<li id="limited_download_rate">Limit (10 kB/s)</li>
 								<li class="separator"></li>
-								<li>5 kB/s</li>
-								<li>10 kB/s</li>
-								<li>20 kB/s</li>
-								<li>30 kB/s</li>
-								<li>40 kB/s</li>
-								<li>50 kB/s</li>
-								<li>75 kB/s</li>
-								<li>100 kB/s</li>
-								<li>150 kB/s</li>
-								<li>200 kB/s</li>
-								<li>250 kB/s</li>
-								<li>500 kB/s</li>
-								<li>750 kB/s</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
@@ -506,31 +440,31 @@
 								<li id="unlimited_upload_rate">Unlimited</li>
 								<li id="limited_upload_rate">Limit (10 kB/s)</li>
 								<li class="separator"></li>
-								<li>5 kB/s</li>
-								<li>10 kB/s</li>
-								<li>20 kB/s</li>
-								<li>30 kB/s</li>
-								<li>40 kB/s</li>
-								<li>50 kB/s</li>
-								<li>75 kB/s</li>
-								<li>100 kB/s</li>
-								<li>150 kB/s</li>
-								<li>200 kB/s</li>
-								<li>250 kB/s</li>
-								<li>500 kB/s</li>
-								<li>750 kB/s</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 id="sort_by_activity">Activity</li>
-								<li id="sort_by_age">Age</li>
-								<li id="sort_by_name">Name</li>
-								<li id="sort_by_percent_completed">Progress</li>
-								<li id="sort_by_ratio">Ratio</li>
-								<li id="sort_by_queue_order">Queue Order</li>
-								<li id="sort_by_state">State</li>
+								<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>
@@ -538,6 +472,7 @@
 					</ul>
 				</li>
 			</ul>
+			<div id="prefs-button">&nbsp;</div>
 			<div id="turtle-button">&nbsp;</div>
 			<div id="compact-button">&nbsp;</div>
 		</div>
diff --git a/web/javascript/Makefile.am b/web/javascript/Makefile.am
index c7be4e894..f93ce22b3 100644
--- a/web/javascript/Makefile.am
+++ b/web/javascript/Makefile.am
@@ -6,7 +6,7 @@ dist_data_DATA = \
   file-row.js \
   formatter.js \
   inspector.js \
-  menu.js \
+  prefs-dialog.js \
   remote.js \
   torrent.js \
   torrent-row.js \
diff --git a/web/javascript/common.js b/web/javascript/common.js
index 8ba38d5c2..0a9c6eb91 100644
--- a/web/javascript/common.js
+++ b/web/javascript/common.js
@@ -1,9 +1,8 @@
-/*
- *	Copyright © Dave Perrett and Malcolm Jarvis
- *	This code is licensed under the GPL version 2.
- *	For more details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+/**
+ * Copyright © Dave Perrett and Malcolm Jarvis
  *
- * Common javascript
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 var transmission,
@@ -21,6 +20,19 @@ if (!Array.indexOf){
 	}
 }
 
+// http://forum.jquery.com/topic/combining-ui-dialog-and-tabs
+$.fn.tabbedDialog = function (dialog_opts) {
+	this.tabs({selected: 0});
+	this.dialog(dialog_opts);
+	this.find('.ui-tab-dialog-close').append(this.parent().find('.ui-dialog-titlebar-close'));
+	this.find('.ui-tab-dialog-close').css({'position':'absolute','right':'0', 'top':'16px'});
+	this.find('.ui-tab-dialog-close > a').css({'float':'none','padding':'0'});
+	var tabul = this.find('ul:first');
+	this.parent().addClass('ui-tabs').prepend(tabul).draggable('option','handle',tabul); 
+	this.siblings('.ui-dialog-titlebar').remove();
+	tabul.addClass('ui-dialog-titlebar');
+}
+
 $(document).ready(function() {
 	// Initialise the dialog controller
 	dialog = new Dialog();
@@ -58,15 +70,6 @@ $(document).ready(function() {
 	}
 });
 
-/*
- *   Return a copy of the array
- *
- *   @returns array
- */
-Array.prototype.clone = function () {
-	return this.concat();
-};
-
 /**
  * "innerHTML = html" is pretty slow in FF.  Happily a lot of our innerHTML
  * changes are triggered by periodic refreshes on torrents whose state hasn't
@@ -100,27 +103,19 @@ Math.ratio = function(numerator, denominator) {
 	return result;
 };
 
-/*
- *   Truncate a float to a specified number of decimal
- *   places, stripping trailing zeroes
- *
- *   @param float floatnum
- *   @param integer precision
- *   @returns float
- */
-Math.truncateWithPrecision = function(floatnum, precision) {
-	return Math.floor(floatnum * Math.pow (10, precision)) / Math.pow(10, precision);
-};
-
-/*
- *   Round a string of a number to a specified number of decimal
- *   places
+/**
+ * Round a string of a number to a specified number of decimal places
  */
 Number.prototype.toTruncFixed = function(place) {
-	var ret = Math.truncateWithPrecision(this, place);
+	var ret = Math.floor(this * Math.pow (10, place)) / Math.pow(10, place);
 	return ret.toFixed(place);
 }
 
+Number.prototype.toStringWithCommas = function() {
+    return this.toString().replace(/\B(?=(?:\d{3})+(?!\d))/g, ",");
+}
+
+
 /*
  * Trim whitespace from a string
  */
@@ -136,7 +131,6 @@ function Prefs() { }
 Prefs.prototype = { };
 
 Prefs._RefreshRate        = 'refresh_rate';
-Prefs._SessionRefreshRate = 'session_refresh_rate';
 
 Prefs._FilterMode         = 'filter';
 Prefs._FilterAll          = 'all';
@@ -159,7 +153,6 @@ Prefs._SortByProgress     = 'percent_completed';
 Prefs._SortByRatio        = 'ratio';
 Prefs._SortByState        = 'state';
 
-Prefs._TurtleState        = 'turtle-state';
 Prefs._CompactDisplayState= 'compact_display_state';
 
 Prefs._Defaults =
diff --git a/web/javascript/dialog.js b/web/javascript/dialog.js
index 05774d46e..026d54f20 100644
--- a/web/javascript/dialog.js
+++ b/web/javascript/dialog.js
@@ -1,9 +1,8 @@
-/*
- *	Copyright © Dave Perrett and Malcolm Jarvis
- *	This code is licensed under the GPL version 2.
- *	For more details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+/**
+ * Copyright © Dave Perrett and Malcolm Jarvis
  *
- * Class Dialog
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 function Dialog(){
diff --git a/web/javascript/file-row.js b/web/javascript/file-row.js
index 057e64f27..fd5469f5a 100644
--- a/web/javascript/file-row.js
+++ b/web/javascript/file-row.js
@@ -1,7 +1,8 @@
-/*
- *   Copyright © Jordan Lee
- *   This code is licensed under the GPL version 2.
- *   <http://www.gnu.org/licenses/old-licenses/gpl-2.0.html>
+/**
+ * Copyright © Mnemosyne LLC
+ *
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 function FileRow(torrent, i)
diff --git a/web/javascript/formatter.js b/web/javascript/formatter.js
index 10d2bf071..f33ad7d0b 100644
--- a/web/javascript/formatter.js
+++ b/web/javascript/formatter.js
@@ -1,9 +1,9 @@
 /**
-***  This file Copyright (C) Mnemosyne LLC
-***
-***  This code is licensed under the GPL version 2.
-***  For more details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
-**/
+ * Copyright © Mnemosyne LLC
+ *
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+ */
 
 Transmission.fmt = (function()
 {
diff --git a/web/javascript/inspector.js b/web/javascript/inspector.js
index 06d991e00..e95bbc44a 100644
--- a/web/javascript/inspector.js
+++ b/web/javascript/inspector.js
@@ -1,7 +1,8 @@
-/*
+/**
  * Copyright © Jordan Lee, Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
- * This code is licensed under the GPL version 2.
- * For details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+ *
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 function Inspector(controller) {
diff --git a/web/javascript/menu.js b/web/javascript/menu.js
deleted file mode 100644
index c156dd23b..000000000
--- a/web/javascript/menu.js
+++ /dev/null
@@ -1,45 +0,0 @@
-/*
- *	Copyright © Dave Perrett and Malcolm Jarvis
- *	This code is licensed under the GPL version 2.
- *	For more details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
- *
- * Menu Configuration Properties
- */
-
-Menu = {
-
-	context: {
-
-		menu_style: {
-			width: '310px',
-			backgroundColor: '#fff',
-			border: 'none',
-			padding: '5px 0',
-			textAlign: 'left'},
-
-		item_style: {
-			backgroundColor: 'transparent',
-			margin: '0',
-			padding: '0 10px 2px 20px',
-			color: '#000',
-			fontSize: '14px',
-			cursor: 'default',
-			border: 'none'},
-
-		item_hover_style: {
-			backgroundColor: '#24e',
-			color: '#fff',
-			border: 'none'},
-
-		item_disabled_style: {
-			backgroundColor: 'transparent',
-			margin: '0',
-			padding: '0 10px 2px 20px',
-			color: '#aaa',
-			fontSize: '1.5em',
-			cursor: 'default',
-			border: 'none'}
-	}
-
-
-}
diff --git a/web/javascript/prefs-dialog.js b/web/javascript/prefs-dialog.js
new file mode 100644
index 000000000..22fca0167
--- /dev/null
+++ b/web/javascript/prefs-dialog.js
@@ -0,0 +1,309 @@
+/**
+ * Copyright © Jordan Lee, Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
+ *
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+ */
+
+function PrefsDialog(remote) {
+
+    var data = {
+        dialog: null,
+        remote: null,
+        elements: { },
+
+        // all the RPC session keys that we have gui controls for
+        keys: [
+            'alt-speed-down',
+            'alt-speed-time-begin',
+            'alt-speed-time-day',
+            'alt-speed-time-enabled',
+            'alt-speed-time-end',
+            'alt-speed-up',
+            'blocklist-enabled',
+            'blocklist-size',
+            'blocklist-url',
+            'dht-enabled',
+            'download-dir',
+            'encryption',
+            'idle-seeding-limit',
+            'idle-seeding-limit-enabled',
+            'lpd-enabled',
+            'peer-limit-global',
+            'peer-limit-per-torrent',
+            'peer-port',
+            'peer-port-random-on-start',
+            'pex-enabled',
+            'port-forwarding-enabled',
+            'rename-partial-files',
+            'seedRatioLimit',
+            'seedRatioLimited',
+            'speed-limit-down',
+            'speed-limit-down-enabled',
+            'speed-limit-up',
+            'speed-limit-up-enabled',
+            'start-added-torrents',
+            'utp-enabled'
+        ],
+
+        // map of keys that are enabled only if a 'parent' key is enabled
+        groups: {
+            'alt-speed-time-enabled': ['alt-speed-time-begin',
+                                       'alt-speed-time-day',
+                                       'alt-speed-time-end' ],
+            'blocklist-enabled': ['blocklist-url',
+                                  'blocklist-update-button' ],
+            'idle-seeding-limit-enabled': [ 'idle-seeding-limit' ],
+            'seedRatioLimited': [ 'seedRatioLimit' ],
+            'speed-limit-down-enabled': [ 'speed-limit-down' ],
+            'speed-limit-up-enabled': [ 'speed-limit-up' ]
+        }
+    },
+
+    initTimeDropDown = function(e)
+    {
+        var i, hour, mins, value, content;
+
+        for (i=0; i<24*4; ++i) {
+            hour = parseInt(i/4, 10);
+            mins = ((i%4) * 15);
+            value = i * 15;
+            content = hour + ':' + (mins || '00');
+            e.options[i] = new Option(content, value);
+        }
+    },
+
+    onPortChecked = function(response)
+    {
+        var is_open = response['arguments']['port-is-open'],
+            text = 'Port is <b>' + (is_open ? 'Open' : 'Closed') + '</b>',
+            e = data.elements.root.find('#port-label');
+        setInnerHTML(e[0],text);
+    },
+
+    setGroupEnabled = function(parent_key, enabled)
+    {
+        var i, key, keys, root;
+
+        if (parent_key in data.groups)
+        {
+            root = data.elements.root,
+            keys = data.groups[parent_key];
+
+            for (i=0; key=keys[i]; ++i)
+                root.find('#'+key).attr('disabled',!enabled);
+        }
+    },
+
+    onBlocklistUpdateClicked = function ()
+    {
+        data.remote.updateBlocklist();
+        setBlocklistButtonEnabled(false);
+    },
+    setBlocklistButtonEnabled = function(b)
+    {
+        var e = data.elements.blocklist_button;
+        e.attr('disabled',!b);
+        e.val(b ? 'Update' : 'Updating...');
+    },
+
+    getValue = function(e)
+    {
+        var str;
+
+        switch (e[0].type)
+        {
+            case 'checkbox':
+            case 'radio':
+                return e.prop('checked');
+
+            case 'text':
+            case 'select-one':
+                str = e.val();
+                if( parseInt(str,10).toString() === str)
+                    return parseInt(str,10);
+                if( parseFloat(str).toString() === str)
+                    return parseFloat(str);
+                return str;
+
+            default:
+                return null;
+        }
+    },
+
+    /* this callback is for controls whose changes can be applied
+       immediately, like checkboxs, radioboxes, and selects */
+    onControlChanged = function(ev)
+    {
+        var o = {};
+        o[ev.target.id] = getValue($(ev.target));
+        data.remote.savePrefs(o);
+    },
+        
+    /* these two callbacks are for controls whose changes can't be applied
+       immediately -- like a text entry field -- because it takes many
+       change events for the user to get to the desired result */
+    onControlFocused  = function(ev)
+    {
+        data.oldValue = getValue($(ev.target));
+    },
+    onControlBlurred  = function(ev)
+    {
+        var newValue = getValue($(ev.target));
+        if (newValue !== data.oldValue)
+        {
+            var o = {};
+            o[ev.target.id] = newValue;
+            data.remote.savePrefs(o);
+            delete data.oldValue;
+        }
+    },
+
+    getDefaultMobileOptions = function()
+    {
+        return {
+            width: $(window).width(),
+            height: $(window).height(),
+            position: [ 'left', 'top' ],
+            resizable: false,
+            draggable: false
+        };
+    },
+
+    initialize = function (remote)
+    {
+        var i, key, e, o;
+
+        data.remote = remote;
+
+        e = $('#prefs-dialog');
+        data.elements.root = e;
+
+        initTimeDropDown(e.find('#alt-speed-time-begin')[0]);
+        initTimeDropDown(e.find('#alt-speed-time-end')[0]);
+
+        o = isMobileDevice
+          ? getDefaultMobileOptions()
+          : { width: 350, height: 400 };
+        o.autoOpen = false;
+        o.show = 'fade';
+        o.hide = 'fade';
+        o.close = onDialogClosed;
+        e.tabbedDialog(o);
+
+        e = e.find('#blocklist-update-button');
+        data.elements.blocklist_button = e;
+        e.click(onBlocklistUpdateClicked);
+
+        // listen for user input
+        for (i=0; key=data.keys[i]; ++i)
+        {
+            e = data.elements.root.find('#'+key);
+            switch (e[0].type)
+            {
+                case 'checkbox':
+                case 'radio':
+                case 'select-one':
+                    e.change(onControlChanged);
+                    break;
+
+                case 'text':
+                    e.focus(onControlFocused);
+                    e.blur(onControlBlurred);
+
+                default:
+                    break;
+            }
+        }
+
+        // handle orientation changes...
+        var supportsOrientationChange = 'onorientationchange' in window,
+            orientationEvent = supportsOrientationChange ? 'orientationchange' : 'resize';
+        $('body').bind(orientationEvent, function() {
+            data.elements.root.dialog('option',getDefaultMobileOptions());
+        });
+    },
+
+    getValues = function()
+    {
+        var i, key, val, o={},
+            keys = data.keys,
+            root = data.elements.root;
+
+        for (i=0; key=keys[i]; ++i) {
+            val = getValue(root.find('#'+key));
+            if (val !== null)
+                o[key] = val;
+        }
+
+        return o;
+    },
+
+    onDialogClosed = function()
+    {
+        window.scrollTo(0,1);
+        $(data.dialog).trigger('closed', getValues());
+    };
+
+    /****
+    *****  PUBLIC FUNCTIONS
+    ****/
+
+    // update the dialog's controls
+    this.set = function (o)
+    {
+        var e, i, key, val, option,
+            keys = data.keys,
+            root = data.elements.root;
+
+        setBlocklistButtonEnabled(true);
+
+        for (i=0; key=keys[i]; ++i)
+        {
+            val = o[key];
+            e = root.find('#'+key);
+
+            if (key === 'blocklist-size')
+            {
+                // special case -- regular text area
+                e.text('' + val.toStringWithCommas());
+            }
+            else switch (e[0].type)
+            {
+                case 'checkbox':
+                case 'radio':
+                    e.prop('checked', val);
+                    setGroupEnabled(key, val);
+                    break;
+                case 'text':
+                    // don't change the text if the user's editing it.
+                    // it's very annoying when that happens!
+                    if (e[0] !== document.activeElement)
+                        e.val(val);
+                    break;
+                case 'select-one':
+                    e.val(val);
+                    break;
+                default:
+                    break;
+            }
+        }
+    };
+
+    this.show = function ()
+    {
+        window.scrollTo(0,1);
+
+        setBlocklistButtonEnabled(true);
+        data.remote.checkPort(onPortChecked,this);
+        data.elements.root.dialog('open');
+    };
+
+    this.shouldAddedTorrentsStart = function()
+    {
+        return data.elements.root.find('#start-added-torrents')[0].checked;
+    };
+
+    data.dialog = this;
+    initialize (remote);
+};
diff --git a/web/javascript/remote.js b/web/javascript/remote.js
index 829ddc793..3c048d25b 100644
--- a/web/javascript/remote.js
+++ b/web/javascript/remote.js
@@ -1,46 +1,24 @@
-/*
- * Copyright © Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
- * This code is licensed under the GPL version 2.
- * For details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+/**
+ * Copyright © Jordan Lee, Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
  *
- * Class TransmissionRemote
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 var RPC = {
-	_Root                   : '../rpc',
 	_DaemonVersion          : 'version',
-	_Encryption             : 'encryption',
-	_EncryptionPreferred    : 'preferred',
-	_EncryptionRequired     : 'required',
-	_UpSpeedLimit           : 'speed-limit-up',
 	_DownSpeedLimit         : 'speed-limit-down',
-	_DownloadDir            : 'download-dir',
-	_PeerPort               : 'peer-port',
-	_UpSpeedLimited         : 'speed-limit-up-enabled',
 	_DownSpeedLimited       : 'speed-limit-down-enabled',
-	_TurtleState            : 'alt-speed-enabled',
-	_TurtleUpSpeedLimit     : 'alt-speed-up',
-	_TurtleDownSpeedLimit   : 'alt-speed-down',
-	_TurtleTimeEnabled      : 'alt-speed-time-enabled',
-	_TurtleTimeBegin        : 'alt-speed-time-begin',
-	_TurtleTimeEnd          : 'alt-speed-time-end',
-	_TurtleTimeDay          : 'alt-speed-time-day',
-	_PeerLimitGlobal        : 'peer-limit-global',
-	_PeerLimitPerTorrent    : 'peer-limit-per-torrent',
-	_PexEnabled             : 'pex-enabled',
-	_DhtEnabled             : 'dht-enabled',
-	_LpdEnabled             : 'lpd-enabled',
-	_BlocklistEnabled       : 'blocklist-enabled',
-	_BlocklistURL           : 'blocklist-url',
-	_BlocklistSize          : 'blocklist-size',
-	_UtpEnabled             : 'utp-enabled',
-	_PeerPortRandom         : 'peer-port-random-on-start',
-	_PortForwardingEnabled  : 'port-forwarding-enabled',
-	_StartAddedTorrent      : 'start-added-torrents',
 	_QueueMoveTop           : 'queue-move-top',
 	_QueueMoveBottom        : 'queue-move-bottom',
 	_QueueMoveUp            : 'queue-move-up',
-	_QueueMoveDown          : 'queue-move-down'
+	_QueueMoveDown          : 'queue-move-down',
+	_Root                   : '../rpc',
+	_TurtleDownSpeedLimit   : 'alt-speed-down',
+	_TurtleState            : 'alt-speed-enabled',
+	_TurtleUpSpeedLimit     : 'alt-speed-up',
+	_UpSpeedLimit           : 'speed-limit-up',
+	_UpSpeedLimited         : 'speed-limit-up-enabled'
 };
 
 function TransmissionRemote(controller)
diff --git a/web/javascript/torrent-row.js b/web/javascript/torrent-row.js
index 34b6e21a0..7ca5ef365 100644
--- a/web/javascript/torrent-row.js
+++ b/web/javascript/torrent-row.js
@@ -1,14 +1,10 @@
-/*
- *   Copyright © Jordan Lee
- *   This code is licensed under the GPL version 2.
- *   <http://www.gnu.org/licenses/old-licenses/gpl-2.0.html>
+/**
+ * Copyright © Mnemosyne LLC
+ *
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
-/****
-*****
-*****
-****/
-
 function TorrentRendererHelper()
 {
 }
diff --git a/web/javascript/torrent.js b/web/javascript/torrent.js
index 11553d771..87174f9c1 100644
--- a/web/javascript/torrent.js
+++ b/web/javascript/torrent.js
@@ -1,12 +1,10 @@
-/*
- *	Copyright © Jordan Lee, Dave Perrett and Malcolm Jarvis
- *	This code is licensed under the GPL version 2.
- *	For details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+/**
+ * Copyright © Mnemosyne LLC
  *
- *	Class Torrent
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
-
 function Torrent(data)
 {
 	this.initialize(data);
diff --git a/web/javascript/transmission.js b/web/javascript/transmission.js
index 865c18f49..4c9fec8be 100644
--- a/web/javascript/transmission.js
+++ b/web/javascript/transmission.js
@@ -1,9 +1,8 @@
-/*
- *	Copyright © Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
- *	This code is licensed under the GPL version 2.
- *	For details, see http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
+/**
+ * Copyright © Jordan Lee, Dave Perrett, Malcolm Jarvis and Bruno Bierbaumer
  *
- * Class Transmission
+ * This file is licensed under the GPLv2.
+ * http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
  */
 
 function Transmission()
@@ -21,9 +20,13 @@ Transmission.prototype =
 
 	initialize: function()
 	{
+		var e;
+
 		// Initialize the helper classes
 		this.remote = new TransmissionRemote(this);
 		this.inspector = new Inspector(this, this.remote);
+		this.prefsDialog = new PrefsDialog(this.remote);
+		this.isMenuEnabled = !isMobileDevice;
 
 		// Initialize the implementation fields
 		this.filterText    = '';
@@ -37,66 +40,63 @@ Transmission.prototype =
 		this.preloadImages();
 
 		// Set up user events
-		var tr = this;
 		$(".numberinput").forceNumeric();
-		$('#pause_all_link').click(function(e) { tr.stopAllClicked(e); });
-		$('#resume_all_link').click(function(e) { tr.startAllClicked(e); });
-		$('#pause_selected_link').click(function(e) { tr.stopSelectedClicked(e); });
-		$('#resume_selected_link').click(function(e) { tr.startSelectedClicked(e); });
-		$('#remove_link').click(function(e) { tr.removeClicked(e); });
-		$('#prefs_save_button').click(function(e) { tr.savePrefsClicked(e); return false;});
-		$('#prefs_cancel_button').click(function() { tr.hidePrefsDialog(); return false; });
-		$('#block_update_button').click(function() { tr.remote.updateBlocklist(); return false; });
-		$('#stats_close_button').click(function() { tr.hideStatsDialog(); return false; });
-		$('#open_link').click(function(e) { tr.openTorrentClicked(e); });
-		$('#upload_confirm_button').click(function(e) { tr.confirmUploadClicked(e); return false;});
-		$('#upload_cancel_button').click(function() { tr.hideUploadDialog(); return false; });
-		$('#turtle-button').click(function() { tr.toggleTurtleClicked(); });
-		$('#compact-button').click(function() { tr.toggleCompactClicked(); });
-		$('#prefs-tab-general').click(function() { tr.selectPrefsTab('general'); });
-		$('#prefs-tab-speed').click(function() { tr.selectPrefsTab('speed'); });
-		$('#prefs-tab-peers').click(function() { tr.selectPrefsTab('peers'); });
-		$('#prefs-tab-network').click(function() { tr.selectPrefsTab('network'); });
-		$('#torrent_upload_form').submit(function() { $('#upload_confirm_button').click(); return false; });
-		$('#torrent_container').bind('dragover', function(e) { return tr.dragenter(e); });
-		$('#torrent_container').bind('dragenter', function(e) { return tr.dragenter(e); });
-		$('#torrent_container').bind('drop', function(e) { return tr.drop(e); });
+		$('#pause_all_link').click($.proxy(this.stopAllClicked,this));
+		$('#resume_all_link').click($.proxy(this.startAllClicked,this));
+		$('#pause_selected_link').click($.proxy(this.stopSelectedClicked,this));
+		$('#resume_selected_link').click($.proxy(this.startSelectedClicked,this));
+		$('#remove_link').click($.proxy(this.removeClicked,this));
+		$('#stats_close_button').click($.proxy(this.hideStatsDialog,this));
+		$('#open_link').click($.proxy(this.openTorrentClicked,this));
+
+		$('#prefs-button').click($.proxy(this.showPrefsDialog,this));
+
+		$('#upload_confirm_button').click($.proxy(this.confirmUploadClicked,this));
+		$('#upload_cancel_button').click($.proxy(this.hideUploadDialog,this));
+		$('#turtle-button').click($.proxy(this.toggleTurtleClicked,this));
+		$('#compact-button').click($.proxy(this.toggleCompactClicked,this));
+		$('#torrent_container').bind('dragover', $.proxy(this.dragenter,this));
+		$('#torrent_container').bind('dragenter', $.proxy(this.dragenter,this));
+		$('#torrent_container').bind('drop', $.proxy(this.drop,this));
+
 		// tell jQuery to copy the dataTransfer property from events over if it exists
 		jQuery.event.props.push("dataTransfer");
 
 		$('#torrent_upload_form').submit(function() { $('#upload_confirm_button').click(); return false; });
 
 		if (isMobileDevice) {
-			$('#inspector_close').bind('click', function() { tr.setInspectorVisible(false); });
-			$('#preferences_link').bind('click', function(e) { tr.releaseClutchPreferencesButton(e); });
+			$('#inspector_close').click($.proxy(this.toggleInspector,this));
 		} else {
-			$(document).bind('keydown', function(e) { return tr.keyDown(e); });
-			$(document).bind('keyup', function(e) { tr.keyUp(e); });
-			$(document).delegate('#torrent_container', 'click', function() { tr.deselectAll(); });
-			$('#inspector_link').click(function(e) { tr.toggleInspector(); });
+			$(document).bind('keydown', $.proxy(this.keyDown,this) );
+			$(document).bind('keyup', $.proxy(this.keyUp, this) );
+			$('#torrent_container').click( $.proxy(this.deselectAll,this) );
+			$('#inspector_link').click( $.proxy(this.toggleInspector,this) );
 
 			this.setupSearchBox();
 			this.createContextMenu();
-			this.createSettingsMenu();
 		}
-		this.initTurtleDropDowns();
-
-		this._torrent_list             = $('#torrent_list')[0];
-		this._toolbar_buttons          = $('#toolbar ul li');
-		this._toolbar_pause_button     = $('#toolbar #pause_selected')[0];
-		this._toolbar_pause_all_button = $('#toolbar #pause_all')[0];
-		this._toolbar_start_button     = $('#toolbar #resume_selected')[0];
-		this._toolbar_start_all_button = $('#toolbar #resume_all')[0];
-		this._toolbar_remove_button    = $('#toolbar #remove')[0];
-		this._context_pause_button     = $('li#context_pause_selected')[0];
-		this._context_start_button     = $('li#context_resume_selected')[0];
-		this._context_start_now_button = $('li#context_resume_now_selected')[0];
-		this._context_move_top         = $('li#context_move_top')[0];
-		this._context_move_up          = $('li#context_move_up')[0];
-		this._context_move_down        = $('li#context_move_down')[0];
-		this._context_move_bottom      = $('li#context_move_bottom')[0];
-
-		// Setup the prefs gui
+
+		if (this.isMenuEnabled)
+			this.createSettingsMenu();
+ 
+		e = {};
+		e.torrent_list              = $('#torrent_list')[0];
+		e.toolbar_buttons           = $('#toolbar ul li');
+		e.toolbar_pause_button      = $('#toolbar #pause_selected')[0];
+		e.toolbar_pause_all_button  = $('#toolbar #pause_all')[0];
+		e.toolbar_start_button      = $('#toolbar #resume_selected')[0];
+		e.toolbar_start_all_button  = $('#toolbar #resume_all')[0];
+		e.toolbar_remove_button     = $('#toolbar #remove')[0];
+		e.context_pause_button      = $('li#context_pause_selected')[0];
+		e.context_start_button      = $('li#context_resume_selected')[0];
+		e.context_start_now_button  = $('li#context_resume_now_selected')[0];
+		e.context_move_top          = $('li#context_move_top')[0];
+		e.context_move_up           = $('li#context_move_up')[0];
+		e.context_move_down         = $('li#context_move_down')[0];
+		e.context_move_bottom       = $('li#context_move_bottom')[0];
+		this.elements = e;
+
+		// Apply the prefs settings to the gui
 		this.initializeSettings();
 
 		// Get preferences & torrents from the daemon
@@ -110,16 +110,11 @@ Transmission.prototype =
 		this.filterSetup();
 	},
 
-	selectPrefsTab: function(name) {
-		$('#prefs-tab-'+name).addClass('selected').siblings('.prefs-tab').removeClass('selected');
-		$('#prefs-page-'+name).show().siblings('.prefs-page').hide();
-	},
-
 	loadDaemonPrefs: function(async) {
 		this.remote.loadDaemonPrefs(function(data) {
 			var o = data['arguments'];
 			Prefs.getClutchPrefs(o);
-			this.updatePrefs(o);
+			this.updateGuiFromSession(o);
 		}, this, async);
 	},
 
@@ -128,12 +123,6 @@ Transmission.prototype =
 			this.updateStats(data['arguments']);
 		}, this, async);
 	},
-	checkPort: function(async) {
-		$('#port_test').text('checking ...');
-		this.remote.checkPort(function(data) {
-			this.updatePortStatus(data['arguments']);
-		}, this, async);
-	},
 
 	preloadImages: function() {
 		if (isMobileDevice) {
@@ -175,11 +164,7 @@ Transmission.prototype =
 	{
 		Prefs.getClutchPrefs(this);
 
-		// iPhone conditions in the section allow us to not
-		// include transmenu js to save some bandwidth; if we
-		// start using prefs on mobile devices we need to weed
-		// transmenu refs out of that too.
-		if (!isMobileDevice)
+		if (this.isMenuEnabled)
 		{
 			$('#sort_by_' + this[Prefs._SortMethod]).selectMenuItem();
 
@@ -219,7 +204,7 @@ Transmission.prototype =
 		}
 	},
 
-	/*
+	/**
 	 * Create the torrent right-click menu
 	 */
 	createContextMenu: function() {
@@ -241,13 +226,13 @@ Transmission.prototype =
 			context_move_bottom:          function() { tr.moveBottom(); }
 		};
 
-		// Setup the context menu
+		// Set up the context menu
 		$('ul#torrent_list').contextMenu('torrent_context_menu', {
 			bindings:          bindings,
-			menuStyle:         Menu.context.menu_style,
-			itemStyle:         Menu.context.item_style,
-			itemHoverStyle:    Menu.context.item_hover_style,
-			itemDisabledStyle: Menu.context.item_disabled_style,
+			menuStyle:         { width: '310px', backgroundColor: '#fff', border: 'none', padding: '5px 0', textAlign: 'left' },
+			itemStyle:         { backgroundColor: 'transparent', margin: '0', padding: '3px 10px 3px 20px', color: '#000', cursor: 'default', border: 'none'},
+			itemHoverStyle:    { backgroundColor: '#24e', color: '#fff', border: 'none'},
+			itemDisabledStyle: { backgroundColor: 'transparent', margin: '0', padding: '3px 10px 3px 20px', color: '#aaa', cursor: 'default', border: 'none'},
 			shadow:            false,
 			boundingElement:   $('div#torrent_container'),
 			boundingRightPad:  20,
@@ -269,7 +254,7 @@ Transmission.prototype =
 		$('#settings_menu').transMenu({
 			selected_char: '&#x2714;',
 			direction: 'up',
-			onClick: $.proxy(this.processSettingsMenuEvent,this)
+			onClick: $.proxy(this.onMenuClicked,this)
 		});
 
 		$('#unlimited_download_rate').selectMenuItem();
@@ -277,22 +262,6 @@ Transmission.prototype =
 	},
 
 
-	initTurtleDropDowns: function() {
-		var i, hour, mins, start, end, value, content;
-		// Build the list of times
-		start = $('#turtle_start_time')[0];
-		end = $('#turtle_end_time')[0];
-		for (i = 0; i < 24 * 4; i++) {
-			hour = parseInt(i / 4, 10);
-			mins = ((i % 4) * 15);
-
-			value = (i * 15);
-			content = hour + ":" + (mins || '00');
-			start.options[i] = new Option(content, value);
-			end.options[i]  = new Option(content, value);
-		}
-	},
-
 	/****
 	*****
 	*****  UTILITIES
@@ -360,7 +329,7 @@ Transmission.prototype =
 	},
 
 	setSelectedRow: function(row) {
-		$(this._torrent_list).children('.selected').removeClass('selected');
+		$(this.elements.torrent_list).children('.selected').removeClass('selected');
 		this.selectRow(row);
 	},
 
@@ -375,11 +344,11 @@ Transmission.prototype =
 	},
 
 	selectAll: function() {
-		$(this._torrent_list).children().addClass('selected');
+		$(this.elements.torrent_list).children().addClass('selected');
 		this.callSelectionChangedSoon();
 	},
 	deselectAll: function() {
-		$(this._torrent_list).children('.selected').removeClass('selected');
+		$(this.elements.torrent_list).children('.selected').removeClass('selected');
 		this.callSelectionChangedSoon();
 		delete this._last_torrent_clicked;
 	},
@@ -578,7 +547,7 @@ Transmission.prototype =
 				break;
 			}
 		}
-		var paused = $('#prefs_form #auto_start')[0].checked;
+		var paused = this.shouldAddedTorrentsStart();
 		for (i = 0; i < uris.length; ++i) {
 			var uri = uris[i];
 			if (/^#/.test(uri)) {
@@ -604,54 +573,6 @@ Transmission.prototype =
 		this.hideUploadDialog();
 	},
 
-	savePrefsClicked: function()
-	{
-		// handle the clutch prefs locally
-		var rate = parseInt ($('#prefs_form #refresh_rate')[0].value, 10);
-		if (rate != this[Prefs._RefreshRate])
-			this.setPref (Prefs._RefreshRate, rate);
-
-		var up_bytes        = parseInt($('#prefs_form #upload_rate').val(), 10),
-		    dn_bytes        = parseInt($('#prefs_form #download_rate').val(), 10),
-		    turtle_up_bytes = parseInt($('#prefs_form #turtle_upload_rate').val(), 10),
-		    turtle_dn_bytes = parseInt($('#prefs_form #turtle_download_rate').val(), 10);
-
-		// pass the new prefs upstream to the RPC server
-		var o = { };
-		o[RPC._StartAddedTorrent]    = $('#prefs_form #auto_start')[0].checked;
-		o[RPC._PeerPort]             = parseInt($('#prefs_form #port').val(), 10);
-		o[RPC._UpSpeedLimit]         = up_bytes;
-		o[RPC._DownSpeedLimit]       = dn_bytes;
-		o[RPC._DownloadDir]          = $('#prefs_form #download_location').val();
-		o[RPC._UpSpeedLimited]       = $('#prefs_form #limit_upload').prop('checked');
-		o[RPC._DownSpeedLimited]     = $('#prefs_form #limit_download').prop('checked');
-		o[RPC._Encryption]           = $('#prefs_form #encryption').prop('checked')
-		                                   ? RPC._EncryptionRequired
-		                                   : RPC._EncryptionPreferred;
-		o[RPC._TurtleDownSpeedLimit] = turtle_dn_bytes;
-		o[RPC._TurtleUpSpeedLimit]   = turtle_up_bytes;
-		o[RPC._TurtleTimeEnabled]    = $('#prefs_form #turtle_schedule').prop('checked');
-		o[RPC._TurtleTimeBegin]      = parseInt($('#prefs_form #turtle_start_time').val(), 10);
-		o[RPC._TurtleTimeEnd]        = parseInt($('#prefs_form #turtle_end_time').val(), 10);
-		o[RPC._TurtleTimeDay]        = parseInt($('#prefs_form #turtle_days').val(), 10);
-
-
-		o[RPC._PeerLimitGlobal]      = parseInt($('#prefs_form #conn_global').val(), 10);
-		o[RPC._PeerLimitPerTorrent]  = parseInt($('#prefs_form #conn_torrent').val(), 10);
-		o[RPC._PexEnabled]           = $('#prefs_form #conn_pex').prop('checked');
-		o[RPC._DhtEnabled]           = $('#prefs_form #conn_dht').prop('checked');
-		o[RPC._LpdEnabled]           = $('#prefs_form #conn_lpd').prop('checked');
-		o[RPC._BlocklistEnabled]     = $('#prefs_form #block_enable').prop('checked');
-		o[RPC._BlocklistURL]         = $('#prefs_form #block_url').val();
-		o[RPC._UtpEnabled]           = $('#prefs_form #network_utp').prop('checked');
-		o[RPC._PeerPortRandom]       = $('#prefs_form #port_rand').prop('checked');
-		o[RPC._PortForwardingEnabled]= $('#prefs_form #port_forward').prop('checked');
-
-		this.remote.savePrefs(o);
-
-		this.hidePrefsDialog();
-	},
-
 	removeClicked: function(ev) {
 		if (this.isButtonEnabled(ev)) {
 			this.removeSelectedTorrents();
@@ -659,30 +580,14 @@ Transmission.prototype =
 		}
 	},
 
-	/*
-	 * 'Clutch Preferences' was clicked (isMobileDevice only)
-	 */
-	releaseClutchPreferencesButton: function() {
-		$('div#prefs_container div#pref_error').hide();
-		$('div#prefs_container h2.dialog_heading').show();
-		this.showPrefsDialog();
-	},
-
-	getIntervalMsec: function(key, min)
-	{
-		var interval = this[key];
-		if (!interval || (interval < min))
-			interval = min;
-		return interval * 1000;
-	},
-
-	/* Turn the periodic ajax session refresh on & off */
 	togglePeriodicSessionRefresh: function(enabled) {
+		/* Turn the periodic ajax session refresh on & off */
 		clearInterval(this.sessionInterval);
 		delete this.sessionInterval;
 		if (enabled) {
-			var msec = this.getIntervalMsec(Prefs._SessionRefreshRate, 5);
-			this.sessionInterval = setInterval($.proxy(this.loadDaemonPrefs,this), msec);
+		        var callback = $.proxy(this.loadDaemonPrefs,this),
+			    msec = 8000;
+			this.sessionInterval = setInterval(callback, msec);
 		}
 	},
 
@@ -691,31 +596,17 @@ Transmission.prototype =
 		clearInterval(this.statsInterval);
 		delete this.statsInterval;
 		if (enabled) {
-			var msec = this.getIntervalMsec(Prefs._SessionRefreshRate, 5);
-			this.statsInterval = setInterval($.proxy(this.loadDaemonStats,this), msec);
+			var callback = $.proxy(this.loadDaemonStats,this),
+                            msec = 5000;
+			this.statsInterval = setInterval(callback, msec);
 		}
 	},
 
 	toggleTurtleClicked: function()
 	{
-		// toggle it
-		var p = Prefs._TurtleState;
-		this[p] = !this[p];
-
-		// send it to the session
-		var args = { };
-		args[RPC._TurtleState] = this[p];
-		this.remote.savePrefs(args);
-	},
-
-	updateTurtleButton: function() {
-		var enabled = this[Prefs._TurtleState],
-		    w = $('#turtle-button'),
-		    t = [ 'Click to ', (enabled?'disable':'enable'), ' Temporary Speed Limits',
-		          '(', Transmission.fmt.speed(this._prefs[RPC._TurtleUpSpeedLimit]), 'up,',
-		               Transmission.fmt.speed(this._prefs[RPC._TurtleDownSpeedLimit]), 'down)' ];
-		w.toggleClass('enabled',enabled);
-		w.attr('title', t.join(' '));
+		var o = {};
+		o[RPC._TurtleState] = !$('#turtle-button').hasClass('enabled');
+		this.remote.savePrefs(o);
 	},
 
 	/*--------------------------------------------
@@ -724,99 +615,13 @@ Transmission.prototype =
 	 *
 	 *--------------------------------------------*/
 
-	showPrefsDialog: function() {
-		this.checkPort(true);
-		$('body').addClass('prefs_showing');
-		$('#prefs_container').fadeIn();
-		this.hideMobileAddressbar();
-		this.updateButtonStates();
-		this.togglePeriodicSessionRefresh(false);
-	},
-
-	hidePrefsDialog: function()
+	showPrefsDialog: function()
 	{
-		$('body.prefs_showing').removeClass('prefs_showing');
-		if (isMobileDevice)
-			this.hideMobileAddressbar();
-		$('#prefs_container').fadeOut();
-		this.updateButtonStates();
-		this.togglePeriodicSessionRefresh(true);
-	},
-
-	/*
-	 * Process got some new session data from the server
-	 */
-	updatePrefs: function(p)
-	{
-		// remember them for later
-		this._prefs = p;
-
-		var up_limited        = p[RPC._UpSpeedLimited];
-		var dn_limited        = p[RPC._DownSpeedLimited];
-		var up_limit_k        = p[RPC._UpSpeedLimit];
-		var dn_limit_k        = p[RPC._DownSpeedLimit];
-		var turtle_up_limit_k = p[RPC._TurtleUpSpeedLimit];
-		var turtle_dn_limit_k = p[RPC._TurtleDownSpeedLimit];
-
-		if (p.units)
-			Transmission.fmt.updateUnits(p.units);
-
-		$('div.download_location input').val(      p[RPC._DownloadDir]);
-		$('div.port input').val(                   p[RPC._PeerPort]);
-		$('div.auto_start input').prop('checked',  p[RPC._StartAddedTorrent]);
-		$('input#limit_download').prop('checked',  dn_limited);
-		$('input#download_rate').val(              dn_limit_k);
-		$('input#limit_upload').prop('checked',    up_limited);
-		$('input#upload_rate').val(                up_limit_k);
-		$('input#refresh_rate').val(               p[Prefs._RefreshRate]);
-		$('div.encryption input').val(             p[RPC._Encryption] === RPC._EncryptionRequired);
-		$('input#turtle_download_rate').val(       turtle_dn_limit_k);
-		$('input#turtle_upload_rate').val(         turtle_up_limit_k);
-		$('input#turtle_schedule').prop('checked', p[RPC._TurtleTimeEnabled]);
-		$('select#turtle_start_time').val(         p[RPC._TurtleTimeBegin]);
-		$('select#turtle_end_time').val(           p[RPC._TurtleTimeEnd]);
-		$('select#turtle_days').val(               p[RPC._TurtleTimeDay]);
-		$('#transmission_version').text(           p[RPC._DaemonVersion]);
-		$('#conn_global').val(                     p[RPC._PeerLimitGlobal]);
-		$('#conn_torrent').val(                    p[RPC._PeerLimitPerTorrent]);
-		$('#conn_pex').prop('checked',             p[RPC._PexEnabled]);
-		$('#conn_dht').prop('checked',             p[RPC._DhtEnabled]);
-		$('#conn_lpd').prop('checked',             p[RPC._LpdEnabled]);
-		$('#block_enable').prop('checked',         p[RPC._BlocklistEnabled]);
-		$('#block_url').val(                       p[RPC._BlocklistURL]);
-		$('#block_size').text(                     p[RPC._BlocklistSize]+' IP rules in the list');
-		$('#network_utp').prop('checked',          p[RPC._UtpEnabled]);
-		$('#port_rand').prop('checked',            p[RPC._PeerPortRandom]);
-		$('#port_forward').prop('checked',         p[RPC._PortForwardingEnabled]);
-
-		if (!isMobileDevice)
-		{
-			setInnerHTML($('#limited_download_rate')[0], [ 'Limit (', Transmission.fmt.speed(dn_limit_k), ')' ].join(''));
-			var key = dn_limited ? '#limited_download_rate'
-			                       : '#unlimited_download_rate';
-			$(key).deselectMenuSiblings().selectMenuItem();
-
-			setInnerHTML($('#limited_upload_rate')[0], [ 'Limit (', Transmission.fmt.speed(up_limit_k), ')' ].join(''));
-			key = up_limited ? '#limited_upload_rate'
-			                 : '#unlimited_upload_rate';
-			$(key).deselectMenuSiblings().selectMenuItem();
-		}
-
-		this[Prefs._TurtleState] = p[RPC._TurtleState];
-		this.updateTurtleButton();
-		this.setCompactMode(p[Prefs._CompactDisplayState]);
-	},
-
-	updatePortStatus: function(status) {
-		if (status['port-is-open'])
-			$('#port_test').text('Port is open');
-		else
-			$('#port_test').text('Port is closed');
+		this.prefsDialog.show();
 	},
 
 	showStatsDialog: function() {
 		this.loadDaemonStats();
-		$('body').addClass('stats_showing');
 		$('#stats_container').fadeIn();
 		this.hideMobileAddressbar();
 		this.updateButtonStates();
@@ -824,10 +629,8 @@ Transmission.prototype =
 	},
 
 	hideStatsDialog: function() {
-		$('body.stats_showing').removeClass('stats_showing');
-		if (isMobileDevice)
-			this.hideMobileAddressbar();
 		$('#stats_container').fadeOut();
+		this.hideMobileAddressbar();
 		this.updateButtonStates();
 		this.togglePeriodicStatsRefresh(false);
 	},
@@ -868,105 +671,145 @@ Transmission.prototype =
 		this.refilter(true);
 	},
 
-	/*
-	 * Process an event in the footer-menu
-	 */
-	processSettingsMenuEvent: function(ev) {
-		var tr = this;
-		var $element = $(ev.target);
+	updateGuiFromSession: function(o)
+	{
+		var limit, limited, e, b, text,
+                    fmt = Transmission.fmt,
+                    menu = $('#settings_menu');
 
-		// Figure out which menu has been clicked
-		switch ($element.parent()[0].id) {
+		this.prefsDialog.set(o);
 
-				// Display the preferences dialog
-			case 'footer_super_menu':
-				if ($element[0].id === 'preferences') {
-					$('div#prefs_container div#pref_error').hide();
-					$('div#prefs_container h2.dialog_heading').show();
-					tr.showPrefsDialog();
-				}
-				else if ($element[0].id === 'statistics') {
-					$('div#stats_container div#stats_error').hide();
-					$('div#stats_container h2.dialog_heading').show();
-					tr.showStatsDialog();
-				}
-				else if ($element[0].id === 'homepage') {
-					window.open('http://www.transmissionbt.com/');
-				}
-				else if ($element[0].id === 'tipjar') {
-					window.open('http://www.transmissionbt.com/donate.php');
-				}
+		if (RPC._TurtleState in o)
+		{
+			b = o[RPC._TurtleState];
+			e = $('#turtle-button');
+			text = [ 'Click to ', (b?'disable':'enable'), ' Temporary Speed Limits (',
+			         fmt.speed(o[RPC._TurtleUpSpeedLimit]), ' up,',
+			         fmt.speed(o[RPC._TurtleDownSpeedLimit]), ' down)' ].join('');
+			e.toggleClass('enabled', b);
+			e.attr('title', text);
+		}
+
+		if (this.isMenuEnabled && (RPC._DownSpeedLimited in o)
+		                       && (RPC._DownSpeedLimit in o))
+		{
+			limit = o[RPC._DownSpeedLimit];
+			limited = o[RPC._DownSpeedLimited];
+
+			e = menu.find('#limited_download_rate');
+                        e.html('Limit (' + fmt.speed(limit) + ')');
+
+                        if (!limited)
+                        	e = menu.find('#unlimited_download_rate');
+                        e.deselectMenuSiblings().selectMenuItem();
+		}
+
+		if (this.isMenuEnabled && (RPC._UpSpeedLimited in o)
+		                       && (RPC._UpSpeedLimit in o))
+		{
+			limit = o[RPC._UpSpeedLimit];
+			limited = o[RPC._UpSpeedLimited];
+
+			e = menu.find('#limited_upload_rate');
+                        e.html('Limit (' + fmt.speed(limit) + ')');
+
+                        if (!limited)
+                        	e = menu.find('#unlimited_upload_rate');
+                        e.deselectMenuSiblings().selectMenuItem();
+		}
+	},
+
+	onMenuClicked: function(ev)
+	{
+		var o, dir,
+		    id = ev.target.id,
+		    remote = this.remote,
+		    element = $(ev.target);
+
+		if (element.hasClass('sort-mode'))
+		{
+			element.parent().find('.sort-mode').each(function() {
+				element.parent().deselectMenuItem();
+			});
+			element.selectMenuItem();
+			this.setSortMethod(id.replace(/sort_by_/, ''));
+		}
+		else if (element.hasClass('upload-speed'))
+		{
+			o = {};
+			o[RPC._UpSpeedLimit] = parseInt(ev.target.innerHTML);
+			o[RPC._UpSpeedLimited] = true;
+			remote.savePrefs(o);
+		}
+		else if (element.hasClass('download-speed'))
+		{
+			o = {};
+			o[RPC._DownSpeedLimit] = parseInt(ev.target.innerHTML);
+			o[RPC._DownSpeedLimited] = true;
+			remote.savePrefs(o);
+		}
+		else switch (id)
+		{
+			case 'preferences':
+				this.showPrefsDialog();
 				break;
 
-			// Limit the download rate
-			case 'footer_download_rate_menu':
-				var args = { };
-				if ($element.is('#unlimited_download_rate')) {
-					$element.deselectMenuSiblings().selectMenuItem();
-					args[RPC._DownSpeedLimited] = false;
-				} else {
-					var rate_str = $element[0].innerHTML;
-					var rate_val = parseInt(rate_str, 10);
-					setInnerHTML($('#limited_download_rate')[0], [ 'Limit (', Transmission.fmt.speed(rate_val), ')' ].join(''));
-					$('#limited_download_rate').deselectMenuSiblings().selectMenuItem();
-					$('div.preference input#download_rate')[0].value = rate_str;
-					args[RPC._DownSpeedLimit] = rate_val;
-					args[RPC._DownSpeedLimited] = true;
-				}
-				$('div.preference input#limit_download')[0].checked = args[RPC._DownSpeedLimited];
-				tr.remote.savePrefs(args);
+			case 'statistics':
+				$('div#stats_container div#stats_error').hide();
+				$('div#stats_container h2.dialog_heading').show();
+				this.showStatsDialog();
 				break;
 
-			// Limit the upload rate
-			case 'footer_upload_rate_menu':
-				var args = { };
-				if ($element.is('#unlimited_upload_rate')) {
-					$element.deselectMenuSiblings().selectMenuItem();
-					args[RPC._UpSpeedLimited] = false;
-				} else {
-					var rate_str = $element[0].innerHTML;
-					var rate_val = parseInt(rate_str, 10);
-					setInnerHTML($('#limited_upload_rate')[0], [ 'Limit (', Transmission.fmt.speed(rate_val), ')' ].join(''));
-					$('#limited_upload_rate').deselectMenuSiblings().selectMenuItem();
-					$('div.preference input#upload_rate')[0].value = rate_str;
-					args[RPC._UpSpeedLimit] = rate_val;
-					args[RPC._UpSpeedLimited] = true;
-				}
-				$('div.preference input#limit_upload')[0].checked = args[RPC._UpSpeedLimited];
-				tr.remote.savePrefs(args);
+			case 'homepage':
+				window.open('http://www.transmissionbt.com/');
 				break;
 
-			// Sort the torrent list
-			case 'footer_sort_menu':
-
-				// The 'reverse sort' option state can be toggled independently of the other options
-				if ($element.is('#reverse_sort_order')) {
-					if (!$element.is('#reverse_sort_order.active')) break;
-					var dir;
-					if ($element.menuItemIsSelected()) {
-						$element.deselectMenuItem();
-						dir = Prefs._SortAscending;
-					} else {
-						$element.selectMenuItem();
-						dir = Prefs._SortDescending;
-					}
-					tr.setSortDirection(dir);
-
-				// Otherwise, deselect all other options (except reverse-sort) and select this one
+			case 'tipjar':
+				window.open('http://www.transmissionbt.com/donate.php');
+				break;	
+
+			case 'unlimited_download_rate':
+				o = { };
+				o[RPC._DownSpeedLimited] = false;
+				remote.savePrefs(o);
+				break;
+
+			case 'limited_download_rate':
+				o = { };
+				o[RPC._DownSpeedLimited] = true;
+				remote.savePrefs(o);
+				break;
+
+			case 'unlimited_upload_rate':
+				o = {};
+				o[RPC._UpSpeedLimited] = false;
+				remote.savePrefs(o);
+				break;
+
+			case 'limited_upload_rate':
+				o = {};
+				o[RPC._UpSpeedLimited] = true;
+				remote.savePrefs(o);
+				break;
+
+			case 'reverse_sort_order':
+				if (element.menuItemIsSelected()) {
+					dir = Prefs._SortAscending;
+					element.deselectMenuItem();
 				} else {
-					$element.parent().find('span.selected').each(function() {
-						if (! $element.parent().is('#reverse_sort_order')) {
-							$element.parent().deselectMenuItem();
-						}
-					});
-					$element.selectMenuItem();
-					var method = $element[0].id.replace(/sort_by_/, '');
-					tr.setSortMethod(method);
+					dir = Prefs._SortDescending;
+					element.selectMenuItem();
 				}
+				this.setSortDirection(dir);
+				break;
+
+			default:
+				console.log('unhandled: ' + id);
 				break;
+
 		}
 		$('#settings_menu').trigger('closemenu');
-		return false; // to prevent the event from bubbling up
+		ev.stopImmediatePropagation();
 	},
 
 
@@ -998,7 +841,8 @@ Transmission.prototype =
 				t = this._torrents[id] = new Torrent(o);
 				this.dirtyTorrents[id] = true;
 				$(t).bind('dataChanged',$.proxy(this.onTorrentChanged,this));
-				if(!('name' in t.fields) || !('status' in t.fields)) // missing some fields...
+				// if we need them, ask for fields from the server...
+				if(!('name' in t.fields) || !('status' in t.fields))
 					needinfo.push(id);
 			}
 		}
@@ -1022,17 +866,23 @@ Transmission.prototype =
 
 	refreshTorrents: function()
 	{
+		var callback = $.proxy(this.refreshTorrents,this),
+		    msec = this[Prefs._RefreshRate] * 1000,
+		    fields = ['id'].concat(Torrent.Fields.Stats);
+
 		// send a request right now
-		this.updateTorrents('recently-active', ['id'].concat(Torrent.Fields.Stats));
+		this.updateTorrents('recently-active', fields);
 
 		// schedule the next request
 		clearTimeout(this.refreshTorrentsTimeout);
-		this.refreshTorrentsTimeout = setTimeout($.proxy(this.refreshTorrents,this), this[Prefs._RefreshRate]*1000);
+		this.refreshTorrentsTimeout = setTimeout(callback,msec);
 	},
 
 	initializeTorrents: function()
 	{
-		this.updateTorrents(null, ['id'].concat(Torrent.Fields.Metadata, Torrent.Fields.Stats));
+		var fields = ['id'].concat(Torrent.Fields.Metadata,
+		                           Torrent.Fields.Stats);
+		this.updateTorrents(null, fields);
 	},
 
 	onRowClicked: function(ev)
@@ -1108,7 +958,7 @@ Transmission.prototype =
 
 	updateStatusbar: function()
 	{
-		var i, row,
+		var i, row, text,
 		    u=0, d=0,
 		    fmt = Transmission.fmt,
 		    torrents = this.getAllTorrents();
@@ -1121,8 +971,16 @@ Transmission.prototype =
 			d += row.getDownloadSpeed();
 		}
 
-		setInnerHTML($('#statusbar #speed-up-label')[0], u ? '&uarr; ' + fmt.speedBps(u) : '');
-		setInnerHTML($('#statusbar #speed-dn-label')[0], d ? '&darr; ' + fmt.speedBps(d) : '');
+		text = u ? '&uarr; ' + fmt.speedBps(u) : '';
+		setInnerHTML($('#statusbar #speed-up-label')[0], text);
+
+		text = d ? '&darr; ' + fmt.speedBps(d) : '';
+		setInnerHTML($('#statusbar #speed-dn-label')[0], text);
+	},
+
+	shouldAddedTorrentsStart: function()
+	{
+		return this.prefsDialog.shouldAddedTorrentsStart();
 	},
 
 	/*
@@ -1135,7 +993,7 @@ Transmission.prototype =
 		if (! confirmed) {
 			$('input#torrent_upload_file').attr('value', '');
 			$('input#torrent_upload_url').attr('value', '');
-			$('input#torrent_auto_start').attr('checked', $('#prefs_form #auto_start')[0].checked);
+			$('input#torrent_auto_start').attr('checked', this.shouldAddedTorrentsStart());
 			$('#upload_container').show();
 			$('#torrent_upload_url').focus();
 
@@ -1173,15 +1031,15 @@ Transmission.prototype =
 	{
 		if (torrents.length === 1)
 		{
-			var torrent = torrents[0];
-			var header = 'Remove ' + torrent.getName() + '?';
-			var message = 'Once removed, continuing the transfer will require the torrent file. Are you sure you want to remove it?';
+			var torrent = torrents[0],
+			    header = 'Remove ' + torrent.getName() + '?',
+			    message = 'Once removed, continuing the transfer will require the torrent file. Are you sure you want to remove it?';
 			dialog.confirm(header, message, 'Remove', 'transmission.removeTorrents', torrents);
 		}
 		else
 		{
-			var header = 'Remove ' + torrents.length + ' transfers?';
-			var message = 'Once removed, continuing the transfers will require the torrent files. Are you sure you want to remove them?';
+			var header = 'Remove ' + torrents.length + ' transfers?',
+			    message = 'Once removed, continuing the transfers will require the torrent files. Are you sure you want to remove them?';
 			dialog.confirm(header, message, 'Remove', 'transmission.removeTorrents', torrents);
 		}
 	},
@@ -1191,20 +1049,20 @@ Transmission.prototype =
 		if (torrents.length === 1)
 		{
 			var torrent = torrents[0],
-				header = 'Remove ' + torrent.getName() + ' and delete data?',
-				message = 'All data downloaded for this torrent will be deleted. Are you sure you want to remove it?';
+			    header = 'Remove ' + torrent.getName() + ' and delete data?',
+			    message = 'All data downloaded for this torrent will be deleted. Are you sure you want to remove it?';
 			dialog.confirm(header, message, 'Remove', 'transmission.removeTorrentsAndData', torrents);
 		}
 		else
 		{
 			var header = 'Remove ' + torrents.length + ' transfers and delete data?',
-				message = 'All data downloaded for these torrents will be deleted. Are you sure you want to remove them?';
+			    message = 'All data downloaded for these torrents will be deleted. Are you sure you want to remove them?';
 			dialog.confirm(header, message, 'Remove', 'transmission.removeTorrentsAndData', torrents);
 		}
 	},
 
 	removeTorrents: function(torrents) {
-		var ids = $.map(torrents, function(t) { return t.getId(); });
+		var ids = this.getTorrentIds(torrents);
 		this.remote.removeTorrents(ids, this.refreshTorrents, this);
 	},
 
@@ -1229,15 +1087,19 @@ Transmission.prototype =
 	startTorrent: function(torrent) {
 		this.startTorrents([ torrent ], false);
 	},
+
+	getTorrentIds: function(torrents) {
+		return $.map(torrents.slice(0), function(t) {return t.getId();});
+	},
 	startTorrents: function(torrents, force) {
-		this.remote.startTorrents($.map(torrents, function(t) {return t.getId();}),
-		                          force, this.refreshTorrents, this);
+		this.remote.startTorrents(this.getTorrentIds(torrents), force,
+		                          this.refreshTorrents, this);
 	},
 	verifyTorrent: function(torrent) {
 		this.verifyTorrents([ torrent ]);
 	},
 	verifyTorrents: function(torrents) {
-		this.remote.verifyTorrents($.map(torrents, function(t) {return t.getId();}),
+		this.remote.verifyTorrents(this.getTorrentIds(torrents),
 		                           this.refreshTorrents, this);
 	},
 
@@ -1245,7 +1107,7 @@ Transmission.prototype =
 		this.reannounceTorrents([ torrent ]);
 	},
 	reannounceTorrents: function(torrents) {
-		this.remote.reannounceTorrents($.map(torrents, function(t) {return t.getId();}),
+		this.remote.reannounceTorrents(this.getTorrentIds(torrents),
 		                               this.refreshTorrents, this);
 	},
 
@@ -1259,7 +1121,7 @@ Transmission.prototype =
 		this.stopTorrents([ torrent ]);
 	},
 	stopTorrents: function(torrents) {
-		this.remote.stopTorrents($.map(torrents.slice(0), function(t) {return t.getId();}),
+		this.remote.stopTorrents(this.getTorrentIds(torrents),
 		                         this.refreshTorrents, this);
 	},
 	changeFileCommand: function(torrentId, rowIndices, command) {
@@ -1268,8 +1130,9 @@ Transmission.prototype =
 
 	hideMobileAddressbar: function(delaySecs) {
 		if (isMobileDevice && !scroll_timeout) {
-			var delayMsec = delaySecs*1000 || 150;
-			scroll_timeout = setTimeout($.proxy(this.doToolbarHide,this), delayMsec);
+			var callback = $.proxy(this.doToolbarHide,this),
+			    msec = delaySecs*1000 || 150;
+			scroll_timeout = setTimeout(callback,msec);
 		}
 	},
 	doToolbarHide: function() {
@@ -1307,48 +1170,47 @@ Transmission.prototype =
 	updateButtonsSoon: function()
 	{
 		if (!this.buttonRefreshTimer)
-			this.buttonRefreshTimer = setTimeout($.proxy(this.updateButtonStates,this), 100);
+		{
+			var callback = $.proxy(this.updateButtonStates,this),
+			    msec = 100;
+			this.buttonRefreshTimer = setTimeout(callback, msec);
+		}
 	},
 
 	updateButtonStates: function()
 	{
+		var e = this.elements,
+		    haveActive = false,
+		    havePaused = false,
+		    haveSelection = false,
+		    haveActiveSelection = false,
+		    havePausedSelection = false;
+
 		clearTimeout(this.buttonRefreshTimer);
 		delete this.buttonRefreshTimer;
 
-		var showing_dialog = new RegExp("(prefs_showing|dialog_showing|open_showing)").test(document.body.className);
-		this._toolbar_buttons.toggleClass('disabled', showing_dialog);
-
-		if (!showing_dialog)
-		{
-			var haveSelection = false,
-			    haveActive = false,
-			    haveActiveSelection = false,
-			    havePaused = false,
-			    havePausedSelection = false;
-
-			for (var i=0, row; row=this._rows[i]; ++i) {
-				var isStopped = row.getTorrent().isStopped();
-				var isSelected = row.isSelected();
-				if (!isStopped) haveActive = true;
-				if (isStopped) havePaused = true;
-				if (isSelected) haveSelection = true;
-				if (isSelected && !isStopped) haveActiveSelection = true;
-				if (isSelected && isStopped) havePausedSelection = true;
-			}
-
-			this.setEnabled(this._toolbar_pause_button,       haveActiveSelection);
-			this.setEnabled(this._context_pause_button,       haveActiveSelection);
-			this.setEnabled(this._toolbar_start_button,       havePausedSelection);
-			this.setEnabled(this._context_start_button,       havePausedSelection);
-			this.setEnabled(this._context_move_top_button,    haveSelection);
-			this.setEnabled(this._context_move_up_button,     haveSelection);
-			this.setEnabled(this._context_move_down_button,   haveSelection);
-			this.setEnabled(this._context_move_bottom_button, haveSelection);
-			this.setEnabled(this._context_start_now_button,   havePausedSelection);
-			this.setEnabled(this._toolbar_remove_button,      haveSelection);
-			this.setEnabled(this._toolbar_pause_all_button,   haveActive);
-			this.setEnabled(this._toolbar_start_all_button,   havePaused);
+		for (var i=0, row; row=this._rows[i]; ++i) {
+			var isStopped = row.getTorrent().isStopped();
+			var isSelected = row.isSelected();
+			if (!isStopped) haveActive = true;
+			if (isStopped) havePaused = true;
+			if (isSelected) haveSelection = true;
+			if (isSelected && !isStopped) haveActiveSelection = true;
+			if (isSelected && isStopped) havePausedSelection = true;
 		}
+
+		this.setEnabled(e.toolbar_pause_button,       haveActiveSelection);
+		this.setEnabled(e.context_pause_button,       haveActiveSelection);
+		this.setEnabled(e.toolbar_start_button,       havePausedSelection);
+		this.setEnabled(e.context_start_button,       havePausedSelection);
+		this.setEnabled(e.context_move_top_button,    haveSelection);
+		this.setEnabled(e.context_move_up_button,     haveSelection);
+		this.setEnabled(e.context_move_down_button,   haveSelection);
+		this.setEnabled(e.context_move_bottom_button, haveSelection);
+		this.setEnabled(e.context_start_now_button,   havePausedSelection);
+		this.setEnabled(e.toolbar_remove_button,      haveSelection);
+		this.setEnabled(e.toolbar_pause_all_button,   haveActive);
+		this.setEnabled(e.toolbar_start_all_button,   havePaused);
 	},
 
 	/****
@@ -1367,6 +1229,9 @@ Transmission.prototype =
 	},
 	setInspectorVisible: function(visible)
 	{
+		if (visible)
+			this.inspector.setTorrents(this.getSelectedTorrents());
+
 		// update the ui widgetry
 		$('#torrent_inspector').toggle(visible);
 		if (isMobileDevice) {
@@ -1378,9 +1243,6 @@ Transmission.prototype =
 			$('#torrent_container')[0].style.right = w;
 		}
 		setInnerHTML($('ul li#context_toggle_inspector')[0], (visible?'Hide':'Show')+' Inspector');
-
-		if (visible)
-			this.inspector.setTorrents(this.getSelectedTorrents());
 	},
 
 	/****
@@ -1394,7 +1256,7 @@ Transmission.prototype =
 		var popup = $('#filter-popup');
 		popup.dialog({
 			autoOpen: false,
-			position: isMobileDevice ? [0,0] : [40,80],
+			position: isMobileDevice ? 'center' : [40,80],
 			show: 'blind',
 			hide: 'blind',
 			title: 'Show',
@@ -1424,7 +1286,6 @@ Transmission.prototype =
 		    visible_count = this._rows.length;
 
 		// count the total number of torrents
-		// torrent_count = Object.keys(this._torrents).length; // IE8 doesn't support Object.keys(
 		torrent_count = 0;
 		o = this._torrents;
 		for (tmp in o)
@@ -1452,8 +1313,10 @@ Transmission.prototype =
 	refilterSoon: function()
 	{
 		if (!this.refilterTimer) {
-			var tr = this;
-			this.refilterTimer = setTimeout(function(){tr.refilter(false);}, 100);
+			var tr = this,
+			    callback = function(){tr.refilter(false);},
+			    msec = 100;
+			this.refilterTimer = setTimeout(callback, msec);
 		}
 	},
 
@@ -1485,7 +1348,7 @@ Transmission.prototype =
 		    filter_text = this.filterText,
 		    filter_tracker = this.filterTracker,
 		    renderer = this.torrentRenderer,
-		    list = this._torrent_list,
+		    list = this.elements.torrent_list,
 		    old_sel_count = $(list).children('.selected').length;
 
 
@@ -1652,11 +1515,10 @@ Transmission.prototype =
 		****  Trackers
 		***/
 
-		var trackers = this.getTrackers();
-		//var names = Object.keys(trackers).sort(); (IE8 doesn't have Object.keys)
-		var name, name=[];
-		var names = [];
-		for  (name in trackers)
+		var trackers = this.getTrackers(),
+		    name, name=[],
+		    names = [];
+		for (name in trackers)
 			names.push (name);
 		names.sort();
 
diff --git a/web/stylesheets/common.css b/web/stylesheets/common.css
index 316ea819b..4bc98c923 100644
--- a/web/stylesheets/common.css
+++ b/web/stylesheets/common.css
@@ -50,20 +50,12 @@ a {
 	width: 100%;
 	height: 75px;
 	margin: 0;
-        border: 1px outset #AEBBCB;
+	border: 1px outset #AEBBCB;
 	overflow: hidden;
 	-moz-user-select: none;
 	-webkit-user-select: none;
 }
 
-#toolbar h1 {
-	height: inherit;
-	width: 205px;
-	text-indent: -9000px !important;
-	padding: 0;
-	margin: 0 0 0 5px;
-}
-
 #toolbar ul {
 	height: 50px;
 	margin: 0;
@@ -214,7 +206,6 @@ div#filter-popup #filter-by-state .row .filter-name {
         left: 0px;
 }
 #filter-popup .row {
-	font-size: 1.2em;
 	text-align: left;
 	cursor: pointer;
 	margin: 8px 2px;
@@ -484,6 +475,49 @@ li.torrent a:active div.torrent_resume {
 	background-position: center bottom;
 }
 
+/***
+****
+****  PREFERENCES
+****
+***/
+
+#prefs-dialog.ui-tabs .ui-tabs-panel {
+	padding: 0px;
+	-moz-user-select: none;
+	-webkit-user-select: none;
+}
+.prefs-section {
+	margin: 10px;
+	text-align: left;
+}
+.prefs-section > * {
+	padding-top: 8px;
+	padding-left: 8px;
+}
+.prefs-section .title {
+	font-weight: bold;
+	padding-left: 0px;
+}
+.prefs-section .row .key {
+	float: left;
+	padding-top: 3px;
+}
+.prefs-section .row .key > * {
+	margin-left: 0px;
+}
+.prefs-section .row .value {
+	margin-left: 150px;
+}
+.prefs-section .row .value > * {
+	width: 100%;
+}
+.prefs-section .checkbox-row > input {
+	margin: 0px;
+}
+.prefs-section .checkbox-row > label {
+	margin-left: 5px;
+}
+
 /*--------------------------------------
  *
  * T O R R E N T   I N S P E C T O R
@@ -866,11 +900,12 @@ li.inspector_torrent_file_list_entry.complete div.file_priority_control {
 	cursor: default;
 }
 
-/*--------------------------------------
- *
- * T O R R E N T   F O O T E R
- *
- *--------------------------------------*/
+
+/****
+*****
+*****  MAIN WINDOW FOOTER
+*****
+****/
 
 div.torrent_footer {
 	height: 22px;
@@ -900,48 +935,51 @@ div.torrent_footer ul#settings_menu li#button {
 	padding: 0;
 	position: relative;
 }
-div.torrent_footer ul#settings_menu li#button:active,
-div.torrent_footer ul#settings_menu li#button:hover {
+div.torrent_footer ul#settings_menu li#button:hover,
+div.torrent_footer ul#settings_menu li#button:active {
 	background-position: -32px top;
 }
 
 #turtle-button {
 	background: transparent url('../images/graphics/chrome.png') left -18px no-repeat;
 }
-#turtle-button:active,
-#turtle-button:hover {
+#turtle-button:hover,
+#turtle-button:active {
 	background-position: -32px -18px;
 }
 #turtle-button.enabled {
 	background-position: left -36px;
 }
-#turtle-button.enabled:active,
-#turtle-button.enabled:hover {
+#turtle-button.enabled:hover,
+#turtle-button.enabled:active {
 	background-position: -32px -36px;
 }
 
 #compact-button {
-        background: transparent url('../images/graphics/chrome.png') left -54px no-repeat;
+	background: transparent url('../images/graphics/chrome.png') left -54px no-repeat;
 }
-#compact-button:active,
-#compact-button:hover {
+#compact-button:hover,
+#compact-button:active {
 	background-position: -32px -54px;
 }
 #compact-button.enabled {
 	background-position: left -72px;
 }
-#compact-button.enabled:active,
-#compact-button.enabled:hover {
+#compact-button.enabled:hover,
+#compact-button.enabled:active {
 	background-position: -32px -72px;
 }
 
+#prefs-button {
+	display: none;
+}
 
 
-/*--------------------------------------
- *
- * D I A L O G S
- *
- *--------------------------------------*/
+/****
+*****
+*****  DIALOGS
+*****
+****/
 
 div.dialog_container {
 	position: absolute;
@@ -1073,114 +1111,6 @@ iframe#torrent_upload_frame {
 	margin: 0;
 }
 
-div#prefs_container label {
-	display: block;
-	margin: 0 0 0 2px;
-}
-
-div#prefs_container label.category {
-	clear: both;
-	font-size: 1.2em;
-}
-
-div#prefs_container label.item {
-	font-size: 11px !important;
-	margin: 0 5px 0 20px;
-	float: left;
-}
-
-div#prefs_container label.suffix {
-	margin: 0 5px 0 10px;
-	float: left;
-}
-
-div#prefs_container div.formdiv.checkbox label.item {
-	margin: 0 5px 0 2px;
-}
-
-div#prefs_container div.limit_total label.item {
-	width: 102px;
-}
-
-div#prefs_container div.limit_turtle label.item {
-	width: 120px;
-}
-
-div#prefs_container div.preference input[type=checkbox] {
-	float: left;
-	margin-left: 20px;
-	margin-top: 9px;
-}
-@-moz-document url-prefix() {
-	div#prefs_container div.preference input[type=checkbox] {
-		margin-top: 8px;
-	}
-}
-
-div#prefs_container div.preference input[type=text] {
-	width: 50px;
-	padding: 0px !important;
-	height: 18px;
-	margin-top: 2px;
-}
-
-div#prefs_container div.preference input {
-	float: left;
-}
-
-div#prefs_container div.block_url input {
-	width: 256px !important;
-}
-
-div#prefs_container div.download_location input {
-	width: 256px !important;
-}
-div#prefs_container div.download_location .checkbox input {
-	width: auto !important;
-}
-
-div#prefs_container div.formdiv {
-	clear: both;
-	line-height: 30px;
-}
-
-div#prefs_container a {
-	clear: left;
-	margin: 10px 5px 10px 7px;
-}
-
-div#prefs_container h2.dialog_heading {
-	display: none;
-}
-
-div#prefs_container div#prefs_tabs {
-	clear: both;
-}
-div#prefs_container div#prefs_tabs ul {
-	margin: 0;
-	padding: 0 0 0 10px;
-}
-.prefs-tab {
-	cursor: pointer;
-	display: block;
-	float: left;
-	font-size: 1.2em;
-	color: #323232;
-	text-align: center;
-	padding: 2px 20px;
-	border: 1px solid #787878;
-	margin-bottom: -1px;
-	background: #C0C8D6 url('../images/graphics/filter_bar.png') bottom repeat-x;
-}
-.prefs-tab.selected {
-	background: none;
-	border-bottom: 1px solid #efefef;
-}
-.prefs-page {
-	border-top: 1px solid #787878;
-	clear: both;
-	padding: 7px;
-}
 div#stats_container h2.dialog_heading {
 	display: none;
 }
@@ -1235,33 +1165,11 @@ div#stats_container a {
 	margin: 10px 5px 10px 7px;
 }
 
-div#prefs_container div#pref_error {
-	display: none;
-	width: 395px;
-	margin: 6px auto 6px auto;
-	padding: 3px 0 3px 0;
-	border: 2px solid #cc3333;
-	color: #cc3333;
-	font-size: 1.2em;
-	vertical-align: middle;
-	text-align: center;
-	height: 20px;
-	line-height: 20px;
-	background-color: #FFEFEF;
-}
-
-#transmission_version{
-	position: absolute;
-	bottom: 10px;
-	left:   10px;
-	color:  #999;
-}
-
-/*--------------------------------------
- *
- * T R A N S   M E N U
- *
- *--------------------------------------*/
+/****
+*****
+*****  POPUP MENU
+*****
+****/
 
 .trans_menu {
 	margin: 0;
@@ -1297,9 +1205,8 @@ div#prefs_container div#pref_error {
 
 .trans_menu > * li {
 	margin: 0;
-	padding: 0 10px 2px 20px !important;
+	padding: 3px 10px 3px 20px !important;
 	color: #000;
-	font-size: 14px;
 	cursor: default;
 	text-indent: auto !important;
 	width: inherit;
@@ -1322,10 +1229,6 @@ div#prefs_container div#pref_error {
 
 .trans_menu li span.arrow {
 	float: right;
-	margin: 3px 0 0;
-	font-size: 11px;
-	color: #333;
-	text-shadow: none;
 }
 
 .trans_menu li.hover li.hover span.arrow, .trans_menu li.hover li.hover li.hover span.selected {
@@ -1334,7 +1237,6 @@ div#prefs_container div#pref_error {
 
 .trans_menu span.selected {
 	margin: 0 3px 0 -15px;
-	font-size: 14px;
 	color: #666;
 	float: left;
 }
diff --git a/web/stylesheets/mobile.css b/web/stylesheets/mobile.css
index 08d54070f..36a16e1b7 100644
--- a/web/stylesheets/mobile.css
+++ b/web/stylesheets/mobile.css
@@ -12,8 +12,7 @@ html {
 
 body {
 	font: 11px Helvetica, Arial, sans-serif;
-	color: #323232 !important;
-	background: #fff;
+	background: #FFF;
 	text-align: center;
 	margin: 0;
 	padding: 0;
@@ -65,25 +64,24 @@ body.open_showing #torrent_filter_bar, body.open_showing #torrent_container {
 	margin: 0;
 	background: #6685a1 url('../images/graphics/iphone_chrome.png') top left repeat-x;
 	border: 1px outset #AEBBCB;
-	position: relative;
-	text-shadow: 0 -1px 0 #446;
 }
 
 #toolbar ul {
 	margin: 0;
 	padding: 0 3px;
-	text-align: left;
+	text-align: center;
 }
 
 #toolbar ul li {
 	list-style-type: none;
 	list-style-image: none;
-	padding: 0;
 	margin: 4px 0 0 0;
+	padding: 0 2px;
+	cursor: pointer;
 	display: inline-block;
 }
 
-#toolbar li#remove, li#open {
+#toolbar li#remove, li#open, li#resume_selected, li#pause_selected {
 	float: left;
 }
 #toolbar li#resume_all, li#pause_all {
@@ -103,11 +101,7 @@ body.open_showing #torrent_filter_bar, body.open_showing #torrent_container {
 	font-weight: bold;
 }
 
-#toolbar ul li.disabled {
-	opacity: 0.25;
-}
-
-#toolbar ul li div div.toolbar_image {
+#toolbar ul li div.toolbar_image {
 	width: 32px;
 	height: 32px;
 	margin: 0 auto 2px;
@@ -132,6 +126,12 @@ li#filter          div:active div.toolbar_image { background-position: right -19
 li#inspector       div        div.toolbar_image { background-position: left  -224px; }
 li#inspector       div:active div.toolbar_image { background-position: right -224px; }
 
+#toolbar ul li.disabled > div {
+	text-shadow: 0 1px 0 #fff;
+	opacity: 0.25;
+	cursor: default;
+}
+
 #toolbar ul li#filter,
 #toolbar ul li#inspector,
 #toolbar ul li.divider {
@@ -207,12 +207,13 @@ div#filter-popup #filter-by-state .row .filter-name {
         left: 0px;
 }
 #filter-popup .row {
-	font-size: 1.2em;
 	text-align: left;
 	cursor: pointer;
 	margin: 15px 2px;
 	position: relative;
 	height: 18px;
+	-moz-user-select: none;
+	-webkit-user-select: none;
 }
 div#filter-popup .row .filter-img {
         border: none;
@@ -256,7 +257,6 @@ div#filter-popup .row .filter-img {
 ***/
 
 ul.torrent_list {
-	width: 100%;
 	margin: 0;
 	padding: 0;
 	text-align: left;
@@ -297,12 +297,12 @@ ul.torrent_list li.torrent.even {
 }
 
 ul.torrent_list li.torrent.selected {
-	background-color: #3875D7;
+	background-color: #3879D7;
 	color: #FFF;
 }
 
 ul.torrent_list li.torrent div.torrent_name {
-	font-size: 13px;
+	font-size: 1.3em;
 	font-weight: bold;
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -325,10 +325,29 @@ ul.torrent_list li.torrent.selected div.torrent_name {
 	color: #fff;
 }
 
-div.torrent_peer_details {
-	font-size: 10px;
+ul.torrent_list div.torrent_progress_details,
+ul.torrent_list div.torrent_peer_details {
+	clear: left;
+	font-size: 1em;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+ul.torrent_list li.torrent div.torrent_progress_details.error {
+	color: #FF0000;
+}
+ul.torrent_list li.torrent.selected div.torrent_progress_details.error {
+	color: #FFF;
+}
+ul.torrent_list li.torrent div.torrent_peer_details.error {
+	color: #FF0000;
+}
+ul.torrent_list li.torrent.selected div.torrent_peer_details.error {
+	color: #FFF;
 }
 
+
 /**
  * Progressbar
  *
@@ -402,24 +421,24 @@ ul.torrent_list div.torrent_progress_bar.complete.leeching {
         border-color: #3D9DEA;
 }
 ul.torrent_list div.torrent_progress_bar.complete.leeching.queued {
-	background-position: left -70px;
-	border-color: #889CA5;
+        background-position: left -70px;
+        border-color: #889CA5;
 }
 ul.torrent_list div.torrent_progress_bar.incomplete.leeching {
         background-position: left -20px;
         border-color: #CFCFCF;
 }
 ul.torrent_list div.torrent_progress_bar.incomplete.leeching.queued {
-	background-position: left -80px;
-	border-color: #C4C4C4;
+        background-position: left -80px;
+        border-color: #C4C4C4;
 }
 ul.torrent_list div.torrent_progress_bar.complete.seeding {
         background-position: left -40px;
         border-color: #269E30;
 }
 ul.torrent_list div.torrent_progress_bar.complete.seeding.queued {
-	background-position: left -60px;
-	border-color: #8A998D;
+        background-position: left -60px;
+        border-color: #8A998D;
 }
 ul.torrent_list div.torrent_progress_bar.incomplete.seeding {
         background-position: left -10px;
@@ -474,17 +493,6 @@ div.dialog_container a {
 	text-align: center;
 }
 
-div.dialog_container a#dialog_cancel_button, div.dialog_container a#prefs_cancel_button {
-	left: 55px;
-}
-
-div.dialog_container a#dialog_confirm_button, div.dialog_container a#prefs_save_button {
-	right: 55px;
-	color: black;
-	text-shadow: none;
-	background: #fff;
-}
-
 #dialog_container div.dialog_window img {
 	margin: 5px auto 12px;
 }
@@ -514,93 +522,47 @@ div.dialog_container a#dialog_confirm_button, div.dialog_container a#prefs_save_
 	text-align: left;
 }
 
-/*--------------------------------------
- *
- * P R E F S   C O N T A I N E R
- *
- *--------------------------------------*/
+/***
+****
+****  PREFERENCES
+****
+***/
 
-div#prefs_container {
-	text-align: left;
+#prefs-dialog.ui-tabs .ui-tabs-panel {
+	padding: 0px;
+	-moz-user-select: none;
+	-webkit-user-select: none;
 }
-
-div#prefs_container label.item {
-	margin: 0 5px 0 15px;
-	float: left;
+.prefs-section {
+	margin: 10px;
+	text-align: left;
 }
-
-form#prefs_form {
-	height: 365px;
-	padding: 0 5px;
+.prefs-section > * {
+	padding-top: 8px;
+	padding-left: 8px;
 }
-
-div#prefs_container label.suffix {
-	margin: 0 5px 0 10px;
-	float: left;
+.prefs-section .title {
+	font-weight: bold;
+	padding-left: 0px;
 }
-
-div#prefs_container input {
+.prefs-section .row .key {
 	float: left;
+	padding-top: 3px;
 }
-
-div#prefs_container div.preference input[type=checkbox] {
-	margin: 3px 7px 0 16px;
-	width: 18px;
-	height: 18px;
-	clear: left;
-}
-
-div#prefs_container label {
-	line-height: 25px;
-	display: block;
-}
-
-div#prefs_container div.download_location label.item,
-div#prefs_container div.port label.item,
-div#prefs_container div.web_gui label.item {
-	width: 127px;
-	clear: left;
-}
-
-div#prefs_container div.auto_start label.item,
-div#prefs_container div.encryption label.item,
-div#prefs_container div.limit_total label.item {
-	margin: 0 5px 0 0;
-}
-
-div#prefs_container div.limit_total label.item {
-	width: 101px;
-}
-
-div#prefs_container div.preference input[type=text] {
-	padding: 2px 2px 1px;
-	text-shadow: none !important;
-	font-size: 13px;
-	width: 50px;
+.prefs-section .row .key > * {
+	margin-left: 0px;
 }
-
-div#prefs_container div.download_location input {
-	position: absolute;
-	right: 20px;
-	left: 160px;
-	width: auto !important;
-}
-
-div#prefs_container label.category {
-	clear: both;
-	font-weight: bold;
+.prefs-section .row .value {
+	margin-left: 150px;
 }
-
-div#prefs_container a {
-	margin-top: 42px !important;
+.prefs-section .row .value > * {
+	width: 100%;
 }
-
-.landscape div.dialog_container a#prefs_cancel_button {
-	left: 135px;
+.prefs-section .checkbox-row > input {
+	margin: 0px;
 }
-
-.landscape div.dialog_container a#prefs_save_button {
-	right: 135px;
+.prefs-section .checkbox-row > label {
+	margin-left: 5px;
 }
 
 /*--------------------------------------
@@ -630,11 +592,10 @@ div#torrent_inspector {
 div#torrent_inspector #torrent_inspector_name {
 	margin: 0;
 	overflow: hidden;
-	word-wrap: break-word;
 }
 div#torrent_inspector #torrent_inspector_size {
 	font-size: 1.2em;
-	margin: 3;
+	margin: 3px;
 	display: block;
 	padding-top: 2px;
 }
@@ -790,9 +751,6 @@ div.inspector_torrent_file_list_entry_name {
 li.inspector_torrent_file_list_entry.skip>.inspector_torrent_file_list_entry_name {
 	color: #666;
 }
-li.inspector_torrent_file_list_entry.even {
-	background-color: #EEEEEE;
-}
 div.inspector_torrent_file_list_entry_progress {
 	font-size: 1em;
 	color: #666;
@@ -836,12 +794,21 @@ div.file_priority_control {
 	cursor: pointer;
 }
 div.file_priority_control.normal {
+	background-position: left top;
+}
+div.file_priority_control.normal:hover {
 	background-position: right top;
 }
 div.file_priority_control.high {
+	background-position: left -19px;
+}
+div.file_priority_control.high:hover {
 	background-position: right -19px;
 }
 div.file_priority_control.low {
+	background-position: left -38px;
+}
+div.file_priority_control.low:hover {
 	background-position: right -38px;
 }
 ul.single_file li.inspector_torrent_file_list_entry>.file_priority_control, li.inspector_torrent_file_list_entry.complete div.file_priority_control {
@@ -850,104 +817,84 @@ ul.single_file li.inspector_torrent_file_list_entry>.file_priority_control, li.i
 }
 
 
-/*--------------------------------------
- *
- * T O R R E N T   F O O T E R
- *
- *--------------------------------------*/
+/****
+*****
+*****  MAIN WINDOW FOOTER
+*****
+****/
 
 div.torrent_footer {
-	margin: 0px;
 	height: 20px;
-	border-top: 1px solid #777;
+	padding: 1px;
+	border-top: 1px solid #555;
 	position: relative;
 	width: 100%;
-	z-index: 2;
-	text-align: center;
-	color: #222;
-	text-shadow: 0 1px 1px #fff;
-	overflow: hidden;
-
-        background-color: #B9B9B9; /* fallback color if gradients are not supported */
-        background-image: -webkit-gradient(linear, left top, left bottom, from(#C9C9C9), to(#A7A7A7));
-        background-image: -webkit-linear-gradient(top, #C9C9C9, #A7A7A7);
-        background-image:    -moz-linear-gradient(top, #C9C9C9, #A7A7A7);
-        background-image:     -ms-linear-gradient(top, #C9C9C9, #A7A7A7);
-        background-image:      -o-linear-gradient(top, #C9C9C9, #A7A7A7);
-        background-image:         linear-gradient(top, #C9C9C9, #A7A7A7); /* standard, but currently unimplemented */
-}
-
-div.torrent_footer div#disk_space_container, div.torrent_footer a#preferences_link {
-	float: right;
-	font-size: 12px;
-	vertical-align: middle;
-	margin: 1px 6px 0 0;
-	padding: 2px 0 2px;
-	max-width: 55%;
-	overflow: hidden;
-	white-space: nowrap;
-	text-overflow: ellipsis;
+	z-index: 3;
+	background-color: #6b83a1;
 }
 
-div.torrent_footer a#preferences_link {
+div.torrent_footer > * {
+	position: relative;
 	float: left;
-	font-weight: bold;
-	margin: 1px 0 0 6px;
+	margin-right: 30px;
+}
+div.torrent_footer > * {
+	height: 18px;
+	width: 32px;
+	cursor: pointer;
+	-moz-user-select: none;
+	-webkit-user-select: none;
 }
 
-body.prefs_showing div.torrent_footer a#preferences_link, body.dialog_showing div.torrent_footer a#preferences_link {
+div.torrent_footer ul#settings_menu {
 	display: none;
 }
 
-iframe#torrent_upload_frame {
-	display: block; /* Don't change this : safari forms won't target hidden frames (they open a new window) */
-	position: absolute;
-	top: -1000px;
-	left: -1000px;
-	width: 0px;
-	height: 0px;
-	border: none;
-	padding: 0;
-	margin: 0;
+#turtle-button {
+	background: transparent url('../images/graphics/chrome.png') left -18px no-repeat;
 }
-
-div.torrent_footer #compact-button,
-div.torrent_footer #turtle-button {
-	position: absolute;
-	height: 18px;
-	width: 32px !important;
-	top: 0px;
-	margin: 2px;
+#turtle-button:active {
+	background-position: -32px -18px;
+}
+#turtle-button.enabled {
+	background-position: left -36px;
+}
+#turtle-button.enabled:active {
+	background-position: -32px -36px;
 }
 
 #compact-button {
-	right: 0px;
-        background: transparent url('../images/graphics/chrome.png') left -54px no-repeat;
+	background: transparent url('../images/graphics/chrome.png') left -54px no-repeat;
 }
 #compact-button:active {
-        background-position: -32px -54px;
+	background-position: -32px -54px;
 }
 #compact-button.enabled {
-        background-position: left -72px;
+	background-position: left -72px;
 }
 #compact-button.enabled:active {
-        background-position: -32px -72px;
+	background-position: -32px -72px;
 }
 
-#turtle-button {
-	left: 0px;
-        background: transparent url('../images/graphics/chrome.png') left -18px no-repeat;
+#prefs-button {
+	background: transparent url('../images/graphics/chrome.png') left -90px no-repeat;
 }
-#turtle-button:active {
-        background-position: -32px -18px;
-}
-#turtle-button.enabled {
-        background-position: left -36px;
+#prefs-button:active {
+	background-position: -32px -90px;
 }
-#turtle-button.enabled:active {
-        background-position: -32px -36px;
+
+/****
+*****
+*****  POPUP MENU
+*****
+****/
+
+.trans_menu,
+.trans_menu * {
+	display: none;
 }
 
+
 /*--------------------------------------
  *
  * Hide remnants of stuff we don't need, like
@@ -955,6 +902,18 @@ div.torrent_footer #turtle-button {
  *
  *--------------------------------------*/
 
-.torrent_footer div.main_container, .torrent_footer ul#settings_menu, div.torrent_footer ul#settings_menu li#button, div#torrent_context_menu {
+div#torrent_context_menu {
 	display: none;
 }
+
+iframe#torrent_upload_frame {
+	display: block; /* Don't change this : safari forms won't target hidden frames (they open a new window) */
+	position: absolute;
+	top: -1000px;
+	left: -1000px;
+	width: 0px;
+	height: 0px;
+	border: none;
+	padding: 0;
+	margin: 0;
+}