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,7 +1,6 @@ 1 1 {{html clean="false"}} 2 2 <!-- 3 - !!! POC. Code must be reviewed / optimized and packaged for use in production !!! 4 - !!! Many optimisations can be done !!! 3 + !!! POC. Code must be reviewed / optimized and packaged for use in production !!! 5 5 --> 6 6 <script type="module"> 7 7 import {LitElement, html, css} from 'https://cdn.jsdelivr.net/gh/lit/dist@2/core/lit-core.min.js'; ... ... @@ -8,15 +8,21 @@ 8 8 window.addEventListener('DOMContentLoaded', function() { 9 9 10 10 class UnifiedSearch extends LitElement { 10 + /* 11 11 static properties = { 12 - results: { type: Array }, 13 - resultsCache: { type: Array }, 14 - collabFiltersResults: { type: Array} 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 }, 15 15 } 20 + */ 21 + static properties = { 22 + results: { type: Array } 23 + } 16 16 static styles = css` 17 - :host > div { 18 - padding-bottom: 4em; 19 - } 20 20 .result { 21 21 margin-top: 1em; 22 22 } ... ... @@ -27,16 +27,6 @@ 27 27 a { 28 28 color: var(--color-brand-primary, blue); 29 29 } 30 - .rawResults { 31 - width: 100%; 32 - display: flex; 33 - font-size: 12px; 34 - margin-top: 2em; 35 - } 36 - .rawResults ul { 37 - list-style-type: none; 38 - padding: 0; 39 - } 40 40 `; 41 41 constructor() { 42 42 super(); ... ... @@ -49,11 +49,7 @@ 49 49 this.filterUrl = new URL(`${document.location.origin}/rest/v1/collabs?search=&offset=0&orderField=title&order=asc&limit=10000&favorite=false&roles=`); 50 50 this.results = []; 51 51 this.resultsCache = []; 52 - this.collabFiltersResults = []; 53 53 } 54 - firstUpdated() { 55 - this.renderRoot.getElementById('searchInput').focus(); 56 - } 57 57 toggleRoleFilter(roleName) { 58 58 if(this.rolesFilter.indexOf(roleName) === -1) { 59 59 this.rolesFilter.push(roleName); ... ... @@ -70,7 +70,6 @@ 70 70 handleSearch(textSearch) { 71 71 if(this.searchText !== "" || textSearch) { 72 72 if(this.searchText !== this.prevSearchText) { 73 - this.clearResults(); 74 74 this.prevSearchText = this.searchText; 75 75 this.fetchWikiSearch().then(results => { 76 76 this.resultsCache = results; ... ... @@ -80,6 +80,16 @@ 80 80 this.results = results; 81 81 } 82 82 }) 73 + /* 74 + Promise.all([ 75 + this.fetchWikiSearch(), 76 + this.fetchFilterSearch() 77 + ]).then(([wikiSearchResults, collabSearchResults]) => { 78 + this.results = wikiSearchResults; 79 + this.resultsCache = wikiSearchResults; 80 + console.log(wikiSearchResults, collabSearchResults); 81 + }); 82 + */ 83 83 } else if (this.searchText === this.prevSearchText && this.hasActiveFilters()) { 84 84 this.fetchFilterSearch().then(this.filterResults) 85 85 } else { ... ... @@ -104,10 +104,7 @@ 104 104 fetchFilterSearch() { 105 105 return new Promise((resolve) => { 106 106 if(this.hasActiveFilters()) { 107 - fetch(this.filterUrl).then(res => res.json()).then((res) => { 108 - this.collabFiltersResults = res; 109 - resolve(res); 110 - }); 107 + fetch(this.filterUrl).then(res => res.json()).then(resolve); 111 111 } else { 112 112 resolve([]); 113 113 } ... ... @@ -124,16 +124,11 @@ 124 124 getLink(xwikiDocSpace) { 125 125 return `/bin/view/${xwikiDocSpace.replaceAll('.', '/')}`; 126 126 } 127 - handleKeyPress(e) { 128 - if (e.keyCode === 13) { 129 - this.handleSearch(true); 130 - } 131 - } 132 132 render() { 133 133 return html` 134 134 <div> 135 135 <div> 136 - <input id="searchInput"@change="${this.setSearchText}" type="text" placeholder="Search..."@keypress="${this.handleKeyPress}"/>128 + <input @change="${this.setSearchText}" type="text" placeholder="Search..." /> 137 137 <button @click="${() => this.handleSearch(true)}">Search</button> 138 138 </div> 139 139 <div> ... ... @@ -150,16 +150,6 @@ 150 150 </div> 151 151 `)} 152 152 </div> 153 - <div class="rawResults"> 154 - <div> 155 - <strong>XWiki Search Results</strong> 156 - <ul>${this.resultsCache.map((res) => html`<li>${res.space}</li>`)}</ul> 157 - </div> 158 - <div> 159 - <strong>Collab Search Results (Filters)</strong> 160 - <ul>${this.collabFiltersResults.map((res) => html`<li>${res.name}</li>`)}</ul> 161 - </div> 162 - </div> 163 163 </div> 164 164 ` 165 165 } ... ... @@ -187,5 +187,7 @@ 187 187 } 188 188 }); 189 189 </script> 172 + 190 190 <clb-unified-search></clb-unified-search> 174 + 191 191 {{/html}}