From 266138d28c23ee49414a64e3fc24608e5bca6fb2 Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 22:50:16 +0200 Subject: [PATCH 1/8] Changed the $movePosition to relative positionning Simple but more efficient validation of the position range Relative $movePosition for drag and drop with sortGroups (because drag and drop doesn't actually works with sortGroups) That's a quick fix, I'm planning to use the data-group as a filter for the actual index --- Services/PositionHandler.php | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) diff --git a/Services/PositionHandler.php b/Services/PositionHandler.php index 8e966d6..20ebb19 100644 --- a/Services/PositionHandler.php +++ b/Services/PositionHandler.php @@ -114,35 +114,29 @@ public function getPosition($object, $movePosition, $lastPosition) switch ($movePosition) { case 'up' : - if ($currentPosition > 0) { $newPosition = $currentPosition - 1; - } break; case 'down': - if ($currentPosition < $lastPosition) { $newPosition = $currentPosition + 1; - } break; case 'top': - if ($currentPosition > 0) { $newPosition = 0; - } break; case 'bottom': - if ($currentPosition < $lastPosition) { $newPosition = $lastPosition; - } break; default: if (is_numeric($movePosition)) { - $newPosition = $movePosition; + $newPosition = $currentPosition + $movePosition; } } + //Asserts the position is in the range + $newPosition = max(0, min($newPosition, $lastPosition)); return $newPosition; } From 374d90f8f94d194805b66b9cd675ff4282080b62 Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 23:00:52 +0200 Subject: [PATCH 2/8] NEW_POSITION sended relatively to previous pos --- Resources/public/js/init.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/Resources/public/js/init.js b/Resources/public/js/init.js index f2de988..fc5904e 100644 --- a/Resources/public/js/init.js +++ b/Resources/public/js/init.js @@ -17,6 +17,7 @@ var DraggableTable = function () { }; DraggableTable.prototype.init = function (node, settings) { + var prevPosition = 0; $(node).sortable({ 'handle': '.js-sortable-move', 'axis': 'y', @@ -33,13 +34,16 @@ DraggableTable.prototype.init = function (node, settings) { }); return ui; }, + 'start': function(event, ui) { + prevPosition = ui.item.index(); + }, 'update': function(event, ui) { var moved = $(ui.item).find('.js-sortable-move'); var newPosition = ui.item.index(); $.ajax({ 'type': 'GET', - 'url': moved.data('url').replace('NEW_POSITION', newPosition), + 'url': moved.data('url').replace('NEW_POSITION', newPosition - prevPosition), 'dataType': 'json', 'success': function(data) { $(document).trigger("pixSortableBehaviorBundle.success", [data]); @@ -51,4 +55,4 @@ DraggableTable.prototype.init = function (node, settings) { } }).disableSelection(); -}; \ No newline at end of file +}; From b0cf88584116544de3233b28ddcf7308e6f88bac Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 23:31:51 +0200 Subject: [PATCH 3/8] More flexible sortGroup --- Resources/public/js/init.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/Resources/public/js/init.js b/Resources/public/js/init.js index fc5904e..5eb837e 100644 --- a/Resources/public/js/init.js +++ b/Resources/public/js/init.js @@ -17,7 +17,6 @@ var DraggableTable = function () { }; DraggableTable.prototype.init = function (node, settings) { - var prevPosition = 0; $(node).sortable({ 'handle': '.js-sortable-move', 'axis': 'y', @@ -34,22 +33,28 @@ DraggableTable.prototype.init = function (node, settings) { }); return ui; }, - 'start': function(event, ui) { - prevPosition = ui.item.index(); - }, 'update': function(event, ui) { var moved = $(ui.item).find('.js-sortable-move'); var newPosition = ui.item.index(); + groups = moved.data('group'); + if (groups) { + var list = $(ui.item).parent().children() + group = list.filter(function() { + return $(this).find('.js-sortable-move').data("group") == groups; + }); + newPosition = group.index(ui.item); + } + $.ajax({ 'type': 'GET', - 'url': moved.data('url').replace('NEW_POSITION', newPosition - prevPosition), + 'url': moved.data('url').replace('NEW_POSITION', newPosition), 'dataType': 'json', 'success': function(data) { $(document).trigger("pixSortableBehaviorBundle.success", [data]); }, 'error': function(data) { - $(document).trigger("pixSortableBehaviorBundle.error",[data]); + $(document).trigger("pixSortableBehaviorBundle.error", [data]); } }); From 8b322dbd2bac38318c409d86d1a8d9776bd3a51d Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 23:33:44 +0200 Subject: [PATCH 4/8] Back to absolute positionning --- Services/PositionHandler.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Services/PositionHandler.php b/Services/PositionHandler.php index 20ebb19..85e4de2 100644 --- a/Services/PositionHandler.php +++ b/Services/PositionHandler.php @@ -131,7 +131,7 @@ public function getPosition($object, $movePosition, $lastPosition) default: if (is_numeric($movePosition)) { - $newPosition = $currentPosition + $movePosition; + $newPosition = $movePosition; } } From 0fdc33c293dbcd40aeffc60facad52b2f1b04de9 Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 23:40:49 +0200 Subject: [PATCH 5/8] New data-group for js-sortable-move Data group for sortGroups directly inside twig template so the group can be used in init.js You need to call the template like this now : $listMapper->add('_action', 'actions', array( 'actions' => array( 'move' => array( 'template' => 'PixSortableBehaviorBundle:Default:_sort_drag_drop.html.twig', 'enable_top_bottom_buttons' => false, 'groups' => array('parent') //Array of sortGroups goes here ) ))); It will generate a unique data-group signature for the groups of the form (groupFieldName~FieldID~groupFieldName~FieldID~...) --- Resources/views/Default/_sort_drag_drop.html.twig | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/Resources/views/Default/_sort_drag_drop.html.twig b/Resources/views/Default/_sort_drag_drop.html.twig index e88baed..2634f6b 100644 --- a/Resources/views/Default/_sort_drag_drop.html.twig +++ b/Resources/views/Default/_sort_drag_drop.html.twig @@ -2,9 +2,11 @@ {% set current_position = currentObjectPosition(object) %} {% set last_position = lastPosition(object) %} {% set enable_top_bottom_buttons = field_description.options.actions.move.enable_top_bottom_buttons ?? true %} + {% set groups = field_description.options.actions.move.groups %} - - + From 0ee27dd87b954eee55f431021722b61db0bfef12 Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Mon, 12 Jun 2017 23:59:43 +0200 Subject: [PATCH 6/8] Updated README to reflect changes + error fix --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 5efa291..90b2120 100644 --- a/README.md +++ b/README.md @@ -24,12 +24,12 @@ pix_sortable_behavior: AppBundle/Entity/Baz: rang sortable_groups: entities: - AppBundle/Entity/Baz: [ group ] + AppBundle/Entity/Baz: [ group ] # ``` #### Use a draggable list instead of up/down buttons -In order to use a draggable list instead of up/down buttons, change the template in the ```move``` action to ```AppBundle:Admin:_sort_drag_drop.html.twig```. +In order to use a draggable list instead of up/down buttons, change the template in the ```move``` action to ```PixSortableBehaviorBundle:Default:_sort_drag_drop.html.twig```. ```php add('_action', null, array( 'actions' => array( 'move' => array( - 'template' => 'AppBundle:Admin:_sort_drag_drop.html.twig', + 'template' => 'PixSortableBehaviorBundle:Default:_sort_drag_drop.html.twig', 'enable_top_bottom_buttons' => true, //optional + 'groups' => array('group') //only if you've defined a sortable group for your entity in the config ), ), )) @@ -78,8 +79,9 @@ pixSortableBehaviorBundle.error ->add('_action', null, array( 'actions' => array( 'move' => array( - 'template' => 'AppBundle:Admin:_sort.html.twig', - 'enable_top_bottom_buttons' => true, + 'template' => 'PixSortableBehaviorBundle:Default:_sort.html.twig', + 'enable_top_bottom_buttons' => false, //Disabled buttons + 'groups' => array('group') //only if you've defined a sortable group for your entity in the config ), ), )) From 0b2680ee49c42a016683496ee9870283c6dda8d9 Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Tue, 13 Jun 2017 00:01:19 +0200 Subject: [PATCH 7/8] Create README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 90b2120..9b384fe 100644 --- a/README.md +++ b/README.md @@ -24,7 +24,7 @@ pix_sortable_behavior: AppBundle/Entity/Baz: rang sortable_groups: entities: - AppBundle/Entity/Baz: [ group ] # + AppBundle/Entity/Baz: [ group ] #Sortable groups goes here or in your doctrine mapping if you use Gedmo ``` From 49c53f12f948a28b00d814c145238da7ee59546f Mon Sep 17 00:00:00 2001 From: Adrien Foulon Date: Tue, 13 Jun 2017 00:16:00 +0200 Subject: [PATCH 8/8] Added backward compatibility (groups is now optionnal) --- Resources/views/Default/_sort_drag_drop.html.twig | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/Resources/views/Default/_sort_drag_drop.html.twig b/Resources/views/Default/_sort_drag_drop.html.twig index 2634f6b..018dd50 100644 --- a/Resources/views/Default/_sort_drag_drop.html.twig +++ b/Resources/views/Default/_sort_drag_drop.html.twig @@ -2,7 +2,9 @@ {% set current_position = currentObjectPosition(object) %} {% set last_position = lastPosition(object) %} {% set enable_top_bottom_buttons = field_description.options.actions.move.enable_top_bottom_buttons ?? true %} - {% set groups = field_description.options.actions.move.groups %} + {% if field_description.options.actions.move.groups is defined %} + {% set groups = field_description.options.actions.move.groups %} + {% endif %}