quartz_flow 0.0.1

data/public/js/quartz.js

@@ -0,0 +1,419 @@
+
+/* Main Angular module */
+var quartzModule = angular.module('quartz',[]);
+
+/* Set up URL routes. Different URLs map to different HTML fragments (templates)*/
+quartzModule.config(function($routeProvider) {
+  $routeProvider.
+    when('/', {controller: TorrentTableCtrl, templateUrl:'/torrent_table'}).
+    when('/details/:torrent', {controller: TorrentDetailsCtrl, templateUrl:'/torrent_detail'}).
+    when('/config', {controller: ConfigCtrl, templateUrl:'/config'}).
+    otherwise({redirectTo:'/'});
+
+});
+
+/* Set up function that keeps retrieving torrent data from server on a timer.
+   We store the data in the rootScope which means it's available in all scopes. */
+quartzModule.run(function($rootScope, $timeout, $http, $window) {
+  $rootScope.alerts = {};
+
+  $rootScope.deleteRootscopeError = function(err){
+    delete $rootScope.alerts[err];
+  }
+
+  $rootScope.rootErrors = function() {
+    var rc = [];
+    for (var key in $rootScope.alerts) {
+      if ($rootScope.alerts.hasOwnProperty(key)) {
+        rc.push(key);
+      }
+    }
+    
+    return rc;
+  };
+
+  // Load the list of torrent data every 1 second.
+  var refresh = function() {
+    // http://code.angularjs.org/1.0.8/docs/api/ng.$http
+
+    var msg = "Server is unreachable.";
+    $http.get("/torrent_data", {'timeout': 3000}).
+      success(function(data,status,headers,config){
+        $rootScope.torrents = data;
+        updateTableTorrentData($rootScope);
+        $rootScope.deleteRootscopeError(msg);
+      }).
+      error(function(data,status,headers,config){
+        $rootScope.torrents = [];
+        updateTableTorrentData($rootScope);
+        if ( status == 0 ){
+          $rootScope.alerts[msg] = 1;
+        } else if (data == "Authentication required" ) {
+          $window.location.href = '/login';
+        } else {
+          $rootScope.alerts[data] = 1;
+        }
+      });
+
+    $timeout(refresh, 1000);
+  }
+  refresh();
+});
+
+/* Controller for the torrent table view */
+function TorrentTableCtrl($scope, $rootScope, $timeout, $http) {
+  $scope.errors = [];
+
+
+  var checkIframeMessages = function() {
+    while( iframeUploadResultMessages.length > 0 ) {
+      var msg = iframeUploadResultMessages.shift();
+      if ( msg != "@@success" ){
+        $scope.errors.push(msg);
+      }
+    }
+
+    $timeout(checkIframeMessages, 1000);
+  }
+  $timeout(checkIframeMessages, 1000);
+
+  $scope.deleteError = function(err){
+    genericDeleteError($scope, err);
+  }
+
+  $scope.dailyUsage = 0;
+  $scope.monthlyUsage = 0;
+  // Load the usage values
+  var getUsage = function() {
+    $http.get("/usage", {'timeout': 3000}).
+      success(function(data,status,headers,config){
+        $scope.dailyUsage = data.dailyUsage;
+        $scope.monthlyUsage = data.monthlyUsage;
+      })
+
+    $timeout(getUsage, 2000);
+  }
+  $timeout(getUsage, 2000);
+
+  $scope.getTimes = function(n){
+    var result = [];
+    for(var i = 0; i < n; i++){
+      result.push(i);
+    }
+    return result;
+  }
+
+  $scope.setPage = function(n){
+    $scope.currentPageIndex = n - 1;
+    if ( $scope.currentPageIndex < 0 )
+      $scope.currentPageIndex = 0;
+    if ( $scope.currentPageIndex >= $scope.totalPages )
+      $scope.currentPageIndex = $scope.totalPages - 1;
+    updatePages($scope);
+    updatePagesInfo($scope);
+  }
+
+  $scope.decrementPage = function(){
+    $scope.setPage($scope.currentPageIndex);
+  }
+
+  $scope.incrementPage = function(){
+    $scope.setPage($scope.currentPageIndex+2);
+  }
+
+  $scope.torrentToDownload = "";
+  $scope.magnetToStart = "";
+
+  $scope.downloadTorrentFile = function(){
+    $http.post("/download_torrent", {"url": $scope.torrentToDownload}).
+      success(function(data,status,headers,config){
+        console.log("huzzah, downloading torrent succeeded");
+      }).
+      error(function(data,status,headers,config){
+        console.log("Crap, downloading torrent failed: " + status + ": " + data);
+        $scope.errors.push(data);
+      });
+  }
+
+  $scope.startMagnetLink = function(){
+    $http.post("/start_magnet", {"url": $scope.magnetToStart}).
+      success(function(data,status,headers,config){
+        console.log("huzzah, starting magnet succeeded");
+      }).
+      error(function(data,status,headers,config){
+        console.log("Crap, starting magnet failed: " + status + ": " + data);
+        $scope.errors.push(data);
+      });
+  }
+  
+  $scope.stateForDisplay = function(infoHash){
+    var torrent = $scope.torrents[infoHash];
+    if ( ! torrent ){
+      return "unknown";      
+    }
+
+    var result = torrent.state;
+
+    if ( torrent.paused ){
+      result = result + " (paused)";
+    }
+
+    return result;
+  }
+  
+  $scope.pauseMenuItem = function(infoHash){
+    var torrent = $scope.torrents[infoHash];
+    if ( ! torrent ) {
+      return "Pause";
+    }
+    var rc = ""
+    if (torrent.paused) {
+      rc = "Unpause";
+    } else {
+      rc = "Pause";
+    }
+    return rc; 
+  }
+
+  $scope.togglePause = function(infoHash){
+    var torrent = $scope.torrents[infoHash];
+    if ( ! torrent ) {
+      return;
+    }
+    var url = "";
+    if (torrent.paused) {
+      url = "/unpause_torrent";
+    } else {
+      url = "/pause_torrent";
+    }
+
+    $http.post(url, {"infohash": infoHash}).
+      success(function(data,status,headers,config){
+        console.log("huzzah, unpausing torrent succeeded");
+      }).
+      error(function(data,status,headers,config){
+        console.log("Crap, unpausing torrent failed: " + status + ": " + data);
+        $scope.errors.push(data);
+      });
+  }
+  
+  $scope.deleteTorrent = function(infoHash, deleteFiles){
+    var torrent = $scope.torrents[infoHash];
+    if ( ! torrent ) {
+      return;
+    }
+   
+    $http.post("/delete_torrent", {"infohash": infoHash, "delete_files": deleteFiles}).
+      success(function(data,status,headers,config){
+        console.log("huzzah, deleting torrent succeeded");
+      }).
+      error(function(data,status,headers,config){
+        console.log("Crap, deleting torrent failed: " + status + ": " + data);
+        $scope.errors.push(data);
+      });
+  }
+
+
+}
+
+/* Controller for the torrent details view */
+function TorrentDetailsCtrl($scope, $routeParams, $http) {
+  $scope.torrent = $scope.torrentsForTable[$routeParams.torrent]
+
+  $scope.deleteError = function(err){
+    genericDeleteError($scope, err);
+  }
+
+  $scope.applyDownloadRateLimit = function(){
+    $http.post("/change_torrent", {"infoHash": $scope.torrent.infoHash, "downloadRateLimit" : $scope.torrent.downloadRateLimit}).
+      success(function(data,status,headers,config){
+        console.log("huzzah, changing setting succeeded");
+      }).
+      error(function(data,status,headers,config){
+        $scope.errors.push(data);
+      });   
+  }
+
+}
+
+/* Controller for the config view */
+function ConfigCtrl($scope, $timeout, $http) {
+  $scope.deleteError = function(err){
+    genericDeleteError($scope, err);
+  }
+
+  $http.get("/global_settings").
+    success(function(data,status,headers,config){
+      $scope.globalSettings = data;
+    }).
+    error(function(data,status,headers,config){
+      $scope.globalSettings = {};
+      $scope.errors.push(data);
+    });
+
+  $scope.applySettings = function(){
+    $http.post("/global_settings", $scope.globalSettings).
+      success(function(data,status,headers,config){
+        console.log("huzzah, saving settings succeeded");
+      }).
+      error(function(data,status,headers,config){
+        $scope.errors.push(data);
+      });
+  }
+}
+
+/* Controller used for login */
+function LoginCtrl($scope, $window, $http) {
+  $scope.errors = [];
+  $scope.login = null;
+  $scope.password = null;
+
+  $scope.doLogin = function(){
+    $http.post("/login", {"login": $scope.login, "password" : $scope.password}).
+      success(function(data,status,headers,config){
+        $window.location.href = '/';
+      }).
+      error(function(data,status,headers,config){
+        $scope.errors.push(data);
+      });   
+  }
+
+  $scope.doLogout = function(){
+    $http.post("/logout").
+      success(function(data,status,headers,config){
+        $window.location.href = '/';
+      }).
+      error(function(data,status,headers,config){
+        $window.location.href = '/';
+      });   
+  }
+
+  $scope.deleteRootscopeError = function(err){}
+  $scope.deleteError = function(err){
+    genericDeleteError($scope, err);
+  }
+}
+
+var torrentPropsNotToUpdate = { 'downloadRateLimit': 1 };
+
+/* Helper used to update the $scope's list of torrent data shown in the table 
+   from the full data retrieved from the server */
+function updateTableTorrentData($scope) {
+  if ( ! $scope.torrents )
+    return;
+
+  if ( ! $scope.torrentsForTable ) {
+    $scope.torrentsForTable = {};
+  }
+  
+  for (var key in $scope.torrents) {
+    if ($scope.torrents.hasOwnProperty(key)) {
+      torrent = $scope.torrents[key];
+      if ( ! (key in $scope.torrentsForTable)) {
+        // New entry
+        $scope.torrentsForTable[key] = clone(torrent);
+      }
+      else {
+        // Update entry if needed
+        existing = $scope.torrentsForTable[key];
+        for (var prop in torrent) {
+          if (torrent.hasOwnProperty(prop)) {
+            if (existing[prop] != torrent[prop] && !torrentPropsNotToUpdate[prop])
+              existing[prop] = torrent[prop];
+          }
+        }
+      }
+    }
+  }
+
+  var toDelete = [];
+  for (var key in $scope.torrentsForTable) {
+    if ( ! (key in $scope.torrents)){
+      // This torrent has been deleted server-side
+      toDelete.push(key);
+    }   
+  }
+  for(var i = 0; i < toDelete.length; i++) {
+    delete $scope.torrentsForTable[toDelete[i]];
+  }
+
+  // Set up the current page
+  updatePages($scope);
+}
+
+function updatePages($scope) {
+  // Set up the current page
+  var pageSize = 5;
+  if( ! $scope.currentPageIndex ) {
+    $scope.currentPageIndex = 0;
+  }
+  $scope.torrentsList = [];
+  for (var key in $scope.torrentsForTable) {
+    $scope.torrentsList.push($scope.torrentsForTable[key]);
+  }
+  var pageStartIndex = $scope.currentPageIndex * pageSize;
+  var pageEndIndex = ($scope.currentPageIndex+1) * pageSize;
+  $scope.currentPage = $scope.torrentsList.slice(pageStartIndex, pageEndIndex);
+  $scope.totalPages = Math.floor(($scope.torrentsList.length - 1) / pageSize + 1);
+
+  if( ! $scope.pagesInfo || $scope.pagesInfo.length != $scope.totalPages ) {
+    updatePagesInfo($scope);
+  }
+}
+
+function updatePagesInfo($scope) {
+  $scope.pagesInfo = [];
+  for(var i = 0; i < $scope.totalPages; i++){
+    var style = (i == $scope.currentPageIndex ? "active" : "");
+    $scope.pagesInfo.push({"number": i+1, "style": style});
+  }
+}
+
+function clone(obj) {
+  result = {};
+  for (var prop in obj) {
+    if (obj.hasOwnProperty(prop)) {
+      result[prop] = obj[prop];
+    }
+  }
+  return result;
+}
+
+function genericDeleteError($scope, err) {
+  for(var i = 0; i < $scope.errors.length; i++) {
+    if ( $scope.errors[i] == err ) {
+      $scope.errors.splice(i,1);
+      break;
+    }
+  }
+  $scope.deleteRootscopeError(err);
+}
+
+/*********** IFRAME AJAX UPLOAD *************/
+
+var iframeUploadResultMessages = [];
+
+function getFrameByName(name) {
+  for (var i = 0; i < frames.length; i++)
+    if (frames[i].name == name)
+      return frames[i];
+        
+  return null;
+}
+
+function handleIframeLoad(frameName)
+{
+  var frame = getFrameByName(frameName);
+  if ( frame != null )
+  {
+    result = frame.document.getElementsByTagName("body")[0].innerHTML;
+          
+    // The form's onload handler gets called when the main page is first loaded as well.
+    // We detect this condition by checking if the iframes contents are not empty.
+    if ( result.length > 0 ){
+      if ( iframeUploadResultMessages.length < 10 ){
+        iframeUploadResultMessages.push(result);
+      }
+    }
+  }
+}

