Changes for page Solr Search

Last modified by Mark Kohlmann on 2025/01/19 06:48

From version 4.1
edited by Mark Kohlmann
on 2025/01/19 06:48
Change comment: Install extension [org.xwiki.platform:xwiki-platform-search-solr-ui/16.10.2]
To version 1.1
edited by Mark Kohlmann
on 2020/04/02 23:26
Change comment: Install extension [org.xwiki.platform:xwiki-platform-search-solr-ui-9.4]

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.mark\.kohlmann@chiefintegrations\.com
1 +XWiki.MarkKohlmann
dark-grey-disclosure-arrow-down.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.MarkKohlmann
Size
... ... @@ -1,0 +1,1 @@
1 +94 bytes
Content
dark-grey-disclosure-arrow-left.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.MarkKohlmann
Size
... ... @@ -1,0 +1,1 @@
1 +94 bytes
Content
light-grey-disclosure-arrow-down.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.MarkKohlmann
Size
... ... @@ -1,0 +1,1 @@
1 +94 bytes
Content
light-grey-disclosure-arrow-left.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.MarkKohlmann
Size
... ... @@ -1,0 +1,1 @@
1 +94 bytes
Content
XWiki.JavaScriptExtension[0]
Code
... ... @@ -26,8 +26,8 @@
26 26   };
27 27  
28 28   var updateExpandCollapseAllFacetsState = function(facetsContainer) {
29 - var facetCount = facetsContainer.find('.search-facet').length;
30 - var expandedFacetCount = facetsContainer.find('.search-facet.expanded').length;
29 + var facetCount = facetsContainer.find('.search-facet').size();
30 + var expandedFacetCount = facetsContainer.find('.search-facet.expanded').size();
31 31   if (expandedFacetCount > facetCount / 2) {
32 32   facetsContainer.find('.search-facets-action-collapseAll').show()
33 33   .parent().children('.search-facets-action-expandAll').hide();
... ... @@ -37,21 +37,14 @@
37 37   }
38 38   };
39 39  
40 - var addFacetValueCheckbox = function(index) {
41 - // Create an id unique to the facet value.
42 - let facetContainer = $(this).parents('.search-facet').first();
43 - $(this).attr('id', facetContainer.attr('data-name') + '-' + index.toString());
44 - // Initialize the checkbox.
45 - let checkBox = $(document.createElement('input')).attr('type', 'checkbox');
46 - checkBox.attr('aria-labelledby', $(this).attr('id'));
40 + var addFacetValueCheckbox = function() {
41 + var checkBox = $(document.createElement('input')).attr('type', 'checkbox');
47 47   checkBox.prop('checked', $(this).hasClass('selected'));
48 48   // Add the 'checked' attribute so that it can be easily located with CSS.
49 49   checkBox.prop('checked') && checkBox.attr('checked', 'checked');
50 - checkBox.on('click', this.click.bind(this));
51 - // Remove the 'selected' class because the selected state is already marked using the check box.
52 - $(this).removeClass('selected')
53 - // Add the checkbox to the DOM
54 - $(this).before(checkBox)
45 + checkBox.click($.proxy(this, 'click'));
46 + // Remove the 'selected' class because the selected state is marked using the check box.
47 + $(this).removeClass('selected').before(checkBox);
55 55   };
56 56  
57 57   var enhanceSearchFacets = function() {
... ... @@ -58,18 +58,18 @@
58 58   var facetsContainer = $(this);
59 59  
60 60   // Add the ability to collapse the facets pane on extra small screens (phones).
61 - facetsContainer.find('.search-facets-header').on('click', function() {
54 + facetsContainer.find('.search-facets-header').click(function() {
62 62   facetsContainer.toggleClass('collapsed-xs');
63 63   });
64 64  
65 65   // Global Expand/Collapse toggle.
66 - facetsContainer.find('.search-facets-action-collapseAll').removeClass('hidden').on('click', collapseAllFacets);
67 - facetsContainer.find('.search-facets-action-expandAll').removeClass('hidden').on('click', expandAllFacets);
59 + facetsContainer.find('.search-facets-action-collapseAll').removeClass('hidden').click(collapseAllFacets);
60 + facetsContainer.find('.search-facets-action-expandAll').removeClass('hidden').click(expandAllFacets);
68 68   updateExpandCollapseAllFacetsState(facetsContainer);
69 69  
70 70   // Expand/Collapse toggle for each facet.
71 - facetsContainer.find('.facet-toggler').on('click', function(event) {
72 - $(event.target).parents('.search-facet').toggleClass('expanded');
64 + facetsContainer.find('.search-facet-header').click(function(event) {
65 + $(event.target).parent('.search-facet').toggleClass('expanded');
73 73   updateExpandCollapseAllFacetsState(facetsContainer);
74 74   });
75 75  
... ... @@ -117,8 +117,7 @@
117 117   searchRequest && searchRequest.abort();
118 118   $('.search-ui').attr('aria-busy', true);
119 119   var getURL = XWiki.currentDocument.getURL('get', getQueryString(viewURL));
120 - searchRequest = $.get(getURL);
121 - searchRequest.then(html => {
113 + searchRequest = $.get(getURL).done(function(html) {
122 122   var state = getSearchUIState();
123 123   updateSearchUI(html);
124 124   setSearchUIState(state);
... ... @@ -131,7 +131,7 @@
131 131   var reloadSearchUI = function(event) {
132 132   event.preventDefault();
133 133   var anchor = $(event.target).closest('a');
134 - anchor.length && $(document).trigger('xwiki:search:update', anchor.attr('href'));
126 + anchor.size() > 0 && $(document).trigger('xwiki:search:update', anchor.attr('href'));
135 135   };
136 136  
137 137   // Others (e.g. a custom facet) can trigger a search UI update by firing this event.
... ... @@ -145,8 +145,7 @@
145 145   $('.search-ui').attr('aria-busy', true);
146 146   var state = event.originalEvent.state;
147 147   var getURL = XWiki.currentDocument.getURL('get', window.location.search.substr(1));
148 - searchRequest = $.get(getURL);
149 - searchRequest.then(html => {
140 + searchRequest = $.get(getURL).done(function(html) {
150 150   updateSearchUI(html);
151 151   setSearchUIState(state);
152 152   });
... ... @@ -187,7 +187,7 @@
187 187   '.search-facet a.itemName',
188 188   '.search-facet-body a.more',
189 189   '.search-facet-body .selectedLocation a'
190 - ].join(',')).on('click', reloadSearchUI);
181 + ].join(',')).click(reloadSearchUI);
191 191   };
192 192  
193 193   enhanceSearchUI();
XWiki.StyleSheetExtension[0]
Code
... ... @@ -222,7 +222,7 @@
222 222   box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
223 223   /* Leave space for the bottom shadow. */
224 224   margin-bottom: 1em;
225 - border-radius: 7px;
225 + border-radius: 4px;
226 226  }
227 227  /* Colibri skin doesn't have the grid system. */
228 228  .skin-colibri .search-facets {
... ... @@ -287,15 +287,28 @@
287 287  }
288 288  
289 289  .search-facet-header {
290 + background: url("$doc.getAttachmentURL('dark-grey-disclosure-arrow-left.png')") no-repeat scroll 100% 50% transparent;
290 290   color: $theme.titleColor;
291 291   cursor: pointer;
292 292   line-height: 1.4em;
293 293   margin: 0 .2em;
294 - display: flex;
295 - justify-content: space-between;
296 - position: relative;
295 + text-transform: capitalize;
297 297  }
298 298  
298 +.search-facet-header:after {
299 + border-bottom: 1px dotted $theme.pageContentBackgroundColor;
300 + border-top: 1px dotted $theme.borderColor;
301 + clear: both;
302 + content: "";
303 + display: block;
304 + height: 0;
305 + margin: 2.45em 0 0;
306 + position: absolute;
307 + right: 0;
308 + top: 0;
309 + width: 100%;
310 +}
311 +
299 299  .search-facet:last-of-type .search-facet-header:after {
300 300   border: medium none;
301 301  }
... ... @@ -317,37 +317,13 @@
317 317  }
318 318  
319 319  .search-facet-body li {
320 - display: flex;
321 - flex-wrap: wrap;
322 322   padding: .1em .2em;
323 323  }
324 324  
325 -.search-facet .search-facet-header .facet-toggler, button.facet-value-toggler {
326 - background: transparent;
327 - transition: background-color .2s ease-in-out;
336 +.search-facet.expanded .search-facet-header {
337 + background-image: url("$doc.getAttachmentURL('dark-grey-disclosure-arrow-down.png')");
328 328  }
329 329  
330 -.search-facet .search-facet-header .facet-toggler:active, button.facet-value-toggler:active {
331 - box-shadow: unset;
332 -}
333 -
334 -.search-facet .search-facet-header .facet-toggler > span, button.facet-value-toggler > span,
335 -.search-facet .search-facet-header .facet-toggler > img, button.facet-value-toggler > img {
336 - transform: rotate(90deg);
337 -}
338 -
339 -.search-facet.expanded .search-facet-header .facet-toggler > span, .expanded > button.facet-value-toggler > span,
340 -.search-facet.expanded .search-facet-header .facet-toggler > img, .expanded > button.facet-value-toggler > img {
341 - transform: rotate(0deg);
342 -}
343 -
344 -@media not (prefers-reduced-motion) {
345 - .search-facet .search-facet-header .facet-toggler > span, button.facet-value-toggler > span,
346 - .search-facet .search-facet-header .facet-toggler > img, button.facet-value-toggler > img {
347 - transition: transform 0.2s ease;
348 - }
349 -}
350 -
351 351  .search-facet.expanded .search-facet-body {
352 352   display: block;
353 353  }
... ... @@ -365,6 +365,7 @@
365 365  }
366 366  
367 367  .search-facet-body input[type="checkbox"] {
357 + float: left;
368 368   margin: .2em 0;
369 369  }
370 370  
... ... @@ -377,18 +377,7 @@
377 377   white-space: nowrap;
378 378  }
379 379  
380 -/* Override the default style for links in content. */
381 -body.content.preference-underlining-only-inline-links #xwikicontent .search-facet-body .itemName,
382 -body.content.preference-underlining-only-inline-links #xwikicontent .search-facet-body .more {
383 - text-decoration: none;
384 - /* Make sure we don't take over the default behaviour on hover with too much specificity. */
385 - &:hover, &:focus {
386 - text-decoration: underline;
387 - }
388 -}
389 -
390 390  .search-facet-body .itemName,
391 -.search-facet-body .facet-value-toggler,
392 392  .search-facet-body .more {
393 393   /* Remove link styling */
394 394   color: $theme.textColor;
... ... @@ -406,8 +406,8 @@
406 406  }
407 407  
408 408  .search-facet-body .itemCount {
388 + float: right;
409 409   padding: .1em 0;
410 - margin-left: auto;
411 411  }
412 412  
413 413  @media (max-width: 768px) {