Merge pull request #12 from pdir/refactor-for-contao-53

refactor code for contao 4.13 and contao 5.3
pdir · Mar 7, 2024 · abe1d8e · abe1d8e
2 parents 9d24f50 + aee9402
commit abe1d8e
Show file tree

Hide file tree

Showing 25 changed files with 157 additions and 107 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -12,7 +12,7 @@ jobs:
             -   name: Setup PHP
                 uses: shivammathur/setup-php@v2
                 with:
-                    php-version: 7.4 # Run with the lowest supported to avoid incompatible fixes
+                    php-version: 8.0 # Run with the lowest supported to avoid incompatible fixes
                     extensions: dom, fileinfo, filter, gd, hash, intl, json, mbstring, mysqli, pcre, pdo_mysql, zlib
                     coverage: none
                 env:
@@ -34,7 +34,7 @@ jobs:
             -   name: Setup PHP
                 uses: shivammathur/setup-php@v2
                 with:
-                    php-version: 7.4
+                    php-version: 8.0
                     extensions: dom, fileinfo, filter, gd, hash, intl, json, mbstring, mysqli, pcre, pdo_mysql, zlib
                     coverage: none
                 env:
@@ -76,25 +76,25 @@ jobs:
 #            -   name: Run the unit tests
 #                run: vendor/bin/phpunit --colors=always
 
-#    nightly:
-#        name: PHP 8.2
-#        runs-on: ubuntu-latest
-#        continue-on-error: true
-#        steps:
-#            -   name: Setup PHP
-#                uses: shivammathur/setup-php@v2
-#                with:
-#                    php-version: 8.2
-#                    extensions: dom, fileinfo, filter, gd, hash, intl, json, mbstring, mysqli, pcre, pdo_mysql, zlib
-#                    coverage: none
-#                env:
-#                    COMPOSER_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-#
-#            -   name: Checkout
-#                uses: actions/checkout@v3
-#
-#            -   name: Install the dependencies
-#                run: composer install --ignore-platform-req=php --no-interaction --no-progress
-#
+    nightly:
+        name: PHP 8.2
+        runs-on: ubuntu-latest
+        continue-on-error: true
+        steps:
+            -   name: Setup PHP
+                uses: shivammathur/setup-php@v2
+                with:
+                    php-version: 8.2
+                    extensions: dom, fileinfo, filter, gd, hash, intl, json, mbstring, mysqli, pcre, pdo_mysql, zlib
+                    coverage: none
+                env:
+                    COMPOSER_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+            -   name: Checkout
+                uses: actions/checkout@v3
+
+            -   name: Install the dependencies
+                run: composer install --ignore-platform-req=php --no-interaction --no-progress
+
 #            -   name: Run the unit tests
 #                run: vendor/bin/phpunit --colors=always
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,6 +10,12 @@ Types of changes
     Security in case of vulnerabilities.
 )
 
