New multiselectionstyle, inActiveLayer

origo-map · Sep 29, 2023 · 7a39e5d · 7a39e5d
1 parent a31ddf6
commit 7a39e5d
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/src/infowindow.js b/src/infowindow.js
@@ -40,6 +40,10 @@ function showInfowindow() {
   mainContainer.classList.remove('hidden');
 }
 
+function getActiveSelectionGroup() {
+  return activeSelectionGroup;
+}
+
 function makeElementDraggable(elm) {
   const elmnt = elm;
   let pos1 = 0;
@@ -179,7 +183,16 @@ function showSelectedList(selectionGroup) {
   }
   const subexportToAppend = subexports.get(selectionGroup);
   exportContainer.appendChild(subexportToAppend);
-
+  const selectedItems = selectionManager.getSelectedItems().getArray();
+  selectedItems.forEach((item) => {
+    const feature = item.getFeature();
+    feature.unset('state', 'selected');
+    if (item.selectionGroup === selectionGroup) {
+      feature.set('inActiveLayer', true);
+    } else {
+      feature.set('inActiveLayer', false);
+    }
+  });
   urvalElements.forEach((value, key) => {
     if (key === selectionGroup) {
       value.classList.add('selectedurvalelement');
@@ -424,6 +437,7 @@ function init(options) {
   render(options.viewer.getId());
 
   return {
+    getActiveSelectionGroup,
     createListElement,
     removeListElement,
     expandListElement,

diff --git a/src/selectionmanager.js b/src/selectionmanager.js
@@ -155,6 +155,8 @@ const Selectionmanager = function Selectionmanager(options = {}) {
   function featureStyler(feature) {
     if (feature.get('state') === 'selected') {
       return Style.createStyleRule(multiselectStyleOptions.highlighted);
+    } else if (feature.get('inActiveLayer') === true) {
+      return Style.createStyleRule(multiselectStyleOptions.inActiveLayer ? multiselectStyleOptions.inActiveLayer : multiselectStyleOptions.selected);
     }
     return Style.createStyleRule(multiselectStyleOptions.selected);
   }
@@ -261,6 +263,11 @@ const Selectionmanager = function Selectionmanager(options = {}) {
     const item = event.element;
 
     const selectionGroup = event.element.getSelectionGroup();
+    if (selectionGroup === infowindow.getActiveSelectionGroup()) {
+      item.getFeature().set('inActiveLayer', true);
+    } else {
+      item.getFeature().set('inActiveLayer', false);
+    }
     const selectionGroupTitle = event.element.getSelectionGroupTitle();
 
     if (!urval.has(selectionGroup)) {