Commit 015ac568 by Kálmán Viktor

dashboard: improve vm create

parent 726fec74
......@@ -4,12 +4,27 @@ $(function () {
type: 'GET',
url: '/dashboard/vm/create/',
success: function(data) {
// TODO this is ugly
var html = '<div class="modal fade" id="vm-create-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button><h4 class="modal-title">Modal title</h4></div><div class="modal-body"> ' +
// TODO this is still ugly
var html = '<div class="modal fade" id="vm-create-modal" tabindex="-1" role="dialog">' +
'<div class="modal-dialog">' +
'<div class="modal-content">' +
'<div class="modal-header">' +
'<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>' +
'<h4 class="modal-title">Create VM</h4>' +
'</div>' +
'<div class="modal-body"> ' +
data +
'</div><div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">Close</button><button type="button" class="btn btn-primary">Save changes</button></div></div><!-- /.modal-content --></div><!-- /.modal-dialog --></div><!-- /.modal -->';
'</div>' +
/*'<div class="modal-footer">' +
'<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>' +
'<button type="button" class="btn btn-primary">Save changes</button>' +
'</div>' + */
'</div><!-- /.modal-content -->' +
'</div><!-- /.modal-dialog -->' +
'</div><!-- /.modal -->';
$('.container').append(html);
vmCreateLoaded();
$('#vm-create-modal').modal('show');
$('#vm-create-modal').on('hidden.bs.modal', function() {
$('#vm-create-modal').remove();
......@@ -53,10 +68,22 @@ $(function () {
$("[data-mark]")
.each(function () {
var value=$(this).attr('data-mark').parseFloat();
});
if (window.location.hash)
$("a[href=" + window.location.hash +"]").tab('show');
vmCreateLoaded();
});
function vmCreateLoaded() {
$('.vm-create-advanced').hide();
$('.vm-create-advanced-btn').click(function() {
$('.vm-create-advanced').stop().slideToggle();
if ($('.vm-create-advanced-icon').hasClass('icon-caret-down')) {
$('.vm-create-advanced-icon').removeClass('icon-caret-down').addClass('icon-caret-up');
} else {
$('.vm-create-advanced-icon').removeClass('icon-caret-up').addClass('icon-caret-down');
}
});
}
{% extends "dashboard/base.html" %}
{% block content %}
<div class="body-content">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="no-margin">
{{ box_title }}
</h3>
</div>
<div class="panel-body">
{% include template %}
</div>
</div>
{% endblock %}
Create a VM
<style>
.row {
margin-bottom: 15px;
}
</style>
<div class="row">
<div class="col-sm-10">
<select class="select form-control">
<option>Menő gép</option>
<option>Menő gép</option>
<option>Menő gép</option>
<option>Menő gép</option>
<option>Menő gép</option>
</select>
</div>
</div>
<div class="row">
<div class="col-sm-5">
<a class="btn btn-info vm-create-advanced-btn">Advanced <i class="vm-create-advanced-icon icon-caret-down"></i></a>
</div>
<div class="col-sm-5 text-right">
<a class="btn btn-success "><i class="icon-play"></i> Start</a>
</div>
</div>
<div class="vm-create-advanced">
<div class="row">
<div class="col-sm-12">
<h2>Resources</h2>
</div>
{% include "dashboard/vm-detail-resources.html" %}
</div>
<div class="row">
<div class="col-sm-12">
<h2>Disks</h2>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<h2>Network</h2>
</div>
</div>
</div>
......@@ -65,6 +65,7 @@ class VmCreate(TemplateView):
context = self.get_context_data(**kwargs)
if not request.is_ajax():
context.update({
'template': 'dashboard/vm-create.html'
'template': 'dashboard/vm-create.html',
'box_title': 'Create a VM'
})
return self.render_to_response(context)
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment