Merge branch 'master' of git://github.com/endor/kettu

Conflicts:
	index.html

README.md

@@ -1,16 +1,35 @@
 # kettu
-
-Port of http://github.com/kjg/derailleur and the original Transmission Web Client
-using [jquery](http://jquery.com), [sammy](http://github.com/quirkey/sammy), [jspec](http://github.com/visionmedia/jspec) and [mustache.js](http://github.com/janl/mustache.js).
+Port of http://github.com/kjg/derailleur and the original Transmission Web Client  
+using [jquery](http://jquery.com), [sammy](http://github.com/quirkey/sammy) and [mustache.js](http://github.com/janl/mustache.js).
 
 By Frank Prößdorf <fp@notjusthosting.com>.
 
+
 ## Thanks 
-kjg for all the work on the transmission web client.
-lenalena for introducing proper jspec testing to this project.
+* kjg for all the work on the transmission web client and help.
+* lenalena for introducing proper jspec testing to this project.
 
-## Where to use?
-You can use kettu instead of the original web client to remotely administrate your transmission application.
 
 ## Usage
-Once you allowed remote access in your transmission client, you can simply open the `index.html` in the browser. If you run your transmission application on something other than the default host and port, you can adjust these settings in the `rpc` file.
+You can use kettu instead of the original web client to remotely administrate your transmission application.
+
+Once you allowed remote access in your transmission client, you can simply open the `index.html` in the browser. If you run your transmission application on something other than the default host and port, you can adjust these settings in the `rpc` file.
+
+It's recommended to replace the old web interface with this one, so the server and the web interface run in the same location (e.g. localhost:9091). When uploading torrents there is a cross-site request which leads to a deserved warning. Also Firefox and Chrome will not work because cross-site requests will trigger [preflight requests](http://www.w3.org/TR/access-control/#preflight-request) in those browsers, which the server cannot handle.
+
+
+## Tests
+
+### Unit Tests
+There are [jspecs](http://github.com/visionmedia/jspec) in `/spec` which you can run by opening the `index.html` file within the spec directory.
+
+### Acceptance Tests
+There are [culerity](http://github.com/langalex/culerity) tests in `features`. You will need culerity, celerity and the most current htmlunit to run them. You will just need to type `cucumber features/<feature>`.
+
+
+## Todo
+* countdown till next scrape in tracker info
+* show more information about files
+* show more information about peers
+* feature test that the right rpc queries are sent when updating settings, adding torrents, etc.
+* display errors, also tracker errors in tracker info

css/transmission.css

@@ -12,16 +12,14 @@ body{
 }
 #ratiobar {
   height: 20px;
-  background-color: #cccccc;
-  width: 100%;
+  background-color: #442244;
+  color: white;
   margin: 0px;
   padding: 3px;
 }
-#ratiobar #numberOfTorrents {
-  float: left;
-}
 #ratiobar #globalUpAndDownload {
   float: right;
+  margin-right: 5px;
 }
 #footer {
   width: 100%;
@@ -48,6 +46,13 @@ body{
   background: url(jquery/images/ui-bg_highlight-soft_75_ffe45c_1x100.png) repeat-x;
 }
 
+.torrent .ui-widget-header-meta {
+  border: 1px solid #aaaaaa; 
+  color: #222222;
+  font-weight: bold;
+  background: url(jquery/images/ui-bg_highlight-hard_75_f5f5b5_1x100.png) repeat-x;
+}
+
 .torrent .ui-widget-header-paused {
   border: 1px solid #aaaaaa; 
   color: #222222;
@@ -76,6 +81,18 @@ body{
   height: 15px; 
 }
 
+.deleteButton {
+  display: block;
+  color: transparent;
+  background-color: transparent;
+  border: 0px;
+  float: right;
+  margin-right: 20px;
+  background-image: url(images/control_eject.png);
+  width: 15px;
+  height: 15px; 
+}
+
 .torrent .statusString {
   clear: both;
   font-size: 13px;
@@ -103,9 +120,7 @@ body{
 }
 
 #filterbar {
-/*  padding: 2px;
-  padding-left: 8px;
-*/  border-bottom: 1px solid #CCCCCC;
+  border-bottom: 1px solid #CCCCCC;
 }
 
 #filterbar a {
@@ -118,11 +133,15 @@ body{
   color: #222222;
 }
 
-#filterbar #filter_links {
+#filterbar #filter_sort_links {
   padding: 2px;
   padding-left: 8px;
   float: left;
   margin-top: 2px;
+  width: 400px;
+}
+#filterbar #filter_sort_links #sorts {
+  display: none;
 }
 #filterbar #flash {
   padding: 2px;
@@ -134,7 +153,7 @@ body{
 }
 #torrents {
   position: fixed;
-	top: 89px;
+	top: 53px;
 	bottom: 32px;
 	right: 0px;
 	left: 0px;
