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