+++ /dev/null
-/**
- * @file
- * Drupal's Settings Tray library.
- */
-
-(function ($, Drupal) {
-
- 'use strict';
-
- 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';
- var contextualItemsSelector = '[data-contextual-id] a, [data-contextual-id] button';
- var quickEditItemSelector = '[data-quickedit-entity-id]';
-
- /**
- * Reacts to contextual links being added.
- *
- * @param {jQuery.Event} event
- * The `drupalContextualLinkAdded` event.
- * @param {object} data
- * An object containing the data relevant to the event.
- *
- * @listens event:drupalContextualLinkAdded
- */
- $(document).on('drupalContextualLinkAdded', function (event, data) {
- // 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]);
-
- // Bind a listener to all 'Quick edit' links for blocks
- // Click "Edit" button in toolbar to force Contextual Edit which starts
- // Settings Tray edit mode also.
- data.$el.find(blockConfigureSelector)
- .on('click.outsidein', function () {
- if (!isInEditMode()) {
- $(toggleEditSelector).trigger('click').trigger('click.outside_in');
- }
- // Always disable QuickEdit regardless of whether "EditMode" was just enabled.
- disableQuickEdit();
- });
- });
-
- $(document).on('keyup.outsidein', function (e) {
- if (isInEditMode() && e.keyCode === 27) {
- Drupal.announce(
- Drupal.t('Exited edit mode.')
- );
- toggleEditMode();
- }
- });
-
- /**
- * Gets all items that should be toggled with class during edit mode.
- *
- * @return {jQuery}
- * Items that should be toggled.
- */
- function getItemsToToggle() {
- return $(itemsToToggleSelector).not(contextualItemsSelector);
- }
-
- /**
- * Helper to check the state of the outside-in mode.
- *
- * @todo don't use a class for this.
- *
- * @return {boolean}
- * State of the outside-in edit mode.
- */
- function isInEditMode() {
- return $('#toolbar-bar').hasClass('js-outside-in-edit-mode');
- }
-
- /**
- * Helper to toggle Edit mode.
- */
- function toggleEditMode() {
- setEditModeState(!isInEditMode());
- }
-
- /**
- * Prevent default click events except contextual links.
- *
- * In edit mode the default action of click events is suppressed.
- *
- * @param {jQuery.Event} event
- * The click event.
- */
- function preventClick(event) {
- // Do not prevent contextual links.
- if ($(event.target).closest('.contextual-links').length) {
- return;
- }
- event.preventDefault();
- }
-
- /**
- * Close any active toolbar tray before entering edit mode.
- */
- function closeToolbarTrays() {
- $(Drupal.toolbar.models.toolbarModel.get('activeTab')).trigger('click');
- }
-
- /**
- * Disables the QuickEdit module editor if open.
- */
- function disableQuickEdit() {
- $('.quickedit-toolbar button.action-cancel').trigger('click');
- }
-
- /**
- * Closes/removes off-canvas.
- */
- function closeOffCanvas() {
- $('.ui-dialog-off-canvas .ui-dialog-titlebar-close').trigger('click');
- }
-
- /**
- * Helper to switch edit mode state.
- *
- * @param {boolean} editMode
- * True enable edit mode, false disable edit mode.
- */
- function setEditModeState(editMode) {
- 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');
- }
- editMode = !!editMode;
- var $editButton = $(toggleEditSelector);
- var $editables;
- // Turn on edit mode.
- if (editMode) {
- $editButton.text(Drupal.t('Editing'));
- closeToolbarTrays();
-
- $editables = $('[data-drupal-outsidein="editable"]').once('outsidein');
- if ($editables.length) {
- // Use event capture to prevent clicks on links.
- document.querySelector('[data-off-canvas-main-canvas]').addEventListener('click', preventClick, true);
-
- // When a click occurs try and find the outside-in edit link
- // and click it.
- $editables
- .not(contextualItemsSelector)
- .on('click.outsidein', function (e) {
- // Contextual links are allowed to function in Edit mode.
- if ($(e.target).closest('.contextual').length || !localStorage.getItem('Drupal.contextualToolbar.isViewing')) {
- return;
- }
- $(e.currentTarget).find(blockConfigureSelector).trigger('click');
- disableQuickEdit();
- });
- $(quickEditItemSelector)
- .not(contextualItemsSelector)
- .on('click.outsidein', function (e) {
- // For all non-contextual links or the contextual QuickEdit link close the off-canvas dialog.
- if (!$(e.target).parent().hasClass('contextual') || $(e.target).parent().hasClass('quickedit')) {
- closeOffCanvas();
- }
- // Do not trigger if target is quick edit link to avoid loop.
- if ($(e.target).parent().hasClass('contextual') || $(e.target).parent().hasClass('quickedit')) {
- return;
- }
- $(e.currentTarget).find('li.quickedit a').trigger('click');
- });
- }
- }
- // Disable edit mode.
- else {
- $editables = $('[data-drupal-outsidein="editable"]').removeOnce('outsidein');
- if ($editables.length) {
- document.querySelector('[data-off-canvas-main-canvas]').removeEventListener('click', preventClick, true);
- $editables.off('.outsidein');
- $(quickEditItemSelector).off('.outsidein');
- }
-
- $editButton.text(Drupal.t('Edit'));
- closeOffCanvas();
- disableQuickEdit();
- }
- getItemsToToggle().toggleClass('js-outside-in-edit-mode', editMode);
- $('.edit-mode-inactive').toggleClass('visually-hidden', editMode);
- }
-
- /**
- * Attaches contextual's edit toolbar tab behavior.
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Attaches contextual toolbar behavior on a contextualToolbar-init event.
- */
- Drupal.behaviors.outsideInEdit = {
- attach: function () {
- var editMode = localStorage.getItem('Drupal.contextualToolbar.isViewing') === 'false';
- if (editMode) {
- setEditModeState(true);
- }
- }
- };
-
- /**
- * Toggle the js-outside-edit-mode class on items that we want to disable while in edit mode.
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Toggle the js-outside-edit-mode class.
- */
- Drupal.behaviors.toggleEditMode = {
- attach: function () {
-
- $(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';
- // Loop through all Ajax links and change the format to dialog-off-canvas when
- // needed.
- Drupal.ajax.instances
- .filter(function (instance) {
- var hasElement = instance && !!instance.element;
- var rendererOffCanvas = false;
- var wrapperOffCanvas = false;
- if (hasElement) {
- rendererOffCanvas = $(instance.element).attr('data-dialog-renderer') === 'off_canvas';
- wrapperOffCanvas = instance.options.url.indexOf('drupal_dialog_off_canvas') === -1;
- }
- return hasElement && rendererOffCanvas && wrapperOffCanvas;
- })
- .forEach(function (instance) {
- // @todo Move logic for data-dialog-renderer attribute into ajax.js
- // https://www.drupal.org/node/2784443
- instance.options.url = instance.options.url.replace(search, replace);
- // Check to make sure existing dialogOptions aren't overridden.
- if (!('dialogOptions' in instance.options.data)) {
- instance.options.data.dialogOptions = {};
- }
- instance.options.data.dialogOptions.outsideInActiveEditableId = $(instance.element).parents('.outside-in-editable').attr('id');
- instance.progress = {type: 'fullscreen'};
- });
- }
- };
-
- // Manage Active editable class on opening and closing of the dialog.
- $(window).on({
- 'dialog:beforecreate': function (event, dialog, $element, settings) {
- if ($element.is('#drupal-off-canvas')) {
- $('body .outside-in-active-editable').removeClass('outside-in-active-editable');
- var $activeElement = $('#' + settings.outsideInActiveEditableId);
- if ($activeElement.length) {
- $activeElement.addClass('outside-in-active-editable');
- settings.dialogClass += ' ui-dialog-outside-in';
- }
- }
- },
- 'dialog:beforeclose': function (event, dialog, $element) {
- if ($element.is('#drupal-off-canvas')) {
- $('body .outside-in-active-editable').removeClass('outside-in-active-editable');
- }
- }
- });
-
-})(jQuery, Drupal);
projects / yaffs-website / blobdiff