+## [1.3.0](https://github.com/contao-themes-net/animated-timeline-bundle/tree/1.3.0) – 2024-02-29
+
+- [Added] Add Contao 5.3 support
+- [Added] Add fields to change content slider settings
+- [Added] Add option to put the navigation on top of the timeline [[#10](https://github.com/pdir/animated-timeline-bundle/issues/10)]
+- [Changed] Requires Contao 4.13 and PHP 8.0 as minimum requirements
 
 ## [1.2.1](https://github.com/contao-themes-net/animated-timeline-bundle/tree/1.2.1) – 2023-06-09
 

diff --git a/composer.json b/composer.json
@@ -15,8 +15,8 @@
         }
     ],
     "require": {
-        "php": "^7.4 || ^8.0",
-        "contao/core-bundle": "^4.4"
+        "php": "^8.0",
+        "contao/core-bundle": "^4.13 || ^5.3"
     },
     "require-dev": {
         "bamarni/composer-bin-plugin": "^1.4",

diff --git a/src/Resources/config/services.yml → config/services.yml b/src/Resources/config/services.yml → config/services.yml
@@ -1,4 +1,8 @@
 services:
+    _defaults:
+        autowire: true
+        autoconfigure: true
+
     _instanceof:
         Contao\CoreBundle\Framework\FrameworkAwareInterface:
             calls:

diff --git a/src/Resources/contao/config/config.php → contao/config/config.php b/src/Resources/contao/config/config.php → contao/config/config.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de
@@ -16,12 +16,13 @@
  * file that was distributed with this source code.
  */
 
+use Contao\ArrayUtil;
 use Pdir\AnimatedTimelineBundle\Element\TimelineSliderElement;
 use Pdir\AnimatedTimelineBundle\Element\TimelineStartElement;
 use Pdir\AnimatedTimelineBundle\Element\TimelineStopElement;
 
 // Insert the mate theme category
-array_insert($GLOBALS['TL_CTE'], 1, ['pdirTimelineSlider' => []]);
+ArrayUtil::arrayInsert($GLOBALS['TL_CTE'], 1, ['pdirTimelineSlider' => []]);
 
 /*
  * Add content element

diff --git a/src/Resources/contao/dca/tl_content.php → contao/dca/tl_content.php b/src/Resources/contao/dca/tl_content.php → contao/dca/tl_content.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de
@@ -16,15 +16,14 @@
  * file that was distributed with this source code.
  */
 
-use Contao\Backend;
 use Contao\BackendUser;
-use Contao\DataContainer;
+use Contao\Controller;
 use Contao\System;
 
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de
@@ -35,9 +34,9 @@
  * file that was distributed with this source code.
  */
 
-$GLOBALS['TL_DCA']['tl_content']['palettes']['timelineSliderElement'] = '{type_legend},type,headline;{text_legend},text;{image_legend},addImage;{content_slider_legend},multiSRC,contentSliderSize;{template_legend:hide},timelineElement_customTpl;{expert_legend:hide},cssID';
+$GLOBALS['TL_DCA']['tl_content']['palettes']['timelineSliderElement'] = '{type_legend},type,headline;{text_legend},text;{image_legend},addImage;{content_slider_legend},multiSRC,sliderDelay,sliderSpeed,sliderStartSlide,sliderContinuous,contentSliderSize,contentSliderFullsize;{template_legend:hide},timelineElement_customTpl;{expert_legend:hide},cssID';
 
-$GLOBALS['TL_DCA']['tl_content']['palettes']['timelineSliderStart'] = '{type_legend},type;{timeline_legend},timeline_orientation,timeline_eventsPerSlide,timeline_prevLabel,timeline_nextLabel;{template_legend:hide},timelineStart_customTpl;{expert_legend:hide},guests,cssID;{invisible_legend:hide},invisible,start,stop';
+$GLOBALS['TL_DCA']['tl_content']['palettes']['timelineSliderStart'] = '{type_legend},type;{timeline_legend},timeline_orientation,timeline_eventsPerSlide,timeline_prevLabel,timeline_nextLabel,timeline_navPos;{template_legend:hide},timelineStart_customTpl;{expert_legend:hide},guests,cssID;{invisible_legend:hide},invisible,start,stop';
 
 $GLOBALS['TL_DCA']['tl_content']['palettes']['timelineSliderStop'] = '{type_legend},type;{template_legend:hide},timelineStop_customTpl;{invisible_legend:hide},invisible,start,stop';
 
@@ -46,7 +45,6 @@
  */
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timeline_orientation'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timeline_orientation'],
     'exclude' => true,
     'inputType' => 'select',
     'options' => &$GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options'],
@@ -55,52 +53,52 @@
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timeline_eventsPerSlide'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timeline_eventsPerSlide'],
     'exclude' => true,
     'inputType' => 'text',
     'eval' => ['maxlength' => 10, 'rgxp' => 'digit', 'tl_class' => 'w50'],
     'sql' => "int(10) unsigned NOT NULL default '0'",
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timeline_prevLabel'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timeline_prevLabel'],
     'exclude' => true,
     'inputType' => 'text',
     'eval' => ['tl_class' => 'w50'],
     'sql' => "TEXT null default 'Zurück'",
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timeline_nextLabel'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timeline_nextLabel'],
     'exclude' => true,
     'inputType' => 'text',
     'eval' => ['tl_class' => 'w50'],
     'sql' => "TEXT null default 'Weiter'",
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timelineElement_customTpl'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timelineElement_customTpl'],
     'exclude' => true,
     'inputType' => 'select',
