From f0b2ef0b5fc4600c2a941a9b506873bc9dd80594 Mon Sep 17 00:00:00 2001 From: Jacques Erasmus Date: Thu, 25 Jul 2019 17:38:06 +0000 Subject: Update namespace label text for managed clusters Added the ability to update the namespace label text for gitlab-managed --- .../pages/projects/clusters/show/index.js | 2 ++ app/assets/javascripts/pages/projects/index.js | 2 ++ .../projects/gke_cluster_namespace/index.js | 35 ++++++++++++++++++++++ 3 files changed, 39 insertions(+) create mode 100644 app/assets/javascripts/projects/gke_cluster_namespace/index.js (limited to 'app/assets') diff --git a/app/assets/javascripts/pages/projects/clusters/show/index.js b/app/assets/javascripts/pages/projects/clusters/show/index.js index 8001d2dd1da..f091c01fc98 100644 --- a/app/assets/javascripts/pages/projects/clusters/show/index.js +++ b/app/assets/javascripts/pages/projects/clusters/show/index.js @@ -1,5 +1,7 @@ import ClustersBundle from '~/clusters/clusters_bundle'; +import initGkeNamespace from '~/projects/gke_cluster_namespace'; document.addEventListener('DOMContentLoaded', () => { new ClustersBundle(); // eslint-disable-line no-new + initGkeNamespace(); }); diff --git a/app/assets/javascripts/pages/projects/index.js b/app/assets/javascripts/pages/projects/index.js index d4bd02c14e9..55c377ebec0 100644 --- a/app/assets/javascripts/pages/projects/index.js +++ b/app/assets/javascripts/pages/projects/index.js @@ -1,4 +1,5 @@ import initGkeDropdowns from '~/projects/gke_cluster_dropdowns'; +import initGkeNamespace from '~/projects/gke_cluster_namespace'; import PersistentUserCallout from '../../persistent_user_callout'; import Project from './project'; import ShortcutsNavigation from '../../behaviors/shortcuts/shortcuts_navigation'; @@ -16,6 +17,7 @@ document.addEventListener('DOMContentLoaded', () => { PersistentUserCallout.factory(callout); initGkeDropdowns(); + initGkeNamespace(); } new Project(); // eslint-disable-line no-new diff --git a/app/assets/javascripts/projects/gke_cluster_namespace/index.js b/app/assets/javascripts/projects/gke_cluster_namespace/index.js new file mode 100644 index 00000000000..288740203ad --- /dev/null +++ b/app/assets/javascripts/projects/gke_cluster_namespace/index.js @@ -0,0 +1,35 @@ +/** + * Disables & hides the namespace inputs when the gitlab-managed checkbox is checked/unchecked. + */ + +const setDisabled = (el, isDisabled) => { + if (isDisabled) { + el.classList.add('hidden'); + el.querySelector('input').setAttribute('disabled', true); + } else { + el.classList.remove('hidden'); + el.querySelector('input').removeAttribute('disabled'); + } +}; + +const setState = glManagedCheckbox => { + const glManaged = document.querySelector('.js-namespace-prefixed'); + const selfManaged = document.querySelector('.js-namespace'); + + if (glManagedCheckbox.checked) { + setDisabled(glManaged, false); + setDisabled(selfManaged, true); + } else { + setDisabled(glManaged, true); + setDisabled(selfManaged, false); + } +}; + +const initGkeNamespace = () => { + const glManagedCheckbox = document.querySelector('.js-gl-managed'); + + setState(glManagedCheckbox); // this is needed in order to set the initial state + glManagedCheckbox.addEventListener('change', () => setState(glManagedCheckbox)); +}; + +export default initGkeNamespace; -- cgit v1.2.1