Merge branch 'TMS-914' into stage

devgeniem · Mar 6, 2024 · 14440da · 14440da
2 parents 4b602f4 + c74e988
commit 14440da
Show file tree

Hide file tree

Showing 47 changed files with 450 additions and 109 deletions.
diff --git a/CHANGELOG.MD b/CHANGELOG.MD
@@ -12,6 +12,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - TMS-1009: Fix error when fetching Eventz response with languages other than fi & en
 - TMS-1015: Header accessibility fixes
 - TMS-996: Change bold image-caption text to normal
+- TMS-914:
+    - Add new anchor-links block & functionalities
+    - Add anchor id-elements to blocks & components
 
 ## [1.54.5] - 2024-02-01
 

diff --git a/assets/scripts/anchor-links.js b/assets/scripts/anchor-links.js
@@ -0,0 +1,36 @@
+/*
+ *  Copyright (c) 2023. Hion Digital
+ */
+
+// Use jQuery as $ within this file scope.
+const $ = jQuery; // eslint-disable-line no-unused-vars
+
+/**
+ * Class AnchorLinks
+ */
+export default class AnchorLinks {
+
+    /**
+     * Scroll to anchor element
+     *
+     * @param {Object} event The click event object.
+     *
+     * @return {void}
+     */
+    scrollToDiv( event ) {
+        event.preventDefault();
+
+        $( 'html, body' ).animate( {
+            scrollTop: $( $( event.target ).attr( 'href' ) ).offset().top,
+        }, 200 );
+    }
+
+    /**
+     * Run when the document is ready.
+     *
+     * @return {void}
+     */
+    docReady() {
+        $( '.anchor-links__list a' ).on( 'click', this.scrollToDiv.bind( this ) );
+    }
+}
diff --git a/assets/scripts/theme.js b/assets/scripts/theme.js
@@ -5,6 +5,7 @@
 
 import Common from './common';
 import Accordion from './accordion';
+import AnchorLinks from './anchor-links';
 import MapLayout from './map-layout';
 import CopyToClipboard from './copy-to-clipboard';
 import Hero from './hero';