-    'options_callback' => ['tl_content_timeline', 'getTimelineElementTemplates'],
+    'options_callback' => static function () {
+        return Controller::getTemplateGroup('ce_timeline_element');
+    },
     'eval' => ['includeBlankOption' => true, 'chosen' => true, 'tl_class' => 'w50'],
     'sql' => "varchar(64) NOT NULL default ''",
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timelineStart_customTpl'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timelineStart_customTpl'],
     'exclude' => true,
     'inputType' => 'select',
-    'options_callback' => ['tl_content_timeline', 'getTimelineStartTemplates'],
+    'options_callback' => static function () {
+        return Controller::getTemplateGroup('ce_timeline_start');
+    },
     'eval' => ['includeBlankOption' => true, 'chosen' => true, 'tl_class' => 'w50'],
     'sql' => "varchar(64) NOT NULL default ''",
 ];
 
 $GLOBALS['TL_DCA']['tl_content']['fields']['timelineStop_customTpl'] = [
-    'label' => &$GLOBALS['TL_LANG']['tl_content']['timelineStop_customTpl'],
     'exclude' => true,
     'inputType' => 'select',
-    'options_callback' => ['tl_content_timeline', 'getTimelineStopTemplates'],
+    'options_callback' => static function () {
+        return Controller::getTemplateGroup('ce_timeline_stop');
+    },
     'eval' => ['includeBlankOption' => true, 'chosen' => true, 'tl_class' => 'w50'],
     'sql' => "varchar(64) NOT NULL default ''",
 ];
@@ -111,27 +109,22 @@
     'inputType' => 'imageSize',
     'reference' => &$GLOBALS['TL_LANG']['MSC'],
     'eval' => ['rgxp' => 'natural', 'includeBlankOption' => true, 'nospace' => true, 'helpwizard' => true, 'tl_class' => 'w50'],
-    'options_callback' => static fn () => System::getContainer()->get('contao.image.image_sizes')->getOptionsForUser(BackendUser::getInstance()),
+    'options_callback' => static fn () => System::getContainer()->get('contao.image.sizes')->getOptionsForUser(BackendUser::getInstance()),
     'sql' => 'TEXT null',
 ];
 
-class tl_content_timeline extends Backend
-{
-    /**
-     * Return all content element templates as array.
-     */
-    public function getTimelineElementTemplates(DataContainer $dc): array
-    {
-        return $this->getTemplateGroup('ce_timeline_element');
-    }
-
-    public function getTimelineStartTemplates(DataContainer $dc): array
-    {
-        return $this->getTemplateGroup('ce_timeline_start');
-    }
-
-    public function getTimelineStopTemplates(DataContainer $dc): array
-    {
-        return $this->getTemplateGroup('ce_timeline_stop');
-    }
-}
+$GLOBALS['TL_DCA']['tl_content']['fields']['contentSliderFullsize'] = [
+    'inputType' => 'checkbox',
+    'eval' => ['tl_class'=>'w50'],
+    'sql' => $GLOBALS['TL_DCA']['tl_content']['fields']['fullsize']['sql'],
+];
+
+$GLOBALS['TL_DCA']['tl_content']['fields']['timeline_navPos'] = [
+    'exclude' => true,
+    'inputType' => 'select',
+    'options' => &$GLOBALS['TL_LANG']['tl_content']['timeline_navPos']['options'],
+    'eval' => ['chosen' => true, 'tl_class' => 'w50'],
+    'sql' => 'TEXT null default "bottom"',
+];
+
+$GLOBALS['TL_DCA']['tl_content']['fields']['multiSRC']['eval']['isGallery'] = 'true';
diff --git a/...Resources/contao/languages/de/default.php → contao/languages/de/default.php b/...Resources/contao/languages/de/default.php → contao/languages/de/default.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de

