settings for individual accounts

8 files changed, 81 insertions, 30 deletions

diff --git a/pyload/web/app/scripts/helpers/pluginIcon.js b/pyload/web/app/scripts/helpers/pluginIcon.js
index 6b2fdc67f..1004c2487 100644
--- a/pyload/web/app/scripts/helpers/pluginIcon.js
+++ b/pyload/web/app/scripts/helpers/pluginIcon.js
@@ -3,7 +3,7 @@ define('helpers/pluginIcon', ['handlebars', 'app'], function(Handlebars, App) {
     'use strict';
 
     function pluginIcon(name) {
-        if (typeof name === 'object' && typeof name.get === 'function')
+        if (name && typeof name === 'object' && typeof name.get === 'function')
             name = name.get('plugin');
 
         return App.apiUrl('icons/' + name);
diff --git a/pyload/web/app/scripts/models/Account.js b/pyload/web/app/scripts/models/Account.js
index d98d3374f..94893f3e2 100644
--- a/pyload/web/app/scripts/models/Account.js
+++ b/pyload/web/app/scripts/models/Account.js
@@ -1,4 +1,4 @@
-define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'], function($, Backbone, _, App, Api) {
+define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes', './ConfigItem'], function($, Backbone, _, App, Api, ConfigItem) {
     'use strict';
 
     return Backbone.Model.extend({
@@ -30,6 +30,15 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'], function($
 
         },
 
+        parse: function(resp) {
+            // Convert config to models
+            resp.config = _.map(resp.config, function(item) {
+                return new ConfigItem(item);
+            });
+
+            return resp;
+        },
+
         fetch: function(options) {
             var refresh = _.has(options, 'refresh') && options.refresh;
             options = App.apiRequest('getAccountInfo',
@@ -47,8 +56,16 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'], function($
         },
 
         save: function() {
+            // use changed config items only
+            var data = this.toJSON();
+            data.config = _.map(_.filter(data.config, function(c){
+                return c.isChanged();
+            }), function(c) {
+                return c.prepareSave();
+            });
+
             // On success wait 1sec and trigger event to reload info
-            var options = App.apiRequest('updateAccountInfo', {account: this.toJSON()}, {
+            var options = App.apiRequest('updateAccountInfo', {account: data}, {
                 success: function() {
                     _.delay(function() {
                         App.vent.trigger('account:updated');
diff --git a/pyload/web/app/scripts/models/ConfigItem.js b/pyload/web/app/scripts/models/ConfigItem.js
index ecb44cbbc..8c75f45f6 100644
--- a/pyload/web/app/scripts/models/ConfigItem.js
+++ b/pyload/web/app/scripts/models/ConfigItem.js
@@ -4,6 +4,8 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'],
 
         return Backbone.Model.extend({
 
+            idAttribute: 'name',
+
             defaults: {
                 name: '',
                 label: '',
@@ -29,11 +31,12 @@ define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'],
                 if (this.get('inputView'))
                     this.set('value', this.get('inputView').getVal());
 
-                var data = this.toJSON();
-                delete data.inputView;
-                delete data.description;
-
-                return data;
+                // These values are enough to be handled correctly
+                return {
+                    name: this.get('name'),
+                    value: this.get('value'),
+                    '@class': this.get('@class')
+                };
             }
         });
     });
\ No newline at end of file
diff --git a/pyload/web/app/scripts/views/accounts/accountEdit.js b/pyload/web/app/scripts/views/accounts/accountEdit.js
index b9109390b..503860a5e 100644
--- a/pyload/web/app/scripts/views/accounts/accountEdit.js
+++ b/pyload/web/app/scripts/views/accounts/accountEdit.js
@@ -1,5 +1,5 @@
-define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'hbs!tpl/accounts/editAccount'],
-    function($, _, App, modalView, template) {
+define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'views/input/inputRenderer', 'hbs!tpl/accounts/editAccount', 'hbs!tpl/settings/configItem'],
+    function($, _, App, modalView, renderForm, template, templateItem) {
         'use strict';
         return modalView.extend({
 
@@ -16,6 +16,10 @@ define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'hbs!tpl/acco
             },
 
             onRender: function() {
+                renderForm(this.$('.account-config'),
+                    this.model.get('config'),
+                    templateItem
+                );
             },
 
             save: function() {
@@ -23,7 +27,7 @@ define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'hbs!tpl/acco
                 if (password !== '') {
                     this.model.setPassword(password);
                 }
-
+                this.model.save();
                 this.hide();
                 return false;
             },
diff --git a/pyload/web/app/scripts/views/input/inputRenderer.js b/pyload/web/app/scripts/views/input/inputRenderer.js
new file mode 100644
index 000000000..c20f15708
--- /dev/null
+++ b/pyload/web/app/scripts/views/input/inputRenderer.js
@@ -0,0 +1,22 @@
+define(['jquery', 'underscore', './inputLoader'], function($, _, load_input) {
+    'use strict';
+
+    // Renders list of ConfigItems to an container
+    // Optionally binds change event to view
+    return function(container, items, template, onChange, view) {
+        _.each(items, function(item) {
+            var json = item.toJSON();
+            var el = $('<div>').html(template(json));
+            var InputView = load_input(item.get('input'));
+            var input = new InputView(json).render();
+            item.set('inputView', input);
+
+            if (_.isFunction(onChange) && view) {
+                view.listenTo(input, 'change', onChange);
+            }
+
+            el.find('.controls').append(input.el);
+            container.append(el);
+        });
+    };
+});
\ No newline at end of file
diff --git a/pyload/web/app/scripts/views/settings/configSectionView.js b/pyload/web/app/scripts/views/settings/configSectionView.js
index 0d9b0762f..38d4cb869 100644
--- a/pyload/web/app/scripts/views/settings/configSectionView.js
+++ b/pyload/web/app/scripts/views/settings/configSectionView.js
@@ -1,6 +1,6 @@
-define(['jquery', 'underscore', 'backbone', 'app', '../abstract/itemView', '../input/inputLoader',
+define(['jquery', 'underscore', 'backbone', 'app', '../abstract/itemView', '../input/inputRenderer',
     'hbs!tpl/settings/config', 'hbs!tpl/settings/configItem'],
-    function($, _, Backbone, App, itemView, load_input, template, templateItem) {
+    function($, _, Backbone, App, itemView, renderForm, template, templateItem) {
         'use strict';
 
         // Renders settings over view page
@@ -9,7 +9,6 @@ define(['jquery', 'underscore', 'backbone', 'app', '../abstract/itemView', '../i
             tagName: 'div',
 
             template: template,
-            templateItem: templateItem,
 
             // Will only render one time with further attribute updates
             rendered: false,
@@ -33,19 +32,11 @@ define(['jquery', 'underscore', 'backbone', 'app', '../abstract/itemView', '../i
 //                        trigger: 'hover'
                     });
 
-                    var container = this.$('.control-content');
-                    var self = this;
-                    _.each(this.model.get('items'), function(item) {
-                        var json = item.toJSON();
-                        var el = $('<div>').html(self.templateItem(json));
-                        var InputView = load_input(item.get('input'));
-                        var input = new InputView(json).render();
-                        item.set('inputView', input);
-
-                        self.listenTo(input, 'change', _.bind(self.render, self));
-                        el.find('.controls').append(input.el);
-                        container.append(el);
-                    });
+                    // Renders every single element
+                    renderForm(this.$('.control-content'),
+                        this.model.get('items'), templateItem,
+                        _.bind(this.render, this), this);
+
                     this.rendered = true;
                 }
                 // Enable button if something is changed
diff --git a/pyload/web/app/styles/default/accounts.less b/pyload/web/app/styles/default/accounts.less
index 3891d8e45..efc8b5518 100644
--- a/pyload/web/app/styles/default/accounts.less
+++ b/pyload/web/app/styles/default/accounts.less
@@ -16,6 +16,21 @@
 
 }
 
+.form-account {
+
+    // Bit wider control labels / same as config page
+  .control-label {
+    width: 180px;
+  }
+  .controls {
+    margin-left: 200px;
+  }
+  .form-actions {
+    padding-left: 200px;
+  }
+
+}
+
 .logo-select {
   width: 20px;
   height: 20px;
diff --git a/pyload/web/app/templates/default/accounts/editAccount.html b/pyload/web/app/templates/default/accounts/editAccount.html
index 45cbf95f6..57c767226 100755
--- a/pyload/web/app/templates/default/accounts/editAccount.html
+++ b/pyload/web/app/templates/default/accounts/editAccount.html
@@ -3,14 +3,14 @@
     <h3>{{_ "Edit account" }}</h3>
 </div>
 <div class="modal-body">
-    <form class="form-horizontal" autocomplete="off">
+    <form class="form-horizontal form-account" autocomplete="off">
         <div class="control-group">
             <label class="control-label">
                 Account
             </label>
 
             <div class="controls">
-                <img src="{{ pluginIcon plugin }}">
+                <img src="{{ pluginIcon plugin }}" style="padding-right: 2px">
                 {{ loginname }}
             </div>
         </div>
@@ -27,7 +27,6 @@
         <legend>
            {{ _ "Configuration" }}
         </legend>
-        TODO
         {{/if}}
         <div class="account-config">
         </div>