improve ui

jpillora · Sep 5, 2015 · de30585 · de30585
1 parent 0aea056
commit de30585
Show file tree

Hide file tree

Showing 13 changed files with 128 additions and 55 deletions.
diff --git a/engine/engine.go b/engine/engine.go
@@ -4,7 +4,6 @@ import (
 	"encoding/hex"
 	"fmt"
 	"io/ioutil"
-	"log"
 	"os"
 	"path/filepath"
 	"sync"
@@ -204,7 +203,6 @@ func (e *Engine) StartFile(infohash, filepath string) error {
 	}
 	t.Started = true
 	f.Started = true
-	log.Printf("prioritze %s %d", f.Path, f.Size)
 	f.f.PrioritizeRegion(0, f.Size)
 	return nil
 }

diff --git a/server/server.go b/server/server.go
@@ -152,7 +152,10 @@ func (s *Server) handle(w http.ResponseWriter, r *http.Request) {
 	}
 
 	//handle realtime client connections
-	if r.URL.Path == "/realtime" {
+	if r.URL.Path == "/realtime.js" {
+		realtime.JS.ServeHTTP(w, r)
+		return
+	} else if r.URL.Path == "/realtime" {
 		s.rt.ServeHTTP(w, r)
 		return
 	}

diff --git a/server/server_search.go b/server/server_search.go
@@ -42,7 +42,7 @@ var defaultSearchConfig = []byte(`{
 	},
 	"abb-item": {
 		"name": "The Audiobook Bay (Item)",
-		"url": "http://audiobookbay.co/{{path}}",
+		"url": "http://audiobookbay.co{{path}}",
 		"result": {
 			"infohash": "/td>([a-f0-9]+)</",
 			"tracker": "table tr:nth-child(1) > td:nth-child(2)"

diff --git a/static/files.go b/static/files.go
diff --git a/static/files/css/app.css b/static/files/css/app.css
@@ -52,6 +52,18 @@ html body .muted {
 	font-size: 1.2em;
 }
 
+.app .connect-warning {
+	padding-top: 50px;
+	position: fixed;
+    z-index: 10000;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0,0,0,1);
+    opacity: 0.95;
+}
+
 /*
 	================
 	app styles

diff --git a/static/files/css/sections/omni.css b/static/files/css/sections/omni.css
@@ -1,7 +1,7 @@
 
 
 .omni {
-	margin-top: 5px; 
+	margin-top: 5px;
 }
 
 .omni .buttons {
@@ -55,4 +55,4 @@
 }
 .omni .form {
 	margin-top: 5px;
-}
+}
diff --git a/static/files/css/sections/torrents.css b/static/files/css/sections/torrents.css
@@ -62,7 +62,7 @@ section.torrents {
 	padding: 4px;
 	margin: 0;
 	height: 100%;
-	border: none;
+	background: none;
 }
 .torrent .download.file .progress .bar {
 	height: 100%;

diff --git a/static/files/index.html b/static/files/index.html
@@ -9,6 +9,16 @@
 		<style type="text/css">[ng-cloak]{display: none;}</style>
 	</head>
 	<body ng-app="app" class="app"><div ng-cloak class="cage">
+		<div ng-if="!connected" class="connect-warning ui inverted vertical masthead center aligned segment">
+			<div class="ui text container">
+			<h1 class="ui inverted header">
+				Disconnected
+			</h1>
+			<h1 class="ui inverted header">
+				<i class="red lightning icon"></i>
+			</h1>
+			</div>
+		</div>
 		<!-- TITLE ===================== -->
 		<div class="title">
 			<h2>
@@ -47,7 +57,7 @@ <h2>
 		<script src="js/vendor/query-string.js"></script>
 		<script src="js/vendor/angular.min.js"></script>
 		<script src="js/vendor/moment.min.js"></script>
-		<script src="/realtime"></script>
+		<script src="/realtime.js"></script>
 		<script>window.app = window.angular.module('app', []);</script>
 		<script src="js/config-controller.js"></script>
 		<script src="js/omni-controller.js"></script>

diff --git a/static/files/js/downloads-controller.js b/static/files/js/downloads-controller.js
@@ -10,36 +10,76 @@ app.controller("DownloadsController", function($scope, $rootScope) {
   };
 });
 
-app.controller("NodeController", function($scope, $rootScope, $http) {
+app.controller("NodeController", function($scope, $rootScope, $http, $timeout) {
   var n = $scope.node;
-  var path = [n.Name];
+  $scope.isfile = function() { return !n.Children; };
+  $scope.isdir = function() { return !$scope.isfile(); };
+
+  var pathArray = [n.Name];
   if($scope.$parent && $scope.$parent.$parent && $scope.$parent.$parent.node) {
     var parentNode = $scope.$parent.$parent.node;
-    path.unshift(parentNode.$path);
+    pathArray.unshift(parentNode.$path);
     n.$depth = parentNode.$depth + 1;
   } else {
     n.$depth = 1;
   }
-  n.$path = path.join("/");
+  var path = n.$path = pathArray.join("/");
   n.$closed = $scope.agoHrs(n.Modified) > 24;
 
+  //search for this file
+  var torrents = $rootScope.state.Torrents;
+  if($scope.isfile() && torrents) {
+    for(var ih in torrents) {
+      var files = torrents[ih].Files;
+      for (var i = 0; i < files.length; i++) {
+        var f = files[i];
+        if(f.Path === path) {
+          n.$file = f;
+          break;
+        }
+      }
+      if(n.$file)
+        break;
+    }
+  }
+
+  $scope.isdownloading = function() {
+    return n.$file && n.$file.Percent < 100;
+  };
+
+  $scope.preremove = function() {
+    $scope.confirm = true;
+    $timeout(function() {
+      $scope.confirm = false;
+    }, 3000);
+  };
+
   //defaults
   $scope.closed = function() { return n.$closed; };
   $scope.toggle = function() { n.$closed = !n.$closed; };
   $scope.icon = function() {
-    var c = ["outline","icon"];
-    if($scope.isfile()) {
-      c.push("file");
+    var c = [];
+    if($scope.isdownloading()) {
+      c.push("spinner", "loading")
     } else {
-      c.push("folder");
-    }
-    if(!$scope.closed()) {
-      c.push("open");
+      c.push("outline");
+      if($scope.isfile()) {
+        if(/\.mp3$/.test(path))
+          c.push("audio");
+        else if(/\.(mp4|avi|mkv)$/.test(path))
+          c.push("video");
+        else if(/\.(jpe?g|png|gif)$/.test(path))
+          c.push("image");
+        c.push("file");
+      } else {
+        c.push("folder");
+        if(!$scope.closed())
+          c.push("open");
+      }
     }
+    c.push("icon");
     return c.join(" ");
   };
-  $scope.isfile = function() { return !n.Children; };
-  $scope.isdir = function() { return !$scope.isfile(); };
 
   $scope.remove = function() {
     $http.delete("/download/" + n.$path);

diff --git a/static/files/js/omni-controller.js b/static/files/js/omni-controller.js
@@ -97,7 +97,9 @@ app.controller("OmniController", function($scope, $rootScope, storage, api, sear
     return "magnet:?" +
       "xt=urn:btih:" + (infohash || '') + "&" +
       "dn=" + (name || '').replace(/\W/g, '').replace(/\s+/g, '+') +
-      (trackers || []).map(function(t) {
+      (trackers || []).filter(function(t) {
+        return !!t.v;
+      }).map(function(t) {
         return "&tr=" + encodeURIComponent(t.v);
       }).join('');
   };
@@ -174,12 +176,11 @@ app.controller("OmniController", function($scope, $rootScope, storage, api, sear
     if (!result.path)
       return $scope.omnierr = "No URL found";
 
-    search.one($scope.inputs.provider, result.path).success(function(err, data) {
-      if (err)
-        return $scope.omnierr = err;
-
+    search.one($scope.inputs.provider, result.path).then(function(resp) {
+      var data = resp.data;
+      if (!data)
+        return $scope.omnierr = "No response";
       var magnet;
-
       if (data.magnet) {
         magnet = data.magnet;
       } else if (data.infohash) {
@@ -188,8 +189,10 @@ app.controller("OmniController", function($scope, $rootScope, storage, api, sear
         $scope.omnierr = "No magnet or infohash found";
         return;
       }
-
+      console.log("start magnet", magnet);
       api.magnet(magnet);
+    }, function(err) {
+      $scope.omnierr = err;
     });
   };
 });
diff --git a/static/files/js/vendor/angular.min.js b/static/files/js/vendor/angular.min.js
diff --git a/static/files/template/download-tree.html b/static/files/template/download-tree.html
@@ -1,12 +1,18 @@
 
-<i ng-if="isdir()" ng-class="icon()" ng-click="toggle()"></i>
-<i ng-if="isfile()" ng-class="icon()"></i>
+<!-- <div class="icon-container"> -->
+<i class="wrapper icon">
+  <i ng-if="isdir()" ng-class="icon()" ng-click="toggle()"></i>
+  <i ng-if="isfile()" ng-class="icon()"></i>
+</i>
+<!-- </div> -->
+
 <div class="content">
   <div class="header">
     <span ng-if="isdir()">{{ node.Name }}</span>
-    <a ng-if="isfile()" ng-href="/download/{{ node.$path }}">{{ node.Name }}</a>
-    <span class="controls">
-      <i ng-show="!confirm" ng-click="confirm = true" class="red trash icon"></i>
+    <a ng-if="isfile() && !isdownloading()" ng-href="/download/{{ node.$path }}">{{ node.Name }}</a>
+    <span ng-if="isfile() && isdownloading()">{{ node.Name }}</span>
+    <span ng-if="!isdownloading()" class="controls">
+      <i ng-show="!confirm" ng-click="preremove()" class="red trash icon"></i>
       <i ng-show="!deleting && confirm" ng-click="deleting = true; remove();" class="red check icon"></i>
       <i ng-show="deleting" class="grey notched circle loading icon"></i>
     </span>

diff --git a/static/files/template/torrents.html b/static/files/template/torrents.html
@@ -77,12 +77,14 @@ <h5 class="ui files downloading header">
           <tr class="download file" ng-repeat="f in t.Files">
             <td class="name">
               <div>
-                <span ng-show="f.Percent < 100">
+                <span>
                   {{ f.Path | filename }}
                 </span>
+                <!-- 
                 <a ng-show="f.Percent == 100" ng-href="{{ f.Path }}">
                   {{ f.Path | filename }}
                 </a>
+                 -->
               </div>
               <div ng-if="f.downloadError"
                 class="ui error message">