d4708
/
qBittorrent
mirror of https://github.com/d47081/qBittorrent.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #9387 from Piccirello/webui-pref-tweaks 

Minor WebUI visual changes
adaptive-webui-19844
Mike Tzou 6 years ago committed by GitHub
parent
487ea36782 fef1ad6083
commit
5cb41c3c2d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 78 additions and 33 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 21
      src/webui/www/private/css/style.css
  2. 45
      src/webui/www/private/filters.html
  3. 28
      src/webui/www/private/preferences_content.html
  4. 15
      src/webui/www/private/scripts/client.js
  5. 2
      src/webui/www/private/scripts/mocha-init.js

21
src/webui/www/private/css/style.css
Unescape View File

@ -383,6 +383,14 @@ fieldset.settings .leftLabelSmall { @@ -383,6 +383,14 @@ fieldset.settings .leftLabelSmall {
display: block;
}
fieldset.settings .leftLabelMedium {
width: 9em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
}
fieldset.settings .leftLabelLarge {
width: 14em;
float: left;
@ -400,6 +408,19 @@ div.formRow { @@ -400,6 +408,19 @@ div.formRow {
font-weight: bold;
text-transform: uppercase;
padding-left: 5px;
padding-top: 5px;
display: block;
}
.filterTitle img {
width: 16px;
height: 16px;
margin-bottom: -3px;
padding: 0 5px;
}
.filterTitle img.rotate {
transform: rotate(270deg);
}
ul.filterList {

45
src/webui/www/private/filters.html
Unescape View File

@ -1,19 +1,26 @@ @@ -1,19 +1,26 @@
<span class="filterTitle">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]</span>
<ul class="filterList">
<li id="all_filter"><a href="#" onclick="setFilter('all');return false;"><img src="images/skin/filterall.svg" alt="All" />QBT_TR(All (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="downloading_filter"><a href="#" onclick="setFilter('downloading');return false;"><img src="images/skin/downloading.svg" alt="Downloading" />QBT_TR(Downloading (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="seeding_filter"><a href="#" onclick="setFilter('seeding');return false;"><img src="images/skin/uploading.svg" alt="Seeding" />QBT_TR(Seeding (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="completed_filter"><a href="#" onclick="setFilter('completed');return false;"><img src="images/skin/completed.svg" alt="Completed" />QBT_TR(Completed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="resumed_filter"><a href="#" onclick="setFilter('resumed');return false;"><img src="images/skin/resumed.svg" alt="Resumed" />QBT_TR(Resumed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="paused_filter"><a href="#" onclick="setFilter('paused');return false;"><img src="images/skin/paused.svg" alt="Paused" />QBT_TR(Paused (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="active_filter"><a href="#" onclick="setFilter('active');return false;"><img src="images/skin/filteractive.svg" alt="Active" />QBT_TR(Active (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="inactive_filter"><a href="#" onclick="setFilter('inactive');return false;"><img src="images/skin/filterinactive.svg" alt="Inactive" />QBT_TR(Inactive (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="errored_filter"><a href="#" onclick="setFilter('errored');return false;"><img src="images/skin/error.svg" alt="Errored" />QBT_TR(Errored (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
</ul>
<br/>
<span class="filterTitle">QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget]</span>
<ul id="filterCategoryList" class="filterList">
</ul>
<div class="filterWrapper">
<span class="filterTitle" onclick="toggleFilterDisplay('status');">
<img src="images/qbt-theme/go-down.svg">QBT_TR(Status)QBT_TR[CONTEXT=TransferListFiltersWidget]
</span>
<ul class="filterList" id="statusFilterList">
<li id="all_filter"><a href="#" onclick="setFilter('all');return false;"><img src="images/skin/filterall.svg" alt="All" />QBT_TR(All (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="downloading_filter"><a href="#" onclick="setFilter('downloading');return false;"><img src="images/skin/downloading.svg" alt="Downloading" />QBT_TR(Downloading (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="seeding_filter"><a href="#" onclick="setFilter('seeding');return false;"><img src="images/skin/uploading.svg" alt="Seeding" />QBT_TR(Seeding (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="completed_filter"><a href="#" onclick="setFilter('completed');return false;"><img src="images/skin/completed.svg" alt="Completed" />QBT_TR(Completed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="resumed_filter"><a href="#" onclick="setFilter('resumed');return false;"><img src="images/skin/resumed.svg" alt="Resumed" />QBT_TR(Resumed (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="paused_filter"><a href="#" onclick="setFilter('paused');return false;"><img src="images/skin/paused.svg" alt="Paused" />QBT_TR(Paused (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="active_filter"><a href="#" onclick="setFilter('active');return false;"><img src="images/skin/filteractive.svg" alt="Active" />QBT_TR(Active (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="inactive_filter"><a href="#" onclick="setFilter('inactive');return false;"><img src="images/skin/filterinactive.svg" alt="Inactive" />QBT_TR(Inactive (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
<li id="errored_filter"><a href="#" onclick="setFilter('errored');return false;"><img src="images/skin/error.svg" alt="Errored" />QBT_TR(Errored (0))QBT_TR[CONTEXT=StatusFilterWidget]</a></li>
</ul>
</div>
<div class="filterWrapper">
<span class="filterTitle" onclick="toggleFilterDisplay('category');">
<img src="images/qbt-theme/go-down.svg">QBT_TR(Categories)QBT_TR[CONTEXT=TransferListFiltersWidget]
</span>
<ul class="filterList" id="categoryFilterList">
</ul>
</div>
<script>
var categoriesFilterContextMenu = new CategoriesFilterContextMenu({
@ -47,4 +54,10 @@ @@ -47,4 +54,10 @@
this.options.element.firstChild.click();
}
});
if (localStorage.getItem('filter_status_collapsed') === "true")
toggleFilterDisplay('status');
if (localStorage.getItem('filter_category_collapsed') === "true")
toggleFilterDisplay('category');
</script>

28
src/webui/www/private/preferences_content.html
Unescape View File

@ -53,10 +53,10 @@ @@ -53,10 +53,10 @@
<legend><input type="checkbox" id="mail_notification_checkbox" onclick="updateMailNotification();" />
<label for="mail_notification_checkbox">QBT_TR(Email notification &upon download completion)QBT_TR[CONTEXT=OptionsDialog]</label></legend>
<div class="formRow">
<label for="dest_email_txt" class="leftLabelLarge">QBT_TR(To:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dest_email_txt" />
<label for="dest_email_txt" class="leftLabelMedium">QBT_TR(To:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dest_email_txt" />
</div>
<div class="formRow">
<label for="smtp_server_txt" class="leftLabelLarge">QBT_TR(SMTP server:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="smtp_server_txt" />
<label for="smtp_server_txt" class="leftLabelMedium">QBT_TR(SMTP server:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="smtp_server_txt" />
</div>
<div class="formRow">
<input type="checkbox" id="mail_ssl_checkbox" /><label for="mail_ssl_checkbox">QBT_TR(This server requires a secure connection (SSL))QBT_TR[CONTEXT=OptionsDialog]</label>
@ -64,10 +64,10 @@ @@ -64,10 +64,10 @@
<fieldset class="settings">
<legend><input type="checkbox" id="mail_auth_checkbox" onclick="updateMailAuthSettings();" /><label for="mail_auth_checkbox">QBT_TR(Authentication)QBT_TR[CONTEXT=OptionsDialog]</label></legend>
<div class="formRow">
<label for="mail_username_text" class="leftLabelLarge">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="mail_username_text" />
<label for="mail_username_text" class="leftLabelMedium">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="mail_username_text" />
</div>
<div class="formRow">
<label for="mail_password_text" class="leftLabelLarge">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="password" id="mail_password_text" />
<label for="mail_password_text" class="leftLabelMedium">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="password" id="mail_password_text" />
</div>
</fieldset>
</fieldset>
@ -180,11 +180,11 @@ @@ -180,11 +180,11 @@
<legend><input type="checkbox" id="peer_proxy_auth_checkbox" onclick="updatePeerProxyAuthSettings();" />
<label for="peer_proxy_auth_checkbox">QBT_TR(Authentication)QBT_TR[CONTEXT=OptionsDialog]</label></legend>
<div class="formRow">
<label for="peer_proxy_username_text" class="leftLabelLarge">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label>
<label for="peer_proxy_username_text" class="leftLabelMedium">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label>
<input type="text" id="peer_proxy_username_text" />
</div>
<div class="formRow">
<label for="peer_proxy_password_text" class="leftLabelLarge">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label>
<label for="peer_proxy_password_text" class="leftLabelMedium">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label>
<input type="password" id="peer_proxy_password_text" />
</div>
</fieldset>
@ -419,20 +419,20 @@ @@ -419,20 +419,20 @@
<fieldset class="settings">
<legend>QBT_TR(Web User Interface (Remote control))QBT_TR[CONTEXT=OptionsDialog]</legend>
<label for="webui_address_value">QBT_TR(IP address:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="webui_address_value" />
<label for="webui_port_value">QBT_TR(Port:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="webui_port_value" style="width: 4em;" /><br/>
<label for="webui_domain_textarea">QBT_TR(Server domains:)QBT_TR[CONTEXT=OptionsDialog]</label><textarea id="webui_domain_textarea" rows="1" cols="70"></textarea><br/>
<label class="leftLabelMedium" for="webui_address_value">QBT_TR(IP address:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="webui_address_value" />
<label for="webui_port_value" style="margin-left: 10px;">QBT_TR(Port:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="webui_port_value" style="width: 4em;" /><br/>
<label class="leftLabelMedium" for="webui_domain_textarea">QBT_TR(Server domains:)QBT_TR[CONTEXT=OptionsDialog]</label><textarea id="webui_domain_textarea" rows="1" cols="70"></textarea><br/>
<input type="checkbox" id="webui_upnp_checkbox" />
<label for="webui_upnp_checkbox">QBT_TR(Use UPnP / NAT-PMP to forward the port from my router)QBT_TR[CONTEXT=OptionsDialog]</label><br/>
<fieldset class="settings">
<legend><input type="checkbox" id="use_https_checkbox" onclick="updateHttpsSettings();" />
<label for="use_https_checkbox">QBT_TR(&Use HTTPS instead of HTTP)QBT_TR[CONTEXT=OptionsDialog]</label></legend>
<div class="formRow">
<label for="ssl_key_textarea" style="margin-left: 20px;">QBT_TR(Key:)QBT_TR[CONTEXT=OptionsDialog]</label>
<label class="leftLabelSmall" for="ssl_key_textarea">QBT_TR(Key:)QBT_TR[CONTEXT=OptionsDialog]</label>
<textarea id="ssl_key_textarea" rows="5" cols="70"></textarea>
</div>
<div class="formRow">
<label for="ssl_cert_textarea" style="margin-left: 20px;">QBT_TR(Certificate:)QBT_TR[CONTEXT=OptionsDialog]</label>
<label class="leftLabelSmall" for="ssl_cert_textarea">QBT_TR(Certificate:)QBT_TR[CONTEXT=OptionsDialog]</label>
<textarea id="ssl_cert_textarea" rows="5" cols="70"></textarea>
</div>
<div style="padding-left: 10px;"><a target="_blank" href="https://httpd.apache.org/docs/current/ssl/ssl_faq.html#aboutcerts">QBT_TR(Information about certificates)QBT_TR[CONTEXT=HttpServer]</a></div>
@ -478,13 +478,13 @@ @@ -478,13 +478,13 @@
</select>
<input type="button" value="QBT_TR(Register)QBT_TR[CONTEXT=OptionsDialog]" onclick="registerDynDns();" /><br/><br/>
<div class="formRow">
<label for="dyndns_domain_text" class="leftLabelSmall">QBT_TR(Domain name:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dyndns_domain_text" />
<label for="dyndns_domain_text" class="leftLabelMedium">QBT_TR(Domain name:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dyndns_domain_text" />
</div>
<div class="formRow">
<label for="dyndns_username_text" class="leftLabelSmall">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dyndns_username_text" />
<label for="dyndns_username_text" class="leftLabelMedium">QBT_TR(Username:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="text" id="dyndns_username_text" />
</div>
<div class="formRow">
<label for="dyndns_password_text" class="leftLabelSmall">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="password" id="dyndns_password_text" />
<label for="dyndns_password_text" class="leftLabelMedium">QBT_TR(Password:)QBT_TR[CONTEXT=OptionsDialog]</label><input type="password" id="dyndns_password_text" />
</div>
</fieldset>
</div>

15
src/webui/www/private/scripts/client.js
Unescape View File

@ -50,6 +50,7 @@ var setCategoryFilter = function() {}; @@ -50,6 +50,7 @@ var setCategoryFilter = function() {};
var selected_filter = getLocalStorageItem('selected_filter', 'all');
var setFilter = function() {};
var toggleFilterDisplay = function() {};
var loadSelectedCategory = function() {
selected_category = getLocalStorageItem('selected_category', CATEGORIES_ALL);
@ -132,6 +133,16 @@ window.addEvent('load', function() { @@ -132,6 +133,16 @@ window.addEvent('load', function() {
updateMainData();
};
toggleFilterDisplay = function(filter) {
var element = filter + "FilterList";
localStorage.setItem('filter_' + filter + "_collapsed", !$(element).hasClass("invisible"));
$(element).toggleClass("invisible")
var parent = $(element).getParent(".filterWrapper");
var toggleIcon = $(parent).getChildren(".filterTitle img");
if (toggleIcon)
toggleIcon[0].toggleClass("rotate");
};
new MochaUI.Panel({
id: 'Filters',
title: 'Panel',
@ -232,7 +243,7 @@ window.addEvent('load', function() { @@ -232,7 +243,7 @@ window.addEvent('load', function() {
};
var updateCategoryList = function() {
var categoryList = $('filterCategoryList');
var categoryList = $('categoryFilterList');
if (!categoryList)
return;
categoryList.empty();
@ -274,7 +285,7 @@ window.addEvent('load', function() { @@ -274,7 +285,7 @@ window.addEvent('load', function() {
};
var highlightSelectedCategory = function() {
var categoryList = $('filterCategoryList');
var categoryList = $('categoryFilterList');
if (!categoryList)
return;
var childrens = categoryList.childNodes;

2
src/webui/www/private/scripts/mocha-init.js
Unescape View File

@ -98,7 +98,7 @@ initializeWindows = function() { @@ -98,7 +98,7 @@ initializeWindows = function() {
paddingVertical: 0,
paddingHorizontal: 0,
width: loadWindowWidth(id, 700),
height: loadWindowHeight(id, 300),
height: loadWindowHeight(id, 500),
onResize: function() {
saveWindowSize(id);
}

Write Preview
Loading…
Cancel
Save