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