@@ -19,7 +19,7 @@ const appElement = document.querySelector(appSelector);
1919
2020const app = createApp ( {
2121 props : {
22- url : String ,
22+ searchApiServer : String ,
2323 initialTimeout : Number ,
2424 moreTimeout : Number ,
2525 minChars : Number ,
@@ -85,8 +85,8 @@ const app = createApp({
8585 hasHits ( ) {
8686 return this . search . result . hits . length > 0
8787 } ,
88- cardHits ( ) {
89- return this . search . result . hits . map ( hit => this . guidesPathToCardHtmlElement . get ( hit . id ) ) . filter ( e => e )
88+ searchHits ( ) {
89+ return this . search . result . hits
9090 }
9191 } ,
9292 mounted ( ) {
@@ -101,7 +101,37 @@ const app = createApp({
101101 cards = appElement . querySelectorAll ( cardSelector )
102102 }
103103 this . guidesPathToCardHtmlElement = new Map ( Array . from ( cards )
104- . map ( element => [ new URL ( element . querySelector ( 'a' ) . href ) . pathname , element ] ) )
104+ . map ( element => {
105+ const link = element . querySelector ( 'h4 a' )
106+ if ( link ) {
107+ // new versions:
108+ const url = link . getAttribute ( 'href' ) ;
109+ return [
110+ new URL ( link . href ) . pathname ,
111+ {
112+ url : url ,
113+ className : element . className ,
114+ title : link . innerHTML ,
115+ summary : element . querySelector ( 'div .description' ) . innerHTML ,
116+ keywords : element . querySelector ( 'div .keywords' ) . innerHTML ,
117+ categories : element . querySelector ( 'div .categories' ) . innerHTML ,
118+ origin : element . querySelector ( 'div .origin' ) ?. innerHTML
119+ } ] ;
120+ } else {
121+ // older Quarkus versions:
122+ const url = element . querySelector ( 'a' ) . getAttribute ( 'href' )
123+ return [
124+ url ,
125+ {
126+ url : url ,
127+ className : element . className ,
128+ title : element . querySelector ( 'p.title' ) . innerHTML ,
129+ summary : element . querySelector ( 'div.description' ) . innerHTML ,
130+ keywords : element . querySelector ( 'div.keywords' ) . innerHTML ,
131+ origin : element . querySelector ( 'div.origin' ) ?. innerHTML
132+ } ] ;
133+ }
134+ } ) )
105135
106136 // Load more results on scroll
107137 document . addEventListener ( 'scroll' , e => {
@@ -157,11 +187,14 @@ const app = createApp({
157187 }
158188 const queryParams = {
159189 page : this . search . page ,
160- version : this . quarkusVersion
190+ version : this . quarkusVersion ,
191+ contentSnippets : 2 ,
192+ contentSnippetsLength : 120 ,
193+ highlightCssClass : 'highlighted'
161194 }
162195 Object . assign ( queryParams , this . search . input )
163196 const result = await this . _jsonFetch ( controller , 'GET' , queryParams , timeout )
164- this . search . result . hits = this . search . result . hits . concat ( result . hits )
197+ this . search . result . hits = this . search . result . hits . concat ( this . _processHits ( result . hits ) )
165198 this . search . result . hasMoreHits = result . hits . length > 0
166199 }
167200 catch ( error ) {
@@ -182,9 +215,15 @@ const app = createApp({
182215 }
183216 }
184217 } ,
218+ _processHits ( serverHits ) {
219+ return serverHits . map ( hit => {
220+ hit . content = hit ?. content . map ( paragraph => `...${ paragraph } )
221+ return hit ;
222+ } )
223+ } ,
185224 async _jsonFetch ( controller , method , queryParams , timeout ) {
186225 const timeoutId = setTimeout ( ( ) => controller . abort ( ) , timeout )
187- const response = await fetch ( this . url + '?' + ( new URLSearchParams ( queryParams ) ) . toString ( ) , {
226+ const response = await fetch ( ` ${ this . searchApiServer } api/guides/search? ${ new URLSearchParams ( queryParams ) } ` , {
188227 method : method ,
189228 signal : controller . signal ,
190229 body : null
@@ -203,21 +242,20 @@ const app = createApp({
203242
204243 return Array . from ( this . guidesPathToCardHtmlElement )
205244 . filter ( ( [ path , card ] ) => this . _javascriptFilter ( card , terms , categories ) )
206- . map ( ( [ path , _ ] ) => { return { id : path } } )
245+ . map ( ( [ _ , card ] ) => card )
207246 } ,
208247 _javascriptFilter ( card , terms , categories ) {
209248 let match = true
210249 if ( match && categories ) {
211- const categoriesElem = card . getElementsByClassName ( 'categories' ) . item ( 0 )
212- match = categoriesElem && this . _containsAllCaseInsensitive ( categoriesElem , categories )
250+ match = this . _containsAllCaseInsensitive ( card . categories , categories )
213251 }
214252 if ( match && terms ) {
215- match = this . _containsAllCaseInsensitive ( card , terms )
253+ match = this . _containsAllCaseInsensitive ( ` ${ card . keywords } ${ card . summary } ${ card . title } ${ card . categories } ` , terms )
216254 }
217255 return match
218256 } ,
219257 _containsAllCaseInsensitive ( elem , terms ) {
220- const text = ( elem . textContent || elem . innerText || '' ) . toLowerCase ( )
258+ const text = ( elem ? elem : '' ) . toLowerCase ( ) ;
221259 for ( let i in terms ) {
222260 if ( text . indexOf ( terms [ i ] . toLowerCase ( ) ) < 0 ) {
223261 return false
0 commit comments