From 76efeecae1d4f2309267479479db969239266604 Mon Sep 17 00:00:00 2001
From: Stephen Cameron <stephen@cubedesigners.com>
Date: Tue, 14 Apr 2020 21:05:53 +0200
Subject: [PATCH] WIP #3498 @9

---
 .../mu-plugins/cube/src/Elementor/Setup.php   |   2 +
 .../src/Elementor/Widgets/DynamicTable.php    | 160 ++++++++++++++++++
 .../cube/src/Elementor/Widgets/FancyList.php  | 103 +++++++++++
 .../cube/src/Elementor/Widgets/TextBlock.php  |  20 ++-
 .../resources/assets/images/table-dash.svg    |   3 +
 .../resources/assets/images/table-tick.svg    |   5 +
 .../views/widgets/dynamic-table.blade.php     |  22 +++
 .../views/widgets/fancy-list.blade.php        |  12 ++
 wp-content/themes/CCV/tailwind.config.js      |   9 +
 9 files changed, 335 insertions(+), 1 deletion(-)
 create mode 100644 wp-content/mu-plugins/cube/src/Elementor/Widgets/DynamicTable.php
 create mode 100644 wp-content/mu-plugins/cube/src/Elementor/Widgets/FancyList.php
 create mode 100644 wp-content/themes/CCV/resources/assets/images/table-dash.svg
 create mode 100644 wp-content/themes/CCV/resources/assets/images/table-tick.svg
 create mode 100644 wp-content/themes/CCV/resources/views/widgets/dynamic-table.blade.php
 create mode 100644 wp-content/themes/CCV/resources/views/widgets/fancy-list.blade.php

