Revision c376783b ui/templates/machines.html
| b/ui/templates/machines.html | ||
|---|---|---|
| 12 | 12 |
|
| 13 | 13 |
<div id="machinesview" class="standard"> |
| 14 | 14 |
<div id="spinner"></div> |
| 15 |
<div class="instance" id="instance-template" style="display:none">
|
|
| 15 |
<div class="machine" id="machine-template" style="display:none">
|
|
| 16 | 16 |
<div class="state"> |
| 17 | 17 |
<div class="status">{% trans "Running" %}</div>
|
| 18 | 18 |
<div class="indicator"></div> |
| ... | ... | |
| 33 | 33 |
<div class="actions"> |
| 34 | 34 |
<a href="#" class="action">{% trans "Reboot" %}</a>
|
| 35 | 35 |
<a href="#" class="action">{% trans "Shutdown" %}</a>
|
| 36 |
<a href="#" class="more">{% trans "more" %} …</a>
|
|
| 36 |
<a href="#" class="more">{% trans "more …" %}</a>
|
|
| 37 | 37 |
</div> |
| 38 | 38 |
<div class="seperator"></div> |
| 39 | 39 |
</div> |
| ... | ... | |
| 52 | 52 |
<!-- status bar --> |
| 53 | 53 |
<ul id="status"> |
| 54 | 54 |
<li class="active"><strong>1.</strong> {% trans "Image" %}</li>
|
| 55 |
<li><strong>2.</strong> {% trans "Instance" %}</li>
|
|
| 55 |
<li><strong>2.</strong> {% trans "Machine" %}</li>
|
|
| 56 | 56 |
<li><strong>3.</strong> {% trans "Review" %}</li>
|
| 57 | 57 |
</ul> |
| 58 | 58 |
<!-- scrollable items --> |
| ... | ... | |
| 93 | 93 |
<h2>{% trans "Select CPU, RAM and storage" %}</h2>
|
| 94 | 94 |
<ul> |
| 95 | 95 |
<li> |
| 96 |
<div class="instance-type">
|
|
| 96 |
<div class="machine-type">
|
|
| 97 | 97 |
<label for="small"> |
| 98 |
<input type="radio" id="small" name="instance-type" value="small" checked="true" />
|
|
| 98 |
<input type="radio" id="small" name="machine-type" value="small" checked="true" />
|
|
| 99 | 99 |
<strong>{% trans "small" %}</strong>
|
| 100 | 100 |
</label> |
| 101 | 101 |
</div> |
| 102 |
<div class="instance-type">
|
|
| 102 |
<div class="machine-type">
|
|
| 103 | 103 |
<label for="medium"> |
| 104 |
<input type="radio" id="medium" name="instance-type" value="medium" />
|
|
| 104 |
<input type="radio" id="medium" name="machine-type" value="medium" />
|
|
| 105 | 105 |
<strong>{% trans "medium" %}</strong>
|
| 106 | 106 |
</label> |
| 107 | 107 |
</div> |
| 108 |
<div class="instance-type">
|
|
| 108 |
<div class="machine-type">
|
|
| 109 | 109 |
<label for="large"> |
| 110 |
<input type="radio" id="large" name="instance-type" value="large" />
|
|
| 110 |
<input type="radio" id="large" name="machine-type" value="large" />
|
|
| 111 | 111 |
<strong>{% trans "large" %}</strong>
|
| 112 | 112 |
</label> |
| 113 | 113 |
</div> |
| 114 |
<div class="instance-type">
|
|
| 114 |
<div class="machine-type">
|
|
| 115 | 115 |
<label for="custom"> |
| 116 |
<input type="radio" name="instance-type" id="custom" value="large" />
|
|
| 116 |
<input type="radio" name="machine-type" id="custom" value="large" />
|
|
| 117 | 117 |
<strong>{% trans "custom" %}</strong>
|
| 118 | 118 |
</label> |
| 119 | 119 |
</div> |
| ... | ... | |
| 144 | 144 |
<ul> |
| 145 | 145 |
<li class="required"> |
| 146 | 146 |
<label> |
| 147 |
<strong>Instance name</strong>
|
|
| 148 |
<input type="text" class="text" name="instance_name" value="My Ubuntu 10.04 x86_64 server"/>
|
|
| 147 |
<strong>Machine name</strong>
|
|
| 148 |
<input type="text" class="text" name="machine_name" value="My Ubuntu 10.04 x86_64 server"/>
|
|
| 149 | 149 |
</label> |
| 150 | 150 |
</li> |
| 151 | 151 |
<li> |
| ... | ... | |
| 213 | 213 |
success: function(data) {
|
| 214 | 214 |
$.each(data.servers, function(i,server){
|
| 215 | 215 |
|
| 216 |
var instance = $("#instance-template").clone().attr("id",server.id).fadeIn("slow");
|
|
| 217 |
instance.find("a.name span.name").text(server.name);
|
|
| 218 |
instance.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'.png');
|
|
| 219 |
instance.find("img.list-logo").attr("src","static/os_logos/"+image_tags[server.imageId]+'.png');
|
|
| 220 |
instance.find("a.ip span.public").text(String(server.addresses.public));
|
|
| 216 |
var machine = $("#machine-template").clone().attr("id",server.id).fadeIn("slow");
|
|
| 217 |
machine.find("a.name span.name").text(server.name);
|
|
| 218 |
machine.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'.png');
|
|
| 219 |
machine.find("img.list-logo").attr("src","static/os_logos/"+image_tags[server.imageId]+'.png');
|
|
| 220 |
machine.find("a.ip span.public").text(String(server.addresses.public));
|
|
| 221 | 221 |
|
| 222 | 222 |
if (server.status == 'BUILD'){
|
| 223 |
instance.find(".status").text('Building');
|
|
| 224 |
instance.appendTo(".running");
|
|
| 223 |
machine.find(".status").text('Building');
|
|
| 224 |
machine.appendTo(".running");
|
|
| 225 | 225 |
} else if (server.status == 'ACTIVE') {
|
| 226 |
instance.find(".status").text('Running');
|
|
| 227 |
instance.appendTo(".running");
|
|
| 226 |
machine.find(".status").text('Running');
|
|
| 227 |
machine.appendTo(".running");
|
|
| 228 | 228 |
} else if (server.status == 'SUSPENDED') {
|
| 229 |
instance.find(".status").text('Terminated');
|
|
| 230 |
instance.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'-off.png');
|
|
| 231 |
instance.appendTo(".terminated");
|
|
| 229 |
machine.find(".status").text('Terminated');
|
|
| 230 |
machine.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'-off.png');
|
|
| 231 |
machine.appendTo(".terminated");
|
|
| 232 | 232 |
$("#mini.seperator").fadeIn("slow");
|
| 233 | 233 |
} else {
|
| 234 |
instance.find(".status").text('Unknown');
|
|
| 235 |
instance.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'-off.png');
|
|
| 236 |
instance.appendTo(".terminated");
|
|
| 234 |
machine.find(".status").text('Unknown');
|
|
| 235 |
machine.find("img.logo").attr("src","static/machines/"+image_tags[server.imageId]+'-off.png');
|
|
| 236 |
machine.appendTo(".terminated");
|
|
| 237 | 237 |
} |
| 238 | 238 |
}); |
| 239 | 239 |
$("#spinner").hide();
|
Also available in: Unified diff