root / snf-cyclades-app / synnefo / ui / templates / partials / networks.html @ 198b546d
History | View | Annotate | Download (13.4 kB)
1 |
{% load i18n %} |
---|---|
2 |
|
3 |
<!-- add new network overlay -->
|
4 |
<div id="networks-create-content" class="overlay-content hidden"> |
5 |
<div class="create-form"> |
6 |
<p class="info"></p> |
7 |
<form>
|
8 |
<div class="col-fields bordered clearfix"> |
9 |
<div class="form-field"> |
10 |
<label for="network-create-name">Project</label> |
11 |
<select class="project-select"></select> |
12 |
</div>
|
13 |
</div>
|
14 |
<div class="col-fields bordered clearfix"> |
15 |
<div class="form-field"> |
16 |
<label for="network-create-name">Network name:</label> |
17 |
<input type="text" class="network-create-name" name="network-create-name" id="network-create-name" /> |
18 |
</div>
|
19 |
<div class="form-field right-field"> |
20 |
<label for="network-create-type">Network type:</label> |
21 |
<select id="network-create-type"> |
22 |
</select>
|
23 |
</div>
|
24 |
</div>
|
25 |
<div class="col-fields clearfix bordered"> |
26 |
<div class="form-field fixpos"> |
27 |
<label for="network-create-dhcp">Assign IP addresses automatically:</label> |
28 |
<input type="checkbox" class="use-dhcp" name="network-create-dhcp" |
29 |
id="network-create-dhcp" checked |
30 |
<p ="description fields-desc"> |
31 |
If you enable DHCP on the private network, |
32 |
connected virtual machines will automatically be assigned |
33 |
an IP address based on the given subnet. You may disable this option |
34 |
if you want to assign IP addresses to the connected |
35 |
virtual machines manually. |
36 |
</p>
|
37 |
</div>
|
38 |
<div id="network-create-dhcp-fields"> |
39 |
<div class="form-field fixpos"> |
40 |
<label for="network-type">Network subnet:</label> |
41 |
<select id="network-create-subnet"> |
42 |
<option selected ="auto" value="auto">Auto</option> |
43 |
<option value="custom" class="manual">Manual...</option> |
44 |
</select>
|
45 |
</div>
|
46 |
<div class="form-field"> |
47 |
<label class="hidden" for="network-custom-subnet">Custom subnet:</label> |
48 |
<input type="text" id="network-create-subnet-custom"/> |
49 |
</div>
|
50 |
</div>
|
51 |
</div>
|
52 |
<div class="form-actions plain clearfix"> |
53 |
<span class="form-action create">create network</span> |
54 |
</div>
|
55 |
</form>
|
56 |
</div>
|
57 |
|
58 |
<div class="ajax-submit"></div> |
59 |
</div>
|
60 |
|
61 |
<!-- vm select -->
|
62 |
<div id="network-vms-select-content" class="overlay-content hidden"> |
63 |
<div class="description"> |
64 |
<p>{% trans "Select machines to add" %}</p> |
65 |
</div>
|
66 |
<div class="clearfix vms-list"> |
67 |
<ul class="options-list three"> |
68 |
</ul>
|
69 |
</div>
|
70 |
<div class="form-actions clearfix"> |
71 |
<span class="form-action create">{% trans "connect machines" %}</span> |
72 |
<span class="form-action assign">{% trans "connect machine" %}</span> |
73 |
</div>
|
74 |
</div>
|
75 |
|
76 |
|
77 |
<div id="network-port-collection-view-tpl" class="collection-list-view hidden"> |
78 |
<div class="collection"> |
79 |
<div class="empty-list item-list hidden nested"> |
80 |
<div class="border"> |
81 |
<i class="add icon-action connect" |
82 |
data-rv-on-click="view.show_connect_vms_overlay">+</i> |
83 |
</div>
|
84 |
<div class="border2"></div> |
85 |
</div>
|
86 |
<div class="items-list clearfix"> |
87 |
</div>
|
88 |
</div>
|
89 |
</div>
|
90 |
|
91 |
<div id="network-port-view-tpl" class="hidden model-item" |
92 |
data-rv-class-actionpending="model.actions.pending"> |
93 |
<div class="outer"> |
94 |
<div class="border"> |
95 |
<i data-rv-show="model.can_disconnect" |
96 |
class="remove icon-action" |
97 |
data-rv-on-click="view.set_disconnect_confirm">X</i> |
98 |
</div>
|
99 |
<div class="border2"></div> |
100 |
<div data-rv-class="model.vm.status|vm_status_cls"> |
101 |
<img class="model-logo" data-rv-src="model.vm.status|vm_logo_url" /> |
102 |
<h5 class="title" data-rv-text="model.vm.name|truncate 35"></h5> |
103 |
<div class="state state-indicator"> |
104 |
<div class="action-indicator"></div> |
105 |
</div>
|
106 |
<ul class="ip-addresses"> |
107 |
<li data-rv-each-item="model.fixed_ips"> |
108 |
<span data-rv-text="item:ip_address|ip_type" class="type"></span> |
109 |
<span data-rv-text="item:ip_address" class="ip">IP</span> |
110 |
</li>
|
111 |
</ul>
|
112 |
<div class="firewall"> |
113 |
<img data-rv-show="model.in_progress" |
114 |
src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" |
115 |
class="progress-indicator" /> |
116 |
<img data-rv-show="model.vm.in_progress" |
117 |
src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" |
118 |
class="progress-indicator" /> |
119 |
</div>
|
120 |
<div data-rv-hide="model.vm.status|error_status"> |
121 |
<div data-rv-show="model.network.is_public" |
122 |
class="firewall"> |
123 |
<img data-rv-show="model.firewall_running" |
124 |
src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" |
125 |
class="progress-indicator" /> |
126 |
<div class="toggler-wrap clearfix"> |
127 |
<div class="cont-toggler firewall-toggle"> |
128 |
<span class="label machines-label">Firewall |
129 |
(<span class="firewall-on">On</span>) |
130 |
</span>
|
131 |
</div>
|
132 |
</div>
|
133 |
<div class="firewall-content clearfix" |
134 |
data-rv-class-dummy="model.firewall_status|update_firewall"> |
135 |
<input type="radio" class="checkboxes" value="DISABLED" |
136 |
checked="checked" |
137 |
data-rv-name="model.id|prefix firewall-" /> |
138 |
<span class="checkbox-legends current">Unprotected mode</span> |
139 |
<br /> |
140 |
<input type="radio" class="checkboxes" |
141 |
value="ENABLED" |
142 |
data-rv-name="model.id|prefix firewall-" /> |
143 |
<span class="checkbox-legends">Fully protected mode (Firewall on)</span> |
144 |
<br /> |
145 |
<input type="radio" class="checkboxes" |
146 |
data-rv-name="model.id|prefix firewall-" |
147 |
value="PROTECTED" /> |
148 |
<span class="checkbox-legends">Basically protected mode (Firewall on)</span> |
149 |
<br /> |
150 |
<button data-rv-on-click="view.set_firewall" type="submit" class="firewall-apply hidden">Apply</button> |
151 |
</div>
|
152 |
</div>
|
153 |
</div>
|
154 |
<div class="actions-content"> |
155 |
<div class="action-container isactive" |
156 |
data-rv-on-click="view.show_vm_details"> |
157 |
<a>Details</a> |
158 |
</div>
|
159 |
<div class="action-container disconnect warn" |
160 |
data-rv-class-isactive="model.can_disconnect" |
161 |
data-rv-class-selected="model.actions.disconnect|intEq 1" |
162 |
data-rv-on-click="view.set_disconnect_confirm"> |
163 |
<a>Disconnect</a> |
164 |
<div class="confirm-single clearfix"> |
165 |
<span class="yes" |
166 |
data-rv-on-click="view.disconnect_port"> |
167 |
{% trans "Confirm" %} |
168 |
</span>
|
169 |
<span class="no" data-rv-on-click="view.unset_disconnect_confirm">X</span> |
170 |
</div>
|
171 |
</div>
|
172 |
</div>
|
173 |
</div>
|
174 |
</div>
|
175 |
</div>
|
176 |
|
177 |
<div id="network-view-tpl" |
178 |
data-rv-class-actionpending="model.actions.pending" |
179 |
data-rv-class-clearfix="model.id" |
180 |
class="hidden model-item model-view with-actions"> |
181 |
<div class="clearfix"> |
182 |
<div class="main-content clearfix" style="position: relative"> |
183 |
<div class="main-content-inner clearfix"> |
184 |
<div class="project-name-cont" |
185 |
data-rv-on-click="view.show_reassign_view" |
186 |
data-rv-show="model.tenant_id"> |
187 |
<span class="project-name" data-rv-text="model.project.name|truncate 20"></span> |
188 |
</div>
|
189 |
<img class="logo" data-rv-src="model.is_public|get_network_icon" /> |
190 |
<div class="entry"> |
191 |
<div data-rv-show="model" |
192 |
data-rv-model-view="model|ModelRenameView"> |
193 |
</div>
|
194 |
<div class="toggler-wrap clearfix network-ports-toggler"> |
195 |
<div class="cont-toggler"> |
196 |
<span class="label machines-label"> |
197 |
Connections (<span
|
198 |
data-rv-text="model.ports|collection_size">0</span>) |
199 |
</span>
|
200 |
<span class="network-progress-indicator"> |
201 |
<img src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" /> |
202 |
</span>
|
203 |
</div>
|
204 |
</div>
|
205 |
<div class="ports nested-model-list" |
206 |
data-rv-class-is-public="model.is_public"> |
207 |
<div
|
208 |
data-rv-collection-view="model.ports|NetworkPortCollectionView"> |
209 |
</div>
|
210 |
</div>
|
211 |
</div>
|
212 |
<div class="entry-right"> |
213 |
<div data-rv-class="model.ext_status|status_cls" class="status"> |
214 |
<div class="status-title"> |
215 |
<span data-rv-text="model.cidr|status_display">STATUS</span> |
216 |
<span data-rv-show="model.in_progress">...</span> |
217 |
</div>
|
218 |
<div class="state state-indicator"> |
219 |
<div class="action-indicator"></div> |
220 |
</div>
|
221 |
<div class="status-indicator clearfix"> |
222 |
<div class="indicator indicator1"></div> |
223 |
<div class="indicator indicator2"></div> |
224 |
<div class="indicator indicator3"></div> |
225 |
<div class="indicator indicator4"></div> |
226 |
</div>
|
227 |
<div data-rv-show="model.status|in_progress" class="status-progress"></div> |
228 |
</div>
|
229 |
</div>
|
230 |
</div>
|
231 |
</div>
|
232 |
<div class="actions-content"> |
233 |
<div class="action-container connect" |
234 |
data-rv-class-isactive="model.can_connect" |
235 |
data-rv-on-click="view.show_connect_vms_overlay"> |
236 |
<a>{% trans "Connect machine" %}</a> |
237 |
</div>
|
238 |
<div class="action-container remove warn" |
239 |
data-rv-class-isactive="model.can_remove" |
240 |
data-rv-class-selected="model.actions.remove|intEq 1" |
241 |
data-rv-on-click="view.set_remove_confirm"> |
242 |
<a>{% trans "Destroy" %}</a> |
243 |
<div class="confirm-single clearfix"> |
244 |
<span class="yes" |
245 |
data-rv-on-click="view.remove"> |
246 |
{% trans "Confirm" %} |
247 |
</span>
|
248 |
<span class="no" data-rv-on-click="view.unset_remove_confirm">X</span> |
249 |
</div>
|
250 |
</div>
|
251 |
</div>
|
252 |
</div>
|
253 |
</div>
|
254 |
|
255 |
<div id="networks-list-view" class="collection-list-view"> |
256 |
<div class="collection"> |
257 |
|
258 |
<div id="create-network" class="create-button"> |
259 |
<a href="#">{% trans "New Network +" %}</a> |
260 |
</div>
|
261 |
|
262 |
<div class="empty-list hidden"> |
263 |
<p>{% trans "The list is empty" %}</p> |
264 |
</div>
|
265 |
|
266 |
<div class="items-list clearfix"> |
267 |
<div class="items-sublist public"></div> |
268 |
<div class="items-sublist private"></div> |
269 |
</div>
|
270 |
</div>
|
271 |
</div>
|
272 |
|
273 |
<div id="networks-select-floating-ip-tpl" class="hidden"> |
274 |
<div class="select-item floating-ip clearfix"> |
275 |
<div class="checkbox"> |
276 |
<input type="checkbox" data-rv-data-id="model.id" /> |
277 |
</div>
|
278 |
<div class="name" data-rv-text="model.floating_ip_address"></div> |
279 |
</div>
|
280 |
</div>
|
281 |
|
282 |
<div id="networks-select-floating-ips-tpl" class="hidden"> |
283 |
<div class="collection"> |
284 |
<div class="items-list floating-ips clearfix"> |
285 |
</div>
|
286 |
<div class="create model-item select-item floating-ip clearfix"> |
287 |
<span class="empty-list hidden" style="padding-left:0;"> |
288 |
{% trans "No ip addresses available" %} |
289 |
</span>
|
290 |
<a href="#">create new...</a> |
291 |
<span class="loading">creating...</span> |
292 |
<span class="no-available hidden">{% trans "No IPs available" %}</span> |
293 |
</div>
|
294 |
</div>
|
295 |
</div>
|
296 |
|
297 |
<div id="networks-select-public-item-tpl" class="hidden"> |
298 |
<div class="select-item clearfix"> |
299 |
<div class="checkbox"> |
300 |
<input type="checkbox" data-rv-data-id="model.id" /> |
301 |
</div>
|
302 |
<div class="ico"> |
303 |
<img data-rv-src="model.is_public|get_network_icon" /> |
304 |
</div>
|
305 |
<div class="name"> |
306 |
<span class="" data-rv-text="model.name"></span> |
307 |
<span class="no-available hidden">{% trans "No IPs available" %}</span> |
308 |
<span class="available hidden"></span> |
309 |
</div>
|
310 |
</div>
|
311 |
<div data-rv-show="model.is_public" class="floating-ips"> |
312 |
<div
|
313 |
data-rv-collection-view="model.available_floating_ips|NetworkSelectFloatingIpsView,resolve_floating_ip_view_params"> |
314 |
</div>
|
315 |
</div>
|
316 |
</div>
|
317 |
|
318 |
<div id="networks-select-private-item-tpl" class="hidden"> |
319 |
<div class="select-item private-network clearfix"> |
320 |
<div class="checkbox"><input type="checkbox" data-rv-data-id="model.id"></div> |
321 |
<div class="ico"><img data-rv-src="model.is_public|get_network_icon" /></div> |
322 |
<div class="name"><span class="" data-rv-text="model.name|truncate 45"></span></div> |
323 |
<div class="cidr"><span class="" data-rv-text="model.subnet.cidr"></span></div> |
324 |
</div>
|
325 |
</div>
|
326 |
|
327 |
<div id="networks-select-public-tpl" class="hidden"> |
328 |
<div class="collection"> |
329 |
<div class="items-list"> |
330 |
</div>
|
331 |
</div>
|
332 |
</div>
|
333 |
|
334 |
<div id="networks-select-private-tpl" class="hidden"> |
335 |
<div class="collection"> |
336 |
<div class="items-list"> |
337 |
</div>
|
338 |
</div>
|
339 |
</div>
|
340 |
|
341 |
<div id="networks-select-view-tpl" class="hidden list-cont"> |
342 |
<h4>{% trans "Available networks" %}</h4> |
343 |
<p class="desc">Select the networks you want your machine to get connected to.</p> |
344 |
<div class="network-select"> |
345 |
<div class="public-list" |
346 |
data-rv-collection-view="model.public_collection|NetworkSelectPublicNetworks"> |
347 |
</div>
|
348 |
<div class="private-list" |
349 |
data-rv-collection-view="model.private_collection|NetworkSelectPrivateNetworks"> |
350 |
</div>
|
351 |
</div>
|
352 |
</div>
|