j3d1/webvirtcloud
1
0
Fork 0
mirror of https://github.com/retspen/webvirtcloud synced 2024-12-24 15:15:22 +00:00
Code Issues Projects Releases Wiki Activity

convert HDD selection of new instance creation to user request. Before that, instance creation gets all images of all pools. If there is a problem with some pools other than default. It causes problem and sometimes it takes too long to opeen create instance page. With that extension getting volumes is up to request. Firs you must select pool then select volume. For now the create page opens instantly.

Browse source
This commit is contained in:
catborise 2018-11-16 16:08:35 +03:00
parent 91f01d884b
commit 45720d3bcf
2 changed files with 95 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

120
create/templates/create_instance.html
View file

@ -16,6 +16,22 @@
{% include 'errors_block.html' %} {% include 'errors_block.html' %}
{% include 'pleasewaitdialog.html' %} {% include 'pleasewaitdialog.html' %}
{% if form.errors %}
{% for field in form %}
{% for error in field.errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endfor %}
{% for error in form.non_field_errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endif %}
<div class="row" id="max-width-page"> <div class="row" id="max-width-page">
<div class="col-lg-12"> <div class="col-lg-12">
<div role="tabpanel"> <div role="tabpanel">
@ -223,9 +239,9 @@
</tbody> </tbody>
</table> </table>
</div> </div>
{% endif %} {% endif %}
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div role="tabpanel" class="tab-pane tab-pane-bordered" id="addCustom"> <div role="tabpanel" class="tab-pane tab-pane-bordered" id="addCustom">
<div class="well"> <div class="well">
@ -239,7 +255,7 @@
<div class="form-group"> <div class="form-group">
<label class="col-sm-3 control-label">{% trans "VCPU" %}</label> <label class="col-sm-3 control-label">{% trans "VCPU" %}</label>
<div class="col-sm-6"> <div class="col-sm-6">
<input type="text" class="form-control" name="vcpu" value="1" maxlength="1" required pattern="[0-9]"> <input type="text" class="form-control" name="vcpu" value="1" maxlength="2" required pattern="[0-9]">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
@ -256,24 +272,36 @@
</div> </div>
<label class="col-sm-1 control-label">{% trans "MB" %}</label> <label class="col-sm-1 control-label">{% trans "MB" %}</label>
</div> </div>
<div id="disk_list_div" class="form-group" hidden>
<label id="added_disks" class="col-sm-3 control-label">{% trans "Added Disks" %}</label>
<div class="col-sm-6">
<ul id="img-list" class="form-row">
<!-- populated from javascript -->
</ul>
</div>
</div>
<div class="form-group"> <div class="form-group">
<label class="col-sm-3 control-label">{% trans "HDD" %}</label> <label class="col-sm-3 control-label">{% trans "HDD" %}</label>
<div class="col-sm-6"> <input id="images" name="images" type="hidden" value=""/>
<ul id="img-list"> <div class="col-sm-3">
<!-- populated from javascript --> <select id="storage-control" name="storage-control" class="form-control" onchange="get_cust_vols({{ compute_id }}, value);">
</ul> {% if storages %}
<input id="images" name="images" type="hidden" value=""/> <option value disabled selected>{% trans "Select pool..." %}</option>
<select id="image-control" name="image-control" class="form-control" multiple="multiple"> {% for storage in storages %}
{% if get_images %} <option value="{{ storage }}" >{{ storage }}</option>
{% for name in get_images %}
<option value="{{ name }}">{{ name }}</option>
{% endfor %} {% endfor %}
{% else %} {% else %}
<option value="">{% trans "None" %}</option> <option value="">{% trans "None" %}</option>
{% endif %} {% endif %}
</select> </select>
</div> </div>
<div class="col-sm-3">
<select id="image-control" name="image-control" multiple="multiple">
<!-- populated from javascript -->
</select>
</div>
</div> </div>
<div class="form-group meta-prealloc"> <div class="form-group meta-prealloc">
<label class="col-sm-3 control-label">{% trans "Metadata" %}</label> <label class="col-sm-3 control-label">{% trans "Metadata" %}</label>
<div class="col-sm-6"> <div class="col-sm-6">
@ -354,7 +382,7 @@
</div> </div>
</div> </div>
{% if storages %} {% if storages %}
<button type="submit" class="btn btn-primary" name="create" onclick="showPleaseWaitDialog()" value="1"> <button type="submit" class="btn btn-primary" name="create" formnovalidate onclick="showPleaseWaitDialog()" value="1">
{% trans "Create" %} {% trans "Create" %}
</button> </button>
{% else %} {% else %}
@ -379,7 +407,7 @@
<div class="form-group"> <div class="form-group">
<label class="col-sm-3 control-label">{% trans "VCPU" %}</label> <label class="col-sm-3 control-label">{% trans "VCPU" %}</label>
<div class="col-sm-6"> <div class="col-sm-6">
<input type="text" class="form-control" name="vcpu" value="1" maxlength="1" required pattern="[0-9]"> <input type="text" class="form-control" name="vcpu" value="1" maxlength="2" required pattern="[0-9]">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
@ -396,19 +424,27 @@
</div> </div>
<label class="col-sm-1 control-label">{% trans "MB" %}</label> <label class="col-sm-1 control-label">{% trans "MB" %}</label>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="col-sm-3 control-label">{% trans "HDD" %}</label> <label class="col-sm-3 control-label">{% trans "HDD" %}</label>
<div class="col-sm-6"> <input id="images" name="images" type="hidden" value=""/>
<select name="template" class="form-control"> <div class="col-sm-3">
{% if get_images %} <select id="temp-storage-control" name="temp-storage-control" class="form-control" onchange="get_template_vols({{ compute_id }}, value);">
{% for name in get_images %} {% if storages %}
<option value="{{ name }}">{{ name }}</option> <option value disabled selected>{% trans "Select pool" %}...</option>
{% for storage in storages %}
<option value="{{ storage }}" >{{ storage }}</option>
{% endfor %} {% endfor %}
{% else %} {% else %}
<option value="">{% trans "None" %}</option> <option value="">{% trans "None" %}</option>
{% endif %} {% endif %}
</select> </select>
</div> </div>
<div class="col-sm-3">
<select id="template" class="form-control" name="template" disabled>
<!-- populated from javascript -->
</select>
</div>
</div> </div>
<div class="form-group meta-prealloc"> <div class="form-group meta-prealloc">
<label class="col-sm-3 control-label">{% trans "Metadata" %}</label> <label class="col-sm-3 control-label">{% trans "Metadata" %}</label>
@ -487,7 +523,7 @@
</div> </div>
{% if storages %} {% if storages %}
<button type="submit" class="btn btn-primary" name="create" value="1" onclick="showPleaseWaitDialog()"> <button type="submit" class="btn btn-primary" name="create" value="1" formnovalidate onclick="showPleaseWaitDialog()">
{% trans "Create" %} {% trans "Create" %}
</button> </button>
{% else %} {% else %}
@ -539,12 +575,14 @@
} }
$(document).ready(function () { $(document).ready(function () {
$('#image-control').multiselect({
$('#image-control').multiselect({
disableIfEmpty: true,
enableCaseInsensitiveFiltering: true, enableCaseInsensitiveFiltering: true,
maxHeight: 400, maxHeight: 400,
inheritClass: true, inheritClass: true,
buttonText: function (options, select) { buttonText: function (options, select) {
return 'Add image'; return 'Add image...';
}, },
buttonTitle: function (options, select) { buttonTitle: function (options, select) {
return ''; return '';
@ -552,21 +590,27 @@
onChange: function (element, checked) { onChange: function (element, checked) {
var input_value = toggleValue($('#images').val(), element.val(), checked); var input_value = toggleValue($('#images').val(), element.val(), checked);
$('#images').val(input_value); $('#images').val(input_value);
var selected_list_html = ''; var selected_list_html = '';
var counter = 0; var counter = 0;
if (input_value != '') { if (input_value != '') {
$.each(input_value.split(','), function (index, value) { $('#disk_list_div').show();
$.each(input_value.split(','), function (index, value) {
var li = '<li>hdd' + counter + var li = '<li>hdd' + counter +
' -> ' + value + ' ' + ' -> ' + value + ' ' +
'<a class="btn-link" onclick="javascript:$(\'#image-control\').multiselect(\'deselect\', \'' + value + '\')">x</a></li>'; '<a class="btn-link" onclick="javascript:$(\'#image-control\').multiselect(\'deselect\', \'' + value + '\', true)">x</a></li>';
selected_list_html += li; selected_list_html += li;
counter++; counter++;
}); });
}else {
$('#disk_list_div').hide();
} }
$('#img-list').html(selected_list_html); $('#img-list').html(selected_list_html);
} }
}); });
$('#network-control').multiselect({ $('#network-control').multiselect({
inheritClass: true, inheritClass: true,
buttonText: function (options, select) { buttonText: function (options, select) {
@ -584,7 +628,7 @@
$.each(input_value.split(','), function (index, value) { $.each(input_value.split(','), function (index, value) {
var li = '<li>eth' + counter + var li = '<li>eth' + counter +
' -> ' + value + ' ' + ' -> ' + value + ' ' +
'<a class="btn-link" onclick="javascript:$(\'#network-control\').multiselect(\'deselect\', \'' + value + '\')">x</a></li>'; '<a class="btn-link" onclick="javascript:$(\'#network-control\').multiselect(\'deselect\', \'' + value + '\', true)">x</a></li>';
selected_list_html += li; selected_list_html += li;
counter++; counter++;
}); });
@ -593,7 +637,31 @@
} }
}); });
}); });
function get_cust_vols(compute_id, pool) {
get_vol_url = "/computes/" + compute_id + "/storage/" + pool + "/volumes";
$.getJSON(get_vol_url, function (data) {
$("#image-control").find('option').remove();
$.each(data['vols'], function(i, item) {
$("#image-control").append('<option value=' + item +'>' + item + '</option>');
});
$('#image-control').multiselect('rebuild');
});
}
function get_template_vols(compute_id, pool) {
get_vol_url = "/computes/" + compute_id + "/storage/" + pool + "/volumes";
$.getJSON(get_vol_url, function (data) {
$("#template").find('option').remove();
$.each(data['vols'], function(i, item) {
$("#template").append('<option value=' + item +'>' + item + '</option>');
});
});
$("#template").removeAttr("disabled");
}
</script> </script>
<script src="{% static "js/ace.js" %}"></script> <script src="{% static "js/ace.js" %}"></script>
<script> <script>
var editor = ace.edit("editor"); var editor = ace.edit("editor");

3
create/views.py
View file

@ -48,7 +48,7 @@ def create_instance(request, compute_id):
default_cache = INSTANCE_VOLUME_DEFAULT_CACHE default_cache = INSTANCE_VOLUME_DEFAULT_CACHE
listener_addr = QEMU_CONSOLE_LISTEN_ADDRESSES listener_addr = QEMU_CONSOLE_LISTEN_ADDRESSES
mac_auto = util.randomMAC() mac_auto = util.randomMAC()
get_images = sorted(conn.get_storages_images()) #get_images = sorted(conn.get_storages_images())
except libvirtError as lib_err: except libvirtError as lib_err:
error_messages.append(lib_err) error_messages.append(lib_err)
@ -157,5 +157,4 @@ def create_instance(request, compute_id):
conn.delete_volume(volumes.keys()[0]) conn.delete_volume(volumes.keys()[0])
error_messages.append(lib_err) error_messages.append(lib_err)
conn.close() conn.close()
return render(request, 'create_instance.html', locals()) return render(request, 'create_instance.html', locals())