dashboard: fix js

a6c7dcf3 · Bach Dániel · 14af9660 · a6c7dcf3 · a6c7dcf3 · a6c7dcf3
Commit a6c7dcf3 authored Nov 27, 2014 by Bach Dániel
14 changed files
--- a/circle/dashboard/static/dashboard/dashboard.js
+++ b/circle/dashboard/static/dashboard/dashboard.js
@@ -3,62 +3,31 @@ $(function () {
    var template = $(this).data("template");
    $.ajax({
      type: 'GET',
-      url: '/dashboard/vm/create/' + (typeof template === "undefined" ? '' : '?template=' + template),
+      url: $(this).prop('href') + (typeof template === "undefined" ? '' : '?template=' + template),
      success: function(data) {
        $('body').append(data);
        vmCreateLoaded();
        addSliderMiscs();
-        $('#create-modal').modal('show');
-        $('#create-modal').on('hidden.bs.modal', function() {
-          $('#create-modal').remove();
+        var modal = $('#confirmation-modal');
+        modal.modal('show');
+        modal.on('hidden.bs.modal', function() {
+          modal.remove();
        });
      }
    });
    return false;
  });

-  $('.node-create').click(function(e) {
+  $('.group-create, .node-create, .tx-tpl-ownership, .group-delete, .node-delete, .disk-remove').click(function(e) {
    $.ajax({
      type: 'GET',
-      url: '/dashboard/node/create/',
+      url: $(this).prop('href'),
      success: function(data) {
        $('body').append(data);
-        nodeCreateLoaded();
-        addSliderMiscs();
-        $('#create-modal').modal('show');
-        $('#create-modal').on('hidden.bs.modal', function() {
-          $('#create-modal').remove();
-        });
-      }
-    });
-    return false;
-  });
-
-  $('.group-create').click(function(e) {
-    $.ajax({
-      type: 'GET',
-      url: '/dashboard/group/create/',
-      success: function(data) {
-        $('body').append(data);
-        addSliderMiscs();
-        $('#create-modal').modal('show');
-        $('#create-modal').on('hidden.bs.modal', function() {
-          $('#create-modal').remove();
-        });
-      }
-    });
-    return false;
-  });
-
-  $('.tx-tpl-ownership').click(function(e) {
-    $.ajax({
-      type: 'GET',
-      url: $('.tx-tpl-ownership').attr('href'),
-      success: function(data) {
-        $('body').append(data);
-        $('#confirmation-modal').modal('show');
-        $('#confirmation-modal').on('hidden.bs.modal', function() {
-          $('#confirmation-modal').remove();
+        var modal = $('#confirmation-modal');
+        modal.modal('show');
+        modal.on('hidden.bs.modal', function() {
+          modal.remove();
        });
      }
    });
@@ -68,12 +37,13 @@ $(function () {
  $('.template-choose').click(function(e) {
    $.ajax({
      type: 'GET',
-      url: '/dashboard/template/choose/',
+      url: $(this).prop('href'),
      success: function(data) {
        $('body').append(data);
-        $('#create-modal').modal('show');
-        $('#create-modal').on('hidden.bs.modal', function() {
-          $('#create-modal').remove();
+        var modal = $('#confirmation-modal');
+        modal.modal('show');
+        modal.on('hidden.bs.modal', function() {
+          modal.remove();
        });
        // check if user selected anything
        $("#template-choose-next-button").click(function() {
@@ -99,6 +69,7 @@ $(function () {
    e.stopImmediatePropagation();
    return false;
  });
+
  $('[href=#index-list-view]').click(function (e) {
    var box = $(this).data('index-box');
    $('#' + box + '-graph-view').hide();
@@ -108,9 +79,10 @@ $(function () {
    e.stopImmediatePropagation();
    return false;
  });
-  $('body [title]:not(.title-favourite)').tooltip();
+
  $('body .title-favourite').tooltip({'placement': 'right'});
  $('body :input[title]').tooltip({trigger: 'focus', placement: 'auto right'});
+  $('body [title]').tooltip();
  $(".knob").knob();

  $('[data-toggle="pill"]').click(function() {
@@ -165,74 +137,6 @@ $(function () {

  addSliderMiscs();

-  /* for VM removes buttons */
-  $('.vm-delete').click(function() {
-    var vm_pk = $(this).data('vm-pk');
-    var dir = window.location.pathname.indexOf('list') == -1;
-    addModalConfirmation(deleteObject,
-      { 'url': '/dashboard/vm/delete/' + vm_pk + '/',
-        'data': [],
-        'pk': vm_pk,
-        'type': "vm",
-        'redirect': dir});
-    return false;
-  });
-
-  /* for disk remove buttons */
-  $('.disk-remove').click(function() {
-    var disk_pk = $(this).data('disk-pk');
-    addModalConfirmation(deleteObject,
-      { 'url': '/dashboard/disk/' + disk_pk + '/remove/',
-        'data': [],
-        'pk': disk_pk,
-        'type': "disk",
-      });
-    return false;
-  });
-
-  /* for Node removes buttons */
-  $('.node-delete').click(function() {
-    var node_pk = $(this).data('node-pk');
-    var dir = window.location.pathname.indexOf('list') == -1;
-    addModalConfirmation(deleteObject,
-      { 'url': '/dashboard/node/delete/' + node_pk + '/',
-        'data': [],
-        'pk': node_pk,
-        'type': "node",
-        'redirect': dir});
-
-    return false;
-  });
-
-  /* for Node flush buttons */
-  $('.node-flush').click(function() {
-    var node_pk = $(this).data('node-pk');
-    var postto = $(this).attr('href');
-    var dir = window.location.pathname.indexOf('list') == -1;
-    addModalConfirmation(function(){},
-      { 'url': postto,
-        'data': [],
-        'pk': node_pk,
-        'type': "node",
-        'redirect': dir});
-
-    return false;
-  });
-
-  /* for Group removes buttons */
-  $('.group-delete').click(function() {
-    var group_pk = $(this).data('group-pk');
-    var dir = window.location.pathname.indexOf('list') == -1;
-    addModalConfirmation(deleteObject,
-      { 'url': '/dashboard/group/delete/' + group_pk + '/',
-        'data': [],
-        'type': "group",
-        'pk': group_pk,
-        'redirect': dir});
-
-    return false;
-  });
-
 /* search for vms */
  var my_vms = [];
  $("#dashboard-vm-search-input").keyup(function(e) {
@@ -556,62 +460,6 @@ function setDefaultSliderValues() {
 }


-/* deletes the VM with the pk
- * if dir is true, then redirect to the dashboard landing page
- * else it adds a success message */
-function deleteObject(data) {
-  $.ajax({
-    type: 'POST',
-    data: {'redirect': data.redirect},
-    url: data.url,
-    headers: {"X-CSRFToken": getCookie('csrftoken')},
-    success: function(re, textStatus, xhr) {
-      if(!data.redirect) {
-        selected = [];
-        addMessage(re.message, 'success');
-        if(data.type === "disk") {
-          // no need to remove them from DOM
-          $('a[data-disk-pk="' + data.pk + '"]').parent("li").fadeOut();
-          $('a[data-disk-pk="' + data.pk + '"]').parent("h4").fadeOut();
-        }
-        else {
-          $('a[data-'+data.type+'-pk="' + data.pk + '"]').closest('tr').fadeOut(function() {
-            $(this).remove();
-          });
-        }
-      } else {
-        window.location.replace('/dashboard');
-      }
-    },
-    error: function(xhr, textStatus, error) {
-      addMessage('Uh oh :(', 'danger');
-    }
-  });
-}
-
-function massDeleteVm(data) {
-  f = function() {
-    selected = [];
-    // reset group buttons
-    $('.vm-list-group-control a').attr('disabled', true);
-    $(this).remove();
-  };
-  $.ajax({
-      traditional: true,
-      url: data.url,
-      headers: {"X-CSRFToken": getCookie('csrftoken')},
-      type: 'POST',
-      data: {'vms': data.data.v},
-      success: function(re, textStatus, xhr) {
-        for(var i=0; i< data.data.v.length; i++)
-          $('.vm-list-table tbody tr[data-vm-pk="' + data.data.v[i] + '"]').fadeOut(500, f);
-        addMessage(re.message, 'success');
-      },
-      error: function(xhr, textStatus, error) {
-        // TODO this
-      }
-    });
-}


 function addMessage(text, type) {
@@ -699,6 +547,7 @@ function csrfSafeMethod(method) {
  // these HTTP methods do not require CSRF protection
  return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
 }
+
 $.ajaxSetup({
  beforeSend: function(xhr, settings) {
    if (!csrfSafeMethod(settings.type) && !this.crossDomain) {

--- a/circle/dashboard/static/dashboard/group-list.js
+++ b/circle/dashboard/static/dashboard/group-list.js
 $(function() {
  /* rename */
  $("#group-list-rename-button, .group-details-rename-button").click(function() {
-    $("#group-list-column-name", $(this).closest("tr")).hide();
+    $(".group-list-column-name", $(this).closest("tr")).hide();
    $("#group-list-rename", $(this).closest("tr")).css('display', 'inline');
    $("#group-list-rename").find("input").select();
  });
@@ -10,7 +10,7 @@ $(function() {
  $('.group-list-rename-submit').click(function() {
    var row = $(this).closest("tr");
    var name = $('#group-list-rename-name', row).val();
-    var url = '/dashboard/group/' + row.children("td:first-child").text().replace(" ", "") + '/';
+    var url = row.find(".group-list-column-name a").prop("href");
    $.ajax({
      method: 'POST',
      url: url,
@@ -18,7 +18,7 @@ $(function() {
      headers: {"X-CSRFToken": getCookie('csrftoken')},
      success: function(data, textStatus, xhr) {

-        $("#group-list-column-name", row).html(
+        $(".group-list-column-name", row).html(
          $("<a/>", {
            'class': "real-link",
            href: "/dashboard/group/" + data.group_pk + "/",

--- a/circle/dashboard/static/dashboard/vm-create.js
+++ b/circle/dashboard/static/dashboard/vm-create.js
@@ -20,15 +20,15 @@ function vmCreateLoaded() {
    var template = $(this).data("template-pk");

    $.get("/dashboard/vm/create/?template=" + template, function(data) {
-        var r = $('#create-modal'); r.next('div').remove(); r.remove();
+        var r = $('#confirmation-modal'); r.next('div').remove(); r.remove();
        $('body').append(data);
        vmCreateLoaded();
        addSliderMiscs();
-        $('#create-modal').modal('show');
-        $('#create-modal').on('hidden.bs.modal', function() {
-            $('#create-modal').remove();
+        $('#confirmation-modal').modal('show');
+        $('#confirmation-modal').on('hidden.bs.modal', function() {
+            $('#confirmation-modal').remove();
        });
-        $("#create-modal").on("shown.bs.modal", function() {
+        $("#confirmation-modal").on("shown.bs.modal", function() {
          setDefaultSliderValues();
        });
    });
@@ -48,18 +48,18 @@ function vmCreateLoaded() {
          window.location.replace(data.redirect + '#activity');
        }
        else {
-            var r = $('#create-modal'); r.next('div').remove(); r.remove();
+            var r = $('#confirmation-modal'); r.next('div').remove(); r.remove();
            $('body').append(data);
            vmCreateLoaded();
            addSliderMiscs();
-            $('#create-modal').modal('show');
-            $('#create-modal').on('hidden.bs.modal', function() {
-                $('#create-modal').remove();
+            $('#confirmation-modal').modal('show');
+            $('#confirmation-modal').on('hidden.bs.modal', function() {
+                $('#confirmation-modal').remove();
            });
        }
      },
      error: function(xhr, textStatus, error) {
-        var r = $('#create-modal'); r.next('div').remove(); r.remove();
+        var r = $('#confirmation-modal'); r.next('div').remove(); r.remove();

        if (xhr.status == 500) {
          addMessage("500 Internal Server Error", "danger");
@@ -222,7 +222,7 @@ function vmCustomizeLoaded() {

    $(this).find("i").prop("class", "fa fa-spinner fa-spin");

-    if($("#create-modal")) return true;
+    if($("#confirmation-modal")) return true;

    $.ajax({
      url: '/dashboard/vm/create/',
@@ -238,18 +238,18 @@ function vmCustomizeLoaded() {
          window.location.href = data.redirect + '#activity';
        }
        else {
-            var r = $('#create-modal'); r.next('div').remove(); r.remove();
+            var r = $('#confirmation-modal'); r.next('div').remove(); r.remove();
            $('body').append(data);
            vmCreateLoaded();
            addSliderMiscs();
-            $('#create-modal').modal('show');
-            $('#create-modal').on('hidden.bs.modal', function() {
-                $('#create-modal').remove();
+            $('#confirmation-modal').modal('show');
+            $('#confirmation-modal').on('hidden.bs.modal', function() {
+                $('#confirmation-modal').remove();
            });
        }
      },
      error: function(xhr, textStatus, error) {
-        var r = $('#create-modal'); r.next('div').remove(); r.remove();
+        var r = $('#confirmation-modal'); r.next('div').remove(); r.remove();

        if (xhr.status == 500) {
          addMessage("500 Internal Server Error", "danger");

--- a/circle/dashboard/static/dashboard/vm-details.js
+++ b/circle/dashboard/static/dashboard/vm-details.js
@@ -43,7 +43,7 @@ $(function() {
    var vm = $(this).data("vm");
    $.ajax({
      type: 'POST',
-      url: "/dashboard/vm/" + vm + "/op/resources_change/",
+      url: $(this).parent("form").prop('action'),
      data: $('#vm-details-resources-form').serialize(),
      success: function(data, textStatus, xhr) {
        if(data.success) {
@@ -89,17 +89,6 @@ $(function() {
    return false;
  });

-  /* remove port */
-  $('.vm-details-remove-port').click(function() {
-    addModalConfirmation(removePort,
-      {
-        'url': $(this).prop("href"),
-        'data': [],
-        'rule': $(this).data("rule")
-      });
-    return false;
-  });
-
  /* for js fallback */
  $("#vm-details-pw-show").parent("div").children("input").prop("type", "password");


--- a/circle/dashboard/templates/dashboard/confirm/ajax-delete.html
+++ b/circle/dashboard/templates/dashboard/confirm/ajax-delete.html
@@ -3,19 +3,25 @@
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
-        {% if text %}
-          {{ text|safe }}
+        {% if member %}
+          {% blocktrans with group=object member=member %}
+          Do you really want to remove <strong>{{ member }}</strong> from {{ group }}?
+          {% endblocktrans %}
        {% else %}
-          {%blocktrans with object=object%}
+          {% blocktrans with object=object %}
            Are you sure you want to delete <strong>{{ object }}</strong>?
-          {%endblocktrans%}
+          {% endblocktrans %}
        {% endif %}
        <br />
        <div class="pull-right" style="margin-top: 15px;">
-          <button type="button" class="btn btn-default" data-dismiss="modal">{% trans "Cancel" %}</button>
-          <button id="confirmation-modal-button" type="button" class="btn btn-danger"
+          <form action="{{ request.path }}" method="POST">
+            {% csrf_token %}
+            <a class="btn btn-default">{% trans "Cancel" %}</a>
+            <input type="hidden" name="next" value="{{ request.GET.next }}"/>
+            <button class="btn btn-danger"
              {% if disable_submit %}disabled{% endif %}
              >{% trans "Delete" %}</button>
+          </form>
        </div>
        <div class="clearfix"></div>
      </div>

--- a/circle/dashboard/templates/dashboard/confirm/ajax-remove.html
+++ b/circle/dashboard/templates/dashboard/confirm/ajax-remove.html
-{% load i18n %}
-<div class="modal fade" id="confirmation-modal" tabindex="-1" role="dialog">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-body">
-        {% if text %}
-          {{ text }}
-        {% else %}
-          {%blocktrans with object=object%}
-            Are you sure you want to remove <strong>{{ member }}</strong> from <strong>{{ object }}</strong>?
-          {%endblocktrans%}
-        {% endif %}
-        <br />
-        <div class="pull-right" style="margin-top: 15px;">
-          <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
-          <button id="confirmation-modal-button" type="button" class="btn btn-warning">Remove</button>
-        </div>
-        <div class="clearfix"></div>
-      </div>
-    </div><!-- /.modal-content -->
-  </div><!-- /.modal-dialog -->
-</div>
--- a/circle/dashboard/templates/dashboard/confirm/base-delete.html
+++ b/circle/dashboard/templates/dashboard/confirm/base-delete.html
@@ -17,12 +17,18 @@
          {% if text %}
            {{ text|safe }}
          {% else %}
-            {%blocktrans with object=object%}
+            {% if member %}
+              {% blocktrans with group=object member=member %}
+              Do you really want to remove <strong>{{ member }}</strong> from {{ group }}?
+              {% endblocktrans %}
+            {% else %}
+              {% blocktrans with object=object %}
                Are you sure you want to delete <strong>{{ object }}</strong>?
-            {%endblocktrans%}
+              {% endblocktrans %}
+            {% endif %}
          {% endif %}
        <div class="pull-right">
-          <form action="" method="POST">
+          <form action="{{ request.path }}" method="POST">
            {% csrf_token %}
            <a class="btn btn-default">{% trans "Cancel" %}</a>
            <input type="hidden" name="next" value="{{ request.GET.next }}"/>

--- a/circle/dashboard/templates/dashboard/confirm/base-remove.html
+++ b/circle/dashboard/templates/dashboard/confirm/base-remove.html
-{% extends "base.html" %}
-{% load i18n %}
-
-{% block title-site %}Dashboard | CIRCLE{% endblock %}
-
-{% block content %}
-{% blocktrans with group=object member=member %}
-Do you really want to remove {{member}} from {{group}}?
-{% endblocktrans %}
-
-<form action="" method="POST">{% csrf_token %}
-    <input type="submit" value="{% trans "Remove" %}" />
-</form>
-{% endblock %}
--- a/circle/dashboard/templates/dashboard/group-list/column-name.html
+++ b/circle/dashboard/templates/dashboard/group-list/column-name.html
@@ -7,6 +7,6 @@
    <button type="submit" class="group-list-rename-submit btn btn-sm">{% trans "Rename" %}</button>
  </form>
 </div>
-<div id="group-list-column-name">
+<div class="group-list-column-name">
  <a class="real-link" href="{% url "dashboard.views.group-detail" pk=record.pk %}">{{ record.name }}</a>
 </div>
--- a/circle/dashboard/templates/dashboard/vm-detail/network.html
+++ b/circle/dashboard/templates/dashboard/vm-detail/network.html
@@ -79,7 +79,13 @@
                        {{ l.private }}/{{ l.proto }}
                      </td>
                      <td>
-                        <a href="{{ op.remove_port.get_url }}?rule={{ l.ipv4.pk }}" class="btn btn-link btn-xs vm-details-remove-port" data-rule="{{ l.ipv4.pk }}" title="{% trans "Remove" %}"><i class="fa fa-times"><span class="sr-only">{% trans "Remove" %}</span></i></a>
+                        <span class="operation-wrapper">
+                          <a href="{{ op.remove_port.get_url }}?rule={{ l.ipv4.pk }}"
+                             class="btn btn-link btn-xs operation"
+                             title="{% trans "Remove" %}">
+                            <i class="fa fa-times"><span class="sr-only">{% trans "Remove" %}</span></i>
+                          </a>
+                        </span>
                      </td>
                    </tr>
                  {% endif %}

--- a/circle/dashboard/views/group.py
+++ b/circle/dashboard/views/group.py
@@ -360,7 +360,7 @@ class GroupCreate(GroupCodeMixin, LoginRequiredMixin, TemplateView):

    def get_template_names(self):
        if self.request.is_ajax():
-            return ['dashboard/modal-wrapper.html']
+            return ['dashboard/_modal.html']
        else:
            return ['dashboard/nojs-wrapper.html']


--- a/circle/dashboard/views/node.py
+++ b/circle/dashboard/views/node.py
@@ -191,7 +191,7 @@ class NodeCreate(LoginRequiredMixin, SuperuserRequiredMixin, TemplateView):

    def get_template_names(self):
        if self.request.is_ajax():
-            return ['dashboard/modal-wrapper.html']
+            return ['dashboard/_modal.html']
        else:
            return ['dashboard/nojs-wrapper.html']


--- a/circle/dashboard/views/template.py
+++ b/circle/dashboard/views/template.py
@@ -56,7 +56,7 @@ class TemplateChoose(LoginRequiredMixin, TemplateView):

    def get_template_names(self):
        if self.request.is_ajax():
-            return ['dashboard/modal-wrapper.html']
+            return ['dashboard/_modal.html']
        else:
            return ['dashboard/nojs-wrapper.html']


--- a/circle/dashboard/views/vm.py
+++ b/circle/dashboard/views/vm.py
@@ -979,7 +979,7 @@ class VmCreate(LoginRequiredMixin, TemplateView):

    def get_template_names(self):
        if self.request.is_ajax():
-            return ['dashboard/modal-wrapper.html']
+            return ['dashboard/_modal.html']
        else:
            return ['dashboard/nojs-wrapper.html']