diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2019-06-05 13:40:58 +0000 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2019-06-05 13:40:58 +0000 |
commit | cb18dfea0505f47062096e05eda8f74111c1fc39 (patch) | |
tree | c5f09691fe175a42c648b97eb63b1c2be8d922d1 /app | |
parent | 09f482ba41b9dd021f1dc43a0ddf4ca3814bfc6b (diff) | |
parent | 6610f2fdcb4b641e9c1c87891e9de1ca28c1f518 (diff) | |
download | gitlab-ce-cb18dfea0505f47062096e05eda8f74111c1fc39.tar.gz |
Merge branch '28996-create-mvc-ui-in-haml' into 'master'
Add Let's Encrypt option in Pages domain new/edit Haml form
See merge request gitlab-org/gitlab-ce!26438
Diffstat (limited to 'app')
8 files changed, 131 insertions, 20 deletions
diff --git a/app/assets/javascripts/pages/projects/pages_domains/edit/index.js b/app/assets/javascripts/pages/projects/pages_domains/edit/index.js new file mode 100644 index 00000000000..27e4433ad4d --- /dev/null +++ b/app/assets/javascripts/pages/projects/pages_domains/edit/index.js @@ -0,0 +1,3 @@ +import initForm from '~/pages/projects/pages_domains/form'; + +document.addEventListener('DOMContentLoaded', initForm); diff --git a/app/assets/javascripts/pages/projects/pages_domains/form.js b/app/assets/javascripts/pages/projects/pages_domains/form.js new file mode 100644 index 00000000000..1d0dbfe0406 --- /dev/null +++ b/app/assets/javascripts/pages/projects/pages_domains/form.js @@ -0,0 +1,43 @@ +import setupToggleButtons from '~/toggle_buttons'; + +export default () => { + const toggleContainer = document.querySelector('.js-auto-ssl-toggle-container'); + + if (toggleContainer) { + const onToggleButtonClicked = isAutoSslEnabled => { + Array.from(document.querySelectorAll('.js-shown-if-auto-ssl')).forEach(el => { + if (isAutoSslEnabled) { + el.classList.remove('d-none'); + } else { + el.classList.add('d-none'); + } + }); + + Array.from(document.querySelectorAll('.js-shown-unless-auto-ssl')).forEach(el => { + if (isAutoSslEnabled) { + el.classList.add('d-none'); + } else { + el.classList.remove('d-none'); + } + }); + + Array.from(document.querySelectorAll('.js-enabled-if-auto-ssl')).forEach(el => { + if (isAutoSslEnabled) { + el.removeAttribute('disabled'); + } else { + el.setAttribute('disabled', 'disabled'); + } + }); + + Array.from(document.querySelectorAll('.js-enabled-unless-auto-ssl')).forEach(el => { + if (isAutoSslEnabled) { + el.setAttribute('disabled', 'disabled'); + } else { + el.removeAttribute('disabled'); + } + }); + }; + + setupToggleButtons(toggleContainer, onToggleButtonClicked); + } +}; diff --git a/app/assets/javascripts/pages/projects/pages_domains/new/index.js b/app/assets/javascripts/pages/projects/pages_domains/new/index.js new file mode 100644 index 00000000000..27e4433ad4d --- /dev/null +++ b/app/assets/javascripts/pages/projects/pages_domains/new/index.js @@ -0,0 +1,3 @@ +import initForm from '~/pages/projects/pages_domains/form'; + +document.addEventListener('DOMContentLoaded', initForm); diff --git a/app/controllers/projects/pages_domains_controller.rb b/app/controllers/projects/pages_domains_controller.rb index 58b1bc54181..89f21d8dadb 100644 --- a/app/controllers/projects/pages_domains_controller.rb +++ b/app/controllers/projects/pages_domains_controller.rb @@ -65,11 +65,11 @@ class Projects::PagesDomainsController < Projects::ApplicationController private def create_params - params.require(:pages_domain).permit(:key, :certificate, :domain) + params.require(:pages_domain).permit(:key, :certificate, :domain, :auto_ssl_enabled) end def update_params - params.require(:pages_domain).permit(:key, :certificate) + params.require(:pages_domain).permit(:key, :certificate, :auto_ssl_enabled) end # rubocop: disable CodeReuse/ActiveRecord diff --git a/app/views/projects/pages_domains/_form.html.haml b/app/views/projects/pages_domains/_form.html.haml index 1e50a101c1e..33f2166480b 100644 --- a/app/views/projects/pages_domains/_form.html.haml +++ b/app/views/projects/pages_domains/_form.html.haml @@ -1,29 +1,80 @@ - if @domain.errors.any? - #error_explanation - .alert.alert-danger - - @domain.errors.full_messages.each do |msg| - %p= msg + .alert.alert-danger + - @domain.errors.full_messages.each do |msg| + = msg .form-group.row .col-sm-2.col-form-label = f.label :domain, _("Domain") .col-sm-10 - = f.text_field :domain, required: true, autocomplete: 'off', class: 'form-control', disabled: @domain.persisted? + = f.text_field :domain, required: true, autocomplete: "off", class: "form-control", disabled: @domain.persisted? - if Gitlab.config.pages.external_https - .form-group.row - .col-sm-2.col-form-label - = f.label :certificate, _("Certificate (PEM)") - .col-sm-10 - = f.text_area :certificate, rows: 5, class: 'form-control' - %span.help-inline= _("Upload a certificate for your domain with all intermediates") - - .form-group.row - .col-sm-2.col-form-label - = f.label :key, _("Key (PEM)") - .col-sm-10 - = f.text_area :key, rows: 5, class: 'form-control' - %span.help-inline= _("Upload a private key for your certificate") + + - auto_ssl_available = Feature.enabled?(:pages_auto_ssl) + - auto_ssl_enabled = @domain.auto_ssl_enabled? + - auto_ssl_available_and_enabled = auto_ssl_available && auto_ssl_enabled + + - if auto_ssl_available + .form-group.row + .col-sm-2.col-form-label + %label{ for: "pages_domain_auto_ssl_enabled_button" } + - lets_encrypt_link_url = "https://letsencrypt.org/" + - lets_encrypt_link_start = "<a href=\"%{lets_encrypt_link_url}\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-nowrap\">".html_safe % { lets_encrypt_link_url: lets_encrypt_link_url } + - lets_encrypt_link_end = "</a>".html_safe + = _("Automatic certificate management using %{lets_encrypt_link_start}Let's Encrypt%{lets_encrypt_link_end}").html_safe % { lets_encrypt_link_start: lets_encrypt_link_start, lets_encrypt_link_end: lets_encrypt_link_end } + + .col-sm-10.js-auto-ssl-toggle-container + %button{ type: "button", id: "pages_domain_auto_ssl_enabled_button", + class: "js-project-feature-toggle project-feature-toggle mt-2 #{"is-checked" if auto_ssl_available_and_enabled}", + "aria-label": _("Automatic certificate management using Let's Encrypt") } + = f.hidden_field :auto_ssl_enabled?, class: "js-project-feature-toggle-input" + %span.toggle-icon + = sprite_icon("status_success_borderless", size: 16, css_class: "toggle-icon-svg toggle-status-checked") + = sprite_icon("status_failed_borderless", size: 16, css_class: "toggle-icon-svg toggle-status-unchecked") + %p.text-secondary.mt-3 + - docs_link_url = help_page_path("user/project/pages/lets_encrypt_for_gitlab_pages.md", anchor: "lets-encrypt-for-gitlab-pages") + - docs_link_start = "<a href=\"%{docs_link_url}\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-nowrap\">".html_safe % { docs_link_url: docs_link_url } + - docs_link_end = "</a>".html_safe + = _("Let's Encrypt is a free, automated, and open certificate authority (CA) that gives digital certificates in order to enable HTTPS (SSL/TLS) for websites. Learn more about Let's Encrypt configuration by following the %{docs_link_start}documentation on GitLab Pages%{docs_link_end}.").html_safe % { docs_link_url: docs_link_url, docs_link_start: docs_link_start, docs_link_end: docs_link_end } + + .js-shown-if-auto-ssl{ class: ("d-none" unless auto_ssl_available_and_enabled) } + .form-group.row + .col-sm-2.col-form-label + = f.label :certificate, _("Certificate (PEM)") + .col-sm-10 + - if auto_ssl_available_and_enabled && !@domain.certificate.empty? + = f.text_area :certificate, + rows: 5, + class: "form-control", + disabled: true + %span.help-inline.text-muted= _("This certificate is automatically managed by Let's Encrypt") + - else + %p.text-secondary.form-control-plaintext= _("The certificate will be shown here once it has been obtained from Let's Encrypt. This process may take up to an hour to complete.") + + .js-shown-unless-auto-ssl{ class: ("d-none" if auto_ssl_available_and_enabled) } + .form-group.row + .col-sm-2.col-form-label + = f.label :certificate, _("Certificate (PEM)") + .col-sm-10 + = f.text_area :certificate, + rows: 5, + class: "form-control js-enabled-unless-auto-ssl", + value: (@domain.certificate unless auto_ssl_available_and_enabled), + disabled: auto_ssl_available_and_enabled + %span.help-inline.text-muted= _("Upload a certificate for your domain with all intermediates") + + .form-group.row + .col-sm-2.col-form-label + = f.label :key, _("Key (PEM)") + .col-sm-10 + = f.text_area :key, + rows: 5, + class: "form-control js-enabled-unless-auto-ssl", + value: (@domain.key unless auto_ssl_available_and_enabled), + disabled: auto_ssl_available_and_enabled + %span.help-inline.text-muted= _("Upload a private key for your certificate") + - else .nothing-here-block = _("Support for custom certificates is disabled. Ask your system's administrator to enable it.") diff --git a/app/views/projects/pages_domains/_helper_text.html.haml b/app/views/projects/pages_domains/_helper_text.html.haml new file mode 100644 index 00000000000..5a79fefabfc --- /dev/null +++ b/app/views/projects/pages_domains/_helper_text.html.haml @@ -0,0 +1,9 @@ +- docs_link_url = help_page_path("user/project/pages/getting_started_part_three.md", anchor: "adding-certificates-to-your-project") +- docs_link_start = "<a href=\"%{docs_link_url}\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-nowrap\">".html_safe % { docs_link_url: docs_link_url } +- docs_link_end = "</a>".html_safe + +-# Hiding behind a feature flag to avoid any changes to this feature's implemention +-# when the :pages_auto_ssl feature flag is disabled. This check should be removed +-# once the :pages_auto_ssl feature flag is removed. +- if Feature.enabled?(:pages_auto_ssl) + %p= _("Learn more about adding certificates to your project by following the %{docs_link_start}documentation on GitLab Pages%{docs_link_end}.").html_safe % { docs_link_url: docs_link_url, docs_link_start: docs_link_start, docs_link_end: docs_link_end } diff --git a/app/views/projects/pages_domains/edit.html.haml b/app/views/projects/pages_domains/edit.html.haml index e11387ae742..7c0777e5496 100644 --- a/app/views/projects/pages_domains/edit.html.haml +++ b/app/views/projects/pages_domains/edit.html.haml @@ -3,6 +3,7 @@ - page_title @domain.domain %h3.page-title = @domain.domain += render 'projects/pages_domains/helper_text' %hr.clearfix %div = form_for [@project.namespace.becomes(Namespace), @project, @domain], html: { class: 'fieldset-form' } do |f| diff --git a/app/views/projects/pages_domains/new.html.haml b/app/views/projects/pages_domains/new.html.haml index c7cefa87c76..e23ccb5d4c6 100644 --- a/app/views/projects/pages_domains/new.html.haml +++ b/app/views/projects/pages_domains/new.html.haml @@ -2,6 +2,7 @@ - page_title _('New Pages Domain') %h3.page-title = _("New Pages Domain") += render 'projects/pages_domains/helper_text' %hr.clearfix %div = form_for [@project.namespace.becomes(Namespace), @project, @domain], html: { class: 'fieldset-form' } do |f| |