https://www.vegusto.eu/shop/themes/grainfoodmarket/modules/ps_searchbar/ps_searchbar.js

1/* global $ */
2$(document).ready(function () {
3    var $searchWidget = $('#search_widget');
4    var $searchBox    = $searchWidget.find('input[type=text]');
5    var searchURL     = $searchWidget.attr('data-search-controller-url');
6
7    $.widget('prestashop.psBlockSearchAutocomplete', $.ui.autocomplete, {
8        _renderItem: function (ul, product) {
9            if ((product).hasOwnProperty("cover") && product.cover)  {
10                if (product.has_discount) {
11                    return $("<li>")
12                        .append($("<a>")
13                            .append($("<img src="+product.cover.bySize.menu_default.url+">").addClass("product-image"))
14                            .append($("<div class='product-desc'>")
15                                .append($("<span>").html(product.name).addClass("product"))
16                                .append($("<div class='prices-block'>")
17                                    .append($("<span>").html(product.price).addClass("product-price, price"))
18                                    .append($("<span>").html(product.regular_price).addClass("regular-price"))
19                                )
20                            )
21                        ).appendTo(ul)
22                        ;
23                } else {
24                    return $("<li>")
25                        .append($("<a>")
26                            .append($("<img src="+product.cover.bySize.menu_default.url+">").addClass("product-image"))
27                            .append($("<div class='product-desc'>")
28                                .append($("<span>").html(product.name).addClass("product"))
29                                .append($("<div class='prices-block'>")
30                                    .append($("<span>").html(product.price).addClass("product-price, price"))
31                                )
32                            )
33                        ).appendTo(ul)
34                        ;
35                }
36            } else {
37                if (product.has_discount) {
38                    return $("<li class='noimg-search'>")
39                        .append($("<a>")
40
41                            .append($("<div class='product-desc'>")
42                                .append($("<span>").html(product.name).addClass("product"))
43                                .append($("<div class='prices-block'>")
44                                    .append($("<span>").html(product.price).addClass("product-price, price"))
45                                    .append($("<span>").html(product.regular_price).addClass("regular-price"))
46                                )
47                            )
48                        ).appendTo(ul)
49                        ;
50                } else {
51                    return $("<li class='noimg-search'>")
52                        .append($("<a>")
53
54                            .append($("<div class='product-desc'>")
55                                .append($("<span>").html(product.name).addClass("product"))
56                                .append($("<div class='prices-block'>")
57                                    .append($("<span>").html(product.price).addClass("product-price, price"))
58                                )
59                            )
60                        ).appendTo(ul)
61                        ;
62                }
63            }
64        }
65        
66    });
67    jQuery.ui.autocomplete.prototype._resizeMenu = function () {
68        var ul = this.menu.element;
69        ul.outerWidth(this.element.outerWidth());
70    }
71    $searchBox.psBlockSearchAutocomplete({
72        source: function (query, response) {
73            $.post(searchURL, {
74                s: query.term,
75                resultsPerPage: 10
76            }, null, 'json')
77            .then(function (resp) {
78                response(resp.products);
79            })
80            .fail(response);
81        },
82        select: function (event, ui) {
83            var url = ui.item.url;
84            window.location.href = url;
85        },
86        open: function (event, ui) {
87            $('.ui-autocomplete').offset({left: ($('.ui-autocomplete-input').offset().left)});
88            $('.ui-autocomplete').width($('.ui-autocomplete-input').width()+60);
89        },
90    });
91});