X-Git-Url: http://www.aleph1.co.uk/gitweb/?p=yaffs-website;a=blobdiff_plain;f=web%2Fcore%2Fmodules%2Flayout_builder%2Fjs%2Flayout-builder.es6.js;fp=web%2Fcore%2Fmodules%2Flayout_builder%2Fjs%2Flayout-builder.es6.js;h=cdb5bee76299a4604b55a404a6856e78a554cfee;hp=0000000000000000000000000000000000000000;hb=af6d1fb995500ae68849458ee10d66abbdcfb252;hpb=680c79a86e3ed402f263faeac92e89fb6d9edcc0

diff --git a/web/core/modules/layout_builder/js/layout-builder.es6.js b/web/core/modules/layout_builder/js/layout-builder.es6.js
new file mode 100644
index 000000000..cdb5bee76
--- /dev/null
+++ b/web/core/modules/layout_builder/js/layout-builder.es6.js
@@ -0,0 +1,41 @@
+(($, { ajax, behaviors }) => {
+  behaviors.layoutBuilder = {
+    attach(context) {
+      $(context).find('.layout-builder--layout__region').sortable({
+        items: '> .draggable',
+        connectWith: '.layout-builder--layout__region',
+
+        /**
+         * Updates the layout with the new position of the block.
+         *
+         * @param {jQuery.Event} event
+         *   The jQuery Event object.
+         * @param {Object} ui
+         *   An object containing information about the item being sorted.
+         */
+        update(event, ui) {
+          // Check if the region from the event and region for the item match.
+          const itemRegion = ui.item.closest('.layout-builder--layout__region');
+          if (event.target === itemRegion[0]) {
+            // Find the destination delta.
+            const deltaTo = ui.item.closest('[data-layout-delta]').data('layout-delta');
+            // If the block didn't leave the original delta use the destination.
+            const deltaFrom = ui.sender ? ui.sender.closest('[data-layout-delta]').data('layout-delta') : deltaTo;
+            ajax({
+              url: [
+                ui.item.closest('[data-layout-update-url]').data('layout-update-url'),
+                deltaFrom,
+                deltaTo,
+                itemRegion.data('region'),
+                ui.item.data('layout-block-uuid'),
+                ui.item.prev('[data-layout-block-uuid]').data('layout-block-uuid'),
+              ]
+              .filter(element => element !== undefined)
+              .join('/'),
+            }).execute();
+          }
+        },
+      });
+    },
+  };
+})(jQuery, Drupal);