Show the filter dropdown if the user clicks on a label filter

imports/api/filterNavigation.js

@@ -3,8 +3,19 @@ import {Session} from "meteor/session";
 import {Filter} from "./filter";
 import * as config from "../config/filter.js";
 import {NavigatorCheck} from "./navigatorCheck";
+import {MainNavigation} from "./mainNavigation";
 
 export let FilterNavigation = class FilterNavigation {
+	static showDropdown (forceOn = true) {
+		if ($('.navbar-cards-filter-dropdown').hasClass('active') && !forceOn) {
+			$('.navbar-cards-filter-dropdown').removeClass('active');
+		} else {
+			$('.navbar-cards-filter-dropdown').addClass('active');
+			FilterNavigation.setMaxDropdownHeight();
+			MainNavigation.closeCollapse();
+		}
+	}
+
 	static gotAuthorFilter (filterType) {
 		return config.filtersWithAuthor.includes(filterType);
 	}

imports/ui/filter/index/index.js

@@ -61,24 +61,31 @@ Session.set('moduleActive', true);
 Template.filterIndex.events({
 	'click .label-wordcloud': function () {
 		Filter.setActiveFilter(true, "wordcloud");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-lecturer-authorized': function () {
 		Filter.setActiveFilter(true, "lecturerAuthorized");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-kind': function (event) {
 		Filter.setActiveFilter([$(event.target).data('id')], "kind");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-card-type': function (event) {
 		Filter.setActiveFilter(Number($(event.target).data('id')), "cardType");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-difficulty': function (event) {
 		Filter.setActiveFilter(Number($(event.target).data('id')), "difficulty");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-bonus': function () {
 		Filter.setActiveFilter(true, "bonusActive");
+		FilterNavigation.showDropdown();
 	},
 	'click .label-transcript-bonus': function () {
 		Filter.setActiveFilter(true, "transcriptBonus");
+		FilterNavigation.showDropdown();
 	}
 });
 

imports/ui/main/main.js

@@ -152,7 +152,7 @@ Template.main.onRendered(function () {
 			MainNavigation.clearSearch();
 			$('.navbar-cards-search-dropdown').removeClass('active');
 		}
-		if (!$(event.target).is('.cards-filter-element')) {
+		if (!$(event.target).is('.cards-filter-element') && !$(event.target).parents('.resultItemHeaderBottomAreaLabels').length) {
 			MainNavigation.clearSearch();
 			$('.navbar-cards-filter-dropdown').removeClass('active');
 		}

imports/ui/main/navigation/top/item/filter.js

-import {MainNavigation} from "../../../../../api/mainNavigation";
 import {FilterNavigation} from "../../../../../api/filterNavigation";
 import {Template} from "meteor/templating";
 import "./filter.html";
@@ -12,13 +11,7 @@ import "./filter.html";
 let filterResizeSensor;
 Template.mainNavigationTopItemFilterDropdown.events({
 	'click .toggle-filter-dropdown': function () {
-		if ($('.navbar-cards-filter-dropdown').hasClass('active')) {
-			$('.navbar-cards-filter-dropdown').removeClass('active');
-		} else {
-			$('.navbar-cards-filter-dropdown').addClass('active');
-			FilterNavigation.setMaxDropdownHeight();
-			MainNavigation.closeCollapse();
-		}
+		FilterNavigation.showDropdown(false);
 	}
 });