Changes for page CLB Search Component
Last modified by bougault on 2023/01/17 11:42
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -26,11 +26,10 @@ 26 26 27 27 customElements.define('clb-simplified-search', 28 28 class extends ClbComponent { 29 - searchBaseUrl = '/bin/get/XWiki/SuggestSolrService?outputSyntax=plain&media=json&nb=10&offset=0&query=q%3D%22__INPUT__%22~100%0Afq%3Dtype%3ADOCUMENT%0Afq%3Dspace%3ACollabs.*&input='; 29 + searchBaseUrl = 'https://wiki-dev.ebrains.eu/bin/get/XWiki/SuggestSolrService?outputSyntax=plain&media=json&nb=10&offset=0&query=q%3D%22__INPUT__%22~100%0Afq%3Dtype%3ADOCUMENT%0Afq%3Dspace%3ACollabs.*&input='; 30 30 constructor() { 31 31 super(); 32 32 this.results = []; 33 - this.offset = 0; 34 34 } 35 35 36 36 connectedCallback() { ... ... @@ -37,28 +37,26 @@ 37 37 // this.attachShadow({ mode: 'open' }); 38 38 super.connectedCallback(); 39 39 this.render(); 40 - this.$('#search').addEventListener('click', () => this.handleSearch()); 41 - this.$('#prev').addEventListener('click', () => { 42 - if(this.offset > 0) { 43 - this.offset--; 44 - this.handleSearch(); 45 - } 46 - }); 47 - this.$('#next').addEventListener('click', () => { 48 - this.offset++; 49 - this.handleSearch(); 50 - }); 39 + this.searchButton.addEventListener('click', () => this.handleSearch()); 51 51 } 52 52 53 53 54 54 handleSearch = () => { 55 - const value = this.$('input[type="text"]').value; 56 - fetch(`${this.searchBaseUrl}${encodeURIComponent(value)}&offset=${this.offset}&nb=10`) 44 + fetch(`${this.searchBaseUrl}${encodeURIComponent(this.searchInput.value)}`) 57 57 .then(res => res.json()) 58 58 .then(this.renderResults); 47 + 59 59 } 60 60 50 + get searchInput() { 51 + return this.$('input[type="text"]'); 52 + } 61 61 54 + get searchButton() { 55 + return this.$('#search'); 56 + } 57 + 58 + 62 62 get searchInputTemplate() { 63 63 return this.createTemplate(` 64 64 <div> ... ... @@ -70,7 +70,7 @@ 70 70 `); 71 71 } 72 72 73 - renderResults =(results)=>{70 + renderResults(results) { 74 74 const resultsContainer = this.$('#results'); 75 75 resultsContainer.replaceChildren(); 76 76 for(let i = 0, j = results.length; i < j; i++) {