demarches-normaliennes/app/javascript/shared/autocomplete.js

52 lines
1.3 KiB
JavaScript
Raw Normal View History

import autocomplete from 'autocomplete.js';
2018-10-09 11:35:22 +02:00
import { getJSON, fire } from '@utils';
const sources = [
{
type: 'address',
2018-10-15 23:39:42 +02:00
url: '/address/suggestions'
}
];
const options = {
autoselect: true,
minLength: 1
};
function selector(type) {
return `[data-autocomplete=${type}]`;
}
function source(url) {
return {
source(query, callback) {
2018-10-09 11:35:22 +02:00
getJSON(url, { request: query }).then(callback);
},
templates: {
suggestion({ label, mine }) {
const mineClass = `path-mine-${mine ? 'true' : 'false'}`;
const openTag = `<div class="aa-suggestion ${mineClass}">`;
return autocomplete.escapeHighlightedString(label, openTag, '</div>');
}
2018-10-15 21:41:42 +02:00
},
debounce: 300
};
}
2019-08-01 15:22:37 +02:00
addEventListener('ds:page:update', function() {
for (let { type, url } of sources) {
2019-02-07 11:01:21 +01:00
for (let element of document.querySelectorAll(selector(type))) {
element.removeAttribute('data-autocomplete');
autocompleteInitializeElement(element, url);
2018-08-28 12:04:44 +02:00
}
}
2019-08-01 15:22:37 +02:00
});
2019-02-07 11:01:21 +01:00
function autocompleteInitializeElement(element, url) {
const select = autocomplete(element, options, [source(url)]);
select.on('autocomplete:selected', ({ target }, suggestion) => {
fire(target, 'autocomplete:select', suggestion);
select.autocomplete.setVal(suggestion.label);
});
}