Add image preview to autocomplete search

app/Resources/views/base.html.twig

@@ -73,7 +73,8 @@
                 fields: {
                     title: 'name',
                     description: 'id',
-                    url: 'url'
+                    url: 'url',
+                    image: 'img'
                 }
             });
     </script>

app/config/config/liip_imagine.yml

@@ -10,7 +10,8 @@ liip_imagine:
               cache: ~
               default_image: "/resources/images/noimage_min.png"
               filters:
-                  thumbnail: { size: [200, 200], mode: inset, allow_upscale: true }
+                  upscale: { min: [230, 230] }
+                  thumbnail: { size: [230, 230], mode: inset, allow_upscale: true }
                   background: { size: [250, 250], position: center, color: '#FFFFFF' }
         set_large:
               data_loader: set_image_loader
@@ -18,6 +19,7 @@ liip_imagine:
               quality: 90
               default_image: "/resources/images/noimage_large.png"
               filters:
+                  upscale: { min: [840, 580] }
                   thumbnail: { size: [840, 580], mode: inset, allow_upscale: true }
                   background: { size: [900, 600], position: center, color: '#FFFFFF' }
         part_min:
@@ -26,8 +28,8 @@ liip_imagine:
               cache: ~
               default_image: "/resources/images/noimage_min.png"
               filters:
-                  upscale: {min: [200, 200]}
+                  upscale: { min: [230, 230] }
-                  thumbnail: { size: [200, 200], mode: inset, allow_upscale: true }
+                  thumbnail: { size: [230, 230], mode: inset, allow_upscale: true }
                   background: { size: [250, 250], position: center, color: '#FFFFFF' }
         part_large:
               data_loader: part_image_loader
@@ -35,5 +37,6 @@ liip_imagine:
               quality: 90
               default_image: "/resources/images/noimage_large.png"
               filters:
-                  thumbnail: { size: [840, 580], mode: inset, allow_upscale: true }
+                  upscale: { min: [600, 400] }
+                  thumbnail: { size: [600, 400], mode: inset, allow_upscale: true }
                   background: { size: [900, 600], position: center, color: '#FFFFFF' }

src/AppBundle/Controller/SearchController.php

@@ -8,6 +8,8 @@ use AppBundle\Repository\Search\ModelRepository;
 use AppBundle\Repository\Search\SetRepository;
 use FOS\ElasticaBundle\HybridResult;
 use FOS\ElasticaBundle\Repository;
+use Liip\ImagineBundle\Imagine\Cache\CacheManager;
+use Liip\ImagineBundle\Imagine\Cache\Resolver\CacheResolver;
 use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
 use Symfony\Bundle\FrameworkBundle\Controller\Controller;
 use Symfony\Component\HttpFoundation\JsonResponse;
@@ -53,6 +55,9 @@ class SearchController extends Controller
     {
         $query = trim(strip_tags($request->get('query')));
 
+        /** @var CacheManager $liip */
+        $liip = $this->get('liip_imagine.cache.manager');
+
         /** var FOS\ElasticaBundle\Manager\RepositoryManager */
         $repositoryManager = $this->get('fos_elastica.manager');
 
@@ -75,6 +80,7 @@ class SearchController extends Controller
                 'id' => $id,
                 'name' => $name,
                 'url' => $this->generateUrl('model_detail', ['id' => $model->getTransformed()->getId()]),
+                'img' =>  $liip->getBrowserPath('-1/'.$model->getTransformed()->getId().'.png','part_min'),
             ];
         }
 
@@ -88,6 +94,7 @@ class SearchController extends Controller
                 'id' => $id,
                 'name' => $name,
                 'url' => $this->generateUrl('set_detail', ['id' => $set->getTransformed()->getId()]),
+                'img' =>  $liip->getBrowserPath($set->getTransformed()->getId().'.jpg','set_min'),
             ];
         }
 

src/AppBundle/Repository/Search/ModelRepository.php

@@ -13,23 +13,25 @@ class ModelRepository extends Repository
      * @return \Elastica\Query
      */
     public function getSearchQuery(ModelSearch $modelSearch) {
-        $boolQuery = new \Elastica\Query\BoolQuery();
+        $boolQuery = new Query\BoolQuery();
 
         if ($searchQuery = $modelSearch->getQuery()) {
-            $query = new \Elastica\Query\MultiMatch();
+            $query = new Query\MultiMatch();
 
             $query->setFields(['name', 'id', 'aliases.id', 'keywords.name']);
             $query->setQuery($searchQuery);
             $query->setFuzziness(0.7);
             $query->setMinimumShouldMatch('80%');
+            $query->setOperator('and');
+
         } else {
-            $query = new \Elastica\Query\MatchAll();
+            $query = new Query\MatchAll();
         }
 
         $boolQuery->addMust($query);
 
         if ($modelSearch->getCategory()) {
-            $categoryQuery = new \Elastica\Query\Match();
+            $categoryQuery = new Query\Match();
             $categoryQuery->setField('category.id', $modelSearch->getCategory()->getId());
             $boolQuery->addFilter($categoryQuery);
         }