Merge pull request #98 from gitmonkee/feature/drupal-10-compatibility

Feature/drupal 10 compatibility
govCMS · Aug 29, 2023 · 3b10b1b · 3b10b1b
2 parents 23ef25e + 21a0306
commit 3b10b1b
Show file tree

Hide file tree

Showing 15 changed files with 77 additions and 63 deletions.
diff --git a/dvf.info.yml b/dvf.info.yml
@@ -2,5 +2,4 @@ name: Data Visualisation Framework
 description: 'Data Visualisation Framework makes it easy to generate visualisations from different data sources.'
 type: module
 package: Data Visualisation Framework
-core: 8.x
-core_version_requirement: ^8 || ^9
+core_version_requirement: ^9 || ^10
diff --git a/dvf.libraries.yml b/dvf.libraries.yml
@@ -6,10 +6,10 @@ billboard:
     url: https://github.com/naver/billboard.js/blob/master/LICENSE
     gpl-compatible: true
   js:
-    https://cdnjs.cloudflare.com/ajax/libs/billboard.js/3.0.3/billboard.min.js: { type: external, minified: true }
+    https://cdnjs.cloudflare.com/ajax/libs/billboard.js/3.9.3/billboard.min.js: { type: external, minified: true }
   css:
     component:
-      https://cdnjs.cloudflare.com/ajax/libs/billboard.js/3.0.3/billboard.min.css: { type: external, minified: true }
+      https://cdnjs.cloudflare.com/ajax/libs/billboard.js/3.9.3/billboard.min.css: { type: external, minified: true }
 
 d3:
   remote: https://github.com/d3/d3
@@ -19,7 +19,7 @@ d3:
     url: https://github.com/d3/d3/blob/master/LICENSE
     gpl-compatible: true
   js:
-    https://cdnjs.cloudflare.com/ajax/libs/d3/6.7.0/d3.min.js: { type: external, minified: true }
+    https://cdnjs.cloudflare.com/ajax/libs/d3/7.8.5/d3.min.js: { type: external, minified: true }
 
 datatables:
   remote: https://github.com/DataTables/DataTables
@@ -29,10 +29,10 @@ datatables:
     url: https://github.com/DataTables/DataTables/blob/master/license.txt
     gpl-compatible: true
   js:
-    https://cdn.datatables.net/v/dt/dt-1.10.25/datatables.min.js: { type: external, minified: true }
+    https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js: { type: external, minified: true }
   css:
     component:
-      https://cdn.datatables.net/v/dt/dt-1.10.25/datatables.min.css: { type: external, minified: true }
+      https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css: { type: external, minified: true }
 
 filesaver:
   remote: https://github.com/eligrey/FileSaver.js
@@ -41,7 +41,7 @@ filesaver:
     name: MIT
     url: https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md
   js:
-    https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js: { type: external, minified: true }
+    https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js: { type: external, minified: true }
 
 jquery.dvfCharts:
   version: "1.0.0"
@@ -51,6 +51,7 @@ jquery.dvfCharts:
   dependencies:
     - core/jquery
     - core/drupal
+    - core/once
     - core/drupalSettings
     - dvf/d3
     - dvf/billboard
@@ -62,21 +63,23 @@ dvfCharts:
     js/dvfCharts.js: {}
   dependencies:
     - dvf/jquery.dvfCharts
+    - core/once
 
 dvfTables:
   version: "1.0.0"
   js:
     js/dvfTables.js: {}
   dependencies:
     - dvf/jquery.dvfTables
+    - core/once
 
 jquery.dvfTables:
   version: "1.0.0"
   js:
     js/jquery.dvfTables.js: {}
   dependencies:
-    - core/jquery
     - core/drupal
+    - core/jquery
     - core/drupalSettings
     - dvf/datatables
 

diff --git a/dvf_ckan/dvf_ckan.info.yml b/dvf_ckan/dvf_ckan.info.yml
@@ -2,8 +2,7 @@ name: CKAN Data Visualisation
 description: 'CKAN integration for the Data Visualisation Framework module.'
 type: module
 package: Data Visualisation Framework
