@provoly/dashboard 0.19.1 → 0.19.2

package/widgets/widget-map/public-api.d.ts

@@ -5,6 +5,7 @@ export * from './pipe/widget-map-geometry-fields-for.pipe';
 export * from './pipe/widget-map-legend-url.pipe';
 export * from './interaction/interaction-manager.class';
 export * from './interaction/selection-interaction.class';
+export * from './interaction/layer-slider.class';
 export * from './utils/widget-map.utils';
 export * from './utils/xml-utils.class';
 export * from './utils/cql-utils.class';

package/widgets/widget-map/style/_o-layer-legend.scss

@@ -2,11 +2,16 @@
 
 .m-layer-legend {
   z-index: 2;
-  left: toRem(8);
+  right: toRem(8);
   overflow: hidden;
 
   &.ol-control {
-    border: 1px solid #bccad8;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+
+    border: none;
+    background: white;
   }
 
   button {
@@ -19,6 +24,7 @@
   }
 
   &__toggle {
+    align-self: flex-end;
     width: toRem(30);
     height: toRem(30);
   }
@@ -44,11 +50,16 @@
 
 .m-layer-switcher {
   z-index: 2;
-  left: toRem(8);
+  right: toRem(8);
   overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  align-items: normal;
 
   &.ol-control {
-    border: 1px solid #bccad8;
+    border: none;
+    background: white;
+    align-self: flex-end;
   }
 
   button {
@@ -63,6 +74,7 @@
   &__toggle {
     width: toRem(30);
     height: toRem(30);
+    align-self: flex-end;
   }
 
   &__title {
@@ -71,7 +83,6 @@
     background-color: white;
     justify-content: space-between;
     gap: toRem(10);
-    margin-left: toRem(35);
     padding: 5px;
   }
 

package/widgets/widget-map/style/_o-widget-map.scss

@@ -54,9 +54,36 @@
   }
 }
 
-.ol-attribution {
+.ol-attribution, .ol-zoom {
   top: toRem(5);
   bottom: unset;
+  border-radius: toRem(6);
+  padding: 0;
+  border: none;
+  background: white;
+
+  > button {
+    padding: 0;
+    border: none;
+    background: white;
+  }
+}
+
+.ol-zoom {
+  top: toRem(5);
+  right: toRem(8);
+  left: unset;
+  bottom: unset;
+  border-radius: toRem(6);
+  padding: 0;
+  border: none;
+  background: white;
+
+  > button {
+    padding: 0;
+    border: none;
+    background: white;
+  }
 }
 
 .a-form-field {
@@ -80,3 +107,50 @@
     }
   }
 }
+
+.o-map-slider {
+  position: absolute;
+  width: 100%;
+  margin-top: toRem(-10);
+  z-index: 1;
+
+  &.-hidden {
+    visibility: hidden;
+    pointer-events: none;
+  }
+
+  -webkit-appearance: none;
+  appearance: none;
+  background: transparent;
+  cursor: grab;
+
+  &::-webkit-slider-runnable-track {
+    background: none;
+  }
+
+  &::-moz-range-track {
+    background: none;
+  }
+
+  &::-webkit-slider-thumb {
+    -webkit-appearance: none; /* Override default look */
+    appearance: none;
+
+    /*custom styles*/
+    background-color: #113B6E;
+    height: toRem(2000);
+    margin-top: toRem(-1950);
+    width: toRem(4);
+  }
+
+  &::-moz-range-thumb {
+    border: none; /*Removes extra border that FF applies*/
+    border-radius: 0; /*Removes default border-radius that FF applies*/
+
+    /*custom styles*/
+    background-color: #113B6E;
+    height: toRem(2000);
+    margin-top: toRem(-1950);
+    width: toRem(4);
+  }
+}

package/widgets/widget-map/utils/xml-utils.class.d.ts

@@ -4,5 +4,15 @@ export declare class XMLUtils {
     static findAll(childs: NodeListOf<ChildNode>, name: string): ChildNode[];
     static findWith(childs: NodeListOf<ChildNode>, attribute: string, value: string): ChildNode | null;
     static getMatchingLayer(paramLayer: string, doc?: Document): ChildNode | null;
+    static allLayers(doc?: Document): ChildNode[];
     static getLayerExtent(paramLayer: string, map: Map, doc?: Document): import("ol/coordinate").Coordinate[] | null;
+    static getPossibleLayerStyles(doc?: Document): {
+        [param: string]: {
+            param: string;
+            styles: {
+                id: string;
+                label: string;
+            }[];
+        };
+    } | null;
 }