Refactor zooming logic out to action

This also enables a more straight-forward implementation of the functionality that the zoom buttons offer.

1 files changed, 3 insertions, 10 deletions

diff --git a/src/components/app/map/controls/ZoomControlComponent.js b/src/components/app/map/controls/ZoomControlComponent.js
index c5628d16..8406e8c1 100644
--- a/src/components/app/map/controls/ZoomControlComponent.js
+++ b/src/components/app/map/controls/ZoomControlComponent.js
@@ -1,26 +1,19 @@
 import React from "react";
-import {MAP_MAX_SCALE, MAP_MIN_SCALE, MAP_SCALE_PER_EVENT} from "../MapConstants";
-
-const ZoomControlComponent = ({mapScale, setMapScale}) => {
-    const zoom = (out) => {
-        const newScale = out ? mapScale / MAP_SCALE_PER_EVENT : mapScale * MAP_SCALE_PER_EVENT;
-        const boundedScale = Math.min(Math.max(MAP_MIN_SCALE, newScale), MAP_MAX_SCALE);
-        setMapScale(boundedScale);
-    };
 
+const ZoomControlComponent = ({zoomInOnCenter}) => {
     return (
         <span>
             <button
                 className="btn btn-default btn-circle btn-sm mr-1"
                 title="Zoom in"
-                onClick={() => zoom(false)}
+                onClick={() => zoomInOnCenter(true)}
             >
                 <span className="fa fa-plus"/>
             </button>
             <button
                 className="btn btn-default btn-circle btn-sm mr-1"
                 title="Zoom out"
-                onClick={() => zoom(true)}
+                onClick={() => zoomInOnCenter(false)}
             >
                 <span className="fa fa-minus"/>
             </button>