initial commit for connection modal

angular.html

@@ -48,6 +48,7 @@
   <script src="js/services/deps.js"></script>
   <script src="js/services/base64.js"></script>
   <script src="js/services/utils.js"></script>
+
   <script src="js/services/modals.js"></script>
   <script src="js/services/alerts.js"></script>
 
@@ -151,7 +152,9 @@
 
         <ul class="dropdown-menu">
           <li ng-show="false">
-            <a href="#"><i class="icon-wrench"></i> Connection Settings</a>
+            <a
+              ng-click="changeCSettings()"
+              href="#"><i class="icon-wrench"></i> Connection Settings</a>
           </li>
 
           <li>
@@ -608,6 +611,76 @@ http://ex1.com/f2.mp4 http://ex2.com/f2.mp4
 </div
 <!-- }}} -->
 
+<!--{{{ connection modal -->
+<div class="modal hide" modal="connection.shown">
+  <div class="modal-header">
+    <button class="close" ng-click="connection.close()">x</button>
+    <h3>Connection Settings</h3>
+  </div>
+  <div class="modal-body">
+    <form class="form-horizontal">
+      <fieldset>
+        <legend>Aria2 RPC host and port</legend>
+        <div class="control-group">
+          <label class="control-label">Enter the host:</label>
+          <div class="controls">
+            <div class="input-prepend">
+              <span class="add-on">http(s)://</span><input type="text" class="input-xlarge"/>
+            </div>
+            <p class="help-block">
+              Enter the ip or dns name of the server on which the
+              rpc for aria2 is running (default = localhost)
+            </p>
+          </div>
+
+          <label class="control-label">Enter the port:</label>
+          <div class="controls">
+            <input type="text" class="input-xlarge"
+              ng-model="connection.port"
+              placeholder="{{connection.port}}"/>
+            <p class="help-block">
+              Enter the port of the server on which the rpc for
+              aria2 is running (default = 6800)
+            </p>
+          </div>
+
+          <label class="control-label">SSL/TLS encryption:</label>
+          <div class="controls">
+            <button type="button" class="btn" data-toggle="button">ON</button>
+            <p class="help-block">Enable SSL/TLS encryption.</p>
+          </div>
+
+          <label class="control-label">Enter the username (optional):</label>
+          <div class="controls">
+            <input type="text" class="input-xlarge"
+              ng-model="connection.auth.user"/>
+            <p class="help-block">
+              Enter the aria2 RPC username
+              (empty if authentication not enabled)
+            </p>
+          </div>
+
+          <label class="control-label">Enter the password (optional):</label>
+          <div class="controls">
+            <input type="password" class="input-xlarge"
+              ng-model="connection.auth.pass"/>
+            <p class="help-block">
+              Enter the aria2 RPC password
+              (empty if authentication not enabled)
+            </p>
+          </div>
+        </div>
+      </fieldset>
+    </form>
+  </div>
+  <div class="modal-footer">
+    <button href="#" class="btn" ng-click="connection.close()">Retry with default configuration</button>
+    <button href="#" class="btn btn-primary" ng-click="connection.close()">Use custom IP and port settings</button>
+  </div>
+</div>
+<!-- }}} -->
+
+
 </div>
 <!-- }}} -->
 

js/ctrls/modal.js

@@ -34,9 +34,11 @@ angular
 
   scope.getUris = {
     shown: false,
-
     uris: '',
-    init: function(cb) { this.shown = true; this.cb = cb },
+    init: function(cb) {
+      this.shown = this.open =  true;
+      this.cb = cb;
+    },
     parse: function() {
       return _
         .chain(this.uris.trim().split(/\n\r?/g))
@@ -59,10 +61,57 @@ angular
     }
   };
 
+  scope.settings = {
+    shown: false,
+    settings: [],
+    title: 'Settings',
+    init: function(settings, title, cb) {
+      this.cb = cb;
+      this.settings = settings;
+      this.title = title || title;
+      this.shown = this.open = true;
+    },
+    success: function() {
+      if (this.cb) this.cb(this.settings);
+      this.close();
+    },
+    close: function() {
+      this.cb = null;
+      this.shown = this.open = false;
+    }
+  };
+
+  scope.connection = {
+    shown: false,
+
+    host: 'localhost',
+    port: 6800,
+    auth: {
+      user: '',
+      pass: ''
+    },
+
+    init: function(defaults, cb) {
+      this.cb = cb;
+      this.open = this.shown = true;
+    },
+    success: function() {
+      this.close();
+    },
+    close: function() {
+      if (this.cb) this.cb();
+      this.cb = null;
+      this.open = this.shown = false;
+    }
+  };
+
   _.each(['getTorrents', 'getMetalinks'], function(name) {
     scope[name] =  {
       shown: false,
-      init: function(cb) { this.shown = true; this.cb = cb },
+      init: function(cb) {
+        this.shown = this.open =  true;
+        this.cb = cb;
+      },
 
       files: [],
       success: function() {
@@ -77,40 +126,20 @@ angular
       },
       close: function() {
         this.cb = null;
-        this.shown = false;
+        this.shown = this.open = false;
       }
     };
   });
 
-  scope.settings = {
-    shown: false,
-    settings: [],
-    title: 'Settings',
-    init: function(settings, title, cb) {
-      this.cb = cb;
-      this.settings = settings;
-      this.title = title || title;
-      this.shown = true;
-    },
-    success: function() {
-      if (this.cb) this.cb(this.settings);
-      this.close();
-    },
-    close: function() {
-      this.cb = null;
-      this.shown = this.open = false;
-    }
-  };
-
   _.each([
     'getUris', 'getTorrents', 'getMetalinks',
-    'settings'
+    'settings', 'connection'
   ], function(name) {
     modals.register(name, function(cb) {
-      if (scope[name].open && scope[name].cb) {
+      if (scope[name].open) {
         // modal already shown, user is busy
         // TODO: get a better method of passing this info
-        cb([]);
+        return;
       }
       else {
         var args = Array.prototype.slice.call(arguments, 0);

js/ctrls/nav.js

@@ -57,6 +57,12 @@ angular
     );
   };
 
+  scope.changeCSettings = function() {
+    modals.invoke('connection', {}, function(data) {
+      console.log('connection modal closed, got back the follwing data', data);
+    });
+  }
+
   scope.changeGSettings = function() {
     rpc.once('getGlobalOption', [], function(data) {
       var vals = data[0];
@@ -86,7 +92,10 @@ angular
         }
       }
 
-      modals.invoke('settings', settings, 'Global Settings', function(settings) {
+      modals.invoke(
+        'settings', settings,
+        'Global Settings', function(settings) {
+
         var sets = {};
         for (var i in settings) { sets[i] = settings[i].val };
 

js/services/rpc/rpc.js

@@ -18,7 +18,7 @@ angular
       return;
 
     if (configurations.length)
-      syscall.init(configurations.pop());
+      syscall.init(configurations[0]);
 
     subscriptions = _.filter(subscriptions, function(e) { return !!e });
     var params = _.map(subscriptions, function(s) {
@@ -37,8 +37,8 @@ angular
       params: [params],
       success: function(data) {
 
-        // configuration worked, leave this as it is
-        configurations = [];
+        // configuration worked, save it in cookie for next time!!
+        //
         _.each(data.result, function(d, i) {
           var handle = subscriptions[i];
           if (handle) {
@@ -60,7 +60,10 @@ angular
       },
       error: function() {
         // If some proposed configurations are still in the pipeline then retry
-        if (configurations.length) update();
+        if (configurations.length) {
+          configurations.shift();
+          update();
+        }
         else {
           alerts.addAlert('<strong>Oh Snap!</strong> Could not connect to the aria2 server, retrying after ' + time / 1000 + ' secs', 'error');
           timeout = setTimeout(update, time);