/
sagOne.html
106 lines (86 loc) · 2.37 KB
/
sagOne.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<link rel="stylesheet" type="text/css" href="css/sag/instantsearch.min.css">
<script src="js/sag/instantsearch.js"></script>
<link rel="stylesheet" type="text/css" href="css/sag/instantsearch-theme-algolia.min.css">
<link rel="stylesheet" type="text/css" href="css/sag/instantsearch.min.css">
<script>
// const instantsearch = require('js/sag/instantsearch.js');
// const search = instantsearch(options);
// import instantsearch from "js/sag/instantsearch.js";
const search = instantsearch({
appId: '45FAXPQVEG',
apiKey: '7d0c43617ef2a76ef50343c43900245b',
indexName: 'test_index',
routing: true
});
// initialize SearchBox
search.addWidget(
instantsearch.widgets.searchBox({
container: '#search-box',
placeholder: 'Search for products'
})
);
// initialize RefinementList
search.addWidget(
instantsearch.widgets.refinementList({
container: '#refinement-list',
attributeName: 'categories'
})
);
// initialize currentRefinedValues
search.addWidget(
instantsearch.widgets.currentRefinedValues({
container: '#current-refined-values',
// This widget can also contain a clear all link to remove all filters,
// we disable it in this example since we use `clearAll` widget on its own.
clearAll: false
})
);
// initialize clearAll
search.addWidget(
instantsearch.widgets.clearAll({
container: '#clear-all',
templates: {
link: 'Reset everything'
},
autoHideContainer: false
})
);
// initialize pagination
search.addWidget(
instantsearch.widgets.pagination({
container: '#pagination',
maxPages: 20,
// default is to scroll to 'body', here we disable this behavior
scrollTo: false
})
);
// initialize hits widget
search.addWidget(
instantsearch.widgets.hits({
container: '#hits',
templates: {
empty: 'No results',
item: '<em>Hit {{objectID}}</em>: {{{_highlightResult.name.value}}}'
}
})
);
search.start();
</script>
<div id="search-box">
<!-- SearchBox widget will appear here -->
</div>
<div id="refinement-list">
<!-- RefinementList widget will appear here -->
</div>
<div id="current-refined-values">
<!-- CurrentRefinedValues widget will appear here -->
</div>
<div id="clear-all">
<!-- ClearAll widget will appear here -->
</div>
<div id="pagination">
<!-- Pagination widget will appear here -->
</div>
<div id="hits">
<!-- Hits widget will appear here -->
</div>