Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / templates / partials / create_vm.html @ 3b463c5a

History | View | Annotate | Download (17.4 kB)

1
{% load i18n %}
2
<div id="createvm-overlay-content" class="hidden create-vm">
3
    <div class="steps-history clearfix">
4
        <div class="steps-history-cont step1h completed step-header"
5
            id="vm-create-step-history-1">
6
            <div class="steps-history-step clearfix">
7
                <span class="header-step step-1 clearfix">
8
                    <span class="num">1<span class="subnum">/3</span></span>
9
                    <span class="title">
10
                        {% trans "Image" %}
11
                    </span>
12
                    <div class="info">
13
                        <span class="subtitle">
14
                            {% trans "Select an OS" %}
15
                        </span>
16
                        <span class="description">
17
                            {% trans "Choose your preferred image" %}
18
                        </span>
19
                    </div>
20
                </span>
21
            </div>
22
        </div>
23
        <div class="steps-history-cont step2h current step-header"
24
           id="vm-create-step-history-2" >
25
            <div class="steps-history-step clearfix">
26
                <span class="header-step step-2 clearfix">
27
                    <span class="num">2<span class="subnum">/3</span></span>
28
                    <span class="title">
29
                        {% trans "Flavor" %}
30
                    </span>
31
                    <div class="info">
32
                        <span class="subtitle">
33
                            {% trans "Select CPUs, RAM and Disk Size" %}
34
                        </span>
35
                        <span class="description">
36
                            {% trans "Available options are filtered based on the selected image" %}
37
                        </span>
38
                    </div>
39
                </span>
40
            </div>
41
        </div>
42
        <div class="steps-history-cont step3h step-header">
43
            <div class="steps-history-step clearfix"
44
                id="vm-create-step-history-3">
45
                <span class="header-step step-3 clearfix">
46
                    <span class="num">3<span class="subnum">/3</span></span>
47
                    <span class="title">
48
                        {% trans "Personalize" %}
49
                    </span>
50
                    <div class="info">
51
                        <span class="subtitle">
52
                            {% trans "Virtual machine custom options" %}
53
                        </span>
54
                        <span class="description">
55
                            {% trans "Virtual machine custom options" %}
56
                        </span>
57
                    </div>
58
                </span>
59
            </div>
60
        </div>
61
        <div class="steps-history-cont step4h last step-header">
62
            <div class="steps-history-step clearfix"
63
                id="vm-create-step-history-4">
64
                <span class="header-step step-4 clearfix">
65
                    <span class="num">4<span class="subnum">/3</span></span>
66
                    <span class="title">
67
                        {% trans "Confirm" %}
68
                    </span>
69
                    <div class="info">
70
                        <span class="subtitle">
71
                            {% trans "Confirm your settings" %}
72
                        </span>
73
                        <span class="description">
74
                            {% trans "Confirm that the options you have selected are correct" %}
75
                        </span>
76
                    </div>
77
                </span>
78
            </div>
79
        </div>
80
    </div>
81
    <div class="steps-container clearfix">
82
        <div class="step-1 select-image wide create-step-cont clearfix">
83
            <div class="clearfix step-header">
84
            </div>
85
            <div class="step-cont clearfix">
86
                <div class="images-filter-cont content-cont">
87
                    <div class="images-filters">
88
                        <div class="image-types-cont">
89
                            <h4>Image type</h4>
90
                            <ul class="type-filter">
91
                            </ul>
92
                        </div>
93
                        <div class="categories-filters-cont">
94
                            <h4 class="image-filters-title">Categories </h4>
95
                            <ul class="category-filters clearfix"></ul>
96
                            <span class="clear">{% trans "clear categories" %}</span>
97
                            <span class="empty">{% trans "no categories available" %}</span>
98
                        </div>
99
                    </div>
100
                </div>
101
                <div class="images-list-cont content-cont">
102
                    <h4>{% trans "Available images" %}
103
                        <span class="loading-indicator"></span>
104
                        <span class="custom-action">
105
                        <a href="#" class="register-custom-image">{% trans "create image" %}</a>
106
                        </span>
107
                    </h4>
108
                    <ul class="images-list">
109
                    </ul>
110
                    <span class="empty">
111
                      {% trans "No images available" %}.
112
                    </span>
113
                    {% if custom_image_help_url %}
114
                    <span class="custom-image-help" style="display:none">
115
                      <br /><br />
116
                      {% blocktrans with custom_image_help_url as url %}
117
                      Consult <a href="{{ url }}">this guide</a> if you want to create a custom OS image
118
                      {% endblocktrans %}
119
                    </span>
120
                    {% endif %}
121
                    <span class="loading hidden">{% trans "loading..." %}</span>
122
                </div>
123
                <div class="images-info-cont content-cont">
124
                    <h4>Image title</h4>