data/public/style.css

@@ -0,0 +1,25 @@
+
+#mainheader
+{
+  text-align: center;
+  /*background-color: #0f0f0f;*/
+  background-color: #0088cc;
+  color: #ffffff;
+  margin-top: 0px;
+  padding-top: 0px;
+}
+
+/* Make all iframes invisible. */
+iframe
+{
+  width: 0px;
+  height: 0px;
+  border: 0px solid #000000;
+}
+
+#logout
+{
+  float: right;
+  margin-right: 2em;
+  margin-top: 0.4em;
+}

data/views/config_partial.haml

@@ -0,0 +1,30 @@
+:javascript
+  $('#uploadRateLabel').tooltip();
+
+%div{ :class => "row"}
+
+  %ul{ :class => "nav nav-pills"}
+    %li
+      %a{ :href => "#" } Main
+    %li{ :class => "active" }
+      %a{ :href => "#/config" } Config
+
+  %div{ :class => "alert alert-error", "ng-repeat" => "error in errors" }
+    %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+    {{error}}
+
+  %form{ :class => "form-horizontal", "ng-submit" => "applySettings()"}
+    %div{ :class => "control-group"}
+      %label{ :id => "uploadRateLabel", :class => "control-label", :for => "uploadRate", "data-toggle" => "tooltip", :title => "Default rate limit to apply to new torrents"} Default Upload Rate Limit
+      %div{ :class => 'controls'}
+        %input{ :type => "text", :id => "uploadRate", :placeholder => "Enter rate like '20 KB'", "ng-model" => "globalSettings.defaultUploadRateLimit"}
+    %div{ :class => "control-group"}
+      %label{ :id => "downloadRateLabel", :class => "control-label", :for => "downloadRate", "data-toggle" => "tooltip", :title => "Default rate limit to apply to new torrents"} Default Download Rate Limit
+      %div{ :class => 'controls'}
+        %input{ :type => "text", :id => "downloadRate", :placeholder => "Enter rate like '500 KB'", "ng-model" => "globalSettings.defaultDownloadRateLimit"}
+    %div{ :class => "control-group"}
+      %label{ :id => "ratioLabel", :class => "control-label", :for => "ratio", "data-toggle" => "tooltip", :title => "Default upload ratio to apply to new torrents"} Default Upload Ratio
+      %div{ :class => 'controls'}
+        %input{ :type => "text", :id => "ratio", :placeholder => "Enter decimal number like '1.5'", "ng-model" => "globalSettings.defaultRatio"}
+    %button{ :class => "btn", :type => "submit" } Apply
+

