fix: Increase visibility of Main Options (#287)

fixes #288
theforeman · Sep 8, 2023 · 1b5fd16 · 1b5fd16
1 parent 86348e1
commit 1b5fd16
Show file tree

Hide file tree

Showing 5 changed files with 76 additions and 54 deletions.
diff --git a/app/assets/javascripts/foreman_fog_proxmox/proxmox_vm.js b/app/assets/javascripts/foreman_fog_proxmox/proxmox_vm.js
@@ -15,6 +15,8 @@
 // You should have received a copy of the GNU General Public License
 // along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>.
 
+//= require jquery-ui/widgets/accordion
+
 $(document).ready(vmTypeSelected);
 
 function vmTypeSelected() {
@@ -27,13 +29,8 @@ function vmTypeSelected() {
   fieldsets.push({id: 'config_ext', toggle: true, new_vm: new_vm, selected: selected});
   fieldsets.push({id: 'volume', toggle: true, new_vm: new_vm, selected: selected});
   fieldsets.push({id: 'network', toggle: true, new_vm: true, selected: selected});
-  fieldsets.push({id: 'config_options', toggle: false, new_vm: new_vm, selected: selected});
-  fieldsets.push({id: 'config_cpu', toggle: false, new_vm: new_vm, selected: selected});
-  fieldsets.push({id: 'config_memory', toggle: false, new_vm: new_vm, selected: selected});
-  fieldsets.push({id: 'config_cdrom', toggle: false, new_vm: new_vm, selected: selected});
-  fieldsets.push({id: 'config_os', toggle: false, new_vm: new_vm, selected: selected});
-  fieldsets.push({id: 'config_dns', toggle: false, new_vm: new_vm, selected: selected});
   fieldsets.forEach(toggleFieldsets);
+  toggleAccordion(selected);
   toggleVolumes(selected);
   return false;
 }
@@ -142,6 +139,35 @@ function disableFieldset(fieldsetId, fieldset) {
   input_hidden_id(fieldsetId).attr('disabled','disabled');
 }
 
+function enableConfigOptions(fieldsetId) {
+  var field = $("#" + fieldsetId + "_advanced_options");
+  field.accordion({collapsible : true, heightStyle: "content"});
+  field.removeClass('disabled').find("*").prop("disabled", false);
+  field.removeClass('hide');
+}
+
+function disableConfigOptions(fieldsetId) {
+  var field = $("#" + fieldsetId + "_advanced_options");
+  field.addClass('disabled').find("*").prop("disabled", true);
+  field.addClass('hide');
+}
+
+function toggleConfigOptions(fieldsetId, type1, type2) {
+  if (type1 === type2) {
+    enableConfigOptions(fieldsetId);
+  } else {
+    disableConfigOptions(fieldsetId);
+  }
+}
+
+function toggleAccordion(selected){
+  ['qemu', 'lxc'].forEach(function(type){
+    fieldsets(type).forEach(function(fieldsetId){
+      toggleConfigOptions(fieldsetId, selected, type);
+    });
+  });
+}
+
 function toggleFieldset(fieldsetId, fieldset, type1, type2) {  
   type1 === type2 ? enableFieldset(fieldsetId, fieldset) : disableFieldset(fieldsetId, fieldset);
 }

diff --git a/app/views/compute_resources_vms/form/proxmox/container/_advanced.html.erb b/app/views/compute_resources_vms/form/proxmox/container/_advanced.html.erb
@@ -18,14 +18,4 @@ along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>. %>
 <% container = f.object.type == 'lxc' %>  
 
 <%= field_set_tag _("Advanced"), :id => "container_config_advanced_options", :class => ('hide' unless container) do %>
-  <%= label_tag 'show_container_config_options', n_("Main option", "Main options", 2) %>
-  <%= check_box_tag 'show_container_config_options', '1', false, :onclick => "$('#container_config_options').toggle()" %>
-  <%= label_tag 'show_container_config_cpu', _("CPU") %>
-  <%= check_box_tag 'show_container_config_cpu', '1', false, :onclick => "$('#container_config_cpu').toggle()" %>
-  <%= label_tag 'show_container_config_memory', _("Memory") %>
-  <%= check_box_tag 'show_container_config_memory', '1', false, :onclick => "$('#container_config_memory').toggle()" %>
-  <%= label_tag 'show_container_config_dns', _("DNS") %>
-  <%= check_box_tag 'show_container_config_dns', '1', false, :onclick => "$('#container_config_dns').toggle()" %>
-  <%= label_tag 'show_container_config_os', _("OS") %>
-  <%= check_box_tag 'show_container_config_os', '1', false, :onclick => "$('#container_config_os').toggle()" %>
-<% end %>
+<% end %>
diff --git a/app/views/compute_resources_vms/form/proxmox/container/_config.html.erb b/app/views/compute_resources_vms/form/proxmox/container/_config.html.erb
@@ -17,25 +17,32 @@ along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>. %>
 
 <%= javascript_include_tag 'foreman_fog_proxmox/proxmox_vm_container', "data-turbolinks-track" => true %>
 <% container = type == 'lxc' %>
-<%= field_set_tag n_("Main option", "Main options", 2), :id => "container_config_options", :class => 'hide', :disabled => !container do %>
-  <%= textarea_f f, :description, :label => _('Description'), :label_size => "col-md-2" %>
-  <%= checkbox_f f, :onboot, :label => _('Start at boot') %>
-<% end %>
-<%= field_set_tag _("CPU"), :id => "container_config_cpu", :class => 'hide', :disabled => !container do %>
+<%= content_tag :div, :id => "container_advanced_options" do %>
+  <%= content_tag :h3, "Main Options"%>
+  <div>
+    <%= textarea_f f, :description, :label => _('Description'), :label_size => "col-md-2" %>
+    <%= checkbox_f f, :onboot, :label => _('Start at boot') %>
+  </div>
+  <%= content_tag :h3, "CPUs"%>
+  <div>
   <%= select_f f, :arch, proxmox_archs_map, :id, :name, { }, :label => _('Architecture'), :label_size => "col-md-2" %>
   <%= counter_f f, :cores, :class => "input-mini", :label => _('Cores'), :label_size => "col-md-2" %>
   <%= counter_f f, :cpulimit, :class => "input-mini", :label => _('CPU limit'), :label_size => "col-md-2" %>
   <%= counter_f f, :cpuunits, :class => "input-mini", :label => _('CPU units'), :label_size => "col-md-2" %>
-<% end %>
-<%= field_set_tag _("Memory"), :id => "container_config_memory", :class => 'hide', :disabled => !container do %>
+  </div>
+  <%= content_tag :h3, "Memory"%>
+  <div>
   <%= text_f f, :memory, :class => "input-mini", :label => _('Memory (MB)'), :label_size => "col-md-2" %>
   <%= text_f f, :swap, :class => "input-mini", :label => _('Swap (MB)'), :label_size => "col-md-2" %>
-<% end %>
-<%= field_set_tag _("DNS"), :id => "container_config_dns", :class => 'hide', :disabled => !container do %>
+  </div>
+  <%= content_tag :h3, "DNS"%>
+  <div>
   <%= text_f f, :hostname, :label => _('Hostname'), :label_size => "col-md-2", :disabled => true %>
   <%= text_f f, :nameserver, :label => _('DNS server'), :label_size => "col-md-2" %>
   <%= text_f f, :searchdomain, :label => _('Search domain'), :label_size => "col-md-2" %>
-<% end %>
-<%= field_set_tag _("Operating System"), :id => "container_config_os", :class => 'hide', :disabled => !container do %>
+  </div>
+  <%= content_tag :h3, "Operating System"%>
+  <div>
   <%= select_f f, :ostype, proxmox_ostypes_map, :id, :name, { }, :label => _('OS type'), :label_size => "col-md-2" %>
-<% end %>
+  </div>
+<% end %>
diff --git a/app/views/compute_resources_vms/form/proxmox/server/_advanced.html.erb b/app/views/compute_resources_vms/form/proxmox/server/_advanced.html.erb
@@ -18,12 +18,4 @@ along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>. %>
 <% server = f.object.type == 'qemu' %>
 
 <%= field_set_tag _("Advanced"), :id => "server_config_advanced_options", :class => ('hide' unless server) do %>
-  <%= label_tag 'show_server_config_options', n_("Main option", "Main options", 2) %>
-  <%= check_box_tag 'show_server_config_options', '1', false, :onclick => "$('#server_config_options').toggle()" %>
-  <%= label_tag 'show_server_config_cpu', _("CPU") %>
-  <%= check_box_tag 'show_server_config_cpu', '1', false, :onclick => "$('#server_config_cpu').toggle()" %>
-  <%= label_tag 'show_server_config_memory', _("Memory") %>
-  <%= check_box_tag 'show_server_config_memory', '1', false, :onclick => "$('#server_config_memory').toggle()" %>
-  <%= label_tag 'show_server_config_os', _("OS") %>
-  <%= check_box_tag 'show_server_config_os', '1', false, :onclick => "$('#server_config_os').toggle()" %>
-<% end %>
+<% end %>
diff --git a/app/views/compute_resources_vms/form/proxmox/server/_config.html.erb b/app/views/compute_resources_vms/form/proxmox/server/_config.html.erb
@@ -20,17 +20,21 @@ along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>. %>
 <% server = type == 'qemu' %>
 <% logger.debug("_config.html.erb server_config=#{f.object.inspect}") %>
 
-<%= field_set_tag n_("Main option", "Main options", 2), :id => "server_config_options", :class => 'hide', :disabled => !server do %>
-  <%= textarea_f f, :description, :label => _('Description'), :label_size => "col-md-2" %>
-  <%= text_f f, :boot, :label => _('Boot device order'), :label_size => "col-md-2", :label_help => _('Order your devices, e.g. order=net0;ide2;scsi0. Default empty (any)')  %>
-  <%= checkbox_f f, :onboot, :label => _('Start at boot') %>
-  <%= checkbox_f f, :agent, :label => _('Qemu Agent') %>
-  <%= checkbox_f f, :kvm, :label => _('KVM'), :label_help => _('Enable/disable KVM hardware virtualization') %>
-  <%= select_f f, :vga, proxmox_vgas_map, :id, :name, { :include_blank => true }, :label => _('VGA'), :label_size => "col-md-2" %>
-  <%= select_f f, :scsihw, proxmox_scsi_controllers_map, :id, :name, { }, :label => _('SCSI Controller'), :label_size => "col-md-2" %>
-  <%= select_f f, :bios, proxmox_bios_map, :id, :name, { }, :label => _('BIOS'), :label_size => "col-md-2" %>
-<% end %>
-<%= field_set_tag _("CPUs"), :id => "server_config_cpu", :class => 'hide', :disabled => !server do %>
+<%= content_tag :div, :id => "server_advanced_options" do %>
+  <%= content_tag :h3, "Main Options" %>
+  <div>
+    <%= textarea_f f, :description, :label => _('Description'), :label_size => "col-md-2" %>
+    <%= text_f f, :boot, :label => _('Boot device order'), :label_size => "col-md-2", :label_help => _('Order your devices, e.g. order=net0;ide2;scsi0. Default empty (any)')  %>
+    <%= checkbox_f f, :onboot, :label => _('Start at boot') %>
+    <%= checkbox_f f, :agent, :label => _('Qemu Agent') %>
+    <%= checkbox_f f, :kvm, :label => _('KVM'), :label_help => _('Enable/disable KVM hardware virtualization') %>
+    <%= select_f f, :vga, proxmox_vgas_map, :id, :name, { :include_blank => true }, :label => _('VGA'), :label_size => "col-md-2" %>
+    <%= select_f f, :scsihw, proxmox_scsi_controllers_map, :id, :name, { }, :label => _('SCSI Controller'), :label_size => "col-md-2" %>
+    <%= select_f f, :bios, proxmox_bios_map, :id, :name, { }, :label => _('BIOS'), :label_size => "col-md-2" %>
+  </div>
+
+  <%= content_tag :h3, "CPUs" %>
+  <div>
   <%= select_f f, :cpu_type, proxmox_cpus_map, :id, :name, { }, :label => _('Type'), :label_size => "col-md-2" %>
   <%= counter_f f, :sockets, :class => "input-mini", :label => _('Sockets'), :label_size => "col-md-2" %>
   <%= counter_f f, :cores, :class => "input-mini", :label => _('Cores'), :label_size => "col-md-2" %>
@@ -43,19 +47,22 @@ along with ForemanFogProxmox. If not, see <http://www.gnu.org/licenses/>. %>
       <%= select_f f, flag_key, proxmox_cpu_flags_map, :id, :name, { }, :label => _(flag_value) %>
     <% end %>
   <% end %>
-<% end %>
-<%= field_set_tag _("Memory"), :id => "server_config_memory", :class => 'hide', :disabled => !server do %>
+  </div>
+  <%= content_tag :h3, "Memory" %>
+  <div>
   <%= text_f f, :memory, :class => "input-mini", :label => _('Memory (MB)'), :label_size => "col-md-2" %>
   <%= text_f f, :balloon, :class => "input-mini", :label => _('Minimum memory (MB)'), :label_size => "col-md-2" %>
   <%= text_f f, :shares, :class => "input-mini", :label => _('Shares (MB)'), :label_size => "col-md-2" %>
-<% end %>
-<%= field_set_tag _("Operating System"), :id => "server_config_os", :class => 'hide', :disabled => !server do %>
+  </div>
+  <%= content_tag :h3, "Operating System" %>
+  <div>
   <%= select_f f, :ostype, proxmox_operating_systems_map, :id, :name, { :include_blank => true }, :label => _('OS type'), :label_size => "col-md-2" %>
+  </div>
 <% end %>
 <%= field_set_tag _("Cloud-init"), :id => "server_config_cloud_init", :class => ('hide' unless cloudinit), :disabled => (!cloudinit) do %>
   <%= text_f f, :ciuser, :label => _('User'), :label_size => "col-md-2" %>
   <%= text_f f, :cipassword, :label => _('Password'), :label_size => "col-md-2" %>
   <%= text_f f, :searchdomain, :label => _('DNS domain'), :label_size => "col-md-2" %>
   <%= text_f f, :nameserver, :label => _('DNS servers'), :label_size => "col-md-2" %>
   <%= textarea_f f, :sshkeys, :label => _("SSH public key"), :size => "col-md-4" %>
-<% end %>
+<% end %>