diff --git a/htdocs/css/admin.css b/htdocs/css/admin.css index 038c25c..24aa8fc 100644 --- a/htdocs/css/admin.css +++ b/htdocs/css/admin.css @@ -85,4 +85,21 @@ table.bookmarks .frequency { .sdr-device-list .list-group-item, .sdr-profile-list .list-group-item { background: initial; +} + +.removable-group.removable { + display: flex; + flex-direction: row; +} + +.removable-group.removable .removable-item { + flex: 1 0 auto; +} + +.removable-group.removable .option-remove-button { + flex: 0 0 70px; +} + +.option-add-button, .option-remove-button { + width: 70px; } \ No newline at end of file diff --git a/htdocs/lib/settings/OptionalSection.js b/htdocs/lib/settings/OptionalSection.js new file mode 100644 index 0000000..8c60fa4 --- /dev/null +++ b/htdocs/lib/settings/OptionalSection.js @@ -0,0 +1,26 @@ +$.fn.optionalSection = function(){ + this.each(function() { + var $section = $(this); + var $select = $section.find('.optional-select'); + var $optionalInputs = $section.find('.optional-inputs'); + $section.on('click', '.option-add-button', function(e){ + var field = $select.val(); + var group = $optionalInputs.find(".form-group[data-field='" + field + "']"); + group.find('input, select').prop('disabled', false); + $select.parents('.form-group').before(group); + $select.find('option[value=\'' + field + '\']').remove(); + + return false; + }); + $section.on('click', '.option-remove-button', function(e) { + var group = $(e.target).parents('.form-group') + group.find('input, select').prop('disabled', true); + $optionalInputs.append(group); + var $label = group.find('> label'); + var $option = $(''); + $select.append($option); + + return false; + }) + }); +} \ No newline at end of file diff --git a/htdocs/settings.js b/htdocs/settings.js index 4a9903b..30aacad 100644 --- a/htdocs/settings.js +++ b/htdocs/settings.js @@ -5,4 +5,5 @@ $(function(){ $('.wsjt-decoding-depths').wsjtDecodingDepthsInput(); $('#waterfall_scheme').waterfallDropdown(); $('#rf_gain').gainInput(); + $('.optional-section').optionalSection(); }); \ No newline at end of file diff --git a/owrx/controllers/assets.py b/owrx/controllers/assets.py index f090fb6..696d541 100644 --- a/owrx/controllers/assets.py +++ b/owrx/controllers/assets.py @@ -151,6 +151,7 @@ class CompiledAssetsController(GzipMixin, ModificationAwareController): "lib/settings/WsjtDecodingDepthsInput.js", "lib/settings/WaterfallDropdown.js", "lib/settings/GainInput.js", + "lib/settings/OptionalSection.js", "settings.js", ], } diff --git a/owrx/controllers/settings/__init__.py b/owrx/controllers/settings/__init__.py index 11f056c..12d8b09 100644 --- a/owrx/controllers/settings/__init__.py +++ b/owrx/controllers/settings/__init__.py @@ -10,19 +10,25 @@ class Section(object): self.title = title self.inputs = inputs + def render_input(self, input, data): + return input.render(data) + def render_inputs(self, data): - return "".join([i.render(data) for i in self.inputs]) + return "".join([self.render_input(i, data) for i in self.inputs]) + + def classes(self): + return ["col-12", "settings-section"] def render(self, data): return """ -