data/views/index.haml

@@ -0,0 +1,21 @@
+!!! html
+%html{ "ng-app" => "quartz"}
+  %head
+    %link{ :rel => "stylesheet", :type => "text/css", :href => "/style.css"}
+    %link{ :rel => "stylesheet", :type => "text/css", :href => "/bootstrap/css/bootstrap.min.css"} 
+    %script{ :src => "http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" }
+    %script{ :src => "http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular-resource.js" }
+    %script{ :src => "/js/quartz.js" }
+    %title QuartzFlow
+  %body
+    %h1{ :id => "mainheader", "ng-controller" => "LoginCtrl"}
+      QuartzFlow
+      %button{ :type => "button", :class => "btn btn-mini", :id => "logout", "ng-click" => "doLogout()" } logout
+
+    %div{ :class => "container", "ng-view" => ''}
+
+    %script{ :src => "/js/jquery-1.10.2.min.js" }
+    %script{ :src => "/bootstrap/js/bootstrap.min.js"}
+
+    -# This is the file-upload iframe
+    %iframe{ :id => "uploadiframe", :name => "uploadiframe", :onload => 'handleIframeLoad("uploadiframe")' }

data/views/login.haml

@@ -0,0 +1,32 @@
+!!! html
+%html{ "ng-app" => ""}
+  %head
+    %link{ :rel => "stylesheet", :type => "text/css", :href => "/style.css"}
+    %link{ :rel => "stylesheet", :type => "text/css", :href => "/bootstrap/css/bootstrap.min.css"} 
+    %script{ :src => "http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js" }
+    %script{ :src => "http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular-resource.js" }
+    %script{ :src => "/js/quartz.js" }
+  %body
+    %h1{ :id => "mainheader"} QuartzFlow
+
+    %div{ :class => "container", "ng-controller" => "LoginCtrl"}
+      %div{ :class => "alert alert-error", "ng-repeat" => "error in rootErrors()" }
+        %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+        {{error}}
+
+      %div{ :class => "alert alert-error", "ng-repeat" => "error in errors" }
+        %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+        {{error}}
+
+      %form{ :role => "form", "ng-submit" => "doLogin()" }
+        %div{ :class => "form-group" }
+          %label{ :for => "login" } Login
+          %input{ :type => "text", :class => "form-control", :id => "login", :placeholder => "Enter login", "ng-model" => "login" }
+        %div{ :class => "form-group" }
+          %label{ :for => "password" } Password
+          %input{ :type => "password", :class => "form-control", :id => "password", :placeholder => "Enter password", "ng-model" => "password" }
+        %button{ :class => "btn", :type => "submit" } Login
+
+    %script{ :src => "/js/jquery-1.10.2.min.js" }
+    %script{ :src => "/bootstrap/js/bootstrap.min.js"}
+

