Skip to content

Commit 3dbc70f

Browse files
jbowringjc21
jbowring
authored and
jc21
committed
Add SSL tab to stream UI
1 parent 3091c21 commit 3dbc70f

File tree

4 files changed

+336
-52
lines changed

4 files changed

+336
-52
lines changed

‎frontend/js/app/nginx/stream/form.ejs

+176-37
Original file line numberDiff line numberDiff line change
@@ -3,48 +3,187 @@
33
<h5 class="modal-title"><%- i18n('streams', 'form-title', {id: id}) %></h5>
44
<button type="button" class="close cancel" aria-label="Close" data-dismiss="modal">&nbsp;</button>
55
</div>
6-
<div class="modal-body">
6+
<div class="modal-body has-tabs">
7+
<div class="alert alert-danger mb-0 rounded-0" id="le-error-info" role="alert"></div>
78
<form>
8-
<div class="row">
9-
<div class="col-sm-12 col-md-12">
10-
<div class="form-group">
11-
<label class="form-label"><%- i18n('streams', 'incoming-port') %> <span class="form-required">*</span></label>
12-
<input name="incoming_port" type="number" class="form-control text-monospace" placeholder="eg: 8080" min="1" max="65535" value="<%- incoming_port %>" required>
9+
<ul class="nav nav-tabs" role="tablist">
10+
<li role="presentation" class="nav-item"><a href="#details" aria-controls="tab1" role="tab" data-toggle="tab" class="nav-link active"><i class="fe fe-zap"></i> <%- i18n('all-hosts', 'details') %></a></li>
11+
<li role="presentation" class="nav-item"><a href="#ssl-options" aria-controls="tab2" role="tab" data-toggle="tab" class="nav-link"><i class="fe fe-shield"></i> <%- i18n('str', 'ssl') %></a></li>
12+
</ul>
13+
<div class="tab-content">
14+
<!-- Details -->
15+
<div role="tabpanel" class="tab-pane active" id="details">
16+
<div class="row">
17+
<div class="col-sm-12 col-md-12">
18+
<div class="form-group">
19+
<label class="form-label"><%- i18n('streams', 'incoming-port') %> <span class="form-required">*</span></label>
20+
<input name="incoming_port" type="number" class="form-control text-monospace" placeholder="eg: 8080" min="1" max="65535" value="<%- incoming_port %>" required>
21+
</div>
22+
</div>
23+
<div class="col-sm-8 col-md-8">
24+
<div class="form-group">
25+
<label class="form-label"><%- i18n('streams', 'forwarding-host') %><span class="form-required">*</span></label>
26+
<input type="text" name="forwarding_host" class="form-control text-monospace" placeholder="example.com or 10.0.0.1 or 2001:db8:3333:4444:5555:6666:7777:8888" value="<%- forwarding_host %>" autocomplete="off" maxlength="255" required>
27+
</div>
28+
</div>
29+
<div class="col-sm-4 col-md-4">
30+
<div class="form-group">
31+
<label class="form-label"><%- i18n('streams', 'forwarding-port') %> <span class="form-required">*</span></label>
32+
<input name="forwarding_port" type="number" class="form-control text-monospace" placeholder="eg: 80" min="1" max="65535" value="<%- forwarding_port %>" required>
33+
</div>
34+
</div>
35+
<div class="col-sm-6 col-md-6">
36+
<div class="form-group">
37+
<label class="custom-switch">
38+
<input type="checkbox" class="custom-switch-input" name="tcp_forwarding" value="1"<%- tcp_forwarding ? ' checked' : '' %>>
39+
<span class="custom-switch-indicator"></span>
40+
<span class="custom-switch-description"><%- i18n('streams', 'tcp-forwarding') %></span>
41+
</label>
42+
</div>
43+
</div>
44+
<div class="col-sm-6 col-md-6">
45+
<div class="form-group">
46+
<label class="custom-switch">
47+
<input type="checkbox" class="custom-switch-input" name="udp_forwarding" value="1"<%- udp_forwarding ? ' checked' : '' %>>
48+
<span class="custom-switch-indicator"></span>
49+
<span class="custom-switch-description"><%- i18n('streams', 'udp-forwarding') %></span>
50+
</label>
51+
</div>
52+
</div>
53+
<div class="col-sm-12 col-md-12">
54+
<div class="forward-type-error invalid-feedback"><%- i18n('streams', 'forward-type-error') %></div>
55+
</div>
1356
</div>
1457
</div>
15-
<div class="col-sm-8 col-md-8">
16-
<div class="form-group">
17-
<label class="form-label"><%- i18n('streams', 'forwarding-host') %><span class="form-required">*</span></label>
18-
<input type="text" name="forwarding_host" class="form-control text-monospace" placeholder="example.com or 10.0.0.1 or 2001:db8:3333:4444:5555:6666:7777:8888" value="<%- forwarding_host %>" autocomplete="off" maxlength="255" required>
58+
59+
<!-- SSL -->
60+
<div role="tabpanel" class="tab-pane" id="ssl-options">
61+
<div class="row">
62+
<div class="col-sm-12 col-md-12">
63+
<div class="form-group">
64+
<label class="form-label"><%- i18n('streams', 'ssl-certificate') %></label>
65+
<select name="certificate_id" class="form-control custom-select" placeholder="<%- i18n('all-hosts', 'none') %>">
66+
<option selected value="0" data-data="{&quot;id&quot;:0}" <%- certificate_id ? '' : 'selected' %>><%- i18n('all-hosts', 'none') %></option>
67+
<option selected value="new" data-data="{&quot;id&quot;:&quot;new&quot;}"><%- i18n('all-hosts', 'new-cert') %></option>
68+
</select>
69+
</div>
70+
</div>
71+
72+
<!-- DNS challenge -->
73+
<div class="col-sm-12 col-md-12 letsencrypt">
74+
<div class="form-group">
75+
<label class="form-label"><%- i18n('all-hosts', 'domain-names') %> <span class="form-required">*</span></label>
76+
<input type="text" name="domain_names" class="form-control" id="input-domains" value="<%- domain_names.join(',') %>">
77+
</div>
78+
<div class="form-group">
79+
<label class="custom-switch">
80+
<input
81+
type="checkbox"
82+
class="custom-switch-input"
83+
name="meta[dns_challenge]"
84+
value="1"
85+
checked
86+
disabled
87+
>
88+
<span class="custom-switch-indicator"></span>
89+
<span class="custom-switch-description"><%= i18n('ssl', 'dns-challenge') %></span>
90+
</label>
91+
</div>
92+
</div>
93+
<div class="col-sm-12 col-md-12 letsencrypt">
94+
<fieldset class="form-fieldset dns-challenge">
95+
<div class="text-red mb-4"><i class="fe fe-alert-triangle"></i> <%= i18n('ssl', 'certbot-warning') %></div>
96+
97+
<!-- Certbot DNS plugin selection -->
98+
<div class="row">
99+
<div class="col-sm-12 col-md-12">
100+
<div class="form-group">
101+
<label class="form-label"><%- i18n('ssl', 'dns-provider') %> <span class="form-required">*</span></label>
102+
<select
103+
name="meta[dns_provider]"
104+
id="dns_provider"
105+
class="form-control custom-select"
106+
>
107+
<option
108+
value=""
109+
disabled
110+
hidden
111+
<%- getDnsProvider() === null ? 'selected' : '' %>
112+
>Please Choose...</option>
113+
<% _.each(dns_plugins, function(plugin_info, plugin_name){ %>
114+
<option
115+
value="<%- plugin_name %>"
116+
<%- getDnsProvider() === plugin_name ? 'selected' : '' %>
117+
><%- plugin_info.name %></option>
118+
<% }); %>
119+
</select>
120+
</div>
121+
</div>
122+
</div>
123+
124+
<!-- Certbot credentials file content -->
125+
<div class="row credentials-file-content">
126+
<div class="col-sm-12 col-md-12">
127+
<div class="form-group">
128+
<label class="form-label"><%- i18n('ssl', 'credentials-file-content') %> <span class="form-required">*</span></label>
129+
<textarea
130+
name="meta[dns_provider_credentials]"
131+
class="form-control text-monospace"
132+
id="dns_provider_credentials"
133+
><%- getDnsProviderCredentials() %></textarea>
134+
<div class="text-secondary small">
135+
<i class="fe fe-info"></i>
136+
<%= i18n('ssl', 'credentials-file-content-info') %>
137+
</div>
138+
<div class="text-red small">
139+
<i class="fe fe-alert-triangle"></i>
140+
<%= i18n('ssl', 'stored-as-plaintext-info') %>
141+
</div>
142+
</div>
143+
</div>
144+
</div>
145+
146+
<!-- DNS propagation delay -->
147+
<div class="row">
148+
<div class="col-sm-12 col-md-12">
149+
<div class="form-group mb-0">
150+
<label class="form-label"><%- i18n('ssl', 'propagation-seconds') %></label>
151+
<input
152+
type="number"
153+
min="0"
154+
name="meta[propagation_seconds]"
155+
class="form-control"
156+
id="propagation_seconds"
157+
value="<%- getPropagationSeconds() %>"
158+
>
159+
<div class="text-secondary small">
160+
<i class="fe fe-info"></i>
161+
<%= i18n('ssl', 'propagation-seconds-info') %>
162+
</div>
163+
</div>
164+
</div>
165+
</div>
166+
</fieldset>
167+
</div>
168+
169+
<!-- Lets encrypt -->
170+
<div class="col-sm-12 col-md-12 letsencrypt">
171+
<div class="form-group">
172+
<label class="form-label"><%- i18n('ssl', 'letsencrypt-email') %> <span class="form-required">*</span></label>
173+
<input name="meta[letsencrypt_email]" type="email" class="form-control" placeholder="" value="<%- getLetsencryptEmail() %>" required disabled>
174+
</div>
175+
</div>
176+
<div class="col-sm-12 col-md-12 letsencrypt">
177+
<div class="form-group">
178+
<label class="custom-switch">
179+
<input type="checkbox" class="custom-switch-input" name="meta[letsencrypt_agree]" value="1" required disabled>
180+
<span class="custom-switch-indicator"></span>
181+
<span class="custom-switch-description"><%= i18n('ssl', 'letsencrypt-agree', {url: 'https://letsencrypt.org/repository/'}) %> <span class="form-required">*</span></span>
182+
</label>
183+
</div>
184+
</div>
19185
</div>
20186
</div>
21-
<div class="col-sm-4 col-md-4">
22-
<div class="form-group">
23-
<label class="form-label"><%- i18n('streams', 'forwarding-port') %> <span class="form-required">*</span></label>
24-
<input name="forwarding_port" type="number" class="form-control text-monospace" placeholder="eg: 80" min="1" max="65535" value="<%- forwarding_port %>" required>
25-
</div>
26-
</div>
27-
<div class="col-sm-6 col-md-6">
28-
<div class="form-group">
29-
<label class="custom-switch">
30-
<input type="checkbox" class="custom-switch-input" name="tcp_forwarding" value="1"<%- tcp_forwarding ? ' checked' : '' %>>
31-
<span class="custom-switch-indicator"></span>
32-
<span class="custom-switch-description"><%- i18n('streams', 'tcp-forwarding') %></span>
33-
</label>
34-
</div>
35-
</div>
36-
<div class="col-sm-6 col-md-6">
37-
<div class="form-group">
38-
<label class="custom-switch">
39-
<input type="checkbox" class="custom-switch-input" name="udp_forwarding" value="1"<%- udp_forwarding ? ' checked' : '' %>>
40-
<span class="custom-switch-indicator"></span>
41-
<span class="custom-switch-description"><%- i18n('streams', 'udp-forwarding') %></span>
42-
</label>
43-
</div>
44-
</div>
45-
<div class="col-sm-12 col-md-12">
46-
<div class="forward-type-error invalid-feedback"><%- i18n('streams', 'forward-type-error') %></div>
47-
</div>
48187
</div>
49188
</form>
50189
</div>

0 commit comments

Comments
 (0)