summaryrefslogtreecommitdiff
path: root/app/assets
diff options
context:
space:
mode:
authorEric Eastwood <contact@ericeastwood.com>2017-04-10 15:51:24 -0500
committerEric Eastwood <contact@ericeastwood.com>2017-04-20 13:34:18 -0500
commit36387ce1b4a687a41f450c9fcccc348e478ca296 (patch)
treef22ef9dcfaef98e2bd643d63ec5e06fa46d28cfd /app/assets
parent60a6389a7223f14156aeeec9a3854f8ea88de1f0 (diff)
downloadgitlab-ce-36387ce1b4a687a41f450c9fcccc348e478ca296.tar.gz
Add Fork/Cancel confirmation to "Replace"/"Delete" buttons30637-replace-delete-buttons-get-fork-cancel-confirmation
Fix https://gitlab.com/gitlab-org/gitlab-ce/issues/30637
Diffstat (limited to 'app/assets')
-rw-r--r--app/assets/javascripts/blob/blob_fork_suggestion.js58
-rw-r--r--app/assets/javascripts/commons/polyfills.js1
-rw-r--r--app/assets/javascripts/dispatcher.js12
3 files changed, 61 insertions, 10 deletions
diff --git a/app/assets/javascripts/blob/blob_fork_suggestion.js b/app/assets/javascripts/blob/blob_fork_suggestion.js
index aa9a4e1c99a..3baf81905fe 100644
--- a/app/assets/javascripts/blob/blob_fork_suggestion.js
+++ b/app/assets/javascripts/blob/blob_fork_suggestion.js
@@ -1,15 +1,63 @@
-function BlobForkSuggestion(openButton, cancelButton, suggestionSection) {
- if (openButton) {
- openButton.addEventListener('click', () => {
+const defaults = {
+ // Buttons that will show the `suggestionSections`
+ // has `data-fork-path`, and `data-action`
+ openButtons: [],
+ // Update the href(from `openButton` -> `data-fork-path`)
+ // whenever a `openButton` is clicked
+ forkButtons: [],
+ // Buttons to hide the `suggestionSections`
+ cancelButtons: [],
+ // Section to show/hide
+ suggestionSections: [],
+ // Pieces of text that need updating depending on the action, `edit`, `replace`, `delete`
+ actionTextPieces: [],
+};
+
+class BlobForkSuggestion {
+ constructor(options) {
+ this.elementMap = Object.assign({}, defaults, options);
+ this.onClickWrapper = this.onClick.bind(this);
+
+ document.addEventListener('click', this.onClickWrapper);
+ }
+
+ showSuggestionSection(forkPath, action = 'edit') {
+ [].forEach.call(this.elementMap.suggestionSections, (suggestionSection) => {
suggestionSection.classList.remove('hidden');
});
+
+ [].forEach.call(this.elementMap.forkButtons, (forkButton) => {
+ forkButton.setAttribute('href', forkPath);
+ });
+
+ [].forEach.call(this.elementMap.actionTextPieces, (actionTextPiece) => {
+ // eslint-disable-next-line no-param-reassign
+ actionTextPiece.textContent = action;
+ });
}
- if (cancelButton) {
- cancelButton.addEventListener('click', () => {
+ hideSuggestionSection() {
+ [].forEach.call(this.elementMap.suggestionSections, (suggestionSection) => {
suggestionSection.classList.add('hidden');
});
}
+
+ onClick(e) {
+ const el = e.target;
+
+ if ([].includes.call(this.elementMap.openButtons, el)) {
+ const { forkPath, action } = el.dataset;
+ this.showSuggestionSection(forkPath, action);
+ }
+
+ if ([].includes.call(this.elementMap.cancelButtons, el)) {
+ this.hideSuggestionSection();
+ }
+ }
+
+ destroy() {
+ document.removeEventListener('click', this.onClickWrapper);
+ }
}
export default BlobForkSuggestion;
diff --git a/app/assets/javascripts/commons/polyfills.js b/app/assets/javascripts/commons/polyfills.js
index 3253eebd9b5..cb054a2a197 100644
--- a/app/assets/javascripts/commons/polyfills.js
+++ b/app/assets/javascripts/commons/polyfills.js
@@ -1,6 +1,7 @@
// ECMAScript polyfills
import 'core-js/fn/array/find';
import 'core-js/fn/array/from';
+import 'core-js/fn/array/includes';
import 'core-js/fn/object/assign';
import 'core-js/fn/promise';
import 'core-js/fn/string/code-point-at';
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index 02a7df9b2a0..20db2698ba8 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -91,11 +91,13 @@ const ShortcutsBlob = require('./shortcuts_blob');
fileBlobPermalinkUrl,
});
- new BlobForkSuggestion(
- document.querySelector('.js-edit-blob-link-fork-toggler'),
- document.querySelector('.js-cancel-fork-suggestion'),
- document.querySelector('.js-file-fork-suggestion-section'),
- );
+ new BlobForkSuggestion({
+ openButtons: document.querySelectorAll('.js-edit-blob-link-fork-toggler'),
+ forkButtons: document.querySelectorAll('.js-fork-suggestion-button'),
+ cancelButtons: document.querySelectorAll('.js-cancel-fork-suggestion-button'),
+ suggestionSections: document.querySelectorAll('.js-file-fork-suggestion-section'),
+ actionTextPieces: document.querySelectorAll('.js-file-fork-suggestion-section-action'),
+ });
}
switch (page) {