85 lines
3.9 KiB
HTML
85 lines
3.9 KiB
HTML
<form action="{urlfor internal="stProduct/list"}" class="form-inline search" method="get">
|
|
<div class="input-group">
|
|
<label class="sr-only" for="search">{__ text="Wyszukaj" langCatalogue="stSearchFrontend"}</label>
|
|
<input type="search" autocomplete="off" class="form-control" name="query" value="" placeholder='{__ text="Wyszukaj" langCatalogue="stSearchFrontend"}...' />
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-default btn-search" type="submit">
|
|
<svg enable-background="new 0 0 512 512" height="16px" version="1.1" viewBox="0 0 512 512" width="16px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M497.913,497.913c-18.782,18.782-49.225,18.782-68.008,0l-84.862-84.863c-34.889,22.382-76.13,35.717-120.659,35.717 C100.469,448.767,0,348.312,0,224.383S100.469,0,224.384,0c123.931,0,224.384,100.452,224.384,224.383 c0,44.514-13.352,85.771-35.718,120.676l84.863,84.863C516.695,448.704,516.695,479.131,497.913,497.913z M224.384,64.109 c-88.511,0-160.274,71.747-160.274,160.273c0,88.526,71.764,160.274,160.274,160.274c88.525,0,160.273-71.748,160.273-160.274 C384.657,135.856,312.909,64.109,224.384,64.109z"/></svg>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
</form>
|
|
|
|
{literal}
|
|
<script id="search-result-tpl" type="text/x-template">
|
|
<div class="media">
|
|
<div class="media-left">
|
|
<a href="#">
|
|
<img class="media-object" src="{%=o.image%}" alt="{%=o.name%}">
|
|
</a>
|
|
</div>
|
|
<div class="media-body">
|
|
<h4 class="media-heading">{%=o.name%}</h4>
|
|
{% if (o.price) { %}
|
|
<div class="price-info">
|
|
{% if (o.price.type == 'gross_net') { %}
|
|
<span class="price">{%=o.price.brutto%}</span>
|
|
{% } else if (o.price.type == 'net_gross') { %}
|
|
<span class="price">{%=o.price.netto%}</span>
|
|
{% } else if (o.price.type == 'only_net') { %}
|
|
<span class="price">{%=o.price.netto%}</span>
|
|
{% } else { %}
|
|
<span class="price">{%=o.price.brutto%}</span>
|
|
{% } %}
|
|
</div>
|
|
{% } %}
|
|
</div>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/javascript">
|
|
jQuery(function($) {
|
|
$('.search').submit(function() {
|
|
var input = $(this).find('input[name=query]');
|
|
|
|
if (!input.val()) {
|
|
input.parent().addClass('has-error');
|
|
return false;
|
|
}
|
|
|
|
input.parent().removeClass('has-error');
|
|
return true;
|
|
});
|
|
|
|
var products = new Bloodhound({
|
|
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
|
|
queryTokenizer: Bloodhound.tokenizers.whitespace,
|
|
remote: {
|
|
url: '{/literal}{urlfor internal="@stSearchPlugin?action=typeahead"}?query=%QUERY{literal}',
|
|
wildcard: '%QUERY'
|
|
},
|
|
limit: 100
|
|
});
|
|
|
|
products.initialize();
|
|
|
|
var tpl = tmpl($('#search-result-tpl').html());
|
|
|
|
var typeahead = $('.search input[type="search"]');
|
|
typeahead.typeahead({
|
|
source: products.ttAdapter(),
|
|
messages: {
|
|
noresults: "{/literal}{__ text='Brak produktów dla wybranych kryteriów' catalogue='stProduct'}{literal}"
|
|
},
|
|
viewport: { selector: '#header-navbar', padding: 0 },
|
|
template: function(suggestions) {
|
|
var content = '';
|
|
for (var i = 0; i < suggestions.length; i++) {
|
|
content += '<li data-url="'+suggestions[i].url+'">'+tpl(suggestions[i])+'</li>';
|
|
}
|
|
return content;
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
{/literal} |