fix: defaults

Author: sjhoeksma

src/GEOComp.tsx

@@ -117,17 +117,18 @@ var GEOComp = (function () {
       ArrayControl,
       `${JSON.stringify(i18nObjs.defaultData, null, 2)}`
     ),
-    zoom: NumberControl,
-    maxZoom: NumberControl,
-    rotation: NumberControl,
+    zoom: withDefault(NumberControl, 10),
+    maxZoom: withDefault(NumberControl, 30),
+    rotation: withDefault(NumberControl, 0),
+    projection: stringSimpleControl("EPSG:3857"),
     bbox: arrayStringExposingStateControl("bbox", [0, 0, 0, 0]),
     menuTitle: stringSimpleControl(""),
     menuContent: stringSimpleControl(""),
     events: jsonObjectExposingStateControl("events"),
     event: jsonObjectExposingStateControl("event"),
     feature: jsonObjectExposingStateControl("feature"),
     onEvent: eventHandlerControl(eventDefintions),
-    projection: stringSimpleControl(""),
+
     features:
       featureControl({
         menu: false,
@@ -140,7 +141,7 @@ var GEOComp = (function () {
         splitscreen: false,
         tracker: false,
         timeline: false,
-        gpsCentered: false,
+        gpsCentered: true,
         north: false,
         largeButtons: true,
         scaleToBottom: false,

src/vendors/Geo.jsx

@@ -143,10 +143,10 @@ function Geo(props) {
         controls: [],
         view: new View({
           center: fromLonLat(props.center.length == 2 ? props.center : geoLoc),
-          zoom: props.zoom || 10,
-          maxZoom: props.maxZoom || 30,
+          zoom: props.zoom,
+          maxZoom: props.maxZoom,
           rotation: props.rotation,
-          projection: props.projection || 'EPSG:3857'
+          projection: props.projection
         }),
         target: 'GEO_' + geoId,
         layers: [],
@@ -584,40 +584,43 @@ function Geo(props) {
       // Notification Control
       olMap.addControl(notification);
 
-      //loadLayers(olMap)
-
       //Add map init event
       fireEvent('map:init', olMap);
 
       setMap(olMap)
     }
-  }, [geoRef, props.features]);
+  }, [geoRef, props.features, props.projection]);
 
 
   useEffect(() => {
     if (map) {
       geoRef.style.height = `${props.height}px`;
-      //geoRef.style.width=`${props.width}px`;
     }
   }, [props.height, props.width])
 
   //Zoom handling
   useEffect(() => {
-    if (map) map.getView().setZoom(props.zoom)
+    if (map) {
+      map.getView().setZoom(Math.min(props.zoom, props.maxZoom))
+    }
   }, [props.zoom]);
+
   //Max zoom handling
   useEffect(() => {
     if (map) {
       map.getView().setMaxZoom(props.maxZoom)
       map.getView().setZoom(Math.min(props.zoom, props.maxZoom))
     }
   }, [props.maxZoom]);
+
+
   //rotation handling
   useEffect(() => {
     if (map) {
       map.getView().setRotation(props.rotation)
     }
   }, [props.rotation]);
+
   //Center the location on map
   useEffect(() => {
     if (map) {