diff --git a/wp-content/mu-plugins/cube/src/Elementor/Setup.php b/wp-content/mu-plugins/cube/src/Elementor/Setup.php
index b52c12f..11e02b0 100644
--- a/wp-content/mu-plugins/cube/src/Elementor/Setup.php
+++ b/wp-content/mu-plugins/cube/src/Elementor/Setup.php
@@ -41,6 +41,8 @@ class Setup {
         $elementor->widgets_manager->register_widget_type( new Widgets\PeopleGrid() );
         $elementor->widgets_manager->register_widget_type( new Widgets\Timeline() );
         $elementor->widgets_manager->register_widget_type( new Widgets\ScientificNews() );
+        $elementor->widgets_manager->register_widget_type( new Widgets\DynamicTable() );
+        $elementor->widgets_manager->register_widget_type( new Widgets\FancyList() );
     }
 
     protected function _customise_sections() {
diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/DynamicTable.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/DynamicTable.php
new file mode 100644
index 0000000..31ea24b
--- /dev/null
+++ b/wp-content/mu-plugins/cube/src/Elementor/Widgets/DynamicTable.php
@@ -0,0 +1,160 @@
+<?php
+
+namespace Cube\Elementor\Widgets;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+
+use function Roots\view;
+
+
+class DynamicTable extends Widget_Base {
+
+    // Widget name / ID
+    public function get_name() {
+        return 'cube-dynamic-table';
+    }
+
+    // Elementor widget title
+    public function get_title() {
+        return __( 'Tableau de comparison', 'cube' );
+    }
+
+    // Elementor interface icon
+    public function get_icon() {
+        return 'eicon-table';
+    }
+
+    // Where to display the widget in the Elementor interface
+    public function get_categories() {
+        return [ 'theme-elements' ];
+    }
+
+    /**
+     * List of scripts the widget depends on.
+     * Used to set scripts dependencies required to run the widget.
+     *
+     * @since 1.0.0
+     * @access public
+     * @return array Widget scripts dependencies.
+     */
+    public function get_script_depends() {
+        return [];
+    }
+    /**
+     * Register the widget controls.
+     * Adds different input fields to allow the user to change and customize the widget settings.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function _register_controls() {
+
+        $this->start_controls_section(
+            'section_content',
+            [
+                'label' => __( 'Tableau de comparison', 'cube' ),
+            ]
+        );
+
+        $this->add_control(
+            'column_headings',
+            [
+                'label' => __( 'En-têtes de colonne (un par ligne)', 'cube' ),
+                'type' => Controls_Manager::TEXTAREA,
+                'default' => '',
+                'placeholder' => __("Titre 1\nTitre 2\nTitre 3\n...", 'cube'),
+            ]
+        );
+
+        $this->add_control(
+            'rows',
+            [
+                'label' => __( 'Lignes du tableau', 'cube' ),
+                'type' => Controls_Manager::REPEATER,
+                'fields' => [
+                    [
+                        'name' => 'cells',
+                        'label' => __( 'Cellules du tableau (une valeur par ligne)', 'cube' ),
+                        'placeholder' => __("Valeur 1\nValeur 2\nValeur 3\n...", 'cube'),
+                        'type' => Controls_Manager::TEXTAREA,
+                        'default' => '',
+                        'label_block' => true,
+                    ],
+                    [
+                        'name' => 'bg_color',
+                        'label' => __( 'Couleur de fond', 'cube' ),
+                        'type' => Controls_Manager::SELECT,
+                        'options' => [
+                            '' => __( 'Défaut', 'cube' ),
+                            'bg-light' => __( 'Gris clair', 'cube' ),
+                        ],
+                    ],
+                    [
+                        'name' => 'text_align',
+                        'label' => __( 'Alignement du texte', 'cube' ),
+                        'type' => Controls_Manager::SELECT,
+                        'options' => [
+                            '' => __( 'Défaut', 'cube' ),
+                            'text-left' => __( 'Gauche', 'cube' ),
+                            'text-center' => __( 'Centré', 'cube' ),
+                            'text-right' => __( 'Droit', 'cube' ),
+                        ],
+                    ],
+                    [
+                        'name' => 'font_style',
+                        'label' => __( 'Style de police', 'cube' ),
+                        'type' => Controls_Manager::SELECT,
+                        'options' => [
+                            '' => __( 'Défaut', 'cube' ),
+                            'font-bold' => __( 'Gras', 'cube' ),
+                        ],
+                    ],
+                ],
+                'title_field' => '{{{ cells }}}',
+            ]
+        );
+
+
+        $this->end_controls_section();
+    }
+    /**
+     * Render the widget output on the frontend.
+     * Written in PHP and used to generate the final HTML.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function render() {
+
+        $column_headings = trim($this->get_settings('column_headings'));
+        $headings = explode(PHP_EOL, $column_headings);
+        $column_count = count($headings);
+        $rows = $this->get_settings('rows');
+
+        // It's possible that there are no headings, so get column count from first row's cells
+        if (empty($column_headings) && isset($rows[0]['cells'])) {
+            $column_count = count(explode(PHP_EOL, trim($rows[0]['cells'])));
+        }
+
+        // Regex replacements for "-" and "+". We have to use regex so it will only replace exact/full matches
+        $substitutions = [
+            '/^-$/' => '<img src="'. \Roots\asset('images/table-dash.svg') .'" class="dynamic-table-icon inline-block sm:w-6e">',
+            '/^\+$/' => '<img src="'. \Roots\asset('images/table-tick.svg') .'" class="dynamic-table-icon inline-block sm:w-6e">',
+        ];
+
+        // Split row data into cells but only up to however many columns there are
+        foreach ($rows as $index => $row) {
+            $row['cells'] = explode(PHP_EOL, trim($row['cells']), $column_count);
+            $row['cells'] = array_map('trim', $row['cells']); // Trim each cell so we don't miss any substitutions
+
+            // Also replace "-" and "+" with their image counterparts
+            $row['cells'] = preg_replace(array_keys($substitutions), array_values($substitutions), $row['cells']);
+
+            $rows[$index] = $row;
+        }
+
+        echo view('widgets/dynamic-table', compact('column_count', 'headings', 'rows'));
+    }
+
+}
diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/FancyList.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/FancyList.php
new file mode 100644
index 0000000..90925d4
--- /dev/null
+++ b/wp-content/mu-plugins/cube/src/Elementor/Widgets/FancyList.php
@@ -0,0 +1,103 @@
+<?php
+
+namespace Cube\Elementor\Widgets;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+
+use function Roots\view;
+
+class FancyList extends Widget_Base {
+
+    // Widget name / ID
+    public function get_name() {
+        return 'cube-fancy-list';
+    }
+
+    // Elementor widget title
+    public function get_title() {
+        return __( 'Liste Formatée', 'cube' );
+    }
+
+    // Elementor interface icon
+    public function get_icon() {
+        return 'eicon-bullet-list';
+    }
+
+    // Where to display the widget in the Elementor interface
+    public function get_categories() {
+        return [ 'theme-elements' ];
+    }
+
+    /**
+     * List of scripts the widget depends on.
+     * Used to set scripts dependencies required to run the widget.
+     *
+     * @since 1.0.0
+     * @access public
+     * @return array Widget scripts dependencies.
+     */
+    public function get_script_depends() {
+        return [];
+    }
+    /**
+     * Register the widget controls.
+     * Adds different input fields to allow the user to change and customize the widget settings.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function _register_controls() {
+
+        $this->start_controls_section(
+            'section_content',
+            [
+                'label' => __( 'Liste formatée', 'cube' ),
+            ]
+        );
+
+        $this->add_control(
+            'title',
+            [
+                'label' => __( 'Titre de liste', 'cube' ),
+                'type' => Controls_Manager::TEXT,
+                'default' => '',
+            ]
+        );
+
+        $this->add_control(
+            'items',
+            [
+                'label' => __( 'Éléments', 'cube' ),
+                'type' => Controls_Manager::REPEATER,
+                'fields' => [
+                    [
+                        'name' => 'content',
+                        'default' => '',
+                        'label' => __( 'Contenus', 'cube' ),
+                        'type' => Controls_Manager::WYSIWYG,
+                        'label_block' => true,
+                    ],
+                ],
+                'title_field' => '{{{ content }}}',
+            ]
+        );
+
+        $this->end_controls_section();
+    }
+    /**
+     * Render the widget output on the frontend.
+     * Written in PHP and used to generate the final HTML.
+     *
+     * @since 1.0.0
+     * @access protected
+     */
+    protected function render() {
+
+        $title = $this->get_settings('title');
+        $items = $this->get_settings('items');
+
+        echo view('widgets/fancy-list', compact('title', 'items'));
+    }
+
+}
diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/TextBlock.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/TextBlock.php
index e5d36e8..f74ee70 100644
--- a/wp-content/mu-plugins/cube/src/Elementor/Widgets/TextBlock.php
+++ b/wp-content/mu-plugins/cube/src/Elementor/Widgets/TextBlock.php
@@ -200,11 +200,29 @@ class TextBlock extends _Base {
 					],
 				],
 				'selectors' => [
-					'{{WRAPPER}} .text-block' => 'max-width: {{SIZE}}{{UNIT}}; margin-left: auto; margin-right: auto;',
+					'{{WRAPPER}} .text-block' => 'max-width: {{SIZE}}{{UNIT}};',
 				],
 			]
 		);
 
