diff --git a/tuskar_boxes/overview/urls.py b/tuskar_boxes/overview/urls.py
index 86049c0..0e29743 100644
--- a/tuskar_boxes/overview/urls.py
+++ b/tuskar_boxes/overview/urls.py
@@ -24,6 +24,7 @@ urlpatterns = tuskar_urls.urlpatterns[1:]
urlpatterns.extend(urls.patterns(
'',
urls.url(r'^$', views.IndexView.as_view(), name='index'),
+ urls.url(r'^config$', views.IndexView.as_view(), name='config'),
))
if settings.DEBUG:
diff --git a/tuskar_boxes/overview/views.py b/tuskar_boxes/overview/views.py
index c396fdc..c529d62 100644
--- a/tuskar_boxes/overview/views.py
+++ b/tuskar_boxes/overview/views.py
@@ -174,3 +174,20 @@ class IndexView(views.IndexView):
out = super(IndexView, self).get_progress_update(request, data)
out['nodes'] = data.get('nodes', [])
return out
+
+ def get_context_data(self, **kwargs):
+ context = super(IndexView, self).get_context_data(**kwargs)
+ context['header_actions'] = [{
+ 'name': _('Edit Global Configuration'),
+ 'show_name': True,
+ 'url': reverse('horizon:infrastructure:overview:config'),
+ 'icon': 'fa-pencil',
+ 'ajax_modal': True,
+ }, {
+ 'name': _('Register Nodes'),
+ 'show_name': True,
+ 'url': reverse('horizon:infrastructure:nodes:register'),
+ 'icon': 'fa-plus',
+ 'ajax_modal': True,
+ }]
+ return context
diff --git a/tuskar_boxes/static/tuskar_boxes/js/tuskar.boxes.js b/tuskar_boxes/static/tuskar_boxes/js/tuskar.boxes.js
index 037fe6e..d0e7291 100644
--- a/tuskar_boxes/static/tuskar_boxes/js/tuskar.boxes.js
+++ b/tuskar_boxes/static/tuskar_boxes/js/tuskar.boxes.js
@@ -113,6 +113,18 @@ tuskar.boxes = (function () {
$count.trigger('change');
window.setTimeout(module.update_boxes, 0);
});
+
+ $('.deploy-role-remove').click(function () {
+ var $role = $(this).closest('.boxes-role');
+ var $count = $role.find('input.number-picker');
+ var $flavor = $role.find('input.boxes-flavor');
+ var $drop = $('.boxes-available-roles');
+ $role.appendTo($drop);
+ $flavor.val('');
+ $count.val(0);
+ $count.trigger('change');
+ window.setTimeout(module.update_boxes, 0);
+ });
};
horizon.addInitFunction(module.init);
diff --git a/tuskar_boxes/static/tuskar_boxes/scss/tuskar_boxes.scss b/tuskar_boxes/static/tuskar_boxes/scss/tuskar_boxes.scss
index ba9ebd2..1cc17ad 100644
--- a/tuskar_boxes/static/tuskar_boxes/scss/tuskar_boxes.scss
+++ b/tuskar_boxes/static/tuskar_boxes/scss/tuskar_boxes.scss
@@ -38,15 +38,12 @@
min-width: 120px;
display: inline-block;
padding: 4px 0 0 4px;
- .boxes-role {
+ .boxes-role, .boxes-role:hover {
display: inline-block;
text-align: center;
- width: 120px;
+ width: 180px;
margin: 0 4px 4px 0;
- border: 1px solid #999;
- background: #eee;
- color: #666;
- .deploy-role-icon, .deploy-role-count, .form-control {
+ .deploy-role-remove, .deploy-role-count, .form-controller{
display: none;
}
.deploy-role-label {
@@ -57,9 +54,14 @@
font-weight: normal;
}
}
+ .deploy-role-icon {
+ top: -8px;
+ right: -8px;
+ }
}
}
.boxes-role {
+ position: relative;
opacity: 0.75;
padding: 6px;
border: 1px solid;
@@ -69,6 +71,22 @@
color: #c4a000;
margin: 0 0 4px 0;
cursor: move;
+ .deploy-role-icon {
+ position: absolute;
+ top: 8px;
+ right: -8px;
+ display: none;
+ }
+ .deploy-role-remove {
+ position: absolute;
+ top: -4px;
+ right: -8px;
+ display: none;
+ }
+}
+.boxes-role:hover .deploy-role-icon,
+.boxes-role:hover .deploy-role-remove {
+ display: block;
}
.deploy-role-status .boxes-role {
cursor: default;
@@ -97,6 +115,7 @@
border-color: inherit;
}
.boxes-role .deploy-role-icon a,
+.boxes-role .deploy-role-remove a,
.boxes-role .number_picker,
.boxes-role .number_picker a {
color: inherit;
diff --git a/tuskar_boxes/templates/tuskar_boxes/overview/_role_info.html b/tuskar_boxes/templates/tuskar_boxes/overview/_role_info.html
index efe6aed..f5ab702 100644
--- a/tuskar_boxes/templates/tuskar_boxes/overview/_role_info.html
+++ b/tuskar_boxes/templates/tuskar_boxes/overview/_role_info.html
@@ -7,20 +7,25 @@
data-name="{{ role.name|slugify }}"
>
<div class="row">
- <div class="col-xs-3 deploy-role-count">
+ <div class="col-xs-5 deploy-role-count">
{{ role.field|add_bootstrap_class }}
{{ role.flavor_field|add_bootstrap_class }}
</div>
- <div class="col-xs-6 deploy-role-label">
+ <div class="col-xs-7 deploy-role-label">
<div class="deployment-roles-label">{{ role.name|title }}</div>
</div>
- <div class="col-xs-3 deploy-role-icon">
+ <div class="deploy-role-icon">
<a name="role-edit-{{role.name|slugify}}"
href="{% url 'horizon:infrastructure:roles:update' role_id=role.id %}"
- class="btn">
+ class="btn ajax-modal">
<b class="fa fa-lg fa-fw fa-pencil"></b>
</a>
</div>
+ <div class="deploy-role-remove">
+ <a name="role-remove-{{role.name|slugify}}" href="#" class="btn">
+ <b class="fa fa-lg fa-fw fa-times"></b>
+ </a>
+ </div>
</div>
</div>
{% endspaceless %}
diff --git a/tuskar_boxes/templates/tuskar_boxes/overview/index.html b/tuskar_boxes/templates/tuskar_boxes/overview/index.html
index 2cf0300..9d88a4a 100644
--- a/tuskar_boxes/templates/tuskar_boxes/overview/index.html
+++ b/tuskar_boxes/templates/tuskar_boxes/overview/index.html
@@ -21,7 +21,8 @@
{% block title %}{% trans 'My OpenStack Deployment' %}{% endblock %}
{% block page_header %}
- {% include 'horizon/common/_domain_page_header.html' with title=_('My OpenStack Deployment') %}
+ {% include 'horizon/common/_items_count_domain_page_header.html' with title=_('My OpenStack Deployment') %}
+
{% endblock page_header %}
{% block main %}