--- /dev/null
+<?php
+
+namespace PhysioAssist\Elementor\Widgets;
+
+use Elementor\Widget_Base;
+use Elementor\Controls_Manager;
+use Elementor\Scheme_Color;
+
+use function App\asset_path;
+use function App\template;
+
+class FluxPostCarousel extends Widget_Base {
+
+ protected $_has_template_content = false; // Tell Elementor that content is all rendered dynamically
+
+ // Widget name / ID
+ public function get_name() {
+ return 'cube-flux-post-carousel';
+ }
+
+ // Elementor widget title
+ public function get_title() {
+ return __( 'Flux Post Carousel', 'cube' );
+ }
+
+ // Elementor interface icon
+ public function get_icon() {
+ return 'eicon-posts-carousel';
+ }
+
+ // 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() {
+
+ wp_register_script('slick', asset_path('scripts/slick.js'), ['jquery'], null, true);
+
+ wp_register_script(
+ 'cube-flux-post-carousel',
+ asset_path('scripts/flux-post-carousel.js'),
+ ['jquery', 'slick'], // Dependencies
+ null, // Version
+ true // In footer?
+ );
+
+ // Use script already registered by Elementor so we don't have to include another copy of Slick
+ return ['cube-flux-post-carousel'];
+ }
+ /**
+ * 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' => __( 'Content', 'cube' ),
+ ]
+ );
+
+ $this->add_control(
+ 'title',
+ [
+ 'label' => __( 'Title', 'elementor' ),
+ 'type' => Controls_Manager::TEXT,
+ 'placeholder' => __( 'Enter your title', 'elementor' ),
+ 'default' => '',
+ ]
+ );
+
+ $this->add_control(
+ 'cta_text',
+ [
+ 'label' => __('Call to Action text', 'cube'),
+ 'type' => Controls_Manager::TEXT,
+ 'default' => ''
+ ]
+ );
+
+ $this->add_control(
+ 'cta_link',
+ [
+ 'label' => __('Call to Action link', 'cube'),
+ 'type' => Controls_Manager::MEDIA,
+ ]
+ );
+
+ $this->end_controls_section();
+
+
+ $this->start_controls_section(
+ 'section_formatting',
+ [
+ 'label' => __( 'Colours & Formatting', 'cube' ),
+ ]
+ );
+
+
+ $this->add_control(
+ 'title_color',
+ [
+ 'label' => __( 'Title Colour', 'cube' ),
+ 'type' => Controls_Manager::COLOR,
+ 'default' => '',
+ 'selectors' => [
+ '{{WRAPPER}} .text-block-title' => 'color: {{VALUE}};',
+ ],
+ ]
+ );
+
+
+ $this->add_control(
+ 'subtitle_color',
+ [
+ 'label' => __( 'Subtitle Colour', 'cube' ),
+ 'type' => Controls_Manager::COLOR,
+ 'default' => '',
+ 'selectors' => [
+ '{{WRAPPER}} .text-block-subtitle' => 'color: {{VALUE}};',
+ ],
+ ]
+ );
+
+
+ $this->add_control(
+ 'body_color',
+ [
+ 'label' => __( 'Body Colour', 'cube' ),
+ 'type' => Controls_Manager::COLOR,
+ 'default' => '',
+ 'selectors' => [
+ '{{WRAPPER}} .text-block-body' => 'color: {{VALUE}};',
+ ],
+ ]
+ );
+
+
+ $this->add_control(
+ 'cta_color',
+ [
+ 'label' => __( 'Call to Action Colour', 'cube' ),
+ 'type' => Controls_Manager::COLOR,
+ 'default' => '',
+ 'selectors' => [
+ '{{WRAPPER}} .text-block-cta' => 'color: {{VALUE}};',
+ ],
+ ]
+ );
+
+
+ $this->add_responsive_control(
+ 'align',
+ [
+ 'label' => __( 'Alignment', 'elementor' ),
+ 'type' => Controls_Manager::CHOOSE,
+ 'options' => [
+ 'left' => [
+ 'title' => __( 'Left', 'elementor' ),
+ 'icon' => 'fa fa-align-left',
+ ],
+ 'center' => [
+ 'title' => __( 'Center', 'elementor' ),
+ 'icon' => 'fa fa-align-center',
+ ],
+ 'right' => [
+ 'title' => __( 'Right', 'elementor' ),
+ 'icon' => 'fa fa-align-right',
+ ],
+ 'justify' => [
+ 'title' => __( 'Justified', 'elementor' ),
+ 'icon' => 'fa fa-align-justify',
+ ],
+ ],
+ 'default' => '',
+ 'selectors' => [
+ '{{WRAPPER}}' => 'text-align: {{VALUE}}; margin: 0 auto;',
+ ],
+ ]
+ );
+
+ $this->add_control(
+ 'max-width',
+ [
+ 'label' => __( 'Maximum Width', 'cube' ),
+ 'type' => Controls_Manager::SLIDER,
+ // 'default' => [
+ // 'size' => 400,
+ // ],
+ 'range' => [
+ 'px' => [
+ 'min' => 400,
+ 'max' => 1600,
+ 'step' => 10,
+ ],
+ '%' => [
+ 'min' => 0,
+ 'max' => 100,
+ ],
+ ],
+ 'selectors' => [
+ '{{WRAPPER}} .text-block' => 'max-width: {{SIZE}}{{UNIT}};',
+ ],
+ ]
+ );
+
+ $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() {
+ $newsCat = get_category_by_slug('news');
+ $categories = get_terms([
+ 'taxonomy' => 'category',
+ 'hide_empty' => false,
+ 'exclude' => [$newsCat->term_id]
+ ]);
+
+ $categoriesId = array_map(function($n){ return $n->term_id; },$categories);
+ $items = get_posts(['category__in'=>$categoriesId]);
+ $title = $this->get_settings('title');
+
+ $cta = [
+ 'cta_text' => $this->get_settings('cta_text'),
+ 'cta_link' => $this->get_settings('cta_link'),
+ ];
+
+ echo template('widgets/flux-post-carousel', compact('items','categories', 'title', 'cta'));
+ }
+
+}
\ No newline at end of file
--- /dev/null
+{{--TEXT CAROUSEL--}}
+@php
+ $settings = [
+ 'slidesToShow' => 2,
+ 'slidesToScroll' => 2,
+ 'dots' => count($items) > 2, // Only show dots when there are enough items
+ 'rows' => 2,
+ 'infinite' => true,
+ 'responsive' => [
+ [
+ 'breakpoint' => 1400,
+ 'settings' => [
+ 'slidesToShow' => 3,
+ 'slidesToScroll' => 3,
+ 'dots' => count($items) > 3,
+ ]
+ ],
+ [
+ 'breakpoint' => 1100,
+ 'settings' => [
+ 'slidesToShow' => 2,
+ 'slidesToScroll' => 2,
+ 'dots' => count($items) > 2,
+ ]
+ ],
+ [
+ 'breakpoint' => 850,
+ 'settings' => [
+ 'slidesToShow' => 1,
+ 'slidesToScroll' => 1,
+ 'dots' => count($items) > 1,
+ ]
+ ],
+ ]
+ ];
+
+ $slick = json_encode($settings);
+
+ use function App\template;
+@endphp
+
+<div class="section-flux-post-carousel">
+ <div class="flux-post-carousel-header elementor-widget">
+ <h2 class="elementor-heading-title elementor-size-default flux-post-carousel-header-title">
+ {{__($title)}}
+ </h2>
+ </div>
+ <div class="flux-post-carousel-filter">
+ <ul class="flux-post-carousel-filter-list">
+ <li class="flux-post-carousel-filter-item elementor-button" data-cat="">{{ __('Tout') }}</li>
+ @foreach($categories as $category)
+ <li class="flux-post-carousel-filter-item elementor-button inactive" data-cat="{{ $category->term_id }}">{{ $category->name }}</li>
+ @endforeach
+ </ul>
+ </div>
+ <div class="flux-post-carousel elementor-slick-slider" data-slick="{{ $slick }}">
+
+ @foreach ($items as $item)
+ @include('partials.post')
+ @endforeach
+
+ </div>
+ <div class="flux-post-carousel-download">
+ @if (!empty($cta['cta_text']))
+ <a href="{{ $cta['cta_link']['url'] }}" class="arrow-link elementor-button" target="_blank" rel="noopener">
+ @svg('arrow') {{ $cta['cta_text'] }}
+ </a>
+ @endif
+ </div>
+</div>
];
$slick = json_encode($settings);
-
@endphp
-<div class="text-carousel elementor-slick-slider" data-slick="{{ $slick }}">
+ <div class="text-carousel elementor-slick-slider" data-slick="{{ $slick }}">
- @foreach ($items as $item)
+ @foreach ($items as $item)
- <div class="text-carousel-item slick-slide">
- <div class="text-carousel-item-content">
+ <div class="text-carousel-item slick-slide">
+ <div class="text-carousel-item-content">
- <h3 class="text-carousel-title">{{ $item['title'] }}</h3>
+ <h3 class="text-carousel-title">{{ $item['title'] }}</h3>
- <p class="text-carousel-subtitle">{{ $item['subtitle'] }}</p>
+ <p class="text-carousel-subtitle">{{ $item['subtitle'] }}</p>
- <div class="text-carousel-body">
- {!! $item['body'] !!}
- </div>
+ <div class="text-carousel-body">
+ {!! $item['body'] !!}
+ </div>
- @if (!empty($item['cta_text']))
- <a href="{{ $item['cta_link']['url'] }}" class="text-carousel-link arrow-link"
- @if ($item['cta_link']['is_external']) target="_blank" @endif
- @if ($item['cta_link']['nofollow']) rel="noopener" @endif
- >
- @svg('arrow') {{ $item['cta_text'] }}
- </a>
- @endif
+ @if (!empty($item['cta_text']))
+ <a href="{{ $item['cta_link']['url'] }}" class="text-carousel-link arrow-link"
+ @if ($item['cta_link']['is_external']) target="_blank" @endif
+ @if ($item['cta_link']['nofollow']) rel="noopener" @endif
+ >
+ @svg('arrow') {{ $item['cta_text'] }}
+ </a>
+ @endif
- </div> {{-- .text-carousel-item-content --}}
- </div> {{-- .text-carousel-item --}}
+ </div> {{-- .text-carousel-item-content --}}
+ </div> {{-- .text-carousel-item --}}
- @endforeach
+ @endforeach
-</div>
+ </div>