Added default/ask/latest option for server upon startup

tympanix · Jan 8, 2017 · 5a43c20 · 5a43c20
1 parent 3d79c94
commit 5a43c20
Show file tree

Hide file tree

Showing 6 changed files with 128 additions and 47 deletions.
diff --git a/index.html b/index.html
@@ -18,6 +18,13 @@
     <body ng-controller="mainController" ready-broadcast>
         <div class="main wrapper">
 
+            <!-- Loading Spinner -->
+            <div ng-if="showLoading">
+                <div class="ui active inverted dimmer">
+                    <div class="ui huge text loader">{{statusText}}</div>
+                </div>
+            </div>
+
             <!-- Notifications -->
             <div ng-include="'./views/notifications.html'"></div>
 
@@ -31,18 +38,16 @@
                 <div ng-include="'./views/welcome.html'"></div>
             </div>
 
+            <!-- Server Selection -->
+            <div ng-show="showServers()" class="overlay">
+                <div ng-include="'./views/servers.html'"></div>
+            </div>
+
             <!-- Torrents -->
             <div ng-show="showTorrents" drag-and-drop>
                 <div ng-include="'./views/torrents.html'"></div>
             </div>
 
-            <!-- Loading Spinner -->
-            <div ng-if="showLoading">
-                <div class="ui active inverted dimmer">
-                    <div class="ui huge text loader">{{statusText}}</div>
-                </div>
-            </div>
-
         </div>
 
         <!-- Dependencies -->

diff --git a/scripts/controllers/main.js b/scripts/controllers/main.js
@@ -1,7 +1,11 @@
 
-angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope", "$timeout", "$bittorrent", "electron", "configService", function ($rootScope, $scope, $timeout, $bittorrent, electron, config) {
+angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope", "$timeout", "$bittorrent", "electron", "configService", "notificationService", function ($rootScope, $scope, $timeout, $bittorrent, electron, config, $notify) {
     const PAGE_SETTINGS = 'settings';
     const PAGE_WELCOME = 'welcome';
+    const PAGE_SERVERS = 'servers';
+
+    let settings = config.getAllSettings()
+    $scope.servers = config.getServers()
 
     $scope.showTorrents = false;
     $scope.showLoading = true;
@@ -13,25 +17,37 @@ angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope
             electron.updater.checkForUpdates();
         }
 
-        if (!$scope.$btclient) {
+        if (!settings.servers.length) {
             pageWelcome();
             return;
         }
 
-        var data = config.getDefaultServer()
-        console.log("Default server", data)
-        if (data){
-            connectToServer(data.ip, data.port, data.user, data.password);
-        } else {
-            // First time starting application
-            pageWelcome();
+        if (settings.startup === 'default') {
+            let server = config.getDefaultServer()
+            if ($rootScope.$server){
+                connectToServer(server);
+            } else {
+                pageServers();
+                $notify.ok('No default server', 'Please choose a server to connect to')
+            }
+        } else if (settings.startup === 'ask') {
+            pageServers()
+        } else if (settings.startup === 'latest') {
+            return
+            // TODO: Implemented latest server
         }
     });
 
-    function connectToServer(ip, port, user, password){
+    $scope.connectToServer = function(server) {
+        connectToServer(server)
+    }
+
+    function connectToServer(server){
+        pageLoading()
+        $bittorrent.setServer(server)
         $scope.statusText = "Connecting to " + $rootScope.$btclient.name;
 
-        $rootScope.$btclient.connect(ip, port, user, password)
+        $rootScope.$btclient.connect(server.ip, server.port, server.user, server.password)
         .then(function(){
             pageTorrents();
             requestMagnetLinks();
@@ -66,6 +82,7 @@ angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope
         $scope.showLoading = false;
         $scope.$broadcast('start:torrents');
         page = null;
+        console.log("SHOW TORRENTS!", page);
     }
 
     function pageLoading() {
@@ -80,6 +97,12 @@ angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope
         page = PAGE_SETTINGS;
     }
 
+    function pageServers() {
+        $scope.showLoading = false;
+        $scope.showTorrents = false;
+        page = PAGE_SERVERS;
+    }
+
     function pageWelcome(){
         $scope.showLoading = false;
         page = PAGE_WELCOME;
@@ -102,14 +125,15 @@ angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope
         $bittorrent.setServer(server)
 
         $timeout(function() {
-            connectToServer(server.ip, server.port, server.user, server.password)
+            connectToServer(server)
             $scope.$broadcast('start:torrents', true) // Full update
         }, 250)
         $scope.$apply();
     })
 
     $scope.$on('show:settings', function() {
         if (page === PAGE_WELCOME) return;
+        if (page === PAGE_SERVERS) return;
         page = PAGE_SETTINGS;
         $scope.$apply();
     })
@@ -135,4 +159,8 @@ angular.module("torrentApp").controller("mainController", ["$rootScope", "$scope
         return page === PAGE_WELCOME;
     }
 
+    $scope.showServers = function() {
+        return page === PAGE_SERVERS;
+    }
+
 }]);
diff --git a/scripts/services/config.js b/scripts/services/config.js
@@ -6,6 +6,7 @@ angular.module('torrentApp').service('configService', ['$rootScope', 'notificati
     const config = electron.config;
 
     var settings = {
+        startup: 'default',
         server: {
             ip: '',
             port: '',

diff --git a/scripts/services/server.js b/scripts/services/server.js
@@ -44,6 +44,10 @@ angular.module('torrentApp').factory('Server', ['$btclients', function($btclient
         return $btclients[this.client].name
     };
 
+    Server.prototype.getIcon = function () {
+        return $btclients[this.client].icon
+    };
+
     Server.prototype.getNameAtAddress = function () {
         return this.getName() + " @ " + this.ip
     };

diff --git a/views/servers.html b/views/servers.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<div class="wrapper">
+    <div class="ui middle aligned center aligned grid" style="height: 100vh;">
+        <div class="narrow column">
+            <h2 class="ui image header">
+                <div class="content">
+                    Connect to Server
+                </div>
+            </h2>
+
+            <div class="ui one fluid cards" ng-repeat="server in servers">
+                <div class="card">
+                    <div class="content">
+                        <div class="header">
+                            <i class="torrent icon" ng-class="server.getIcon()"></i>
+                            {{server.getName()}}
+                        </div>
+                        <div class="meta">
+                            {{server.getNameAtAddress()}}
+                        </div>
+                    </div>
+                    <div class="ui bottom attached green button" ng-click="connectToServer(server)">
+                        Connect
+                        <i class="icon right arrow"></i>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
diff --git a/views/settings/general.html b/views/settings/general.html
@@ -1,55 +1,68 @@
 <!DOCTYPE html>
 <h1>General Settings</h1>
-<div class="ui large divided list">
-    <!-- Magnet links -->
-    <div class="item">
-        <div class="right floated middle aligned content">
-            <toggle ng-model="general.magnets"></toggle>
+<div class="ui three doubling stackable cards">
+    <div class="ui card">
+        <div class="content">
+            <div class="header">
+                <i class="asterisk icon"></i>
+                Startup Connection
+            </div>
+            <div class="description">
+                Configure which server to connect to when starting the application
+            </div>
+        </div>
+        <div class="center aligned extra content">
+            <dropdown class="fluid" title="Connection Mode" ng-model="settings.startup">
+                <dropdown-group data-value="default">Default</dropdown-group>
+                <dropdown-group data-value="ask">Ask</dropdown-group>
+                <dropdown-group data-value="latest">Latest</dropdown-group>
+            </dropdown>
         </div>
-        <i class="large magnet middle aligned icon"></i>
-        <div class="middle aligned content">
+    </div>
+    <div class="ui card">
+        <div class="content">
             <div class="header">
+                <i class="magnet icon"></i>
                 Magnet Links
             </div>
             <div class="description">
                 Enabling this makes Electorrent the default program for magnet links
             </div>
         </div>
-    </div>
-
-    <!-- Table resize style -->
-    <div class="item">
-        <div class="right floated middle aligned content">
-            <dropdown title="Resize Mode" ng-model="settings.ui.resizeMode">
-                <dropdown-group data-value="FixedResizer">Fixed</dropdown-group>
-                <dropdown-group data-value="OverflowResizer">Overflow</dropdown-group>
-                <dropdown-group data-value="BasicResizer">Basic</dropdown-group>
-            </dropdown>
+        <div class="center aligned extra content">
+            <toggle ng-model="general.magnets"></toggle>
         </div>
-        <i class="large expand middle aligned icon"></i>
-        <div class="middle aligned content">
+    </div>
+    <div class="ui card">
+        <div class="content">
             <div class="header">
+                <i class="expand icon"></i>
                 Table Resize Style
             </div>
             <div class="description">
                 Changes how the torrent table behaves when resized
             </div>
         </div>
-    </div>
-
-    <!-- Notifications -->
-    <div class="item">
-        <div class="right floated middle aligned content">
-            <toggle ng-model="settings.ui.notifications"></toggle>
+        <div class="center aligned extra content">
+            <dropdown class="fluid" title="Resize Mode" ng-model="settings.ui.resizeMode">
+                <dropdown-group data-value="FixedResizer">Fixed</dropdown-group>
+                <dropdown-group data-value="OverflowResizer">Overflow</dropdown-group>
+                <dropdown-group data-value="BasicResizer">Basic</dropdown-group>
+            </dropdown>
         </div>
-        <i class="large alarm middle aligned icon"></i>
-        <div class="middle aligned content">
+    </div>
+    <div class="ui card">
+        <div class="content">
             <div class="header">
+                <i class="alarm icon"></i>
                 Notifications
             </div>
             <div class="description">
-                Enable desktop notifications
+                Enable desktop notifications when torrents finishes
             </div>
         </div>
+        <div class="center aligned extra content">
+            <toggle ng-model="settings.ui.notifications"></toggle>
+        </div>
     </div>
 </div>