www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/layout_builder/js/layout-builder.es6.js

   1 (($, { ajax, behaviors }) => {
   2   behaviors.layoutBuilder = {
   3     attach(context) {
   4       $(context).find('.layout-builder--layout__region').sortable({
   5         items: '> .draggable',
   6         connectWith: '.layout-builder--layout__region',
   7
   8         /**
   9          * Updates the layout with the new position of the block.
  10          *
  11          * @param {jQuery.Event} event
  12          *   The jQuery Event object.
  13          * @param {Object} ui
  14          *   An object containing information about the item being sorted.
  15          */
  16         update(event, ui) {
  17           // Check if the region from the event and region for the item match.
  18           const itemRegion = ui.item.closest('.layout-builder--layout__region');
  19           if (event.target === itemRegion[0]) {
  20             // Find the destination delta.
  21             const deltaTo = ui.item.closest('[data-layout-delta]').data('layout-delta');
  22             // If the block didn't leave the original delta use the destination.
  23             const deltaFrom = ui.sender ? ui.sender.closest('[data-layout-delta]').data('layout-delta') : deltaTo;
  24             ajax({
  25               url: [
  26                 ui.item.closest('[data-layout-update-url]').data('layout-update-url'),
  27                 deltaFrom,
  28                 deltaTo,
  29                 itemRegion.data('region'),
  30                 ui.item.data('layout-block-uuid'),
  31                 ui.item.prev('[data-layout-block-uuid]').data('layout-block-uuid'),
  32               ]
  33               .filter(element => element !== undefined)
  34               .join('/'),
  35             }).execute();
  36           }
  37         },
  38       });
  39     },
  40   };
  41 })(jQuery, Drupal);