diff --git a/...ources/contao/languages/de/tl_content.php → contao/languages/de/tl_content.php b/...ources/contao/languages/de/tl_content.php → contao/languages/de/tl_content.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de
@@ -22,9 +22,13 @@
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['horizontal'] = 'Horizontal';
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['vertical'] = 'Vertikal';
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['auto'] = 'Auto';
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos'] = ['Navigation Position', 'Wählen Sie hier aus ob die Navigation unten oder oben stehen soll.'];
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos']['options']['top'] = 'oben';
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos']['options']['bottom'] = 'unten';
 $GLOBALS['TL_LANG']['tl_content']['timeline_eventsPerSlide'] = ['Elemente pro Slide', 'Geben Sie hier die Anzahl der Elemente ein, die pro Slide dargestellt werden.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineElement_customTpl'] = ['Individuelles Template', 'Hier können Sie ein individuelles Template auswählen.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineStart_customTpl'] = ['Individuelles Template', 'Hier können Sie ein individuelles Template auswählen.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineStop_customTpl'] = ['Individuelles Template', 'Hier können Sie ein individuelles Template auswählen.'];
 $GLOBALS['TL_LANG']['tl_content']['timeline_prevLabel'] = ['Zurück-Button', 'Hier können Sie definieren was angezeigt werden soll, wenn der Zurück-Button angezeigt wird.'];
 $GLOBALS['TL_LANG']['tl_content']['timeline_nextLabel'] = ['Weiter-Button', 'Hier können Sie definieren was angezeigt werden soll, wenn der Weiter-Button angezeigt wird.'];
+$GLOBALS['TL_LANG']['tl_content']['contentSliderFullsize'] = ['Großansicht/Neues Fenster', 'Großansicht des Bildes in einer Lightbox bzw. den Link in einem neuen Browserfenster öffnen.'];
diff --git a/...Resources/contao/languages/en/default.php → contao/languages/en/default.php b/...Resources/contao/languages/en/default.php → contao/languages/en/default.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de

