diff --git a/circle/dashboard/static/dashboard/dashboard.js b/circle/dashboard/static/dashboard/dashboard.js index 4b2323e..53cd2b2 100644 --- a/circle/dashboard/static/dashboard/dashboard.js +++ b/circle/dashboard/static/dashboard/dashboard.js @@ -304,9 +304,6 @@ function deleteObject(data) { $('a[data-disk-pk="' + data.pk + '"]').parent("li").fadeOut(); $('a[data-disk-pk="' + data.pk + '"]').parent("h4").fadeOut(); } - else if(data.type === "interface") { - $('a[data-interface-pk="' + data.pk + '"]').closest("div").fadeOut(); - } else { $('a[data-'+data['type']+'-pk="' + data['pk'] + '"]').closest('tr').fadeOut(function() { $(this).remove(); diff --git a/circle/dashboard/static/dashboard/vm-details.js b/circle/dashboard/static/dashboard/vm-details.js index 748f5f3..add3a7f 100644 --- a/circle/dashboard/static/dashboard/vm-details.js +++ b/circle/dashboard/static/dashboard/vm-details.js @@ -123,8 +123,7 @@ $(function() { /* add network button */ $("#vm-details-network-add").click(function() { - $("#vm-details-network-add-for-form").html($("#vm-details-network-add-form").html()); - $('input[name="new_network_managed"]').tooltip(); + $("#vm-details-network-add-form").toggle(); return false; }); @@ -142,7 +141,7 @@ $(function() { /* for interface remove buttons */ $('.interface-remove').click(function() { var interface_pk = $(this).data('interface-pk'); - addModalConfirmation(deleteObject, + addModalConfirmation(removeInterface, { 'url': '/dashboard/interface/' + interface_pk + '/delete/', 'data': [], 'pk': interface_pk, @@ -151,6 +150,34 @@ $(function() { return false; }); + /* removing interface post */ + function removeInterface(data) { + $.ajax({ + type: 'POST', + url: data['url'], + headers: {"X-CSRFToken": getCookie('csrftoken')}, + success: function(re, textStatus, xhr) { + /* remove the html element */ + $('a[data-interface-pk="' + data.pk + '"]').closest("div").fadeOut(); + + /* add the removed element to the list */ + network_select = $('select[name="new_network_vlan"]'); + name_html = (re.removed_network.managed ? "": "") + " " + re.removed_network.vlan; + option_html = '<option value="' + re.removed_network.vlan_pk + '">' + name_html + '</option>'; + // if it's -1 then it's a dummy placeholder so we can use .html + if($("option", network_select)[0].value === "-1") { + network_select.html(option_html); + network_select.next("div").children("button").prop("disabled", false); + } else { + network_select.append(option_html); + } + }, + error: function(xhr, textStatus, error) { + addMessage('Uh oh :(', 'danger') + } + }); + } + /* rename */ $("#vm-details-h1-name, .vm-details-rename-button").click(function() { $("#vm-details-h1-name").hide(); @@ -198,7 +225,6 @@ $(function() { /* description update ajax */ $('.vm-details-description-submit').click(function() { var description = $(this).prev("textarea").val(); - console.log(description); $.ajax({ method: 'POST', url: location.href, diff --git a/circle/dashboard/templates/dashboard/vm-detail/network.html b/circle/dashboard/templates/dashboard/vm-detail/network.html index 7becbab..8c009b8 100644 --- a/circle/dashboard/templates/dashboard/vm-detail/network.html +++ b/circle/dashboard/templates/dashboard/vm-detail/network.html @@ -6,9 +6,41 @@ {% trans "Interfaces" %} </h2> -<div class="row" id="vm-details-network-add-for-form"> - +<div class="js-hidden row" id="vm-details-network-add-form"> + <div class="col-md-12"> + <div> + <hr /> + <h3> + {% trans "Add new network interface!" %} + </h3> + <form method="POST" action=""> + {% csrf_token %} + <div class="input-group" style="max-width: 330px;"> + <select name="new_network_vlan" class="form-control font-awesome-font"> + {% for v in vlans %} + <option value="{{ v.pk }}"> + {% if v.managed %} +  + {% else %} +  + {% endif %} + {{ v.name }} + </option> + {% empty %} + <option value="-1">No more networks!</option> + {% endfor %} + </select> + <div class="input-group-btn"> + <button {% if vlans|length == 0 %}disabled{% endif %} + type="submit" class="btn btn-success"><i class="icon-plus-sign"></i></button> + </div> + </div> + </form> + <hr /> + </div> + </div> </div> + {% for i in instance.interface_set.all %} <div> <h3 class="list-group-item-heading dashboard-vm-details-network-h3"> @@ -116,37 +148,3 @@ {% endif %} </div> {% endfor %} -<div class="js-hidden row" id="vm-details-network-add-form"> - <div class="col-md-12"> - <div> - <hr /> - <h3> - {% trans "Add new network interface!" %} - </h3> - <form method="POST" action=""> - {% csrf_token %} - <div class="input-group" style="max-width: 330px;"> - <select name="new_network_vlan" class="form-control font-awesome-font"> - {% for v in vlans %} - <option value="{{ v.pk }}"> - {% if v.managed %} -  - {% else %} -  - {% endif %} - {{ v.name }} - </option> - {% empty %} - <option value="-1">No more networks!</option> - {% endfor %} - </select> - <div class="input-group-btn"> - <button {% if vlans|length == 0 %}disabled{% endif %} - type="submit" class="btn btn-success"><i class="icon-plus-sign"></i></button> - </div> - </div> - </form> - <hr /> - </div> - </div> -</div> diff --git a/circle/dashboard/views.py b/circle/dashboard/views.py index b87bbee..27c0901 100644 --- a/circle/dashboard/views.py +++ b/circle/dashboard/views.py @@ -2277,7 +2277,13 @@ class InterfaceDeleteView(DeleteView): if request.is_ajax(): return HttpResponse( - json.dumps({'message': success_message}), + json.dumps( + {'message': success_message, + 'removed_network': { + 'vlan': self.object.vlan.name, + 'vlan_pk': self.object.vlan.pk, + 'managed': self.object.host is not None, + }}), content_type="application/json", ) else: