aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/index.html
diff options
context:
space:
mode:
authorEgor Tensin <Egor.Tensin@gmail.com>2021-10-03 02:47:07 +0300
committerEgor Tensin <Egor.Tensin@gmail.com>2021-10-03 02:47:07 +0300
commit48ffebfb40b393bcd9cb72a5406e3cdf4d9aabd3 (patch)
tree237346a1e4cdffaed12231702f63a4e5b59bb83e /index.html
parentbump jekyll-theme (diff)
downloadwireguard-config-48ffebfb40b393bcd9cb72a5406e3cdf4d9aabd3.tar.gz
wireguard-config-48ffebfb40b393bcd9cb72a5406e3cdf4d9aabd3.zip
add basic JavaScript functionality
This was the point of this little project: generating a bunch of config files. That's what main.js does. Also, rework the layout in index.html a bit. form-horizontal is not used that way.
Diffstat (limited to 'index.html')
-rw-r--r--index.html36
1 files changed, 21 insertions, 15 deletions
diff --git a/index.html b/index.html
index 832fb1b..66d8e60 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,9 @@ layout: plain
navbar:
link: Main
icon: home
+custom_js:
+ - https://cdn.jsdelivr.net/npm/ipaddr.js@2.0.0/ipaddr.min.js
+ - main.js
params:
- id: server
@@ -68,38 +71,41 @@ show the configuration that can be easily consumed by the new client.</p>
</div>
</div>
-<form class="form-horizontal">
+<form action="javascript:void(0);" onsubmit="form_on_submit(); return false;">
<div class="row">
{% for grp in page.params %}
<div class="col-md-6">
- <div class="form-group">
- <div class="row">
+ <div class="form-horizontal">
+ <div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<h2 class="text-center h3" style="margin-bottom: 0;">{{ grp.desc }}</h2>
</div>
</div>
- </div>
{% for param in grp.items %}
- <div class="form-group">
- <div class="row">
+ <div class="form-group">
<label for="param_{{ grp.id }}_{{ param.id }}" class="col-sm-3 control-label">{{ param.name }}</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="param_{{ grp.id }}_{{ param.id }}" placeholder="{{ param.placeholder }}" aria-describedby="param_{{ grp.id }}_{{ param.id }}_help">
- <span id="param_{{ grp.id }}_{{ param.id }}_help" class="help-block" style="margin-bottom: 0;">{{ param.help }}</span>
+ <span id="param_{{ grp.id }}_{{ param.id }}_help" class="help-block" style="margin-bottom: 0;">
+ <span id="param_{{ grp.id }}_{{ param.id }}_error" class="text-danger small" style="display: block; white-space: pre-line;"></span>
+ <span>{{ param.help }}</span>
+ </span>
</div>
</div>
- </div>
{% endfor %}
+ </div>
</div>
{% endfor %}
- <div class="col-md-offset-6 col-md-6">
- <div class="form-group">
- <div class="row">
- <div class="col-sm-offset-3 col-sm-9 text-center">
- <button type="submit" class="btn btn-primary">Generate</button>
- </div>
- </div>
+ <div class="row">
+ <div class="col-md-offset-6 col-md-6 text-center">
+ <button type="submit" class="btn btn-primary">Generate</button>
+ <span class="help-block" style="margin-bottom: 0;">
+ <span id="params_error" class="text-danger small" style="white-space: pre-line;"></span>
+ </span>
</div>
</div>
</div>
</form>
+
+<div id="instructors">
+</div>