@@ -32,6 +33,7 @@ import FocusOnSearch from './focus-on-search';
 const globalControllers = {
     Common,
     Accordion,
+    AnchorLinks,
     MapLayout,
     CopyToClipboard,
     Hero,

diff --git a/assets/styles/blocks/custom/_anchor-links.scss b/assets/styles/blocks/custom/_anchor-links.scss
@@ -0,0 +1,6 @@
+.anchor-links {
+    &__list {
+        padding-left: 1rem;
+        border-left: 2px solid $primary;
+    }
+}
diff --git a/assets/styles/blocks/custom/index.scss b/assets/styles/blocks/custom/index.scss
@@ -5,6 +5,7 @@
 @import "accordion";
 @import "grid";
 @import "image-gallery";
+@import "anchor-links";
 @import "subpages";
 @import "notice-banner";
 @import "contacts";

diff --git a/lib/ACF/Fields/AnchorLinksFields.php b/lib/ACF/Fields/AnchorLinksFields.php
@@ -0,0 +1,100 @@
+<?php
+/**
+ * Copyright (c) 2023. Hion Digital
+ */
+
+namespace TMS\Theme\Base\ACF\Fields;
+
+use Geniem\ACF\Exception;
+use Geniem\ACF\Field;
+use TMS\Theme\Base\Logger;
+
+/**
+ * Class AnchorLinksFields
+ *
+ * @package TMS\Theme\Base\ACF\Fields
+ */
+class AnchorLinksFields extends Field\Group {
+
+    /**
+     * The constructor for field.
+     *
+     * @param string $label Label.
+     * @param null   $key   Key.
+     * @param null   $name  Name.
+     */
+    public function __construct( $label = '', $key = null, $name = null ) {
+        parent::__construct( $label, $key, $name );
+
+        try {
+            $this->add_fields( $this->sub_fields() );
+        }
+        catch ( \Exception $e ) {
+            ( new Logger() )->error( $e->getMessage(), $e->getTrace() );
+        }
+    }
+
+    /**
+     * This returns all sub fields of the parent groupable.
+     *
+     * @return array
+     * @throws Exception In case of invalid ACF option.
+     */
+    protected function sub_fields() : array {
+        $strings = [
+            'title'            => [
+                'label'        => 'Otsikko',
+                'instructions' => '',
+            ],
+            'description'      => [
+                'label'        => 'Kuvaus',
+                'instructions' => '',
+            ],
+            'anchor_links'     => [
+                'label'        => 'Ankkurilinkit',
+                'instructions' => '',
+                'button'       => 'Lisää linkki',
+            ],
+            'anchor_link'      => [
+                'label'        => 'Ankkurilinkki',
+                'instructions' => 'Kirjoita URL-kenttään "#" ja haluamasi lohkon tai komponentin HTML-ankkuri, esim. #lohkon-ankkuri',
+            ],
+        ];
+
+        $key = $this->get_key();
+
+        $title_field = ( new Field\Text( $strings['title']['label'] ) )
+            ->set_key( "{$key}_title" )
+            ->set_name( 'title' )
+            ->set_instructions( $strings['title']['instructions'] );
+
+        $description_field = ( new Field\ExtendedWysiwyg( $strings['description']['label'] ) )
+            ->set_key( "{$key}_description" )
+            ->set_name( 'description' )
+            ->set_tabs( 'visual' )
+            ->set_toolbar( 'tms-minimal' )
+            ->disable_media_upload()
+            ->set_height( 100 )
+            ->set_instructions( $strings['description']['instructions'] );
+
+        $anchor_links_field = ( new Field\Repeater( $strings['anchor_links']['label'] ) )
+            ->set_key( "{$key}_anchor_links" )
+            ->set_name( 'anchor_links' )
+            ->set_layout( 'block' )
+            ->set_button_label( $strings['anchor_links']['button'] )
+            ->set_instructions( $strings['anchor_links']['instructions'] );
+
+        $anchor_link_field = ( new Field\Link( $strings['anchor_link']['label'] ) )
+            ->set_key( "{$key}_anchor_link" )
+            ->set_name( 'anchor_link' )
+            ->set_instructions( $strings['anchor_link']['instructions'] );
+
+        $anchor_links_field->add_field( $anchor_link_field );
+
+        return [
+            $title_field,
+            $description_field,
+            $anchor_links_field,
+        ];
+    }
+}
diff --git a/lib/ACF/Fields/LinkListFields.php b/lib/ACF/Fields/LinkListFields.php
@@ -64,12 +64,12 @@ protected function sub_fields() : array {
         $key = $this->get_key();
 
         $title_field = ( new Field\Text( $strings['title']['label'] ) )
-            ->set_key( "${key}_title" )
+            ->set_key( "{$key}_title" )
             ->set_name( 'title' )
             ->set_instructions( $strings['title']['instructions'] );
 
         $description_field = ( new Field\ExtendedWysiwyg( $strings['description']['label'] ) )
-            ->set_key( "${key}_description" )
+            ->set_key( "{$key}_description" )
             ->set_name( 'description' )
             ->set_tabs( 'visual' )
             ->set_toolbar( 'tms-minimal' )
@@ -78,14 +78,14 @@ protected function sub_fields() : array {
             ->set_instructions( $strings['description']['instructions'] );
 
         $links_field = ( new Field\Repeater( $strings['links']['label'] ) )
-            ->set_key( "${key}_links" )
+            ->set_key( "{$key}_links" )
             ->set_name( 'links' )
             ->set_layout( 'block' )
             ->set_button_label( $strings['links']['button'] )
             ->set_instructions( $strings['links']['instructions'] );
 
         $link_field = ( new Field\Link( $strings['link']['label'] ) )
-            ->set_key( "${key}_link" )
+            ->set_key( "{$key}_link" )
             ->set_name( 'link' )
             ->set_instructions( $strings['link']['instructions'] );
 

diff --git a/lib/ACF/PageGroup.php b/lib/ACF/PageGroup.php
@@ -24,11 +24,13 @@ class PageGroup {
      * PageGroup constructor.
      */
     public function __construct() {
-        add_action(
+        \add_action(
             'init',
             \Closure::fromCallable( [ $this, 'register_fields' ] ),
             100
         );
+
+        $this->add_anchor_fields();
     }
 
     /**
@@ -106,15 +108,15 @@ protected function register_fields() : void {
                 );
 
             $field_group->add_fields(
-                apply_filters(
+                \apply_filters(
                     'tms/acf/group/' . $field_group->get_key() . '/fields',
                     [
                         $this->get_components_field( $field_group->get_key() ),
                     ]
                 )
             );
 
-            $field_group = apply_filters(
+            $field_group = \apply_filters(
                 'tms/acf/group/' . $field_group->get_key(),
                 $field_group
             );
@@ -143,11 +145,11 @@ protected function get_components_field( string $key ) : Field\FlexibleContent {
         ];
 
         $components_field = ( new Field\FlexibleContent( $strings['components']['title'] ) )
-            ->set_key( "${key}_components" )
+            ->set_key( "{$key}_components" )
             ->set_name( 'components' )
             ->set_instructions( $strings['components']['instructions'] );
 
-        $component_layouts = apply_filters(
+        $component_layouts = \apply_filters(
             'tms/acf/field/' . $components_field->get_key() . '/layouts',
             [
                 Layouts\ImageBannerLayout::class,
@@ -182,6 +184,65 @@ protected function get_components_field( string $key ) : Field\FlexibleContent {
 
         return $components_field;
     }
+
+    /**
+     * Add HTML-anchor field to layout fields.
+     */
+    private function add_anchor_fields() : void {
+        $components = \apply_filters(
+            'tms/acf/page_layouts',
+            [
+                'image_banner'    => Layouts\ImageBannerLayout::class,
+                'call_to_action'  => Layouts\CallToActionLayout::class,
+                'content_columns' => Layouts\ContentColumnsLayout::class,
+                'logo_wall'       => Layouts\LogoWallLayout::class,
+                'map'             => Layouts\MapLayout::class,
+                'icon_links'      => Layouts\IconLinksLayout::class,
+                'social_media'    => Layouts\SocialMediaLayout::class,
+                'image_carousel'  => Layouts\ImageCarouselLayout::class,
+                'subpages'        => Layouts\SubpageLayout::class,
+                'textblock'       => Layouts\TextBlockLayout::class,
+                'grid'            => Layouts\GridLayout::class,
+                'events'          => Layouts\EventsLayout::class,
+                'articles'        => Layouts\ArticlesLayout::class,
+                'blog_articles'   => Layouts\BlogArticlesLayout::class,
+                'sitemap'         => Layouts\SitemapLayout::class,
+                'notice_banner'   => Layouts\NoticeBannerLayout::class,
+                'gravityform'     => Layouts\GravityFormLayout::class,
+                'contacts'        => Layouts\ContactsLayout::class,
+                'acc_icon_links'  => Layouts\AccessibilityIconLinksLayout::class,
+                'share_links'     => Layouts\ShareLinksLayout::class,
+                'countdown'       => Layouts\CountdownLayout::class,
+                'video'           => Layouts\VideoLayout::class,
+            ]
+        );
+
+        $keys = array_keys( $components );
+
+        foreach ( $keys as $component ) {
+            if ( empty( $component ) ) {
+                continue;
+            }
+
+            \add_filter(
+                "tms/acf/layout/fg_page_components_$component/fields",
+                function ( $fields ) use ( $component ) {
+                    $anchor_field = ( new Field\Text( 'HTML-ankkuri' ) )
+                        ->set_key( $component . '_anchor' )
+                        ->set_name( 'anchor' )
+                        ->set_instructions( 'Kirjoita sana tai pari, ilman välilyöntejä,
+                         luodaksesi juuri tälle lohkolle uniikki verkko-osoite, jota kutsutaan "ankkuriksi".
+                         Sen avulla voit luoda linkin suoraan tähän osioon sivullasi.' );
+
+                    array_unshift( $fields, $anchor_field );
+
+                    return $fields;
+                },
+                10,
+                1
+            );
+        }
+    }
 }
 
 ( new PageGroup() );