AfformGui - Improve dragging & dropping with more space & clearer borders

[civicrm-core.git] / ext / afform / admin / ang / afGuiEditor / elements / afGuiContainer.component.js

diff --git a/ext/afform/admin/ang/afGuiEditor/elements/afGuiContainer.component.js b/ext/afform/admin/ang/afGuiEditor/elements/afGuiContainer.component.js
index 963a68eab23b065b922bab6dc8e980636427c430..0b4d6a4d019d2f8a919756141866340fba1d6d0c 100644 (file)
--- a/ext/afform/admin/ang/afGuiEditor/elements/afGuiContainer.component.js
+++ b/ext/afform/admin/ang/afGuiEditor/elements/afGuiContainer.component.js
@@ -12,7 +12,7 @@
     },
     require: {editor: '^^afGuiEditor'},
     controller: function($scope, crmApi4, dialogService, afGui) {
-      var ts = $scope.ts = CRM.ts(),
+      var ts = $scope.ts = CRM.ts('org.civicrm.afform_admin'),
         ctrl = this;
 
       this.$onInit = function() {
@@ -38,6 +38,14 @@
         }
       };
 
+      this.sortableOptions = {
+        handle: '.af-gui-bar',
+        connectWith: '[ui-sortable]',
+        cancel: 'input,textarea,button,select,option,a,.dropdown-menu',
+        placeholder: 'af-gui-dropzone',
+        containment: '#afGuiEditor-canvas-body'
+      };
+
       $scope.isSelectedFieldset = function(entityName) {
         return entityName === ctrl.editor.getSelectedEntityName();
       };