@@ -149,13 +168,13 @@ body{
 }
 #info {
   position: fixed;
-	top: 89px;
-	bottom: 22px;
-	right: 0px;
-	width: 350px;
-	padding-top: 10px;
-	padding-left: 10px;
-	background-color: white;
+  top: 53px;
+  bottom: 22px;
+  right: 0px;
+  width: 350px;
+  padding-top: 10px;
+  padding-left: 10px;
+  background-color: white;
   display: none;
   border-left: 1px solid #dddddd;
   overflow: auto;
@@ -173,20 +192,6 @@ body{
   text-decoration: none;
   font-weight: normal;
 }
-#info .header {
-  color: #555555;
-  text-decoration: none;
-  background-image: url(images/bullet_toggle_plus.png);
-  background-repeat: no-repeat;
-  margin: 10px;
-  padding-left: 15px;
-}
-#info .header.active{
-  background-image: url(images/bullet_toggle_minus.png);
-  background-repeat: no-repeat;
-  margin: 10px;
-  padding-left: 15px;
-}
 #info .content {
   margin-left: 15px;
   margin-bottom: 20px;
@@ -216,7 +221,42 @@ body{
 }
 
 #info input.short {
-  width: 25px;
+  width: 35px;
+}
+
+#info input.submit {
+  background-color: white;
+  padding: 4px;
+}
+
+#info input.long {
+  width: 250px;
+}
+
+#info input.file {
+  border: 0px;
+}
+
+#info td.long {
+  width: 62px;
+}
+
+#info #port-open {
+  margin-top: 3px;
+  width: 15px;
+  height: 15px;
+  background-color: red;
+  float: right;
+  display: none;
+}
+
+#info #port-open.active {
+  background-color: green;
+}
+
+#info #port-open.waiting {
+  background-image: url(images/spinner.gif);
+  background-color: transparent !important;
 }
 
 #info #version {
@@ -233,4 +273,9 @@ body{
 #info .menu li {
   display: inline;
   margin-right: 20px;
+}
+
+#pie_chart {
+  margin-left: 30px;
+  margin-top: 30px;
 }

features/sort_and_filter_torrents.feature

@@ -0,0 +1,62 @@
+Feature: sort and filter torrents
+  In order to have a better overview
+  As a user
+  I want to sort and filter torrents
+
+  Scenario: filter torrents
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the stati "4, 8, 16"
+    When I go to the start page
+      And I follow "Filter"
+      And I follow "Downloading"
+    Then I should see "Mutant Ninja Turtles"
+      But I should not see "Donald Duck"
+      And I should not see "Saber Riders"
+    When I follow "Seeding"
+    Then I should see "Donald Duck"
+      But I should not see "Mutant Ninja Turtles"
+      And I should not see "Saber Riders"
+    When I follow "Paused"
+    Then I should see "Saber Riders"
+      But I should not see "Mutant Ninja Turtles"
+      And I should not see "Donald Duck"
+    When I follow "All"
+    Then I should see "Mutant Ninja Turtles"
+      And I should see "Donald Duck"
+      And I should see "Saber Riders"
+
+  Scenario: sort torrents by name
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the stati "4, 8, 16"
+    When I go to the name sorted torrents page
+    Then I should see "Donald Duck" before "Mutant Ninja Turtles"
+      And I should see "Mutant Ninja Turtles" before "Saber Riders"
+
+  Scenario: sort torrents by status
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the stati "8, 16, 4"
+    When I go to the state sorted torrents page
+    Then I should see "Saber Riders" before "Mutant Ninja Turtles"
+      And I should see "Mutant Ninja Turtles" before "Donald Duck"
+
+  Scenario: sort torrents by activity
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the download rates "16000, 8000, 4000"
+    When I go to the activity sorted torrents page
+    Then I should see "Mutant Ninja Turtles" before "Donald Duck"
+      And I should see "Donald Duck" before "Saber Riders"
+
+  Scenario: sort torrents by age
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the date added "87742, 84253, 81181"
+    When I go to the age sorted torrents page
+    Then I should see "Mutant Ninja Turtles" before "Donald Duck"
+      And I should see "Donald Duck" before "Saber Riders"
+
+  Scenario: sort torrents by progress
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the left until done "8, 4, 16"
+    When I go to the progress sorted torrents page
+    Then I should see "Saber Riders" before "Mutant Ninja Turtles"
+      And I should see "Mutant Ninja Turtles" before "Donald Duck"
+
+  Scenario: sort torrents by queue
+    Given three torrents with the names "Mutant Ninja Turtles, Donald Duck, Saber Riders" and the ids "1, 2, 3"
+    When I go to the queue sorted torrents page
+    Then I should see "Mutant Ninja Turtles" before "Donald Duck"
+      And I should see "Donald Duck" before "Saber Riders"
+