From 5c021741171f683f3e1323a8299e1169056742eb Mon Sep 17 00:00:00 2001
From: hamza zia <ziahamza2007@gmail.com>
Date: Sat, 26 Jan 2013 21:54:17 +0500
Subject: [PATCH] basic tweaks in styling in small resolutions, with graphs
 drawing updated in angular

---
 angular.html                |  4 +++-
 css/download.css            | 10 ++++++++++
 css/style.css               |  4 +++-
 js/directives/dgraph.js     | 11 +++++++----
 js/services/deps.js         |  2 +-
 js/services/rpc/jsoncall.js |  2 +-
 6 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/angular.html b/angular.html
index 7acb3f8..e056c4c 100644
--- a/angular.html
+++ b/angular.html
@@ -27,7 +27,9 @@
   <script src="js/libs/angular.js"></script>
 
   <script src="js/libs/jquery.flot.js"></script>
+  <!-- We do manual resize currently
   <script src="js/libs/jquery.flot.resize.js"></script>
+  -->
 
   <!-- webui core -->
   <script src="js/init.js"></script>
@@ -216,7 +218,7 @@
     <tr>
       <td class="download-progress" colspan="2" data-toggle="collapse" data-target="[data-gid={{download.gid}}] .download-detail .collapse">
 
-        <div ng-show="hasStatus(download, 'active')" class="progress progress-striped active" style="width: 100%; margin: 0; padding: 0;">
+        <div ng-show="hasStatus(download, 'active')" class="progress progress-striped" style="width: 100%; margin: 0; padding: 0;">
           <div class="bar" style="width: {{getProgress(download)}}%;"></div>
         </div>
 
diff --git a/css/download.css b/css/download.css
index e9b68bf..049040b 100644
--- a/css/download.css
+++ b/css/download.css
@@ -1,5 +1,6 @@
 .download-name {
   font-size: 12px;
+  word-wrap: break-word;
 }
 .active-download, .waiting-download, .stopped-download, .download {
   width: 100%;
@@ -10,6 +11,13 @@
   box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
 }
 
+/* fix table  layout to break words */
+@media (max-width: 767px) {
+.active-download, .waiting-download, .stopped-download, .download {
+  table-layout: fixed;
+}
+}
+
 .download-graph {
   width: 80%;
   margin-top: 5px;
@@ -26,6 +34,8 @@
 }
 .stats li {
   padding: 5px;
+  margin-top: 2px;
+  margin-bottom: 2px;
 }
 
 .download-progress {
diff --git a/css/style.css b/css/style.css
index 262fe33..da9ebf9 100644
--- a/css/style.css
+++ b/css/style.css
@@ -2,8 +2,10 @@
 .modal {
   position: absolute;
 }
-@media all and (min-width: 980px) {
+@media (min-width: 980px) {
   body {
     padding-top: 60px;
   }
 }
+
+
diff --git a/js/directives/dgraph.js b/js/directives/dgraph.js
index ae6819a..f374807 100644
--- a/js/directives/dgraph.js
+++ b/js/directives/dgraph.js
@@ -20,7 +20,8 @@ app.directive('dgraph', ['$', '$filter', function($, filter) {
       start = new Date
     ;
 
-    // jqplot doesnt draw graphs with no fixed height
+
+    // hack for the null height for flot elem
     elem.height(elem.width() / 2);
 
     var graph = $.plot(elem, [dconf, uconf], {
@@ -38,10 +39,10 @@ app.directive('dgraph', ['$', '$filter', function($, filter) {
     });
 
     var draw = function() {
-      var height = elem.height();
-      if (height <= 0) return;
+      var width = elem.width();
+      if (width == 0) return;
 
-      elem.height(elem.width() / 2);
+      elem.height(width / 2);
 
       graph.setData([dconf, uconf]);
       graph.resize();
@@ -74,8 +75,10 @@ app.directive('dgraph', ['$', '$filter', function($, filter) {
 
     var interval = setInterval(update, 1000);
 
+    angular.element(window).bind('resize', draw);
     elem.bind('$destroy', function() {
       clearInterval(interval);
     });
+
   };
 }]);
diff --git a/js/services/deps.js b/js/services/deps.js
index 3800cb6..ca64df4 100644
--- a/js/services/deps.js
+++ b/js/services/deps.js
@@ -1,5 +1,5 @@
 app.constant('$name', 'webui-aria2');
-app.constant('$globalTimeout', 1000);
+app.constant('$globalTimeout', 5000);
 
 app.value('$', $);
 app.value('$_', _);
diff --git a/js/services/rpc/jsoncall.js b/js/services/rpc/jsoncall.js
index ccf7663..11308b9 100644
--- a/js/services/rpc/jsoncall.js
+++ b/js/services/rpc/jsoncall.js
@@ -20,7 +20,7 @@ app.factory('$jsoncall', ['$', '$json', '$base64', function($, JSON, base64) {
           params: params && params.length ? this.encode(params) : undefined
         },
         success: function(data) {
-          conn.avgTimeout = 3 * (new Date() - startTime);
+          conn.avgTimeout =  2000 + 3 * (new Date() - startTime);
           return success(data)
         },
         error: error,