+        $this->add_control(
+            'block_position',
+            [
+                'label' => __('Positionnement de bloc', 'cube'),
+                'type' => Controls_Manager::SELECT,
+                'options' => [
+                    '' => __( 'Défaut', 'cube' ),
+                    'margin-left: auto; margin-right: auto;' => __( 'Centré', 'cube' ),
+                    'margin-right: auto;' => __( 'Gauche', 'cube' ),
+                    'margin-left: auto;' => __( 'Droite', 'cube' ),
+                ],
+                'default' => '',
+                'selectors' => [
+                    '{{WRAPPER}} .text-block' => '{{VALUE}}',
+                ],
+            ]
+        );
+
         $this->end_controls_section();
 
         $this->common_controls();
diff --git a/wp-content/themes/CCV/resources/assets/images/table-dash.svg b/wp-content/themes/CCV/resources/assets/images/table-dash.svg
new file mode 100644
index 0000000..5aac050
--- /dev/null
+++ b/wp-content/themes/CCV/resources/assets/images/table-dash.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="29" height="4" viewBox="0 0 29 4">
+  <line x2="29" transform="translate(0 2)" fill="none" stroke="#2cc4cf" stroke-width="4"/>
+</svg>
diff --git a/wp-content/themes/CCV/resources/assets/images/table-tick.svg b/wp-content/themes/CCV/resources/assets/images/table-tick.svg
new file mode 100644
index 0000000..446d0b0
--- /dev/null
+++ b/wp-content/themes/CCV/resources/assets/images/table-tick.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="39.071" height="24.097" viewBox="0 0 39.071 24.097">
+  <g transform="translate(2.828 2.828)">
+    <path d="M556,228.366l14.146,14.146,19.268-19.268" transform="translate(-556 -223.244)" fill="none" stroke="#ff078b" stroke-linecap="round" stroke-linejoin="round" stroke-width="4"/>
+  </g>
+</svg>
diff --git a/wp-content/themes/CCV/resources/views/widgets/dynamic-table.blade.php b/wp-content/themes/CCV/resources/views/widgets/dynamic-table.blade.php
new file mode 100644
index 0000000..2588f89
--- /dev/null
+++ b/wp-content/themes/CCV/resources/views/widgets/dynamic-table.blade.php
@@ -0,0 +1,22 @@
+<table class="dynamic-table w-full">
+  <thead>
+    <tr class="bg-light text-dark text-center text-lg uppercase sm:text-sm xs:text-2xs">
+      @foreach ($headings as $heading)
+        <th class="font-normal p-3 xs:px-1 xs:py-2">{{ $heading }}</th>
+      @endforeach
+    </tr>
+  </thead>
+  <tbody>
+    @foreach ($rows as $row)
+      <tr>
+        @for ($i = 0; $i < $column_count; $i++)
+          <td class="p-3 xs:px-1 xs:py-2 sm:text-2xs {{ $row['bg_color'] }} {{ $row['text_align'] }} {{ $row['font_style'] }}">
+            @isset($row['cells'][$i])
+              {!! $row['cells'][$i] !!}
+            @endisset
+          </td>
+        @endfor
+      </tr>
+    @endforeach
+  </tbody>
+</table>
diff --git a/wp-content/themes/CCV/resources/views/widgets/fancy-list.blade.php b/wp-content/themes/CCV/resources/views/widgets/fancy-list.blade.php
new file mode 100644
index 0000000..b9d40cf
--- /dev/null
+++ b/wp-content/themes/CCV/resources/views/widgets/fancy-list.blade.php
@@ -0,0 +1,12 @@
+<div class="fancy-list-wrapper">
+  <h3 class="fancy-list-title">{{ $title }}</h3>
+  <ul class="fancy-list-items">
+    @foreach ($items as $item)
+      <li class="fancy-list-item">
+        <div class="fancy-list-item-content">
+          {!! $item['content'] !!}
+        </div>
+      </li>
+    @endforeach
+  </ul>
+</div>
diff --git a/wp-content/themes/CCV/tailwind.config.js b/wp-content/themes/CCV/tailwind.config.js
index 5d9e958..1ebdd7f 100644
--- a/wp-content/themes/CCV/tailwind.config.js
+++ b/wp-content/themes/CCV/tailwind.config.js
@@ -35,6 +35,7 @@ module.exports = {
       'body': ['Roboto Condensed', 'sans-serif'], // Main blocks of text
     },
     fontSize: {
+      '2xs': '0.7273rem', // 16px
       'xs': '0.8181rem', // 18px
       'sm': '0.9091rem', // 20px
       'base': '1rem', // 22px
@@ -45,6 +46,14 @@ module.exports = {
     },
 
     extend: {
+      spacing: {
+        '1e': '0.25em',
+        '2e': '0.5em',
+        '3e': '0.75em',
+        '4e': '1em',
+        '5e': '1.25em',
+        '6e': '1.5em',
+      },
       padding: {
         '0!': '0 !important', // Special overrides
         '100%': '100%', // Used for proportional padding to make a square
-- 
2.39.5