125
                    <span class="hide">close details</span>
126
                    <div class="image-detail description clearfix">
127
                        <span class="title">{% trans "Description" %}</span>
128
                        <p></p>
129
                    </div>
130
                    <h3>Image metadata</h3>
131
                    <div class="extra-details clearfix">
132
                    </div>
133

    
134
                </div>
135
            </div>
136
        </div>
137
        <div class="step-2 select-flavor create-step-cont clearfix">
138
            <div class="clearfix step-header">
139
            </div>
140
            <div class="step-cont clearfix">
141
                <div class="flavors-predefined-cont content-cont"> 
142
                    <div class="flavors-predefined">
143
                        <h4>{% trans "Predefined" %}</h4>
144
                        <ul class="predefined-list">
145
                        </ul>
146
                    </div>
147
                </div>
148
                <div class="flavor-options-cont content-cont">
149
                    <div class="flavor-options-inner-cont clearfix"
150
                        id="create-vm-flavor-options">
151
                        <div class="flavor-options cpu clearfix">
152
                          <h4 class="clearfix"><span class="title">{% trans "CPUs" %}</span>
153
                            <span class="available"></span>
154
                                <span class="desc">{% trans "Choose number of CPU cores" %}</span>
155
                            </h4>
156
                            <ul class="flavors-cpu-list flavor-opts-list clearfix">
157
                            </ul>
158
                        </div>
159
                        <div class="flavor-options mem clearfix">
160
                            <h4 class="clearfix"><span class="title">{% trans "Memory size" %}</span>
161
                            <span class="available"></span>
162
                                <span class="desc">{% trans "Choose memory size" %}</span>
163
                            </h4>
164
                            <ul class="flavors-mem-list flavor-opts-list clearfix">
165
                            </ul>
166
                        </div>
167
                        <div class="flavor-options disk clearfix">
168
                            <h4 class="clearfix"><span class="title">{% trans "Disk size" %}</span>
169
                            <span class="available"></span>
170
                                <span class="desc">{% trans "Choose disk size" %}</span>
171
                            </h4>
172
                            <ul class="flavors-disk-list flavor-opts-list clearfix">
173
                            </ul>
174
                        </div>
175
                        <div class="flavor-options disk_template clearfix">
176
                            <h4 class="clearfix"><span class="title">{% trans "Storage" %}</span>
177
                                <span class="desc">{% trans "Select storage type" %}</span>
178
                            </h4>
179
                            <ul class="flavors-disk-template-list flavor-opts-list clearfix">
180
                            </ul>
181
                            <div class="disk-template-description">
182
                                <p></p>
183
                            </div>
184
                        </div>
185
                    </div>
186
                </div>
187
            </div>
188
        </div>
189
        <div class="step-3 vm-personalize create-step-cont clearfix">
190
            <div class="clearfix step-header">
191
            </div>
192
            <div class="step-cont clearfix">
193
                <div class="rename">
194
                    <div class="form-field">
195
                        <h4>
196
                            <label for="create-vm-name">{% trans "Machine name" %}</label>
197
                        </h4>
198
                        <input type="text" name="create-vm-name"
199
                        class="rename-field" id="create-vm-name" />
200
                    </div>
201
                    
202
                    <div class="personalize-conts clearfix">
203
                        <div class="list-cont personalize-cont ssh">
204
                            <h4>{% trans "Public SSH keys" %} <span><a
205
                                        class="create-ssh-key" href="#">manage keys</a></span></h4>
206
                            <p class="desc">
207
                            {% blocktrans %}
208
                            Your account contains the following SSH public keys. 
209
                            Select one or more to activate in your new machine. 
210
                            You will then be able to ssh with the corresponding 
211
                            private key without a password."
212
                            {% endblocktrans %}
213
                            </p>
214
                            <p class="desc empty hidden">
215
                            No ssh keys in your account. <a href="#"
216
                                class="create-ssh-key">Create/import a new key now</a>.
217
                            </p>
218
                            <p class="desc warning disabled hidden">
219
                                The image you selected does not support ssh key
220
                                assignments.
221
                            </p>
222
                            <ul class="confirm-params">
223
                            </ul>
224
                        </div>
225
                        <div class="list-cont personalize-cont meta">
226
                            <h4>{% trans "Suggested tags" %}</h4>
227
                            <ul class="confirm-params">
228
                                <li class="predefined-meta role">
229
                                    <p class="desc">
230
                                        You may change machine tags
231
                                        later from the machines view.
232
                                    </p>
233
                                    <span class="key">{% trans "Role" %}</span>
234
                                    <div class="values clearfix">
235
                                    </div>
236
                                </li>
237
                                <!--<li class="predefined-meta clearfix">-->
238
                                    <!--<span class="key">{% trans "Public key" %}</span>-->
239
                                    <!--<input type="file"/>-->