data/views/torrent_detail_partial.haml

@@ -0,0 +1,91 @@
+%ul{ :class => "nav nav-pills"}
+  %li
+    %a{ :href => "#" } Main
+  %li
+    %a{ :href => "#/config" } Config
+
+%div{ :class => "alert alert-error", "ng-repeat" => "error in rootErrors()" }
+  %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+  {{error}}
+
+%div{ :class => "alert alert-error", "ng-repeat" => "error in errors" }
+  %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+  {{error}}
+
+%h1 {{ torrent.recommendedName }}
+/%a{:class => "btn", "href" => "#" } Back
+%table{ :class => "table" }
+  %tr
+    %th Size
+    %td {{torrent.completedBytes}}/{{torrent.dataLength}}
+  %tr
+    %th Pieces
+    %td {{torrent.completePieces}}/{{torrent.totalPieces}}
+  %tr
+    %th Status
+    %td {{torrent.state}}
+  %tr
+    %th Progress
+    %td {{torrent.percentComplete}}%
+  %tr
+    %th Download Rate
+    %td {{torrent.downloadRate}}
+  %tr
+    %th Upload Rate
+    %td {{torrent.uploadRate}}
+  %tr
+    %th Download Rate Limit
+    %td 
+      %form{ "ng-submit" => "applyDownloadRateLimit()" }
+        %fieldset
+          %div{ :class => "input-append" }
+            %input{ :class => "span2", :type => "text", "ng-model" => "torrent.downloadRateLimit" }
+            %button{ :class => "btn", :type => "submit" } Change
+  %tr
+    %th Upload Rate Limit
+    %td 
+      %form
+        %fieldset
+          %div{ :class => "input-append" }
+            %input{ :class => "span2", :type => "text", "ng-model" => "torrent.uploadRateLimit" }
+            %button{ :class => "btn", :type => "submit" } Change
+  %tr
+    %th Upload Ratio
+    %td 
+      %form
+        %fieldset
+          %div{ :class => "input-append" }
+            %input{ :class => "span2", :type => "text", "ng-model" => "torrent.ratio" }
+            %button{ :class => "btn", :type => "submit" } Change
+  %tr
+    %th Bytes Uploaded
+    %td {{torrent.bytesUploaded}}
+  %tr
+    %th Bytes Downloaded
+    %td {{torrent.bytesDownloaded}}
+ 
+%h2 Files ({{torrent.info.files.length}})
+
+%table{ :class => "table" }
+  %tr
+    %th Path
+    %th Length
+  %tr{ "ng-repeat" => "file in torrent.info.files" }
+    %td {{file.path}}
+    %td {{file.length}}
+
+%h2 Peers ({{torrent.peers.length}})
+
+%table{ :class => "table" }
+  %tr
+    %th IP
+    %th Port
+    %th Upload Rate
+    %th Download Rate
+    %th Percent Complete
+  %tr{ "ng-repeat" => "peer in torrent.peers" }
+    %td {{peer.trackerPeer.ip}}
+    %td {{peer.trackerPeer.port}}
+    %td {{peer.uploadRate}}
+    %td {{peer.downloadRate}}
+    %td {{peer.pctComplete}}

