123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112 |
- /**
- * @file
- * Preview behaviors.
- */
- (function($, Drupal) {
- /**
- * Disables all non-relevant links in node previews.
- *
- * Destroys links (except local fragment identifiers such as href="#frag") in
- * node previews to prevent users from leaving the page.
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Attaches confirmation prompt for clicking links in node preview mode.
- * @prop {Drupal~behaviorDetach} detach
- * Detaches confirmation prompt for clicking links in node preview mode.
- */
- Drupal.behaviors.nodePreviewDestroyLinks = {
- attach(context) {
- function clickPreviewModal(event) {
- // Only confirm leaving previews when left-clicking and user is not
- // pressing the ALT, CTRL, META (Command key on the Macintosh keyboard)
- // or SHIFT key.
- if (
- event.button === 0 &&
- !event.altKey &&
- !event.ctrlKey &&
- !event.metaKey &&
- !event.shiftKey
- ) {
- event.preventDefault();
- const $previewDialog = $(
- `<div>${Drupal.theme('nodePreviewModal')}</div>`,
- ).appendTo('body');
- Drupal.dialog($previewDialog, {
- title: Drupal.t('Leave preview?'),
- buttons: [
- {
- text: Drupal.t('Cancel'),
- click() {
- $(this).dialog('close');
- },
- },
- {
- text: Drupal.t('Leave preview'),
- click() {
- window.top.location.href = event.target.href;
- },
- },
- ],
- }).showModal();
- }
- }
- const $preview = $(context).once('node-preview');
- if ($(context).find('.node-preview-container').length) {
- $preview.on(
- 'click.preview',
- 'a:not([href^="#"], .node-preview-container a)',
- clickPreviewModal,
- );
- }
- },
- detach(context, settings, trigger) {
- if (trigger === 'unload') {
- const $preview = $(context)
- .find('.content')
- .removeOnce('node-preview');
- if ($preview.length) {
- $preview.off('click.preview');
- }
- }
- },
- };
- /**
- * Switch view mode.
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Attaches automatic submit on `formUpdated.preview` events.
- */
- Drupal.behaviors.nodePreviewSwitchViewMode = {
- attach(context) {
- const $autosubmit = $(context)
- .find('[data-drupal-autosubmit]')
- .once('autosubmit');
- if ($autosubmit.length) {
- $autosubmit.on('formUpdated.preview', function() {
- $(this.form).trigger('submit');
- });
- }
- },
- };
- /**
- * Theme function for node preview modal.
- *
- * @return {string}
- * Markup for the node preview modal.
- */
- Drupal.theme.nodePreviewModal = function() {
- return `<p>${Drupal.t(
- 'Leaving the preview will cause unsaved changes to be lost. Are you sure you want to leave the preview?',
- )}</p><small class="description">${Drupal.t(
- 'CTRL+Left click will prevent this dialog from showing and proceed to the clicked link.',
- )}</small>`;
- };
- })(jQuery, Drupal);
|