diff --git a/core/modules/outside_in/js/outside_in.es6.js b/core/modules/outside_in/js/outside_in.es6.js index 7ebc0bcfc9..1102331a76 100644 --- a/core/modules/outside_in/js/outside_in.es6.js +++ b/core/modules/outside_in/js/outside_in.es6.js @@ -2,7 +2,7 @@ * @file * Drupal's Settings Tray library. */ -(function ($, Drupal) { +(function ($, {t, announce, debounce, ajax, attachBehaviors, toolbar, behaviors}) { const blockConfigureSelector = '[data-outside-in-edit]'; const toggleEditSelector = '[data-drupal-outsidein="toggle"]'; const itemsToToggleSelector = '[data-off-canvas-main-canvas], #toolbar-bar, [data-drupal-outsidein="editable"] a, [data-drupal-outsidein="editable"] button'; @@ -23,7 +23,7 @@ // Bind Ajax behaviors to all items showing the class. // @todo Fix contextual links to work with use-ajax links in // https://www.drupal.org/node/2764931. - Drupal.attachBehaviors(data.$el[0]); + attachBehaviors(data.$el[0]); // Bind a listener to all 'Quick edit' links for blocks // Click "Edit" button in toolbar to force Contextual Edit which starts @@ -40,8 +40,8 @@ $(document).on('keyup.outsidein', (e) => { if (isInEditMode() && e.keyCode === 27) { - Drupal.announce( - Drupal.t('Exited edit mode.'), + announce( + t('Exited edit mode.') ); toggleEditMode(); } @@ -96,7 +96,7 @@ * Close any active toolbar tray before entering edit mode. */ function closeToolbarTrays() { - $(Drupal.toolbar.models.toolbarModel.get('activeTab')).trigger('click'); + $(toolbar.models.toolbarModel.get('activeTab')).trigger('click'); } /** @@ -114,19 +114,23 @@ } /** - * Display message describing edit mode. + * Display a message informing the user that they have entered edit mode. + * + * This message appear at the top of the page below the toolbar. + * The user will be able to click on the message to remove it. + * It will also be removed when exiting edit mode. * * @todo Refactor to use Javascript Message API https://www.drupal.org/node/77245 */ function displayEditMessage() { - const editMsg = Drupal.t('You are now in edit mode.'); + const editMsg = t('You are now in edit mode.'); const msgDiv = document.createElement('div'); msgDiv.setAttribute('id', 'settings-tray-edit-message') msgDiv.setAttribute('class', 'settings-tray-messages messages messages--status'); msgDiv.setAttribute('role', 'alert'); msgDiv.innerHTML = editMsg; $(msgDiv).insertBefore('div.dialog-off-canvas__main-canvas').hide().fadeIn('slow'); - Drupal.announce(editMsg); + announce(editMsg); $(msgDiv).on('click.outsidein', e => $(e.target).remove()); } @@ -136,8 +140,10 @@ * * @param {boolean} editMode * True enable edit mode, false disable edit mode. + * @param {boolean} displayMessage + * True if the message about entering edit mode should be shown. */ - function setEditModeState(editMode , displayMessage = false) { + function setEditModeState(editMode, displayMessage = false) { if (!document.querySelector('[data-off-canvas-main-canvas]')) { throw new Error('data-off-canvas-main-canvas is missing from outside-in-page-wrapper.html.twig'); } @@ -146,7 +152,7 @@ let $editables; // Turn on edit mode. if (editMode) { - $editButton.text(Drupal.t('Editing')); + $editButton.text(t('Editing')); closeToolbarTrays(); if (displayMessage) { @@ -195,7 +201,7 @@ $(quickEditItemSelector).off('.outsidein'); } - $editButton.text(Drupal.t('Edit')); + $editButton.text(t('Edit')); closeOffCanvas(); disableQuickEdit(); // Remove edit mode message. @@ -213,7 +219,7 @@ * @prop {Drupal~behaviorAttach} attach * Attaches contextual toolbar behavior on a contextualToolbar-init event. */ - Drupal.behaviors.outsideInEdit = { + behaviors.outsideInEdit = { attach() { const editMode = localStorage.getItem('Drupal.contextualToolbar.isViewing') === 'false'; if (editMode) { @@ -230,15 +236,15 @@ * @prop {Drupal~behaviorAttach} attach * Toggle the js-outside-edit-mode class. */ - Drupal.behaviors.toggleEditMode = { + behaviors.toggleEditMode = { attach() { $(toggleEditSelector).once('outsidein').on('click.outsidein', toggleEditMode); - const search = `${Drupal.ajax.WRAPPER_FORMAT}=drupal_dialog`; - const replace = `${Drupal.ajax.WRAPPER_FORMAT}=drupal_dialog_off_canvas`; + const search = `${ajax.WRAPPER_FORMAT}=drupal_dialog`; + const replace = `${ajax.WRAPPER_FORMAT}=drupal_dialog_off_canvas`; // Loop through all Ajax links and change the format to dialog-off-canvas when // needed. - Drupal.ajax.instances + ajax.instances .filter((instance) => { const hasElement = instance && !!instance.element; let rendererOffCanvas = false; @@ -281,5 +287,4 @@ } }, }); -}(jQuery, Drupal)); - +})(jQuery, Drupal); diff --git a/core/modules/outside_in/js/outside_in.js b/core/modules/outside_in/js/outside_in.js index d8878b8b55..9a3a9bc0dc 100644 --- a/core/modules/outside_in/js/outside_in.js +++ b/core/modules/outside_in/js/outside_in.js @@ -5,14 +5,15 @@ * @preserve **/ -<<<<<<< HEAD -(function ($, Drupal) { -======= -(function ($, Drupal, debounce) { +(function ($, _ref) { + var t = _ref.t, + announce = _ref.announce, + debounce = _ref.debounce, + ajax = _ref.ajax, + attachBehaviors = _ref.attachBehaviors, + toolbar = _ref.toolbar, + behaviors = _ref.behaviors; - 'use strict'; - ->>>>>>> rerolled https://www.drupal.org/files/issues/2773601-16.patch js var blockConfigureSelector = '[data-outside-in-edit]'; var toggleEditSelector = '[data-drupal-outsidein="toggle"]'; var itemsToToggleSelector = '[data-off-canvas-main-canvas], #toolbar-bar, [data-drupal-outsidein="editable"] a, [data-drupal-outsidein="editable"] button'; @@ -20,7 +21,7 @@ var quickEditItemSelector = '[data-quickedit-entity-id]'; $(document).on('drupalContextualLinkAdded', function (event, data) { - Drupal.attachBehaviors(data.$el[0]); + attachBehaviors(data.$el[0]); data.$el.find(blockConfigureSelector).on('click.outsidein', function () { if (!isInEditMode()) { @@ -33,7 +34,7 @@ $(document).on('keyup.outsidein', function (e) { if (isInEditMode() && e.keyCode === 27) { - Drupal.announce(Drupal.t('Exited edit mode.')); + announce(t('Exited edit mode.')); toggleEditMode(); } }); @@ -58,7 +59,7 @@ } function closeToolbarTrays() { - $(Drupal.toolbar.models.toolbarModel.get('activeTab')).trigger('click'); + $(toolbar.models.toolbarModel.get('activeTab')).trigger('click'); } function disableQuickEdit() { @@ -70,14 +71,14 @@ } function displayEditMessage() { - var editMsg = Drupal.t('You are now in edit mode.'); + var editMsg = t('You are now in edit mode.'); var msgDiv = document.createElement('div'); msgDiv.setAttribute('id', 'settings-tray-edit-message'); msgDiv.setAttribute('class', 'settings-tray-messages messages messages--status'); msgDiv.setAttribute('role', 'alert'); msgDiv.innerHTML = editMsg; $(msgDiv).insertBefore('div.dialog-off-canvas__main-canvas').hide().fadeIn('slow'); - Drupal.announce(editMsg); + announce(editMsg); $(msgDiv).on('click.outsidein', function (e) { return $(e.target).remove(); }); @@ -94,7 +95,7 @@ var $editables = void 0; if (editMode) { - $editButton.text(Drupal.t('Editing')); + $editButton.text(t('Editing')); closeToolbarTrays(); if (displayMessage) { @@ -132,7 +133,7 @@ $(quickEditItemSelector).off('.outsidein'); } - $editButton.text(Drupal.t('Edit')); + $editButton.text(t('Edit')); closeOffCanvas(); disableQuickEdit(); @@ -142,7 +143,7 @@ $('.edit-mode-inactive').toggleClass('visually-hidden', editMode); } - Drupal.behaviors.outsideInEdit = { + behaviors.outsideInEdit = { attach: function attach() { var editMode = localStorage.getItem('Drupal.contextualToolbar.isViewing') === 'false'; if (editMode) { @@ -151,14 +152,14 @@ } }; - Drupal.behaviors.toggleEditMode = { + behaviors.toggleEditMode = { attach: function attach() { $(toggleEditSelector).once('outsidein').on('click.outsidein', toggleEditMode); - var search = Drupal.ajax.WRAPPER_FORMAT + '=drupal_dialog'; - var replace = Drupal.ajax.WRAPPER_FORMAT + '=drupal_dialog_off_canvas'; + var search = ajax.WRAPPER_FORMAT + '=drupal_dialog'; + var replace = ajax.WRAPPER_FORMAT + '=drupal_dialog_off_canvas'; - Drupal.ajax.instances.filter(function (instance) { + ajax.instances.filter(function (instance) { var hasElement = instance && !!instance.element; var rendererOffCanvas = false; var wrapperOffCanvas = false; @@ -196,4 +197,4 @@ } } }); -})(jQuery, Drupal, Drupal.debounce); \ No newline at end of file +})(jQuery, Drupal); \ No newline at end of file diff --git a/core/modules/outside_in/outside_in.libraries.yml b/core/modules/outside_in/outside_in.libraries.yml index 5c388b82f1..9de816c8ca 100644 --- a/core/modules/outside_in/outside_in.libraries.yml +++ b/core/modules/outside_in/outside_in.libraries.yml @@ -20,6 +20,7 @@ drupal.outside_in: - core/drupal - core/jquery.once - core/drupal.ajax + - toolbar/toolbar drupal.off_canvas: version: VERSION js: