Re-organization of the main page: mini graph is on top of download list (one click on it to enlarge / reduce it) + fixed message when nothing on download list.

This commit is contained in:
Florent Viard 2014-02-18 01:10:45 +01:00
parent b1da2b0a84
commit d3d9b6fd42
3 changed files with 25 additions and 14 deletions

View File

@ -19,12 +19,15 @@
}
.download-graph {
width: 80%;
width: 30%;
margin-top: 5px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
}
.large-graph {
width: 80%;
}
.stats {
margin-top: 0px;
margin-bottom: 0px;

View File

@ -237,12 +237,26 @@
<!--}}} -->
<!-- {{{ downloads -->
<div ng-show="!totalAria2Downloads() && totalAria2Downloads() > getDownloads()" class="hero-unit">
<h3>Currently no downloads in line to display, use the Add download button to start downloading files!</h3>
<!-- Bug?? <div ng-show="!totalAria2Downloads() && totalAria2Downloads() > getDownloads()" class="hero-unit">-->
<div ng-show="!totalAria2Downloads()" class="hero-unit">
Currently no download in line to display, use the '<strong>Add</strong>' download button to start downloading files!
</div>
<!-- {{{ global statistics -->
<h3 ng-show="totalAria2Downloads()">Global Statistics</h3>
<div ng-class="{'large-graph': large_graph}" class="download-graph"
dspeed="gstats.downloadSpeed"
uspeed="gstats.uploadSpeed"
dgraph ng-show="totalAria2Downloads()"
ng-click="large_graph = !large_graph">
</div>
<!-- }}} -->
<!-- {{{ download template -->
<h3 ng-show="totalAria2Downloads()">Download List</h3>
<form class="row" ng-show="(totalAria2Downloads() > pageSize) || downloadFilter.length">
<fieldset>
@ -555,16 +569,7 @@
</div>
<!-- }}} -->
<!-- {{{ global statistics -->
<h3 ng-show="totalAria2Downloads()">Global Statistics</h3>
<div class="download-graph"
dspeed="gstats.downloadSpeed"
uspeed="gstats.uploadSpeed"
dgraph ng-show="totalAria2Downloads()">
</div>
<!-- }}} -->
</div>
@ -820,5 +825,8 @@ http://ex1.com/f2.mp4 http://ex2.com/f2.mp4
</div>
<!-- }}} -->
<!-- Bottom Padding -->
<br /><br /><br /><br /><br />
</body>
</html>

View File

@ -1,5 +1,5 @@
// graph takes dspeed and uspeed, it queries them every second and draws
// the last 20 secs, it also takes draw as an optional attribute and only
// the last 180 secs, it also takes draw as an optional attribute and only
// draws the graph when it is true, if not given then graph is always drawn
angular
.module('webui.directives.dgraph', ['webui.filters.bytes', 'webui.services.deps'])
@ -7,7 +7,7 @@ angular
return function(scope, elem, attrs) {
var canDraw = true;
var graphSize = 20
var graphSize = 180
, dspeed = 0, uspeed = 0
, dconf = {
label: "Download Speed",