root / snf-cyclades-app / synnefo / ui / templates / partials / networks.html @ 19b2c29d
History | View | Annotate | Download (12.7 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 class="inner clearfix main-content"> |
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-show="model.network.is_public" class="firewall"> |
115 |
<img data-rv-show="model.firewall_running" |
116 |
src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" |
117 |
class="progress-indicator" /> |
118 |
<div class="toggler-wrap clearfix"> |
119 |
<div class="cont-toggler firewall-toggle"> |
120 |
<span class="label machines-label">Firewall |
121 |
(<span class="firewall-on">On</span>) |
122 |
</span>
|
123 |
</div>
|
124 |
</div>
|
125 |
<div class="firewall-content clearfix" |
126 |
data-rv-class-dummy="model.firewall_status|update_firewall"> |
127 |
<input type="radio" class="checkboxes" value="DISABLED" |
128 |
checked="checked" |
129 |
data-rv-name="model.id|prefix firewall-" /> |
130 |
<span class="checkbox-legends current">Unprotected mode</span> |
131 |
<br /> |
132 |
<input type="radio" class="checkboxes" |
133 |
value="ENABLED" |
134 |
data-rv-name="model.id|prefix firewall-" /> |
135 |
<span class="checkbox-legends">Fully protected mode (Firewall on)</span> |
136 |
<br /> |
137 |
<input type="radio" class="checkboxes" |
138 |
data-rv-name="model.id|prefix firewall-" |
139 |
value="PROTECTED" /> |
140 |
<span class="checkbox-legends">Basically protected mode (Firewall on)</span> |
141 |
<br /> |
142 |
<button data-rv-on-click="view.set_firewall" type="submit" class="firewall-apply hidden">Apply</button> |
143 |
</div>
|
144 |
</div>
|
145 |
<div class="actions-content"> |
146 |
<div class="action-container isactive" |
147 |
data-rv-on-click="view.show_vm_details"> |
148 |
<a>Details</a> |
149 |
</div>
|
150 |
<div class="action-container disconnect warn" |
151 |
data-rv-class-isactive="model.can_disconnect" |
152 |
data-rv-class-selected="model.actions.disconnect|intEq 1" |
153 |
data-rv-on-click="view.set_disconnect_confirm"> |
154 |
<a>Disconnect</a> |
155 |
<div class="confirm-single clearfix"> |
156 |
<span class="yes" |
157 |
data-rv-on-click="view.disconnect_port"> |
158 |
{% trans "Confirm" %} |
159 |
</span>
|
160 |
<span class="no" data-rv-on-click="view.unset_disconnect_confirm">X</span> |
161 |
</div>
|
162 |
</div>
|
163 |
</div>
|
164 |
</div>
|
165 |
</div>
|
166 |
</div>
|
167 |
|
168 |
<div id="network-view-tpl" |
169 |
data-rv-class-actionpending="model.actions.pending" |
170 |
data-rv-class-clearfix="model.id" |
171 |
class="hidden model-item model-view with-actions"> |
172 |
<div class="clearfix"> |
173 |
<div class="main-content clearfix"> |
174 |
<div class="main-content-inner clearfix"> |
175 |
<img class="logo" data-rv-src="model.is_public|get_network_icon" /> |
176 |
<div class="entry"> |
177 |
<div data-rv-show="model" |
178 |
data-rv-model-view="model|ModelRenameView"> |
179 |
</div>
|
180 |
<div class="toggler-wrap clearfix network-ports-toggler"> |
181 |
<div class="cont-toggler"> |
182 |
<span class="label machines-label"> |
183 |
Connections (<span
|
184 |
data-rv-text="model.ports|collection_size">0</span>) |
185 |
</span>
|
186 |
<span class="network-progress-indicator"> |
187 |
<img src="{{ SYNNEFO_IMAGES_URL }}icons/indicators/small/progress.gif" /> |
188 |
</span>
|
189 |
</div>
|
190 |
</div>
|
191 |
<div class="ports nested-model-list" |
192 |
data-rv-class-is-public="model.is_public"> |
193 |
<div
|
194 |
data-rv-collection-view="model.ports|NetworkPortCollectionView"> |
195 |
</div>
|
196 |
</div>
|
197 |
</div>
|
198 |
<div class="entry-right"> |
199 |
<div data-rv-class="model.ext_status|status_cls" class="status"> |
200 |
<div class="status-title"> |
201 |
<span data-rv-text="model.cidr|status_display">STATUS</span> |
202 |
<span data-rv-show="model.in_progress">...</span> |
203 |
</div>
|
204 |
<div class="state state-indicator"> |
205 |
<div class="action-indicator"></div> |
206 |
</div>
|
207 |
<div class="status-indicator clearfix"> |
208 |
<div class="indicator indicator1"></div> |
209 |
<div class="indicator indicator2"></div> |
210 |
<div class="indicator indicator3"></div> |
211 |
<div class="indicator indicator4"></div> |
212 |
</div>
|
213 |
<div data-rv-show="model.status|in_progress" class="status-progress"></div> |
214 |
</div>
|
215 |
</div>
|
216 |
</div>
|
217 |
</div>
|
218 |
<div class="actions-content"> |
219 |
<div class="action-container connect" |
220 |
data-rv-class-isactive="model.can_connect" |
221 |
data-rv-on-click="view.show_connect_vms_overlay"> |
222 |
<a>{% trans "Connect machine" %}</a> |
223 |
</div>
|
224 |
<div class="action-container remove warn" |
225 |
data-rv-class-isactive="model.can_remove" |
226 |
data-rv-class-selected="model.actions.remove|intEq 1" |
227 |
data-rv-on-click="view.set_remove_confirm"> |
228 |
<a>{% trans "Destroy" %}</a> |
229 |
<div class="confirm-single clearfix"> |
230 |
<span class="yes" |
231 |
data-rv-on-click="view.remove"> |
232 |
{% trans "Confirm" %} |
233 |
</span>
|
234 |
<span class="no" data-rv-on-click="view.unset_remove_confirm">X</span> |
235 |
</div>
|
236 |
</div>
|
237 |
</div>
|
238 |
</div>
|
239 |
</div>
|
240 |
|
241 |
<div id="networks-list-view" class="collection-list-view"> |
242 |
<div class="collection"> |
243 |
|
244 |
<div id="create-network" class="create-button"> |
245 |
<a href="#">{% trans "New Network +" %}</a> |
246 |
</div>
|
247 |
|
248 |
<div class="empty-list hidden"> |
249 |
<p>{% trans "The list is empty" %}</p> |
250 |
</div>
|
251 |
|
252 |
<div class="items-list clearfix"> |
253 |
<div class="items-sublist public"></div> |
254 |
<div class="items-sublist private"></div> |
255 |
</div>
|
256 |
</div>
|
257 |
</div>
|
258 |
|
259 |
<div id="networks-select-floating-ip-tpl" class="hidden"> |
260 |
<div class="select-item floating-ip clearfix"> |
261 |
<div class="checkbox"> |
262 |
<input type="checkbox" data-rv-data-id="model.id" /> |
263 |
</div>
|
264 |
<div class="name" data-rv-text="model.floating_ip_address"></div> |
265 |
</div>
|
266 |
</div>
|
267 |
|
268 |
<div id="networks-select-floating-ips-tpl" class="hidden"> |
269 |
<div class="collection"> |
270 |
<div class="items-list floating-ips clearfix"> |
271 |
</div>
|
272 |
<div class="create model-item select-item floating-ip clearfix"> |
273 |
<span class="empty-list hidden" style="padding-left:0;"> |
274 |
{% trans "No ip addresses available" %} |
275 |
</span>
|
276 |
<a href="#">create new...</a> |
277 |
<span class="loading">creating...</span> |
278 |
<span class="no-available hidden">{% trans "No IPs available" %}</span> |
279 |
</div>
|
280 |
</div>
|
281 |
</div>
|
282 |
|
283 |
<div id="networks-select-public-item-tpl" class="hidden"> |
284 |
<div class="select-item clearfix"> |
285 |
<div class="checkbox"> |
286 |
<input type="checkbox" data-rv-data-id="model.id" /> |
287 |
</div>
|
288 |
<div class="ico"> |
289 |
<img data-rv-src="model.is_public|get_network_icon" /> |
290 |
</div>
|
291 |
<div class="name"> |
292 |
<span class="" data-rv-text="model.name"></span> |
293 |
<span class="no-available hidden">{% trans "No IPs available" %}</span> |
294 |
<span class="available hidden"></span> |
295 |
</div>
|
296 |
</div>
|
297 |
<div data-rv-show="model.is_public" class="floating-ips"> |
298 |
<div data-rv-collection-view="model.available_floating_ips|NetworkSelectFloatingIpsView"> |
299 |
</div>
|
300 |
</div>
|
301 |
</div>
|
302 |
|
303 |
<div id="networks-select-private-item-tpl" class="hidden"> |
304 |
<div class="select-item private-network clearfix"> |
305 |
<div class="checkbox"><input type="checkbox" data-rv-data-id="model.id"></div> |
306 |
<div class="ico"><img data-rv-src="model.is_public|get_network_icon" /></div> |
307 |
<div class="name"><span class="" data-rv-text="model.name|truncate 45"></span></div> |
308 |
<div class="cidr"><span class="" data-rv-text="model.subnet.cidr"></span></div> |
309 |
</div>
|
310 |
</div>
|
311 |
|
312 |
<div id="networks-select-public-tpl" class="hidden"> |
313 |
<div class="collection"> |
314 |
<div class="items-list"> |
315 |
</div>
|
316 |
</div>
|
317 |
</div>
|
318 |
|
319 |
<div id="networks-select-private-tpl" class="hidden"> |
320 |
<div class="collection"> |
321 |
<div class="items-list"> |
322 |
</div>
|
323 |
</div>
|
324 |
</div>
|
325 |
|
326 |
<div id="networks-select-view-tpl" class="hidden list-cont"> |
327 |
<h4>{% trans "Available networks" %}</h4> |
328 |
<p class="desc">Select the networks you want your machine to get connected to.</p> |
329 |
<div class="network-select"> |
330 |
<div class="public-list" |
331 |
data-rv-collection-view="model.public_collection|NetworkSelectPublicNetworks"> |
332 |
</div>
|
333 |
<div class="private-list" |
334 |
data-rv-collection-view="model.private_collection|NetworkSelectPrivateNetworks"> |
335 |
</div>
|
336 |
</div>
|
337 |
</div>
|