diff --git a/horizon/static/framework/widgets/wizard/wizard.html b/horizon/static/framework/widgets/wizard/wizard.html index d084d7bb4..b24f38bfd 100644 --- a/horizon/static/framework/widgets/wizard/wizard.html +++ b/horizon/static/framework/widgets/wizard/wizard.html @@ -8,7 +8,7 @@
-
+
-
+
@@ -46,14 +46,14 @@
- - - - -
+ + + + +
diff --git a/horizon/static/horizon/js/horizon.tables.js b/horizon/static/horizon/js/horizon.tables.js index 76141800c..fbf557d26 100644 --- a/horizon/static/horizon/js/horizon.tables.js +++ b/horizon/static/horizon/js/horizon.tables.js @@ -226,59 +226,81 @@ horizon.datatables = { }; /* Generates a confirmation modal dialog for the given action. */ -horizon.datatables.confirm = function (action) { - var $action = $(action), - $modal_parent = $(action).closest('.modal'), - name_array = [], - closest_table_id, action_string, name_string, - help_text, - title, body, modal, form; - if($action.hasClass("disabled")) { +horizon.datatables.confirm = function(action) { + var $action = $(action); + + if ($action.hasClass("disabled")) { return; } - action_string = $action.text(); - help_text = $action.attr("help_text") || ""; - name_string = ""; + + var $modal_parent = $action.closest('.modal'); + var name_array = []; + var action_string = $action.text(); + var help_text = $action.attr("help_text") || ""; + var name_string = ""; + // Add the display name defined by table.get_object_display(datum) - closest_table_id = $(action).closest("table").attr("id"); + var $closest_table = $action.closest("table"); + // Check if data-display attribute is available - if ($("#"+closest_table_id+" tr[data-display]").length > 0) { - var actions_div = $(action).closest("div"); - if(actions_div.hasClass("table_actions") || actions_div.hasClass("table_actions_menu")) { + var $data_display = $closest_table.find('tr[data-display]'); + if ($data_display.length > 0) { + var $actions_div = $action.closest("div"); + if ($actions_div.hasClass("table_actions") || $actions_div.hasClass("table_actions_menu")) { // One or more checkboxes selected - $("#"+closest_table_id+" tr[data-display]").has(".table-row-multi-select:checked").each(function() { + $data_display.has(".table-row-multi-select:checked").each(function() { name_array.push(" \"" + $(this).attr("data-display") + "\""); }); - name_array.join(", "); - name_string = name_array.toString(); + name_string = name_array.join(", "); } else { // If no checkbox is selected - name_string = " \"" + $(action).closest("tr").attr("data-display") + "\""; + name_string = " \"" + $action.closest("tr").attr("data-display") + "\""; + name_array = [name_string]; } - name_string = interpolate(gettext("You have selected %s. "), [name_string]); } - title = interpolate(gettext("Confirm %s"), [action_string]); - body = name_string + gettext("Please confirm your selection. ") + help_text; - modal = horizon.modals.create(title, body, action_string); + + var title = interpolate(gettext("Confirm %s"), [action_string]); + + // compose the action string using a template that can be overridden + var template = horizon.templates.compiled_templates["#confirm_modal"], + params = { + selection: name_string, + selection_list: name_array, + help: help_text + }; + + var body; + try { + body = $(template.render(params)).html(); + } catch (e) { + body = name_string + gettext("Please confirm your selection. ") + help_text; + } + + var modal = horizon.modals.create(title, body, action_string); modal.modal(); - if($modal_parent.length) { + + if ($modal_parent.length) { var child_backdrop = modal.next('.modal-backdrop'); // re-arrange z-index for these stacking modal child_backdrop.css('z-index', $modal_parent.css('z-index')+10); modal.css('z-index', child_backdrop.css('z-index')+10); } + modal.find('.btn-primary').click(function () { - form = $action.closest('form'); + var $form = $action.closest('form'); var el = document.createElement("input"); - el.type='hidden'; + el.type = 'hidden'; el.name = $action.attr('name'); el.value = $action.attr('value'); - form.append(el); - form.submit(); + $form + .append(el) + .submit(); + modal.modal('hide'); horizon.modals.modal_spinner(gettext("Working")); return false; }); + return modal; }; diff --git a/horizon/static/horizon/js/horizon.templates.js b/horizon/static/horizon/js/horizon.templates.js index 17d62900c..244c618fe 100644 --- a/horizon/static/horizon/js/horizon.templates.js +++ b/horizon/static/horizon/js/horizon.templates.js @@ -1,7 +1,14 @@ /* global Hogan */ /* Namespace for core functionality related to client-side templating. */ horizon.templates = { - template_ids: ["#modal_template", "#empty_row_template", "#alert_message_template", "#spinner-modal", "#membership_template"], + template_ids: [ + "#modal_template", + "#empty_row_template", + "#alert_message_template", + "#spinner-modal", + "#membership_template", + "#confirm_modal" + ], compiled_templates: {} }; diff --git a/horizon/templates/horizon/client_side/_confirm.html b/horizon/templates/horizon/client_side/_confirm.html new file mode 100644 index 000000000..8ed566735 --- /dev/null +++ b/horizon/templates/horizon/client_side/_confirm.html @@ -0,0 +1,12 @@ +{% extends "horizon/client_side/template.html" %} +{% load i18n horizon %} + +{% block id %}confirm_modal{% endblock %} + +{% block template %}{% spaceless %}{% jstemplate %} +
+ {% trans 'You have selected:' %} [[selection]]. + {% trans 'Please confirm your selection.'%} + [[help]] +
+{% endjstemplate %}{% endspaceless %}{% endblock %} diff --git a/horizon/templates/horizon/client_side/_loading.html b/horizon/templates/horizon/client_side/_loading.html index 7deae3bb7..92d98088f 100644 --- a/horizon/templates/horizon/client_side/_loading.html +++ b/horizon/templates/horizon/client_side/_loading.html @@ -5,10 +5,10 @@ {% block template %}{% spaceless %}{% jstemplate %}
-
+
-

[[text]]…

+

[[text]]…

diff --git a/horizon/templates/horizon/client_side/_modal.html b/horizon/templates/horizon/client_side/_modal.html index 7d764af9b..28e58f5e0 100644 --- a/horizon/templates/horizon/client_side/_modal.html +++ b/horizon/templates/horizon/client_side/_modal.html @@ -14,7 +14,7 @@

[[title]]

- [[body]] + [[[body]]]
[[cancel]] diff --git a/horizon/templates/horizon/client_side/templates.html b/horizon/templates/horizon/client_side/templates.html index 33a0f2169..e738200e6 100644 --- a/horizon/templates/horizon/client_side/templates.html +++ b/horizon/templates/horizon/client_side/templates.html @@ -2,4 +2,5 @@ {% include "horizon/client_side/_table_row.html" %} {% include "horizon/client_side/_alert_message.html" %} {% include "horizon/client_side/_loading.html" %} -{% include "horizon/client_side/_membership.html" %} \ No newline at end of file +{% include "horizon/client_side/_membership.html" %} +{% include "horizon/client_side/_confirm.html" %} diff --git a/horizon/test/tests/workflows.py b/horizon/test/tests/workflows.py index cec60f21f..cccf394b4 100644 --- a/horizon/test/tests/workflows.py +++ b/horizon/test/tests/workflows.py @@ -334,21 +334,3 @@ class WorkflowsTests(test.TestCase): flow = TestWorkflow(req, entry_point="test_action_two") self.assertEqual("test_action_two", flow.get_entry_point()) - - def test_fullscreenworkflow_view(self): - view = TestFullscreenWorkflowView.as_view() - req = self.factory.get("/") - req.is_ajax = lambda: True - res = view(req) - output = res.render() - self.assertRegexpMatches(bytes(output), - b'class="[^"]*\\bfullscreen\\b[^"]*"') - - def test_notfullscreenworkflow_view(self): - view = TestWorkflowView.as_view() - req = self.factory.get("/") - req.is_ajax = lambda: True - res = view(req) - output = res.render() - self.assertNotRegexpMatches(bytes(output), - b'class="[^"]*\\bfullscreen\\b[^"]*"') diff --git a/horizon/workflows/base.py b/horizon/workflows/base.py index 45e11c500..5ef09a5c5 100644 --- a/horizon/workflows/base.py +++ b/horizon/workflows/base.py @@ -603,13 +603,6 @@ class Workflow(html.HTMLElement): Whether to present the workflow as a wizard, with "prev" and "next" buttons and validation after every step. - .. attribute:: fullscreen - - If the workflow is presented in a modal, and this attribute is - set to True, then the ``fullscreen`` css class will be added so - the modal can take advantage of the available screen estate. - Defaults to ``False``. - """ slug = None default_steps = () @@ -620,7 +613,6 @@ class Workflow(html.HTMLElement): redirect_param_name = "next" multipart = False wizard = False - fullscreen = False _registerable_class = Step def __str__(self): diff --git a/horizon/workflows/views.py b/horizon/workflows/views.py index 8c0006716..65af97804 100644 --- a/horizon/workflows/views.py +++ b/horizon/workflows/views.py @@ -107,8 +107,6 @@ class WorkflowView(hz_views.ModalBackdropMixin, generic.TemplateView): """ if self.request.is_ajax(): layout = ['modal', ] - if self.workflow_class.fullscreen: - layout += ['fullscreen', ] else: layout = ['static_page', ] diff --git a/openstack_dashboard/contrib/developer/static/dashboard/developer/theme-preview/theme-preview.html b/openstack_dashboard/contrib/developer/static/dashboard/developer/theme-preview/theme-preview.html index dccc6261d..f00f4865a 100644 --- a/openstack_dashboard/contrib/developer/static/dashboard/developer/theme-preview/theme-preview.html +++ b/openstack_dashboard/contrib/developer/static/dashboard/developer/theme-preview/theme-preview.html @@ -1305,29 +1305,7 @@
-
-

Modals

-
-
-
-
-
- -

Modal title

-
-
-

One fine body…

-
-
- - -
-
-
-
-
-
-
+

Popovers

@@ -1344,6 +1322,131 @@
+
+
+

Modals

+
+
+
+
+
+
+
+
+
+ +

Standard Modal

+
+
+

One fine body…

+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+ +

Small Modal

+
+
+

One small body…

+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +

XS

+
+
+

One tiny body…

+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +

Large Modal

+
+
+

One large body…

+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +

XL Modal

+
+
+

One super large body…

+
+
+ + +
+
+
+
+
+
+