diff --git a/.github/workflows/foo.yml b/.github/workflows/test.yml similarity index 97% rename from .github/workflows/foo.yml rename to .github/workflows/test.yml index 9b85840..8f8bc38 100644 --- a/.github/workflows/foo.yml +++ b/.github/workflows/test.yml @@ -24,7 +24,7 @@ jobs: strategy: matrix: THEME: ['claro', 'gin'] - DRUPAL_TESTING_DRUPAL_VERSION: ['~9.1.0'] + DRUPAL_TESTING_DRUPAL_VERSION: ['~9.2.0'] PHP: ['7.4'] steps: diff --git a/config/schema/paragraphs_features.schema.yml b/config/schema/paragraphs_features.schema.yml index 120c126..8f27abc 100644 --- a/config/schema/paragraphs_features.schema.yml +++ b/config/schema/paragraphs_features.schema.yml @@ -16,15 +16,18 @@ paragraphs_features_third_party: delete_confirmation: type: boolean label: 'Flag for delete confirmation feature' + hide_row_weight_sort: + type: boolean + label: 'Flag for hiding row weight sort' + show_drag_and_drop: + type: boolean + label: 'Flag for showing drag & drop button' sorting: type: boolean label: 'Flag for paragraphs checkbox sorting feature' split_text: type: boolean label: 'Flag for paragraphs split text feature' - show_drag_and_drop: - type: boolean - label: 'Flag for showing drag & drop button' field.widget.third_party.paragraphs_features: type: paragraphs_features_third_party diff --git a/css/paragraphs-features.sorting.css b/css/paragraphs-features.sorting.css index 2c30d94..38e6cad 100644 --- a/css/paragraphs-features.sorting.css +++ b/css/paragraphs-features.sorting.css @@ -7,10 +7,6 @@ margin-left: -16px; } -.field-multiple-table.tabledrag-checkbox-active > tbody > tr.draggable > .field-multiple-drag .tabledrag-handle { - display: none; -} - .field-multiple-table .tabledrag-toggle-checkbox-wrapper { float: right; } diff --git a/js/paragraphs-features.delete-confirmation.js b/js/paragraphs-features.delete-confirmation.js index 06c5836..17160d0 100644 --- a/js/paragraphs-features.delete-confirmation.js +++ b/js/paragraphs-features.delete-confirmation.js @@ -54,6 +54,7 @@ var $wrapper = $(event.target).parents('div[id*="-item-wrapper"]').first(); // Hide children. $wrapper.children().toggleClass('visually-hidden'); + $wrapper.parents('.draggable').first().find('.js-tabledrag-cell-content').first().toggleClass('visually-hidden'); // Add markup. $wrapper.append(Drupal.theme('paragraphsFeaturesDeleteConfirmationMessage', {message: Drupal.t('Are you sure you want to remove this paragraph?'), remove: Drupal.t('Remove'), cancel: Drupal.t('Cancel')})); // Add handlers for buttons. @@ -89,6 +90,7 @@ var $wrapper = $(event.target).parents('div[id*="-item-wrapper"]').first(); $wrapper.children('.paragraphs-features__delete-confirmation').first().remove(); $wrapper.children().toggleClass('visually-hidden'); + $wrapper.parents('.draggable').first().find('.js-tabledrag-cell-content').first().toggleClass('visually-hidden'); }; }; diff --git a/js/paragraphs-features.hide-row-weight-sort.js b/js/paragraphs-features.hide-row-weight-sort.js new file mode 100644 index 0000000..db35954 --- /dev/null +++ b/js/paragraphs-features.hide-row-weight-sort.js @@ -0,0 +1,21 @@ +(function ($, Drupal) { + + 'use strict'; + + Drupal.behaviors.paragraphsFeaturesHideRowWeightSort = { + attach: function (context, settings) { + + Object.keys(settings.paragraphs_features.hide_row_weight_sort).forEach(function (paragraphsWidgetId) { + var wrapper = document.querySelector('#' + paragraphsWidgetId); + if (!wrapper) { + return; + } + var table = wrapper.querySelector('.field-multiple-table'); + if (table && Drupal.tableDrag[table.id] && !Drupal.tableDrag[table.id].hideRowWeightSort) { + Drupal.tableDrag[table.id].$toggleWeightButton.hide(); + Drupal.tableDrag[table.id].hideRowWeightSort = true; + } + }); + } + }; +}(jQuery, Drupal)); diff --git a/js/tabledrag.checkbox.js b/js/tabledrag.checkbox.js index d0c5b16..75f5cdb 100644 --- a/js/tabledrag.checkbox.js +++ b/js/tabledrag.checkbox.js @@ -8,26 +8,25 @@ * On click on the sorting button, show/hide the checkboxes and add/remove sorting targets. */ Drupal.tableDrag.prototype.initCkbx = function () { - // build toggle button - this.toggleCheckboxButtonWrapper = $('') - .on('click', $.proxy(function (e) { - e.preventDefault(); + + this.sortCheckbox = $('') + .on('change', $.proxy(function (e) { + // At least one checkbox is checked. + var oneChecked = Array.prototype.slice.call(this.table.querySelectorAll('input.tabledrag-checkbox[type="checkbox"]')) + .some(function (input) { return input.checked; }); + if (!this.$table.hasClass('tabledrag-checkbox-active')) { this.triggerStartEvent(); + this.$table.addClass('tabledrag-checkbox-active'); + this.addSortTargets(); } - this.toggleRelatedButtons(); - this.$table.toggleClass('tabledrag-checkbox-active'); - this.toggleCheckboxes(); - this.toggleSortTargets(); - this.toggleStyleOfCheckboxButton(); - if (!this.$table.hasClass('tabledrag-checkbox-active')) { - this.disableCheckboxes(); + else if (!oneChecked) { + this.removeSortTargets(); + this.$table.removeClass('tabledrag-checkbox-active'); this.triggerEndEvent(); } - }, this)) - .text(Drupal.t('Sort')) - .wrap('
') - .parent(); + + }, this)); this.addInBeetween = !( typeof Drupal.behaviors.paragraphsFeaturesAddInBetweenInit === 'undefined' && @@ -36,24 +35,11 @@ // Add spacer rows. this.addSpacer(); - // add sorting toggle button on top - this.$table.find('> thead > tr > th:first').append(this.toggleCheckboxButtonWrapper); - // add sorting checkbox to items - this.$table.find('> tbody > tr.draggable > .field-multiple-drag .tabledrag-cell-content').prepend( - $('') - .hide() - ); - }; - Drupal.tableDrag.prototype.toggleStyleOfCheckboxButton = function () { - var button = this.toggleCheckboxButtonWrapper.find('button'); - button.toggleClass('button--primary'); - - var text = Drupal.t('Sort'); - if (this.$table.hasClass('tabledrag-checkbox-active')) { - text = Drupal.t('Finish sort'); - } - button.text(text); + // Add sorting checkbox to items. + this.$table.find('tbody > tr.draggable > .field-multiple-drag .tabledrag-handle').hide(); + this.$table.find('> tbody > tr.draggable > .field-multiple-drag .tabledrag-cell-content').prepend(this.sortCheckbox); + this.$table.addClass('tabledrag-checkbox-sort'); }; /** @@ -151,7 +137,10 @@ this.removeSortTargets(); this.sort(row, swapAfter); - this.addSortTargets(); + // End sort, clean up. + this.disableCheckboxes(); + this.$table.removeClass('tabledrag-checkbox-active'); + this.triggerEndEvent(); }, this)) .wrap('