Search functionality and other improvements. WIP #2771 @8

diff --git a/app/Http/Controllers/ApplicationController.php b/app/Http/Controllers/ApplicationController.php
index 0c506d7d150c0b2ccff2f92bb4c4b9de2d84bbf7..005c9e9e9bbe3c83560732701e7c981d7a61b00f 100644 (file)
--- a/app/Http/Controllers/ApplicationController.php
+++ b/app/Http/Controllers/ApplicationController.php
@@ -2,6 +2,7 @@
 
 namespace App\Http\Controllers;
 
+use Illuminate\Http\Request;
 use App\Models\Application;
 use App\Models\Product;
 use Cubist\Backpack\app\Http\Controllers\CubistFrontController;
@@ -9,7 +10,7 @@ use Cubist\Backpack\app\Magic\PageData;
 
 class ApplicationController extends CubistFrontController
 {
-    public function view($id)
+    public function view(Request $request, $id)
     {
         $application = Application::find($id);
 

diff --git a/app/Http/Controllers/NewsController.php b/app/Http/Controllers/NewsController.php
index 99d27502ed9e246f5a2bf82126e7bfc60cb18492..1ff882c5b7d5351f300cb9764c5df3884e846eb1 100644 (file)
--- a/app/Http/Controllers/NewsController.php
+++ b/app/Http/Controllers/NewsController.php
@@ -2,13 +2,14 @@
 
 namespace App\Http\Controllers;
 
+use Illuminate\Http\Request;
 use App\Models\News;
 use Cubist\Backpack\app\Http\Controllers\CubistFrontController;
 use Cubist\Backpack\app\Magic\PageData;
 
 class NewsController extends CubistFrontController
 {
-    public function view($id)
+    public function view(Request $request, $id)
     {
         $newsItem = News::find($id);
 

diff --git a/app/Http/Controllers/ProductController.php b/app/Http/Controllers/ProductController.php
index 3c1a6917c253871db800dadfb9045132ffcae2dd..de13e7367e3669abdb5bed1bce584c20386fbdbd 100644 (file)
--- a/app/Http/Controllers/ProductController.php
+++ b/app/Http/Controllers/ProductController.php
@@ -6,10 +6,11 @@ namespace App\Http\Controllers;
 use App\Models\Product;
 use App\Models\ProductType;
 use Cubist\Backpack\app\Http\Controllers\CubistFrontController;
+use Illuminate\Http\Request;
 
 class ProductController extends CubistFrontController
 {
-    public function productList($id)
+    public function productList(Request $request, $id)
     {
         $productType = ProductType::find($id);
         if (!$productType) {
@@ -33,7 +34,7 @@ class ProductController extends CubistFrontController
         return view('pages.products', $this->data);
     }
 
-    public function productDetails($id)
+    public function productDetails(Request $request, $id)
     {
         $product = Product::find($id);
 

diff --git a/app/Templates/Search.php b/app/Templates/Search.php
index f8675916d7a6da6cf49d770b64c49d74968e6ca8..6c29386934f6d782be53fe26227e756c99d37c82 100644 (file)
--- a/app/Templates/Search.php
+++ b/app/Templates/Search.php
@@ -3,6 +3,7 @@
 
 namespace App\Templates;
 
+use Cubist\Backpack\app\Magic\Search as SearchEngine;
 
 class Search extends Base
 {
@@ -10,4 +11,29 @@ class Search extends Base
     {
         return 'Moteur de recherche';
     }
+
+    public function init()
+    {
+        parent::init();
+
+        $this->removeField('intro');
+
+        $this->addField(['name'  => 'page_heading',
+                         'type'  => 'Text',
+                         'label' => 'Titre de la page',
+                         'tab'   => 'Contenus']);
+
+        // Enable form
+        $this->addForm();
+    }
+
+    public function setData(&$data) {
+
+        $request = $data['request'];
+
+        $data['results'] = SearchEngine::query($request->q, $request->type ?? null, $request->limit ?? null);
+
+    }
+
+
 }

diff --git a/resources/js/components/Search.vue b/resources/js/components/Search.vue
index 91227c26fc33a90d9baf4e37aced9949c795225b..2271264e8d0c7ab0f1d78343ca119d56e54ac689 100644 (file)
--- a/resources/js/components/Search.vue
+++ b/resources/js/components/Search.vue
@@ -10,10 +10,10 @@
 
         <slide-toggle :active="visible" :duration="300" @open-end="focusField">
             <div class="header-search-box container py-3">
-                <form action="/search/" method="get" class="flex justify-between items-center">
+                <form :action="endpoint" method="get" class="flex justify-between items-center">
                     <input class="pl-2 -ml-2 py-2 font-display text-2xl flex-grow appearance-none focus:outline-none focus:bg-grey-100"
                            type="text"
-                           name="query"
+                           name="q"
                            autocomplete="off"
                            tabindex="-1"
                            ref="searchInput"
@@ -46,6 +46,10 @@
             placeholder: {
                 type: String,
                 default: 'Search...'
+            },
+            endpoint: {
+                type: String,
+                required: true
             }
         },
 

diff --git a/resources/styles/components/search.styl b/resources/styles/components/search.styl
new file mode 100644 (file)
index 0000000..07af7c1
--- /dev/null
+++ b/resources/styles/components/search.styl
@@ -0,0 +1,30 @@
+$breakpoint-search-results = 980px
+
+.search-results
+  &-layout
+    display: grid
+    constrain(grid-gap, 2.5vw)
+    grid-template: "results sidebar" auto / 3fr 1fr
+    grid-template-rows: max-content
+    grid-template-columns: auto
+
+    +below($breakpoint-search-results)
+      grid-template-areas: "results" "sidebar"
+
+  &-main
+    grid-area: results
+
+  &-sidebar
+    grid-area: sidebar
+    max-width: 348px
+
+    +below($breakpoint-search-results)
+      max-width: none
+
+    +above($breakpoint-search-results)
+      .form-footer
+        flex-wrap: wrap
+        flex-direction: column-reverse
+
+      .form-submit-button
+        @apply w-full mb-4

diff --git a/resources/views/components/flexible-image.blade.php b/resources/views/components/flexible-image.blade.php
index 08ec90601355e3ef74271b143aca0216f4387fd5..4013c4e56255fec47054a1e455decc982a22744e 100644 (file)
--- a/resources/views/components/flexible-image.blade.php
+++ b/resources/views/components/flexible-image.blade.php
@@ -8,10 +8,16 @@
 @if ($src)
 
     @php
-        $url=$src;
-        if(!file_exists($src)){
-            $src=public_path().$src;
+        $url = $src;
+        if (!file_exists($src)) {
+            $src = public_path() . $src;
         }
+
+        // It's possible that image might still not exist here so bail out
+        if (!file_exists($src)) {
+            return false;
+        }
+
         $meta = getimagesize($src);
         $ratio = $meta[1] / $meta[0] * 100 .'%'; // Height / Width
     @endphp

diff --git a/resources/views/pages/search.blade.php b/resources/views/pages/search.blade.php
new file mode 100644 (file)
index 0000000..b98a4bc
--- /dev/null
+++ b/resources/views/pages/search.blade.php
@@ -0,0 +1,66 @@
+@extends('layouts/app')
+
+@section('content')
+
+    <content class="pb-3v">
+        <text-block :title="$page->page_heading" />
+
+        <div class="search-results-layout">
+
+            <div class="search-results-main">
+
+                <div class="bg-grey-100 p-1v">
+                    <form action="{{ $nav->getHrefByName('recherche') }}" method="get" class="flex justify-between items-center sm:block">
+                        <input class="pl-2 -ml-2 py-2 font-display text-2xl flex-grow appearance-none sm:w-full xs:text-base"
+                               type="text"
+                               name="q"
+                               autocomplete="off"
+                               placeholder="{{ __('Saisissez votre recherche') }}">
+                        <button class="btn flex items-center py-3 px-8 font-display text-lg rounded ml-4 sm:mt-4 sm:mx-auto">
+                            @svg('search', 'fill-current mr-2')
+                            {{ __('Rechercher') }}
+                        </button>
+                    </form>
+                </div>
+
+                <div class="search-results mt-6">
+                    <div class="text-navy mb-2">{{ count($results) }}
+                        @if(count($results) == 1)
+                            {{ __('résultat') }}
+                        @else
+                            {{ __('résultats') }}
+                        @endif
+                    </div>
+
+                    @foreach ($results as $result)
+                        <div class="search-result py-5 @if(!$loop->last) border-b-2 border-grey-100 @endif">
+
+                            <div class="breadcrumbs">
+                                @foreach ($result['breadcrumbs'] as $breadcrumb)
+                                    <div @if(!$loop->last) class="breadcrumbs-item" @endif>
+                                        <a class="breadcrumbs-link" @if ($breadcrumb->url)href="{{ $breadcrumb->url }}" @endif>
+                                            {{ $breadcrumb->title }}
+                                        </a>
+                                    </div>
+                                @endforeach
+                            </div>
+
+                            <a class="text-2xl font-display mt-1 inline-block animated-underline" href="{{ $result['url'] }}">{{ $result['title'] }}</a>
+                        </div>
+                    @endforeach
+                </div>
+
+            </div>
+
+            <div class="search-results-sidebar">
+                <div class="bg-grey-100 p-1v">
+                    @form
+                </div>
+            </div>
+
+        </div>
+
+
+    </content>
+
+@endsection

diff --git a/resources/views/partials/form.blade.php b/resources/views/partials/form.blade.php
index c86ca5eb5ef167da8a28a5598b7b325e6721f968..8c2c8fbb6be65f382bc6e47077facb5a3a2f62ae 100644 (file)
--- a/resources/views/partials/form.blade.php
+++ b/resources/views/partials/form.blade.php
@@ -69,9 +69,9 @@
                 <div class="form-endmessage my-6 text-grey-dark text-sm">
                     @markdown($global->get('form_privacy'))
                 </div>
-                <div class="flex justify-between items-center xs:flex-col-reverse">
-                    <span class="text-grey-dark xs:self-start xs:mt-5">*{{__('Champs obligatoires')}}</span>
-                    <button type="submit" class="btn btn-custom xs:w-full"
+                <div class="form-footer flex justify-between items-center xs:flex-col-reverse">
+                    <span class="form-required-legend text-grey-dark xs:self-start xs:mt-5">*{{__('Champs obligatoires')}}</span>
+                    <button type="submit" class="form-submit-button btn btn-custom xs:w-full"
                             data-sending="{{__('Envoi en cours')}}">{{ $page->get('form_button_text', __('Envoyer')) }}</button>
                 </div>
             </form>

diff --git a/resources/views/partials/header.blade.php b/resources/views/partials/header.blade.php
index b4d55746f7bdac25362d519ade0567a1eee84380..9cf10b85e063a3483fa31c620a43dea787065824 100644 (file)
--- a/resources/views/partials/header.blade.php
+++ b/resources/views/partials/header.blade.php
@@ -50,7 +50,7 @@
 </header>
 
 @if(config('features.search'))
-    <search placeholder="{{ __('Rechercher ...') }}">
+    <search placeholder="{{ __('Rechercher ...') }}" endpoint="{{ $nav->getHrefByName('recherche') }}">
         <template v-slot:link>
             @svg('search')
         </template>