$(document).ready(function () {
    var $searchWidget = $('[data-search-widget]'),
        $searchBox    = $searchWidget.find('input[type=text]'),
        searchURL     = $searchWidget.attr('data-search-controller-url');

    $searchBox.autoComplete({
        minChars: 3,
        source: function (query, response) {
            $.post(searchURL, {
                s: query,
                resultsPerPage: 20
            }, null, 'json')
                .then(function (resp) {
                    response(resp.products);
                })
                .fail(response);
        },
        renderItem: function (product, search) {

            return '<div class="media autocomplete-suggestion" data-url="' + product.url + '">' +
                '<div class="media-body">' + product.name + '</div>' +
                '<div class="media-body text-right">' + product.price + '</div>' +
                '</div>';
        },
        onSelect: function (e, term, item) {
            window.location.href = item.data('url');
        }
    });

    $(document).on('submit', '#search-top', function (e) {
        if($('#search-top-input').val() == '') {
            $('#search-top-input').attr('placeholder', '¿Qué perfume buscas? Si tienes alguna duda contactanos ...');
            e.preventDefault();
        }
    });

});