Installer: Use dropdown for network selection
Change-Id: If50b8a585c55831cf3eee1172571d4dd5a098f4d
diff --git a/core/installer/welcome/appmanager-tmpl/app.html b/core/installer/welcome/appmanager-tmpl/app.html
index e65c612..e6fe096 100644
--- a/core/installer/welcome/appmanager-tmpl/app.html
+++ b/core/installer/welcome/appmanager-tmpl/app.html
@@ -41,12 +41,21 @@
{{ else if eq $schema.Kind 3 }}
<label {{ if $schema.Advanced }}hidden{{ end }}>
{{ $schema.Name }}
- <select name="{{ $name }}" oninput="valueChanged({{ $name }}, this.value)" {{ if $readonly }}disabled{{ end }} >
- {{ if not $readonly }}<option disabled selected value></option>{{ end }}
- {{ range $networks }}
- <option {{if eq .Name (index $data $name) }}selected{{ end }}>{{ .Name }}</option>
- {{ end }}
- </select>
+ <details class="dropdown">
+ {{ $selectedNetwork := index $data $name }}
+ <summary id="{{ $name }}">{{ $selectedNetwork }}</summary>
+ <ul>
+ {{ range $networks }}
+ {{ $selected := eq $selectedNetwork .Name }}
+ <li>
+ <label>
+ <input type="radio" name="{{ $name }}" oninput="networkSelected('{{ $name }}', '{{ .Name }}', this.checked)" {{ if $selected }}checked{{ end }} />
+ {{ .Name }}
+ </label>
+ </li>
+ {{ end }}
+ </ul>
+ </details>
</label>
{{ else if eq $schema.Kind 10 }}
<label {{ if $schema.Advanced }}hidden{{ end }}>
@@ -188,6 +197,14 @@
setValue(name, value, config);
}
+ function networkSelected(name, network, selected) {
+ console.log(selected);
+ setValue(name, network, config);
+ let summary = document.getElementById(name);
+ summary.innerHTML = network;
+ summary.parentNode.removeAttribute("open");
+ }
+
function multiNetworkSelected(name, network, selected) {
let v = getValue(name, config);
if (v === undefined) {
diff --git a/core/installer/welcome/appmanager-tmpl/base.html b/core/installer/welcome/appmanager-tmpl/base.html
index 130f966..fa77d97 100644
--- a/core/installer/welcome/appmanager-tmpl/base.html
+++ b/core/installer/welcome/appmanager-tmpl/base.html
@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="/static/pico.2.0.6.min.css">
- <link rel="stylesheet" type="text/css" href="/static/appmanager.css?v=0.0.13">
+ <link rel="stylesheet" type="text/css" href="/static/appmanager.css?v=0.0.14">
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
diff --git a/core/installer/welcome/static/appmanager.css b/core/installer/welcome/static/appmanager.css
index 2e9787b..cde49ab 100644
--- a/core/installer/welcome/static/appmanager.css
+++ b/core/installer/welcome/static/appmanager.css
@@ -11,6 +11,7 @@
--pico-form-element-background-color: #d6d6d6;
--pico-form-element-active-background-color: #d6d6d6;
--pico-form-element-selected-background-color: #d6d6d6;
+ --pico-dropdown-color: #3a3a3a;
--pico-dropdown-background-color: #d6d6d6;
--pico-dropdown-border-color: #7f9f7f;
--pico-dropdown-hover-background-color: #7f9f7f;