-core: 8.x
-core_version_requirement: ^8 || ^9
+core_version_requirement: ^9 || ^10
 dependencies:
   - ckan_connect:ckan_connect
   - dvf:dvf
diff --git a/dvf_csv/dvf_csv.info.yml b/dvf_csv/dvf_csv.info.yml
@@ -2,7 +2,6 @@ name: CSV Data Visualisation
 description: 'CSV integration for the Data Visualisation Framework module.'
 type: module
 package: Data Visualisation Framework
-core: 8.x
-core_version_requirement: ^8 || ^9
+core_version_requirement: ^9 || ^10
 dependencies:
   - dvf:dvf
diff --git a/dvf_json/dvf_json.info.yml b/dvf_json/dvf_json.info.yml
@@ -2,7 +2,6 @@ name: JSON Data Visualisation
 description: 'JSON integration for the Data Visualisation Framework module.'
 type: module
 package: Data Visualisation Framework
-core: 8.x
-core_version_requirement: ^8 || ^9
+core_version_requirement: ^9 || ^10
 dependencies:
   - dvf:dvf
diff --git a/js/dvfCharts.js b/js/dvfCharts.js
@@ -1,4 +1,4 @@
-;(function ($, Drupal, drupalSettings) {
+;(function ($, Drupal, once, drupalSettings) {
 
   'use strict';
 
@@ -7,12 +7,12 @@
    */
   Drupal.behaviors.dvfCharts = {
     attach: function (context) {
-      $('[data-dvfcharts]', context).once('dvf-charts').each(function () {
-        var $chart = $(this),
+      once('dvf-charts', '[data-dvfcharts]', context).forEach(element => {
+        var $chart = $(element),
             chartId = $chart.data('dvfcharts');
         $chart.dvfCharts(drupalSettings.dvf.charts[chartId]);
       });
     }
   };
 
-})(jQuery, Drupal, drupalSettings);
+})(jQuery, Drupal, once, drupalSettings);
diff --git a/js/dvfTables.js b/js/dvfTables.js
@@ -1,4 +1,4 @@
-;(function ($, Drupal, drupalSettings) {
+;(function ($, Drupal, once, drupalSettings) {
 
   'use strict';
 
@@ -7,9 +7,9 @@
    */
   Drupal.behaviors.dvfTables = {
     attach: function (context) {
-      $('[data-dvftables]', context).once('dvf-tables').each(function () {
-        var $table = $(this),
-            tableId = $table.data('dvftables');
+      once('dvf-tables', '[data-dvftables]', context).forEach(element => {
+        var $table = $(element),
+          tableId = $table.data('dvftables');
         $table.dvfTables(drupalSettings.dvf.tables[tableId]);
       });
     }
@@ -22,12 +22,14 @@
    */
   Drupal.behaviors.dvfTablesDownloadData = {
     attach: function (context) {
-      $('.dvf-table--wrapper .download-data', context).once('download-data').each(function () {
-        $(this).click(function() {
-          window.open($(this).data('file-uri'));
+      once('download-data', '.dvf-table--wrapper .download-data', context).forEach(element => {
+        var $downloadButton = $(element);
+
+        $($downloadButton).click(function() {
+          window.open($($downloadButton).data('file-uri'));
         });
       });
     }
   }
 
-})(jQuery, Drupal, drupalSettings);
+})(jQuery, Drupal, once, drupalSettings);
diff --git a/js/jquery.dvfCharts.js b/js/jquery.dvfCharts.js
@@ -1,4 +1,4 @@
-;(function ($, bb) {
+;(function ($, bb, once) {
 
   'use strict';
 
@@ -405,10 +405,10 @@
 
       var self = this,
           buttonTypes = ['png', 'svg'],
-          $chartWrapper = $(this.element).closest('.dvf--wrapper');
+          $chartWrapper = this.element.closest('.dvf--wrapper');
 
       // For each chart, add download buttons.
-      $chartWrapper.once('download-buttons').each(function(i, el){
+      once('download-buttons', $chartWrapper ).forEach(el => {
         var $buttonWrapper = $(el).find('.table-chart--actions'),
           $chart = $(el).find('.dvf-chart svg');
 
@@ -430,10 +430,9 @@
             .appendTo($buttonWrapper);
         })
 
-        // Set download data click listener.
-        $('.download-data', $buttonWrapper).once('download-data').each(function(i, dlEl) {
-          $(this).on('click', function() {
-            window.open($(this).data('file-uri'));
+        once('download-data', '.table-chart--actions .download-data').forEach(element => {
+          $(element).on('click', function() {
+            window.open($(element).data('file-uri'));
           });
         })
       });
@@ -447,10 +446,10 @@
      * @returns {Plugin}
      */
     addToggleTableButton: function () {
-      var $chartWrapper = $(this.element).closest('.dvf--wrapper');
+      var $chartWrapper = this.element.closest('.dvf--wrapper');
 
       // For each chart, add download buttons.
-      $chartWrapper.once('table-toggle').each(function(i, el){
+      once('table-toggle', $chartWrapper).forEach(el => {
         var $buttonWrapper = $(el).find('.table-chart--actions');
 
         if ( $('.dvf-table', el).length === 0) {
@@ -615,4 +614,4 @@
     });
   };
 
-})(jQuery, bb);
+})(jQuery, bb, once);
diff --git a/src/DvfHelpers.php b/src/DvfHelpers.php
@@ -2,8 +2,6 @@
 
 namespace Drupal\dvf;
 
-use Drupal\Core\Link;
-use Drupal\Core\Url;
 use Drupal\Component\Render\FormattableMarkup;
 
 /**
@@ -50,8 +48,7 @@ public function transformMachineName($string) {
    *   The link.
    */
   public function getHelpPageLink($template_name) {
-    $link = Link::fromTextAndUrl('Help', Url::fromUserInput($this->helpPageBasePath . $template_name));
-    return new FormattableMarkup('<span class="dvf-admin-popup">' . $link->toString() . ' &#x29c9;</span>', []);
+    return new FormattableMarkup('<span class="dvf-admin-popup"><a href="/dvf/help/@template_name">Help</a> &#x29c9;</span>', ['@template_name' => $template_name]);
   }
 
   /**

diff --git a/src/FieldWidgetTrait.php b/src/FieldWidgetTrait.php
@@ -123,7 +123,7 @@ protected function getAjaxWrapperId(array $form, $field_name, $delta) {
     $parents = !empty($form['#parents']) ? $form['#parents'] : [];
     $id_prefix = implode('-', array_merge($parents, [$field_name, $delta]));
 
-    return Html::getUniqueId($id_prefix . '-dvf-options');
+    return $id_prefix . '-dvf-options';
   }
 
 }
diff --git a/src/Plugin/Field/FieldWidget/VisualisationFileWidget.php b/src/Plugin/Field/FieldWidget/VisualisationFileWidget.php
@@ -99,6 +99,8 @@ public function formElement(FieldItemListInterface $items, $delta, array $elemen
       '#tree' => TRUE,
     ];
 
+    $ajaxWrapperId = $this->getAjaxWrapperId($form, $this->fieldDefinition->getName(), $delta);
+
     $element['options']['visualisation_style'] = [
       '#type' => 'select',
       '#title' => $this->t('Visualisation style'),
@@ -110,13 +112,13 @@ public function formElement(FieldItemListInterface $items, $delta, array $elemen
       '#required' => $element['#required'],
       '#ajax' => [
         'callback' => [$this, 'updateVisualisationOptions'],
-        'wrapper' => $this->getAjaxWrapperId($form, $this->fieldDefinition->getName(), $delta),
+        'wrapper' => $ajaxWrapperId,
       ],
     ];
 
     $element['options']['visualisation_style_options'] = [
       '#type' => 'container',
-      '#attributes' => ['id' => $element['options']['visualisation_style']['#ajax']['wrapper']],
+      '#attributes' => ['id' => $ajaxWrapperId],
     ];
 
     $style_id = $this->getElementOptions($items, $delta, $form, $form_state, 'visualisation_style');

diff --git a/src/Plugin/Field/FieldWidget/VisualisationUrlWidget.php b/src/Plugin/Field/FieldWidget/VisualisationUrlWidget.php
@@ -70,6 +70,8 @@ public function formElement(FieldItemListInterface $items, $delta, array $elemen
       '#tree' => TRUE,
     ];
 
+    $ajaxWrapperId = $this->getAjaxWrapperId($form, $this->fieldDefinition->getName(), $delta);
+
     $element['options']['visualisation_style'] = [
       '#type' => 'select',
       '#title' => $this->t('Visualisation style'),
@@ -81,13 +83,13 @@ public function formElement(FieldItemListInterface $items, $delta, array $elemen
       '#required' => $element['#required'],
       '#ajax' => [
         'callback' => [$this, 'updateVisualisationOptions'],
-        'wrapper' => $this->getAjaxWrapperId($form, $this->fieldDefinition->getName(), $delta),
+        'wrapper' => $ajaxWrapperId,
       ],
     ];
 
     $element['options']['visualisation_style_options'] = [
       '#type' => 'container',
-      '#attributes' => ['id' => $element['options']['visualisation_style']['#ajax']['wrapper']],
+      '#attributes' => ['id' => $ajaxWrapperId],
     ];
 
     $style_id = $this->getElementOptions($items, $delta, $form, $form_state, 'visualisation_style');

diff --git a/src/Plugin/Visualisation/Source/VisualisationSourceBase.php b/src/Plugin/Visualisation/Source/VisualisationSourceBase.php
@@ -197,42 +197,42 @@ protected function getIterator() {
   /**
    * {@inheritdoc}
    */
-  public function current() {
+  public function current(): mixed {
     return $this->getIterator()->current();
   }
 
   /**
    * {@inheritdoc}
    */
-  public function next() {
+  public function next(): void {
     $this->getIterator()->next();
   }
 
   /**
    * {@inheritdoc}
    */
-  public function key() {
+  public function key(): mixed {
     return $this->getIterator()->key();
   }
 
   /**
    * {@inheritdoc}
    */
-  public function valid() {
+  public function valid(): bool {
     return $this->getIterator()->valid();
   }
 
   /**
    * {@inheritdoc}
    */
-  public function rewind() {
+  public function rewind(): void {
     $this->getIterator()->rewind();
   }
 
   /**
    * {@inheritdoc}
    */
-  public function count() {
+  public function count(): int {
     $iterator = $this->getIterator();
     return ($iterator instanceof \Countable) ? $iterator->count() : iterator_count($this->initializeIterator());
   }

diff --git a/src/Plugin/Visualisation/Style/AxisChart.php b/src/Plugin/Visualisation/Style/AxisChart.php
@@ -192,6 +192,8 @@ public function settingsForm(array $form, FormStateInterface $form_state) {
       '#default_value' => $this->config('axis', 'x', 'tick', 'culling'),
     ];
 
+    $ajaxWrapperId = $form['#attributes']['id'] . '--x-axis-grouping';
+
     $form['axis']['x']['tick']['values']['field'] = [
       '#type' => 'select',
       '#title' => $this->t('Tick values field'),
@@ -202,7 +204,7 @@ public function settingsForm(array $form, FormStateInterface $form_state) {
       '#default_value' => $this->config('axis', 'x', 'tick', 'values', 'field'),
       '#ajax' => [
         'callback' => [$this, 'updateAxisGrouping'],
-        'wrapper' => 'x-axis-grouping',
+        'wrapper' => $ajaxWrapperId,
       ],
     ];
 
@@ -214,7 +216,7 @@ public function settingsForm(array $form, FormStateInterface $form_state) {
     ];
 
     $form['axis']['x']['x_axis_grouping'] = [
-      '#prefix' => '<div id="x-axis-grouping">',
+      '#prefix' => "<div id=$ajaxWrapperId>",
       '#suffix' => '</div>',
       '#type' => 'select',
       '#title' => $this->t('X Axis Grouping'),
@@ -234,6 +236,8 @@ public function settingsForm(array $form, FormStateInterface $form_state) {
 
     if (!$this->config('axis', 'x', 'tick', 'values', 'field')) {
       $form['axis']['x']['x_axis_grouping']['#attributes']['disabled'] = 'disabled';
+    } else {
+      unset($form['axis']['x']['x_axis_grouping']['#attributes']['disabled']);
     }
 
     $form['axis']['x']['tick']['format']['indexed'] = [