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,9 +1,9 @@ 1 1 {{html clean="false"}} 2 2 <!-- 3 - !!! POC. Code wouldmust be reviewed / optimized and packaged for use in production !!!3 + !!! POC. Code must be reviewed / optimized and packaged for use in production !!! 4 4 --> 5 5 <script type="module"> 6 -import {LitElement, html} from 'https://cdn.jsdelivr.net/gh/lit/dist@2/core/lit-core.min.js'; 6 +import {LitElement, html, css} from 'https://cdn.jsdelivr.net/gh/lit/dist@2/core/lit-core.min.js'; 7 7 window.addEventListener('DOMContentLoaded', function() { 8 8 9 9 class UnifiedSearch extends LitElement { ... ... @@ -18,6 +18,21 @@ 18 18 privateFilter: { type: Boolean }, 19 19 } 20 20 */ 21 + static properties = { 22 + results: { type: Array } 23 + } 24 + static styles = css` 25 + .result { 26 + margin-top: 1em; 27 + } 28 + .light { 29 + color: var(--color-gray-500, #CCC); 30 + font-size: 14px; 31 + } 32 + a { 33 + color: var(--color-brand-primary, blue); 34 + } 35 + `; 21 21 constructor() { 22 22 super(); 23 23 this.searchText = ""; ... ... @@ -26,6 +26,7 @@ 26 26 this.viewer = false; 27 27 this.rolesFilter = []; 28 28 this.filterUrl = new URL(`${document.location.origin}/rest/v1/collabs?search=&offset=0&orderField=title&order=asc&favorite=true&roles=`); 44 + this.results = []; 29 29 } 30 30 toggleRoleFilter(roleName) { 31 31 if(this.rolesFilter.indexOf(roleName) == -1) { ... ... @@ -41,10 +41,20 @@ 41 41 } 42 42 handleSearch() { 43 43 console.log(this.searchText); 60 + if(this.searchText !== "") { 61 + this.fetchWikiSearch(); 62 + } 44 44 } 64 + fetchWikiSearch() { 65 + // request should be built from component, not from "external" dependency. Leave it here like this for POC. 66 + handleXWikiSearch(this.searchText).then(results => this.results = results); 67 + } 45 45 buildFilter() { 46 46 //https://wiki-dev.ebrains.eu/rest/v1/collabs?search=&offset=0&orderField=title&order=asc&favorite=true&roles= 47 47 } 71 + getLink(xwikiDocSpace) { 72 + return `/bin/view/${xwikiDocSpace.replaceAll('.', '/')}`; 73 + } 48 48 render() { 49 49 return html` 50 50 <div> ... ... @@ -57,6 +57,15 @@ 57 57 <label><input type="checkbox" @change="${() => this.toggleRoleFilter('editor')}" .checked="${this.editorFilter}"/> Editor</label> 58 58 <label><input type="checkbox" @change="${() => this.toggleRoleFilter('viewer')}" .checked="${this.viewerFilter}"/> Viewer</label> 59 59 </div> 86 + <div> 87 + ${this.results.map(result => html` 88 + <div class="result"> 89 + <a href="${this.getLink(result.space)}">${result.title_}</a> 90 + <div>${result.doccontent_.substring(0, 150)} 91 + <div class="light">${result.space.replaceAll('.', ' / ')}</div> 92 + </div> 93 + `)} 94 + </div> 60 60 </div> 61 61 ` 62 62 } ... ... @@ -63,30 +63,22 @@ 63 63 } 64 64 customElements.define('clb-unified-search', UnifiedSearch); 65 65 66 - function handleXWikiSearch(space, callback) { 67 - require(['jquery'], function($) { 68 - var solrServiceURL = new XWiki.Document('SuggestSolrService', 'XWiki').getURL('get'); 69 - const contextSearchButton = document.getElementById("context-search-button"); 70 - const xwikiSpace = space ? `.${space}` : ''; 71 - contextSearchButton.addEventListener('click', function() { 72 - $.post(solrServiceURL, { 73 - outputSyntax: 'plain', 74 - media: 'json', 75 - query: [ 76 - 'q="__INPUT__"~100', 77 - 'fq=type:DOCUMENT', 78 - `fq=space:Collabs${xwikiSpace}.*` 79 - ].join('\n'), 80 - input: $('#context-search-text').val() 81 - }).then(res => { 82 - if(callback) { 83 - callback(res).then(results => { 84 - contextSearchResponse.innerText = JSON.stringify(results, null, 2); 85 - }) 86 - } else { 87 - contextSearchResponse.innerText = JSON.stringify(res, null, 2); 88 - } 89 - }); 101 + function handleXWikiSearch(searchString) { 102 + return new Promise((resolve) => { 103 + require(['jquery'], function($) { 104 + const solrServiceURL = new XWiki.Document('SuggestSolrService', 'XWiki').getURL('get'); 105 + //contextSearchButton.addEventListener('click', function() { 106 + $.post(solrServiceURL, { 107 + outputSyntax: 'plain', 108 + media: 'json', 109 + query: [ 110 + 'q="__INPUT__"~100', 111 + 'fq=type:DOCUMENT', 112 + `fq=space:Collabs.*` 113 + ].join('\n'), 114 + input: searchString 115 + }).then(resolve); 116 + //}); 90 90 }); 91 91 }); 92 92 } ... ... @@ -94,130 +94,5 @@ 94 94 </script> 95 95 96 96 <clb-unified-search></clb-unified-search> 97 -<!-- 98 -<select id="context-search-type"> 99 - <option value="all">All</option> 100 - <option value="collabs">Collabs</option> 101 - <option value="current-collab">Current Collab</option> 102 -</select> 103 -<input type="text" id="context-search-text" /> 104 -<button id="context-search-button" class="btn btn-primary">Search</button> 105 -<div class="form-group"> 106 - <label> 107 - <input type="checkbox" data-role-filter="administrator"> Administrator 108 - </label> 109 - <label> 110 - <input type="checkbox" data-role-filter="editor"> Editor 111 - </label> 112 -</div> 113 113 114 - 115 -<pre id="context-search-response"></pre> 116 -<script> 117 - window.addEventListener('DOMContentLoaded', function() { 118 - const filters = { 119 - search: '', 120 - offset: 0, 121 - orderField: 'title', 122 - order: 'asc', 123 - favorite: false, 124 - roles: [] // to be joined as administrator+editor+viewer 125 - }; 126 - 127 - function addRole(role) { 128 - if(filters.roles.indexOf(role) == -1) { 129 - filters.roles.push(role); 130 - } 131 - } 132 - 133 - function removeRole(role) { 134 - filters.roles = filters.roles.filter(r => r !== role) 135 - } 136 - 137 - const filterInputs = document.querySelectorAll('input[data-role-filter]'); 138 - 139 - filterInputs.forEach(function(filterIpt) { 140 - filterIpt.addEventListener('click', function() { 141 - const role = this.getAttribute('data-role-filter'); 142 - if(this.checked) { 143 - addRole(role); 144 - } else { 145 - removeRole(role); 146 - } 147 - runFilteredRequest(); 148 - }) 149 - }); 150 - 151 - function runFilteredRequest() { 152 - const urlParams = new URLSearchParams(); 153 - const tmpFilters = filters; 154 - tmpFilters.roles = tmpFilters.roles.join("+"); 155 - for(filter in tmpFilters) { 156 - urlParams.set(filter, tmpFilters[filter]); 157 - } 158 - console.log(urlParams); 159 - } 160 - // https://wiki-dev.ebrains.eu/rest/v1/collabs?search=&offset=0&orderField=title&order=asc&favorite=false&roles=administrator 161 - const contextSearchType = document.getElementById("context-search-type"); 162 - const contextSearchText = document.getElementById("context-search-text"); 163 - const contextSearchResponse = document.getElementById("context-search-response"); 164 - const contextSearchButton = document.getElementById("context-search-button"); 165 - contextSearchButton.addEventListener('click', function() { 166 - const context = contextSearchType.options[contextSearchType.selectedIndex].value; 167 - const term = contextSearchText.value; 168 - switch(context) { 169 - case 'collabs': 170 - document.location.href = `/bin/view/Collabs/#search=${term}`; 171 - break; 172 - case 'current-collab': 173 - handleXWikiSearch('bougaultx'); 174 - break 175 - default: 176 - handleXWikiSearch('') 177 - } 178 - 179 - }); 180 - function handleXWikiSearch(space, callback) { 181 - require(['jquery'], function($) { 182 - var solrServiceURL = new XWiki.Document('SuggestSolrService', 'XWiki').getURL('get'); 183 - const contextSearchButton = document.getElementById("context-search-button"); 184 - const xwikiSpace = space ? `.${space}` : ''; 185 - contextSearchButton.addEventListener('click', function() { 186 - $.post(solrServiceURL, { 187 - outputSyntax: 'plain', 188 - media: 'json', 189 - query: [ 190 - 'q="__INPUT__"~100', 191 - 'fq=type:DOCUMENT', 192 - `fq=space:Collabs${xwikiSpace}.*` 193 - ].join('\n'), 194 - input: $('#context-search-text').val() 195 - }).then(res => { 196 - if(callback) { 197 - callback(res).then(results => { 198 - contextSearchResponse.innerText = JSON.stringify(results, null, 2); 199 - }) 200 - } else { 201 - contextSearchResponse.innerText = JSON.stringify(res, null, 2); 202 - } 203 - }); 204 - }); 205 - }); 206 - } 207 - function applyAdministratorFilter(results) { 208 - return new Promise((resolve, reject) => { 209 - //fetch("/rest/v1/collabs?roles=administrator") 210 - fetch("/rest/v1/collabs?search=&offset=0&orderField=title&order=asc&favorite=false&roles=administrator") 211 - .then(res => res.json()) 212 - .then(collabs => { 213 - const spaces = collabs.map(collab => `Collabs.${collab.name}`); 214 - const filtered = results.filter(result => spaces.some(space => result.space.startsWith(space))); 215 - resolve(filtered); 216 - }) 217 - 218 - }) 219 - } 220 -}); 221 -</script> 222 ---> 223 223 {{/html}}