data/views/torrent_table_partial.haml

@@ -0,0 +1,76 @@
+%div{ :class => "row"}
+
+  %ul{ :class => "nav nav-pills"}
+    %li{ :class => "active" }
+      %a{ :href => "#" } Main
+    %li
+      %a{ :href => "#/config" } Config
+
+  %div{ :class => "alert alert-error", "ng-repeat" => "error in rootErrors()" }
+    %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+    {{error}}
+
+  %div{ :class => "alert alert-error", "ng-repeat" => "error in errors" }
+    %button{ :type => "button", :class => "close", "ng-click" => "deleteError(error)"} ×
+    {{error}}
+
+  %div{ }
+    %p
+      Usage this month: {{monthlyUsage}}, today: {{dailyUsage}}.
+
+  %div{ :class => "span4"}
+    %form{ "ng-submit" => "downloadTorrentFile()" }
+      %fieldset
+        %label Download using .torrent link
+        %div{ :class => "input-append" }
+          %input{ :class => "span2", :type => "text", :placeholder => "paste url", "ng-model" => "torrentToDownload" }
+          %button{ :class => "btn", :type => "submit" } Get
+  %div{ :class => "span4"}
+    %form{ "ng-submit" => "startMagnetLink()" }
+      %fieldset
+        %label Download using Magnet
+        %div{ :class => "input-append" }
+          %input{ :class => "span2", :type => "text", :placeholder => "paste magnet url", "ng-model" => "magnetToStart" }
+          %button{ :class => "btn", :type => "submit" } Get
+  %div{ :class => "span4"}
+    %form{:method => "post", :enctype => "multipart/form-data", :action => "/upload_torrent", :target => "uploadiframe", :id => "torrent_upload_form" }
+      %fieldset
+        %label Download using .torrent
+        %input{ :class => "span3", :type => "file", :placeholder => "browse...", :name => "torrentfile" }
+        %button{ :class => "btn", :type => "submit" } Upload
+
+%table{ :class => "table table-striped table-condensed" }
+  %tr
+    %th Name
+    %th Size
+    %th Status
+    %th Rates
+    %th Progress
+    %th ETA
+    %th Actions
+  %tr{ "ng-repeat" => "torrent in currentPage" }
+    %td {{torrent.recommendedName}}
+    %td {{torrent.dataLength}}
+    %td {{stateForDisplay(torrent.infoHash)}}
+    %td {{torrent.downloadRate}}/{{torrent.uploadRate}}
+    %td {{torrent.percentComplete}}%
+    %td {{torrent.timeLeft}}
+    %td 
+      %div{ :class => "dropdown" }
+        %button{ :class => "btn dropdown-toggle", "data-toggle" => "dropdown", :href => "#" } Actions
+        %ul{ :class => "dropdown-menu"}
+          %li
+            %a{ :href =>"#", "ng-click" => "togglePause(torrent.infoHash)" } {{pauseMenuItem(torrent.infoHash)}}
+            %a{ :href =>"#", "ng-click" => "deleteTorrent(torrent.infoHash, false)"} Delete Torrent
+            %a{ :href =>"#", "ng-click" => "deleteTorrent(torrent.infoHash, true)"} Delete Torrent and Files
+            %a{ :href =>"#/details/{{torrent.infoHash}}"} Details
+
+%div{ :class => "pagination pagination-right" }
+  %ul
+    %li
+      %a{ :href => "", "ng-click" => "decrementPage()" } Prev
+    %li{ "ng-repeat" => "page in pagesInfo", :class => "{{page.style}}" }
+      %a{ :href => "", "ng-click" => "setPage(page.number)" } {{page.number}}
+    %li
+      %a{ :href => "", "ng-click" => "incrementPage()" } Next
+