Änderungen von Dokument Solr Search

Zusammenfassung

• Objekte (2 geändert, 0 hinzugefügt, 0 gelöscht)
  • XWiki.JavaScriptExtension[0]
  • XWiki.StyleSheetExtension[0]

Details

XWiki.JavaScriptExtension[0]

Code

...	...	@@ -11,19 +11,19 @@
11	11
12	12	var collapseAllFacets = function(event) {
13	13	event.preventDefault();
14		- $(event.target).closest('.search-facets').find('.search-facet .search-facet-body').collapse('hide');
	14	+ $(event.target).closest('.search-facets').find('.search-facet').removeClass('expanded');
15	15	$(event.target).hide().parent().children('.search-facets-action-expandAll').show();
16	16	};
17	17
18	18	var expandAllFacets = function(event) {
19	19	event.preventDefault();
20		- $(event.target).closest('.search-facets').find('.search-facet .search-facet-body').collapse('show');
	20	+ $(event.target).closest('.search-facets').find('.search-facet').addClass('expanded');
21	21	$(event.target).hide().parent().children('.search-facets-action-collapseAll').show();
22	22	};
23	23
24	24	var updateExpandCollapseAllFacetsState = function(facetsContainer) {
25		- let facetCount = facetsContainer.find('.search-facet').length;
26		- let expandedFacetCount = facetsContainer.find('.search-facet-body.collapse.in').length;
	25	+ var facetCount = facetsContainer.find('.search-facet').length;
	26	+ var expandedFacetCount = facetsContainer.find('.search-facet.expanded').length;
27	27	if (expandedFacetCount > facetCount / 2) {
28	28	facetsContainer.find('.search-facets-action-collapseAll').show()
29	29	.parent().children('.search-facets-action-expandAll').hide();
...	...	@@ -70,7 +70,8 @@
70	70	updateExpandCollapseAllFacetsState(facetsContainer);
71	71
72	72	// Expand/Collapse toggle for each facet.
73		- facetsContainer.find('.search-facet-body').on('hidden.bs.collapse shown.bs.collapse', function(event) {
	73	+ facetsContainer.find('.facet-toggle').on('click', function(event) {
	74	+ $(event.target).parents('.search-facet').toggleClass('expanded');
74	74	updateExpandCollapseAllFacetsState(facetsContainer);
75	75	});
76	76
...	...	@@ -92,7 +92,7 @@
92	92
93	93	var getSearchUIState = function() {
94	94	var expandedFacets = [];
95		- $('.search-facet:has(btn.facet-toggle:not(.collapsed))').each(function() {
	96	+ $('.search-facet.expanded').each(function() {
96	96	expandedFacets.push($(this).attr('data-name'));
97	97	});
98	98	return {
...	...	@@ -103,7 +103,7 @@
103	103	var setSearchUIState = function(state) {
104	104	state = state || {};
105	105	var expandedFacets = state.expandedFacets || [];
106		- $('.search-facet:has(btn.facet-toggle.collapsed)').each(function() {
	107	+ $('.search-facet').not('.expanded').each(function() {
107	107	if (expandedFacets.indexOf($(this).attr('data-name')) >= 0) {
108	108	$(this).addClass('expanded');
109	109	}

XWiki.StyleSheetExtension[0]

Code

...	...	@@ -229,8 +229,6 @@
229	229
230	230	.search-facet {
231	231	padding: .2em 0;
232		- display: flex;
233		- flex-direction: column;
234	234	}
235	235
236	236	.search-facets-header > p,
...	...	@@ -273,6 +273,13 @@
273	273	}
274	274
275	275	.search-facet-body {
	274	+ opacity: 0;
	275	+ visibility: hidden; /* This makes sure the element is removed from the accessibility tree. */
	276	+
	277	+ position: absolute;
	278	+ transform: translateY(-10px); /* Start the animation slightly above */
	279	+ padding-top: .5em;
	280	+
276	276	border-top-width: 0;
277	277	border-top-left-radius: 0;
278	278	border-top-right-radius: 0;
...	...	@@ -298,13 +298,13 @@
298	298	box-shadow: unset;
299	299	}
300	300
301		-.search-facet .search-facet-header .facet-toggle.collapsed > span, button.facet-value-toggle > span,
302		-.search-facet .search-facet-header .facet-toggle.collapsed > img, button.facet-value-toggle > img {
	306	+.search-facet .search-facet-header .facet-toggle > span, button.facet-value-toggle > span,
	307	+.search-facet .search-facet-header .facet-toggle > img, button.facet-value-toggle > img {
303	303	transform: rotate(90deg);
304	304	}
305	305
306		-.search-facet .search-facet-header .facet-toggle > span, .expanded > button.facet-value-toggle > span,
307		-.search-facet .search-facet-header .facet-toggle > img, .expanded > button.facet-value-toggle > img {
	311	+.search-facet.expanded .search-facet-header .facet-toggle > span, .expanded > button.facet-value-toggle > span,
	312	+.search-facet.expanded .search-facet-header .facet-toggle > img, .expanded > button.facet-value-toggle > img {
308	308	transform: rotate(0deg);
309	309	}
310	310
...	...	@@ -313,10 +313,13 @@
313	313	.search-facet .search-facet-header .facet-toggle > img, button.facet-value-toggle > img {
314	314	transition: transform 0.2s ease;
315	315	}
	321	+
	322	+ .search-facet-body {
	323	+ transition: opacity 0.3s ease, transform 0.3s ease;
	324	+ }
316	316	}
317	317
318		-.search-facet:has(.search-facet-body.collapse.in),
319		-.search-facet:has(.search-facet-body.collapsing) {
	327	+.search-facet.expanded {
320	320	& .search-facet-header {
321	321	border-bottom-width: 0;
322	322	border-bottom-left-radius: 0;
...	...	@@ -323,9 +323,15 @@
323	323	border-bottom-right-radius: 0;
324	324
325	325	& label {
326		- font-weight: var(--font-weight-semibold);
	334	+ font-weight: var(--font-weight-semibold);
327	327	}
328	328	}
	337	+ & .search-facet-body {
	338	+ opacity: 1;
	339	+ position: unset; /* This element should be positioned normally when shown. */
	340	+ visibility: visible;
	341	+ transform: translateY(0);
	342	+ }
329	329	}
330	330
331	331	.search-facet-body ul, .search-facet-body ul.users {