240
                                    <!--<textarea height="20"></textarea>-->
241
                                <!--</li>-->
242
                            </ul>
243
                        </div>
244
                    </div>
245
                </div>
246
            </div>
247
    </div>
248
        <div class="step-4 vm-confirm create-step-cont clearfix">
249
            <div class="clearfix step-header">
250
            </div>
251
            <div class="step-cont clearfix">
252
                <div class="rename">
253
                    <div class="form-field">
254
                        <h4>Machine name</h4>
255
                        <h3 class="vm-name">
256
                        </h3>
257
                    </div>
258
                    
259
                    <div class="confirm-conts clearfix">
260
                        <div class="list-cont confirm-cont image">
261
                            <h4>{% trans "Image" %}</h4>
262
                            <ul class="confirm-params">
263
                                <li class="param image-name clearfix">
264
                                    <h4 class="value"></h4>
265
                                </li>
266
                                <li class="param image-description clearfix">
267
                                    <span class="title">{% trans "Description" %}</span>
268
                                    <span class="value"></span>
269
                                </li>
270
                                <li class="param image-os clearfix">
271
                                    <span class="title">{% trans "OS" %}</span>
272
                                    <span class="value"></span>
273
                                </li>
274
                                <li class="param image-size clearfix">
275
                                    <span class="title">{% trans "Size" %}</span>
276
                                    <span class="value"></span>
277
                                </li>
278
                                <li class="param image-gui clearfix">
279
                                    <span class="title">{% trans "GUI" %}</span>
280
                                    <span class="value"></span>
281
                                </li>
282
                                <li class="param image-kernel clearfix">
283
                                    <span class="title">{% trans "Kernel" %}</span>
284
                                    <span class="value"></span>
285
                                </li>
286
                            </ul>
287
                        </div>
288
                        <div class="list-cont confirm-cont flavor">
289
                            <h4>{% trans "Flavor" %}</h4>
290
                            <ul class="confirm-params">
291
                                <li class="param flavor-cpu clearfix">
292
                                    <span class="title">{% trans "CPUs" %}</span>
293
                                    <span class="value"></span>
294
                                </li>
295
                                <li class="param flavor-ram clearfix">
296
                                    <span class="title">{% trans "Memory" %}</span>
297
                                    <span class="value"></span>
298
                                </li>
299
                                <li class="param flavor-disk clearfix">
300
                                    <span class="title">{% trans "Disk" %}</span>
301
                                    <span class="value"></span>
302
                                </li>
303
                                <li class="param flavor-disktype clearfix">
304
                                    <span class="title">{% trans "Storage type" %}</span>
305
                                    <span class="value"></span>
306
                                </li>
307
                            </ul>
308
                        </div>
309
                        <div class="list-cont confirm-cont meta">
310
                            <h4>{% trans "Machine Tags" %}</h4>
311
                            <ul class="confirm-params meta">
312
                            </ul>
313
                            <h4>{% trans "SSH Keys" %}</h4>
314
                            <ul class="confirm-params ssh">
315
                            </ul>
316
                        </div>
317
                    </div>
318
                </div>
319
            </div>
320
    </div>
321
</div>
322

    
323
<div class="image-warning clearfix">
324
  <p>
325
  {% blocktrans %}You have selected a user-provided Image, which is not
326
  officially endorsed by ~okeanos. Please make sure it is from a
327
  trustworthy source.{% endblocktrans %}
328
  </p>
329
  <span class="untrusted-image-confirm confirm">confirm</span>
330
</div>
331
<div class="create-controls clearfix">
332
    <div class="form-action cancel">{% trans "cancel" %}</div>
333
    <div class="form-action next">{% trans "next" %}</div>
334
    <div class="form-action prev">{% trans "previous" %}</div>
335
    <div class="form-action create submit">{% trans "create machine" %}</div>
336
</div>
337
</div>
338

    
339
<div id="creation-password-overlay" class="overlay-content overlay-info hidden">
340
    <div class="description">
341
        <p>{% blocktrans %}Your new machine is now buidling... (this might take a few minutes){% endblocktrans %}</p>
342
    </div>
343
    <div class="password-cont clearfix">
344
        <div class="password-label">{% blocktrans %}Write down your password now:{% endblocktrans %}</div>
345
        <div class="password" id="new-machine-password">password</div>
346
        <div class="clipboard new-vm-password-copy"></div>
347
    </div>
348
    <div class="description subinfo">
349
        <p>{% blocktrans %}You will need this later to connect to your machine.{% endblocktrans %}</p>
350
        <p class="important">{% blocktrans %}After closing this window you will <em>NOT</em> be able to retrieve it again
351
        {% endblocktrans %}</p>
352
    </div>
353
    <div class="form-action show-machine">{% trans "view machine" %}</div>
354
</div>
355