Changes for page Context Search
Last modified by bougault on 2023/02/20 16:29
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,6 +1,7 @@ 1 1 {{html clean="false"}} 2 2 <!-- 3 - !!! POC. Code must be reviewed / optimized and packaged for use in production !!! 3 + !!! POC. Code must be reviewed / optimized and packaged for use in production !!! 4 + !!! Many optimisations can be done !!! 4 4 --> 5 5 <script type="module"> 6 6 import {LitElement, html, css} from 'https://cdn.jsdelivr.net/gh/lit/dist@2/core/lit-core.min.js'; ... ... @@ -7,21 +7,15 @@ 7 7 window.addEventListener('DOMContentLoaded', function() { 8 8 9 9 class UnifiedSearch extends LitElement { 10 - /* 11 11 static properties = { 12 - searchText: { type: String }, 13 - favoritesFilter: { type: Boolean }, 14 - administratorFilter: { type: Boolean }, 15 - editorFilter: { type: Boolean }, 16 - viewerFilter: { type: Boolean }, 17 - publicFilter: { type: Boolean }, 18 - privateFilter: { type: Boolean }, 12 + results: { type: Array }, 13 + resultsCache: { type: Array }, 14 + collabFiltersResults: { type: Array} 19 19 } 20 - */ 21 - static properties = { 22 - results: { type: Array } 23 - } 24 24 static styles = css` 17 + :host > div { 18 + padding-bottom: 4em; 19 + } 25 25 .result { 26 26 margin-top: 1em; 27 27 } ... ... @@ -45,6 +45,9 @@ 45 45 this.results = []; 46 46 this.resultsCache = []; 47 47 } 43 + firstUpdated() { 44 + this.renderRoot.getElementById('searchInput').focus(); 45 + } 48 48 toggleRoleFilter(roleName) { 49 49 if(this.rolesFilter.indexOf(roleName) === -1) { 50 50 this.rolesFilter.push(roleName); ... ... @@ -61,22 +61,16 @@ 61 61 handleSearch(textSearch) { 62 62 if(this.searchText !== "" || textSearch) { 63 63 if(this.searchText !== this.prevSearchText) { 62 + this.clearResults(); 64 64 this.prevSearchText = this.searchText; 65 65 this.fetchWikiSearch().then(results => { 66 - //this.results = results; 67 67 this.resultsCache = results; 68 - this.fetchFilterSearch().then(this.filterResults); 66 + if(this.hasActiveFilters()) { 67 + this.fetchFilterSearch().then(this.filterResults); 68 + } else { 69 + this.results = results; 70 + } 69 69 }) 70 - /* 71 - Promise.all([ 72 - this.fetchWikiSearch(), 73 - this.fetchFilterSearch() 74 - ]).then(([wikiSearchResults, collabSearchResults]) => { 75 - this.results = wikiSearchResults; 76 - this.resultsCache = wikiSearchResults; 77 - console.log(wikiSearchResults, collabSearchResults); 78 - }); 79 - */ 80 80 } else if (this.searchText === this.prevSearchText && this.hasActiveFilters()) { 81 81 this.fetchFilterSearch().then(this.filterResults) 82 82 } else { ... ... @@ -101,7 +101,10 @@ 101 101 fetchFilterSearch() { 102 102 return new Promise((resolve) => { 103 103 if(this.hasActiveFilters()) { 104 - fetch(this.filterUrl).then(res => res.json()).then(resolve); 96 + fetch(this.filterUrl).then(res => res.json()).then((res) => { 97 + this.collabFiltersResults = res; 98 + resolve(res); 99 + }); 105 105 } else { 106 106 resolve([]); 107 107 } ... ... @@ -118,11 +118,16 @@ 118 118 getLink(xwikiDocSpace) { 119 119 return `/bin/view/${xwikiDocSpace.replaceAll('.', '/')}`; 120 120 } 116 + handleKeyPress(e) { 117 + if (e.keyCode === 13) { 118 + this.handleSearch(true); 119 + } 120 + } 121 121 render() { 122 122 return html` 123 123 <div> 124 124 <div> 125 - <input @change="${this.setSearchText}" type="text" placeholder="Search..." /> 125 + <input id="searchInput" @change="${this.setSearchText}" type="text" placeholder="Search..." @keypress="${this.handleKeyPress}" /> 126 126 <button @click="${() => this.handleSearch(true)}">Search</button> 127 127 </div> 128 128 <div> ... ... @@ -139,6 +139,16 @@ 139 139 </div> 140 140 `)} 141 141 </div> 142 + <div class="rawResults"> 143 + <div> 144 + <strong>XWiki Search Results</strong> 145 + <pre>${this.resultsCache}</pre> 146 + </div> 147 + <div> 148 + <strong>Collab Search Results (Filters)</strong> 149 + <pre>${this.collabFiltersResults}</pre> 150 + </div> 151 + </div> 142 142 </div> 143 143 ` 144 144 } ... ... @@ -166,7 +166,5 @@ 166 166 } 167 167 }); 168 168 </script> 169 - 170 170 <clb-unified-search></clb-unified-search> 171 - 172 172 {{/html}}