moved everything from module to pyload

3 files changed, 352 insertions, 0 deletions

diff --git a/pyload/web/app/scripts/views/settings/configSectionView.js b/pyload/web/app/scripts/views/settings/configSectionView.js
new file mode 100644
index 000000000..e05701b2a
--- /dev/null
+++ b/pyload/web/app/scripts/views/settings/configSectionView.js
@@ -0,0 +1,99 @@
+define(['jquery', 'underscore', 'backbone', 'app', '../abstract/itemView', '../input/inputLoader',
+    'hbs!tpl/settings/config', 'hbs!tpl/settings/configItem'],
+    function($, _, Backbone, App, itemView, load_input, template, templateItem) {
+        'use strict';
+
+        // Renders settings over view page
+        return itemView.extend({
+
+            tagName: 'div',
+
+            template: template,
+            templateItem: templateItem,
+
+            // Will only render one time with further attribute updates
+            rendered: false,
+
+            events: {
+                'click .btn-primary': 'submit',
+                'click .btn-reset': 'reset'
+            },
+
+            initialize: function() {
+                this.listenTo(this.model, 'destroy', this.destroy);
+            },
+
+            render: function() {
+                if (!this.rendered) {
+                    this.$el.html(this.template(this.model.toJSON()));
+
+                    // initialize the popover
+                    this.$('.page-header a').popover({
+                        placement: 'left'
+//                        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);
+                    });
+                    this.rendered = true;
+                }
+                // Enable button if something is changed
+                if (this.model.hasChanges())
+                    this.$('.btn-primary').removeClass('disabled');
+                else
+                    this.$('.btn-primary').addClass('disabled');
+
+                // Mark all inputs that are modified
+                _.each(this.model.get('items'), function(item) {
+                    var input = item.get('inputView');
+                    var el = input.$el.parent().parent();
+                    if (item.isChanged())
+                        el.addClass('info');
+                    else
+                        el.removeClass('info');
+                });
+
+                return this;
+            },
+
+            onDestroy: function() {
+                // TODO: correct cleanup after building up so many views and models
+            },
+
+            submit: function(e) {
+                e.stopPropagation();
+                // TODO: success / failure popups
+                var self = this;
+                this.model.save({success: function() {
+                    self.render();
+                    App.settingsView.refresh();
+                }});
+
+            },
+
+            reset: function(e) {
+                e.stopPropagation();
+                // restore the original value
+                _.each(this.model.get('items'), function(item) {
+                    if (item.has('inputView')) {
+                        var input = item.get('inputView');
+                        input.setVal(item.get('value'));
+                        input.render();
+                    }
+                });
+                this.render();
+            }
+
+        });
+    });
\ No newline at end of file
diff --git a/pyload/web/app/scripts/views/settings/pluginChooserModal.js b/pyload/web/app/scripts/views/settings/pluginChooserModal.js
new file mode 100644
index 000000000..91e9f11b3
--- /dev/null
+++ b/pyload/web/app/scripts/views/settings/pluginChooserModal.js
@@ -0,0 +1,69 @@
+define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'hbs!tpl/dialogs/addPluginConfig',
+    'helpers/pluginIcon', 'select2'],
+    function($, _, App, modalView, template, pluginIcon) {
+        'use strict';
+        return modalView.extend({
+
+            events: {
+                'click .btn-add': 'add'
+            },
+            template: template,
+            plugins: null,
+            select: null,
+
+            initialize: function() {
+                // Inherit parent events
+                this.events = _.extend({}, modalView.prototype.events, this.events);
+                var self = this;
+                $.ajax(App.apiRequest('getAvailablePlugins', null, {success: function(data) {
+                    self.plugins = _.sortBy(data, function(item) {
+                        return item.name;
+                    });
+                    self.render();
+                }}));
+            },
+
+            onRender: function() {
+                // TODO: could be a seperate input type if needed on multiple pages
+                if (this.plugins)
+                    this.select = this.$('#pluginSelect').select2({
+                        escapeMarkup: function(m) {
+                            return m;
+                        },
+                        formatResult: this.format,
+                        formatSelection: this.formatSelection,
+                        data: {results: this.plugins, text: function(item) {
+                            return item.label;
+                        }},
+                        id: function(item) {
+                            return item.name;
+                        }
+                    });
+            },
+
+            onShow: function() {
+            },
+
+            onHide: function() {
+            },
+
+            format: function(data) {
+                var s = '<div class="plugin-select" style="background-image: url(' + pluginIcon(data.name) +')">' + data.label;
+                s += '<br><span>' + data.description + '<span></div>';
+                return s;
+            },
+
+            formatSelection: function(data) {
+                return '<img class="logo-select" src="' + pluginIcon(data.name) + '"> ' + data.label;
+            },
+
+            add: function(e) {
+                e.stopPropagation();
+                if (this.select) {
+                    var plugin = this.select.val();
+                    App.vent.trigger('config:open', plugin);
+                    this.hide();
+                }
+            }
+        });
+    });
\ No newline at end of file
diff --git a/pyload/web/app/scripts/views/settings/settingsView.js b/pyload/web/app/scripts/views/settings/settingsView.js
new file mode 100644
index 000000000..cad5ab075
--- /dev/null
+++ b/pyload/web/app/scripts/views/settings/settingsView.js
@@ -0,0 +1,184 @@
+define(['jquery', 'underscore', 'backbone', 'app', 'models/ConfigHolder', './configSectionView',
+    'hbs!tpl/settings/layout', 'hbs!tpl/settings/menu', 'hbs!tpl/settings/actionbar'],
+    function($, _, Backbone, App, ConfigHolder, ConfigSectionView, template, templateMenu, templateBar) {
+        'use strict';
+
+        // Renders settings over view page
+        return Backbone.Marionette.ItemView.extend({
+
+            template: template,
+            templateMenu: templateMenu,
+
+            events: {
+                'click .settings-menu li > a': 'change_section',
+                'click .btn-add': 'choosePlugin', // TODO not in scope
+                'click .icon-remove': 'deleteConfig'
+            },
+
+            ui: {
+                'menu': '.settings-menu',
+                'content': '.setting-box > form'
+            },
+
+            selected: null,
+            modal: null,
+
+            coreConfig: null, // It seems collections are not needed
+            pluginConfig: null,
+
+            // currently open configHolder
+            config: null,
+            lastConfig: null,
+            isLoading: false,
+
+            initialize: function() {
+                this.actionbar = Backbone.Marionette.ItemView.extend({
+                    template: templateBar,
+                    events: {
+                        'click .btn': 'choosePlugin'
+                    },
+                    choosePlugin: _.bind(this.choosePlugin, this)
+
+                });
+                this.listenTo(App.vent, 'config:open', this.openConfig);
+
+                this.refresh();
+            },
+
+            refresh: function() {
+                var self = this;
+                $.ajax(App.apiRequest('getCoreConfig', null, {success: function(data) {
+                    self.coreConfig = data;
+                    self.renderMenu();
+                }}));
+                $.ajax(App.apiRequest('getPluginConfig', null, {success: function(data) {
+                    self.pluginConfig = data;
+                    self.renderMenu();
+                }}));
+            },
+
+            onRender: function() {
+                // set a height with css so animations will work
+                this.ui.content.height(this.ui.content.height());
+            },
+
+            renderMenu: function() {
+                var plugins = [],
+                    addons = [];
+
+                // separate addons and default plugins
+                // addons have an activated state
+                _.each(this.pluginConfig, function(item) {
+                    if (item.activated === null)
+                        plugins.push(item);
+                    else
+                        addons.push(item);
+                });
+
+                this.ui.menu.html(this.templateMenu({
+                    core: this.coreConfig,
+                    plugin: plugins,
+                    addon: addons
+                }));
+
+                // mark the selected element
+                this.$('li[data-name="' + this.selected + '"]').addClass('active');
+            },
+
+            openConfig: function(name) {
+                // Do nothing when this config is already open
+                if (this.config && this.config.get('name') === name)
+                    return;
+
+                this.lastConfig = this.config;
+                this.config = new ConfigHolder({name: name});
+                this.loading();
+
+                var self = this;
+                this.config.fetch({success: function() {
+                    if (!self.isLoading)
+                        self.show();
+
+                }, failure: _.bind(this.failure, this)});
+
+            },
+
+            loading: function() {
+                this.isLoading = true;
+                var self = this;
+                this.ui.content.fadeOut({complete: function() {
+                    if (self.config.isLoaded())
+                        self.show();
+
+                    self.isLoading = false;
+                }});
+
+            },
+
+            show: function() {
+                // TODO animations are bit sloppy
+                this.ui.content.css('display', 'block');
+                var oldHeight = this.ui.content.height();
+
+                // this will destroy the old view
+                if (this.lastConfig)
+                    this.lastConfig.trigger('destroy');
+                else
+                    this.ui.content.empty();
+
+                // reset the height
+                this.ui.content.css('height', '');
+                // append the new element
+                this.ui.content.append(new ConfigSectionView({model: this.config}).render().el);
+                // get the new height
+                var height = this.ui.content.height();
+                // set the old height again
+                this.ui.content.height(oldHeight);
+                this.ui.content.animate({
+                    opacity: 'show',
+                    height: height
+                });
+            },
+
+            failure: function() {
+                // TODO
+                this.config = null;
+            },
+
+            change_section: function(e) {
+                // TODO check for changes
+                // TODO move this into render?
+
+                var el = $(e.target).closest('li');
+
+                this.selected = el.data('name');
+                this.openConfig(this.selected);
+
+                this.ui.menu.find('li.active').removeClass('active');
+                el.addClass('active');
+                e.preventDefault();
+            },
+
+            choosePlugin: function(e) {
+                var self = this;
+                _.requireOnce(['views/settings/pluginChooserModal'], function(Modal) {
+                    if (self.modal === null)
+                        self.modal = new Modal();
+
+                    self.modal.show();
+                });
+            },
+
+            deleteConfig: function(e) {
+                e.stopPropagation();
+                var el = $(e.target).parent().parent();
+                var name = el.data('name');
+                var self = this;
+                $.ajax(App.apiRequest('deleteConfig', {plugin: name}, { success: function() {
+                    self.refresh();
+                }}));
+
+            }
+
+        });
+    });
\ No newline at end of file