www.aleph1.co.uk Git - yaffs-website/blob - web/modules/contrib/paragraphs/js/paragraphs.modal.js

   1 /**
   2  * @file paragraphs.modal.js
   3  *
   4  */
   5
   6 (function ($, Drupal, drupalSettings) {
   7
   8   'use strict';
   9
  10   /**
  11    * Click handler for click "Add" button between paragraphs.
  12    *
  13    * @type {Object}
  14    */
  15   Drupal.behaviors.paragraphsModalAdd = {
  16     attach: function (context) {
  17       $('.paragraph-type-add-modal-button', context)
  18         .once('add-click-handler')
  19         .on('click', function (event) {
  20           var $button = $(this);
  21           var $add_more_wrapper = $button.parent().siblings('.paragraphs-add-dialog');
  22           Drupal.paragraphsAddModal.openDialog($add_more_wrapper, $button.val());
  23
  24           // Stop default execution of click event.
  25           event.preventDefault();
  26           event.stopPropagation();
  27         });
  28     }
  29   };
  30
  31   /**
  32    * Namespace for modal related javascript methods.
  33    *
  34    * @type {Object}
  35    */
  36   Drupal.paragraphsAddModal = {};
  37
  38   /**
  39    * Open modal dialog for adding new paragraph in list.
  40    *
  41    * @param {Object} $context
  42    *   jQuery element of form wrapper used to submit request for adding new
  43    *   paragraph to list. Wrapper also contains dialog template.
  44    * @param {string} title
  45    *   The title of the modal form window.
  46    */
  47   Drupal.paragraphsAddModal.openDialog = function ($context, title) {
  48
  49     $context.dialog({
  50       modal: true,
  51       resizable: false,
  52       title: title,
  53       width: 'auto',
  54       close: function () {
  55         var $dialog = $(this);
  56
  57         // Destroy dialog object.
  58         $dialog.dialog('destroy');
  59       }
  60     });
  61
  62     // Close the dialog after a button was clicked.
  63     $('.field-add-more-submit', $context)
  64       .each(function () {
  65       // Use mousedown event, because we are using ajax in the modal add mode
  66       // which explicitly suppresses the click event.
  67       $(this).on('mousedown', function () {
  68         var $this = $(this);
  69         $this.closest('div.ui-dialog-content').dialog('close');
  70       });
  71     });
  72   };
  73
  74 }(jQuery, Drupal, drupalSettings));