diff --git a/...ources/contao/languages/en/tl_content.php → contao/languages/en/tl_content.php b/...ources/contao/languages/en/tl_content.php → contao/languages/en/tl_content.php
@@ -5,7 +5,7 @@
 /*
  * Animated timeline bundle for Contao Open Source CMS
  *
- * Copyright (c) 2023 pdir / digital agentur // pdir GmbH
+ * Copyright (c) 2024 pdir / digital agentur // pdir GmbH
  *
  * @package    animated-timeline-bundle
  * @link       https://pdir.de
@@ -22,9 +22,13 @@
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['horizontal'] = 'Horizontal';
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['vertical'] = 'Vertical';
 $GLOBALS['TL_LANG']['tl_content']['timeline_orientation']['options']['auto'] = 'Auto';
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos'] = ['Navigation position', 'Select here whether the navigation should be at the bottom or top.'];
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos']['options']['top'] = 'top';
+$GLOBALS['TL_LANG']['tl_content']['timeline_navPos']['options']['bottom'] = 'bottom';
 $GLOBALS['TL_LANG']['tl_content']['timeline_eventsPerSlide'] = ['Elements per slide', 'Here you can enter the number of elements displayed per slide.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineElement_customTpl'] = ['Custom template', 'Here you can select an individual template.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineStart_customTpl'] = ['Custom template', 'Here you can select an individual template.'];
 $GLOBALS['TL_LANG']['tl_content']['timelineStop_customTpl'] = ['Custom template', 'Here you can select an individual template.'];
 $GLOBALS['TL_LANG']['tl_content']['timeline_prevLabel'] = ['Label for prev-button', 'Here you can change the label of the prev-button.'];
 $GLOBALS['TL_LANG']['tl_content']['timeline_nextLabel'] = ['Label for next-button', 'Here you can change the label of the next-button.'];
+$GLOBALS['TL_LANG']['tl_content']['contentSliderFullsize'] = ['Full-size view/new window', 'Open the full-size image in a lightbox or the link in a new browser window'];
diff --git a/...ontao/templates/ce_timeline_element.html5 → contao/templates/ce_timeline_element.html5 b/...ontao/templates/ce_timeline_element.html5 → contao/templates/ce_timeline_element.html5
@@ -6,23 +6,11 @@
 
   <?php if($this->sliderImages): ?>
     <div class="image-slider">
-      <div class="content-slider-roadmap" data-config="0,300,0,1">
+      <div class="content-slider-roadmap" data-config="<?= $this->config ?>">
         <div class="slider-wrapper">
-          <?php while($this->sliderImages->next()): ?>
-            <?php
-            $meta = deserialize($this->sliderImages->meta);
-            $picture = \Picture::create($this->sliderImages->path, $this->size)->getTemplateData();
-            if($meta && isset($meta[$GLOBALS['TL_LANGUAGE']])) {
-              $picture['alt'] = specialchars($meta[$GLOBALS['TL_LANGUAGE']]['alt']);
-              $picture['title'] = specialchars($meta[$GLOBALS['TL_LANGUAGE']]['title']);
-            }
-            ?>
-            <div class="ce_image">
-              <figure class="image_container">
-                <?php $this->insert('picture_default', $picture); ?>
-              </figure>
-            </div>
-          <?php endwhile; ?>
+          <?php foreach($this->sliderImages as $sliderImage): ?>
+            <?php $this->insert('image', $sliderImage); ?>
+          <?php endforeach; ?>
         </div>
       </div>
       <nav class="slider-control-roadmap">

diff --git a/.../contao/templates/ce_timeline_start.html5 → contao/templates/ce_timeline_start.html5 b/.../contao/templates/ce_timeline_start.html5 → contao/templates/ce_timeline_start.html5
@@ -1,4 +1,4 @@
-<div class="<?= $this->class ?> <?= $this->orientation ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?= $this->style ?>"<?php endif; ?>>
+<div class="<?= $this->class ?> <?= $this->orientation ?> <?= $this->navPos ?> block"<?= $this->cssID ?><?php if ($this->style): ?> style="<?= $this->style ?>"<?php endif; ?>>
 
 <div id="timeline<?= $this->id ?>"></div>
 

diff --git a/...s/contao/templates/ce_timeline_stop.html5 → contao/templates/ce_timeline_stop.html5 b/...s/contao/templates/ce_timeline_stop.html5 → contao/templates/ce_timeline_stop.html5
diff --git a/...sources/public/css/jquery.roadmap.min.css → public/css/jquery.roadmap.min.css b/...sources/public/css/jquery.roadmap.min.css → public/css/jquery.roadmap.min.css
diff --git a/...Resources/public/css/timeline-slider.scss → public/css/timeline-slider.scss b/...Resources/public/css/timeline-slider.scss → public/css/timeline-slider.scss
@@ -91,6 +91,21 @@
   }
 }
 
+.ce_timelineSliderStart.nav-top .roadmap {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+
+  .roadmap__navigation {
+    order: 1;
+    margin-bottom: 20px;
+  }
+
+  .roadmap__events {
+    order: 2;
+  }
+}
+
 @media (min-width:993px) {
   .roadmap.roadmap--orientation-horizontal .roadmap__events__event, .roadmap.roadmap--orientation-auto .roadmap__events__event {
     &:nth-child(even) .event .event__date {

diff --git a/...Resources/public/js/jquery.roadmap.min.js → public/js/jquery.roadmap.min.js b/...Resources/public/js/jquery.roadmap.min.js → public/js/jquery.roadmap.min.js
diff --git a/src/Resources/public/js/timeline-slider.js → public/js/timeline-slider.js b/src/Resources/public/js/timeline-slider.js → public/js/timeline-slider.js
diff --git a/...esources/public/js/timeline-slider.min.js → public/js/timeline-slider.min.js b/...esources/public/js/timeline-slider.min.js → public/js/timeline-slider.min.js