Advertisement
Guest User

Untitled

a guest
Feb 7th, 2016
57
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.54 KB | None | 0 0
  1. <template name="autocomplete">
  2. <input id="{{name}}" class="autocomplete-input {{className}}"
  3. placeholder="{{placeholder}}" autocomplete="off"/>
  4. <ul class="suggestions"></ul>
  5. </template>
  6.  
  7. (function() {
  8. var inputEl, suggestionsEl, timeout, displayedSuggestions, selectedSuggestion;
  9. var search = function(inputString) {
  10. if (timeout) {
  11. clearTimeout(timeout);
  12. }
  13. timeout = setTimeout(function() {
  14. HTTP.get("https://photon.komoot.de/api/?q=" + inputString + "&lang=" + globalConfig.language, {},
  15. function(error, response) {
  16. if (error) {
  17.  
  18. } else {
  19. displayedSuggestions = response.data.features;
  20. display(displayedSuggestions);
  21. }
  22. });
  23. }, 300);
  24. };
  25.  
  26. var suggestionString = function (suggestion) {
  27. return suggestion.properties.name + ' (' + suggestion.properties.country + ')';
  28. };
  29.  
  30. var selectSuggestion = function(elt) {
  31. inputEl.value = elt.innerHTML;
  32. selectedSuggestion = displayedSuggestions[elt['data-index']];
  33. suggestionsEl.style.display = 'none';
  34. };
  35.  
  36. var display = function(data) {
  37. suggestionsEl.innerHTML = '';
  38. suggestionsEl.style.display = 'block';
  39. for (var i = 0; i < data.length; i++) {
  40. var suggestion = data[i];
  41. var li = document.createElement('li');
  42. li.className = "suggestion";
  43. li.onclick = function() {selectSuggestion(this);};
  44. li['data-index'] = i;
  45. li.innerHTML = suggestionString(suggestion);
  46. suggestionsEl.appendChild(li);
  47. }
  48.  
  49. };
  50.  
  51. Template.autocomplete.onRendered( function(){
  52. inputEl = this.find('.autocomplete-input');
  53. suggestionsEl = this.find('.suggestions');
  54. });
  55.  
  56. Template.autocomplete.events({
  57. "keyup .autocomplete-input": function (event) {
  58. search(event.target.value);
  59. }
  60. });
  61. })();
  62.  
  63. function(error, response) {
  64. if (error) {
  65.  
  66. } else {
  67. displayedSuggestions = response.data.features;
  68. display(displayedSuggestions);
  69. }
  70. }
  71.  
  72. // to
  73.  
  74. function(error, response){
  75. if(error) return; // throw new Error('nothing') or console.warn('')
  76. displayedSuggestions = response.data.features;
  77. display(displayedSuggestions);
  78. }
  79.  
  80. function debounce(fn, delay){
  81. var timer = null;
  82. return function(){
  83. if(timer) clearTimeout(timer);
  84. setTimeout(fn, delay || 300);
  85. }
  86. }
  87.  
  88. var search = debounce(function(){
  89. // Your AJAX code
  90. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement