@maplibre/maplibre-react-native 8.6.0-beta.0

package/android/rctmgl/src/main/java/com/mapbox/rctmgl/components/styles/RCTMGLStyleFunctionParser.java

@@ -0,0 +1,108 @@
+package com.mapbox.rctmgl.components.styles;
+
+import android.util.Log;
+
+import com.facebook.react.bridge.Dynamic;
+import com.facebook.react.bridge.DynamicFromMap;
+import com.facebook.react.bridge.NoSuchKeyException;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.bridge.ReadableMapKeySetIterator;
+import com.facebook.react.bridge.ReadableNativeArray;
+import com.facebook.react.bridge.ReadableType;
+import com.mapbox.mapboxsdk.style.expressions.Expression.Stop;
+import com.mapbox.mapboxsdk.style.layers.PropertyValue;
+
+import java.text.NumberFormat;
+import java.text.ParseException;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * Created by nickitaliano on 9/12/17.
+ */
+
+public abstract class RCTMGLStyleFunctionParser<T, V> {
+    private RCTMGLStyleValue mStyleValue;
+
+    public RCTMGLStyleFunctionParser(RCTMGLStyleValue styleValue) {
+        mStyleValue = styleValue;
+    }
+
+    public List<StopConfig> getRawStops() {
+        ReadableArray readableArrayRawStops = mStyleValue.getArray("stops");
+
+        List<StopConfig> rawStops = new ArrayList<>();
+
+        for (int i = 0; i < readableArrayRawStops.size(); i++) {
+            ReadableArray rawStop = readableArrayRawStops.getArray(i);
+
+            ReadableMap jsStopKey = rawStop.getMap(0);
+            ReadableMap jsStopValue = rawStop.getMap(1);
+            RCTMGLStyleValue innerStyleValue = new RCTMGLStyleValue(jsStopValue);
+
+            Object propertyValue = null;
+            try {
+                Dynamic dynamicPropertyValue = innerStyleValue.getDynamic("propertyValue");
+                ReadableType type = dynamicPropertyValue.getType();
+
+                if (type.equals(ReadableType.Number)) {
+                    propertyValue = dynamicPropertyValue.asDouble();
+                } else if (type.equals(ReadableType.Boolean)){
+                    propertyValue = dynamicPropertyValue.asBoolean();
+                } else {
+                    propertyValue = dynamicPropertyValue.asString();
+                }
+            } catch (NoSuchKeyException e) {
+                // not a zoom-property value
+            }
+
+            StopConfig config;
+            if (propertyValue != null) {
+                config = new StopConfig(getStopKey(jsStopKey), getRawStopValue(innerStyleValue), propertyValue);
+            } else {
+                config = new StopConfig(getStopKey(jsStopKey), getRawStopValue(innerStyleValue));
+            }
+
+            rawStops.add(config);
+        }
+
+        return rawStops;
+    }
+
+    protected abstract T getRawStopValue (RCTMGLStyleValue styleValue);
+    protected abstract PropertyValue<V> getStopValue(T value);
+
+    private Object getStopKey(ReadableMap jsStopKey) {
+        String payloadKey = "value";
+        String type = jsStopKey.getString("type");
+
+        switch (type) {
+            case "number":
+                return jsStopKey.getDouble(payloadKey);
+            case "boolean":
+                return jsStopKey.getBoolean(payloadKey);
+            default:
+                return jsStopKey.getString(payloadKey);
+        }
+    }
+
+    private class StopConfig {
+        Object propertyValue;
+        T value;
+        Object key;
+
+        StopConfig(Object key, T value) {
+            this(key, value, null);
+        }
+
+        StopConfig(Object key, T value, Object propertyValue) {
+            this.key = key;
+            this.value = value;
+            this.propertyValue = propertyValue;
+        }
+    }
+}

package/android/rctmgl/src/main/java/com/mapbox/rctmgl/components/styles/RCTMGLStyleValue.java

@@ -0,0 +1,212 @@
+package com.mapbox.rctmgl.components.styles;
+
+import androidx.annotation.NonNull;
+
+import com.facebook.react.bridge.Dynamic;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.bridge.ReadableType;
+import com.facebook.react.bridge.WritableNativeMap;
+import com.google.gson.JsonArray;
+import com.mapbox.mapboxsdk.style.expressions.Expression;
+import com.mapbox.mapboxsdk.style.layers.TransitionOptions;
+import com.mapbox.rctmgl.utils.ConvertUtils;
+import com.mapbox.rctmgl.utils.ExpressionParser;
+import com.mapbox.rctmgl.utils.ImageEntry;
+
+/**
+ * Created by nickitaliano on 9/12/17.
+ */
+
+public class RCTMGLStyleValue {
+
+    private String mType;
+    private boolean isExpression;
+    private Expression mExpression;
+    private ReadableMap mPayload;
+
+    private String imageURI = "";
+    private boolean isAddImage;
+    private Double imageScale = ImageEntry.defaultScale;
+
+    public static final int InterpolationModeExponential = 100;
+    public static final int InterpolationModeInterval = 101;
+    public static final int InterpolationModeCategorical = 102;
+    public static final int InterpolationModeIdentity = 103;
+
+    public RCTMGLStyleValue(@NonNull ReadableMap config) {
+        mType = config.getString("styletype");
+        mPayload = config.getMap("stylevalue");
+
+        if ("image".equals(mType)) {
+            imageScale = ImageEntry.defaultScale;
+            if ("hashmap".equals(mPayload.getString("type"))) {
+                ReadableMap map = getMap();
+                imageURI = map.getMap("uri").getString("value");
+                if (map.getMap("scale") != null) {
+                    imageScale = map.getMap("scale").getDouble("value");
+                }
+            } else if ("string".equals(mPayload.getString("type"))) {
+                String value = mPayload.getString("value");
+                if (value.contains("://")) {
+                    imageURI = value;
+                } else {
+                    imageURI = null;
+                    isExpression = true;
+                    mExpression = Expression.literal(value);
+                }
+            } else {
+                imageURI = null;
+            }
+            isAddImage = imageURI != null;
+            if (isAddImage) { return; }
+        }
+
+        Dynamic dynamic = mPayload.getDynamic("value");
+        if (dynamic.getType().equals(ReadableType.Array)) {
+            ReadableArray array = dynamic.asArray();
+            if (array.size() > 0 && mPayload.getString("type").equals("array")) {
+                ReadableMap map = array.getMap(0);
+                if (map != null && map.getString("type").equals("string")) {
+                    isExpression = true;
+                    mExpression = ExpressionParser.fromTyped(mPayload);
+                }
+            }
+        }
+    }
+
+    private boolean isTokenizedValue(String value) {
+        return (value.startsWith("{") && value.endsWith("}"));
+    }
+
+    public String getType() {
+        return mType;
+    }
+
+    public boolean isFunction() {
+        return mType.equals("function");
+    }
+
+    public int getInt(String key) {
+        return mPayload.getInt(key);
+    }
+
+    public String getString(String key) {
+        return mPayload.getString(key);
+    }
+
+    public Double getDouble(String key) {
+        return mPayload.getDouble(key);
+    }
+
+    public Float getFloat(String key) {
+        return getDouble(key).floatValue();
+    }
+
+    public Dynamic getDynamic(String key) {
+        return mPayload.getDynamic(key);
+    }
+
+    public ReadableArray getArray(String key) {
+        return mPayload.getArray(key);
+    }
+
+    public Boolean getBoolean(String key) {
+        return mPayload.getBoolean(key);
+    }
+
+    public Float[] getFloatArray(String key) {
+        ReadableArray arr = getArray(key);
+
+        Float[] floatArr = new Float[arr.size()];
+        for (int i = 0; i < arr.size(); i++) {
+            ReadableMap item = arr.getMap(i);
+            floatArr[i] = (float) item.getDouble("value");
+        }
+
+        return floatArr;
+    }
+
+    public String[] getStringArray(String key) {
+        ReadableArray arr = getArray(key);
+
+        String[] stringArr = new String[arr.size()];
+        for (int i = 0; i < arr.size(); i++) {
+            ReadableMap item = arr.getMap(i);
+            stringArr[i] = item.getString("value");
+        }
+
+        return stringArr;
+    }
+
+    public ReadableMap getMap() {
+        if ("hashmap".equals(mPayload.getString("type"))) {
+            ReadableArray keyValues = mPayload.getArray("value");
+            WritableNativeMap result = new WritableNativeMap();
+            for (int i = 0; i < keyValues.size(); i++) {
+                ReadableArray keyValue = keyValues.getArray(i);
+                String stringKey = keyValue.getMap(0).getString("value");
+                WritableNativeMap value = new WritableNativeMap();
+                value.merge(keyValue.getMap(1));
+                result.putMap(stringKey, value);
+            }
+            return result;
+        }
+
+        return null;
+    }
+
+    public ReadableMap getMap(String _key) {
+        return getMap();
+    }
+
+    public Expression getExpression() {
+        return mExpression;
+    }
+
+    public boolean isExpression() {
+        return isExpression;
+    }
+
+    public boolean shouldAddImage() {
+        return isAddImage;
+    }
+
+    public Boolean isImageStringValue() {
+        return "string".equals(mPayload.getString("type"));
+    }
+
+    public String getImageStringValue() {
+        return mPayload.getString("value");
+    }
+
+    public String getImageURI() {
+        return imageURI;
+    }
+
+    public double getImageScale() {
+        return imageScale;
+    }
+
+    public TransitionOptions getTransition() {
+        if (!mType.equals("transition")) {
+            return null;
+        }
+        ReadableMap config = getMap(RCTMGLStyleFactory.VALUE_KEY);
+
+        boolean enablePlacementTransitions = true;
+        if (config.hasKey("enablePlacementTransitions")) {
+            enablePlacementTransitions = config.getMap("enablePlacementTransitions").getBoolean("value");
+        }
+        int duration = 300;
+        int delay = 0;
+        if (config.hasKey("duration") && ReadableType.Map.equals(config.getType("duration"))) {
+            duration = config.getMap("duration").getInt("value");
+        }
+        if (config.hasKey("delay") && ReadableType.Map.equals(config.getType("delay"))) {
+            delay = config.getMap("delay").getInt("value");
+        }
+
+        return new TransitionOptions(duration, delay, enablePlacementTransitions);
+    }
+}

package/android/rctmgl/src/main/java/com/mapbox/rctmgl/components/styles/layers/RCTLayer.java

@@ -0,0 +1,287 @@
+package com.mapbox.rctmgl.components.styles.layers;
+
+import android.content.Context;
+
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.common.logging.FLog;
+import com.mapbox.mapboxsdk.location.LocationComponentConstants;
+import com.mapbox.mapboxsdk.maps.MapboxMap;
+import com.mapbox.mapboxsdk.maps.Style;
+import com.mapbox.mapboxsdk.style.expressions.Expression;
+import com.mapbox.mapboxsdk.style.layers.Layer;
+import com.mapbox.mapboxsdk.style.layers.Property;
+import com.mapbox.mapboxsdk.style.layers.PropertyFactory;
+import com.mapbox.rctmgl.components.AbstractMapFeature;
+import com.mapbox.rctmgl.components.mapview.RCTMGLMapView;
+import com.mapbox.rctmgl.utils.ExpressionParser;
+
+import java.util.Arrays;
+import java.util.HashSet;
+import java.util.Set;
+
+/**
+ * Created by nickitaliano on 9/7/17.
+ */
+
+public abstract class RCTLayer<T extends Layer> extends AbstractMapFeature {
+    public static final String LOG_TAG = "RCTLayer";
+
+    protected String mID;
+    protected String mSourceID;
+    protected String mAboveLayerID;
+    protected String mBelowLayerID;
+
+    protected Integer mLayerIndex;
+    protected boolean mVisible;
+    protected Double mMinZoomLevel;
+    protected Double mMaxZoomLevel;
+    protected ReadableMap mReactStyle;
+    protected Expression mFilter;
+
+    protected MapboxMap mMap;
+    protected T mLayer;
+
+    protected Context mContext;
+    protected RCTMGLMapView mMapView;
+
+    protected boolean mHadFilter;
+
+    public RCTLayer(Context context) {
+        super(context);
+        mContext = context;
+        mHadFilter = false;
+    }
+
+    public String getID() {
+        return mID;
+    }
+
+    public void setID(String id) {
+        mID = id;
+    }
+
+    public void setSourceID(String sourceID) {
+        mSourceID = sourceID;
+    }
+
+    public void setAboveLayerID(String aboveLayerID) {
+        if (mAboveLayerID != null && mAboveLayerID.equals(aboveLayerID)) {
+            return;
+        }
+
+        mAboveLayerID = aboveLayerID;
+        if (mLayer != null) {
+            removeFromMap(mMapView);
+            addAbove(mAboveLayerID);
+        }
+    }
+
+    public void setBelowLayerID(String belowLayerID) {
+        if (mBelowLayerID != null && mBelowLayerID.equals(belowLayerID)) {
+            return;
+        }
+
+        mBelowLayerID = belowLayerID;
+        if (mLayer != null) {
+            removeFromMap(mMapView);
+            addBelow(mBelowLayerID);
+        }
+    }
+
+    public void setLayerIndex(int layerIndex) {
+        if (mLayerIndex != null && mLayerIndex == layerIndex) {
+            return;
+        }
+
+        mLayerIndex = layerIndex;
+        if (mLayer != null) {
+            removeFromMap(mMapView);
+            addAtIndex(mLayerIndex);
+        }
+    }
+
+    public void setVisible(boolean visible) {
+        mVisible = visible;
+
+        if (mLayer != null) {
+            String visibility = mVisible ? Property.VISIBLE : Property.NONE;
+            mLayer.setProperties(PropertyFactory.visibility(visibility));
+        }
+    }
+
+    public void setMinZoomLevel(double minZoomLevel) {
+        mMinZoomLevel = minZoomLevel;
+
+        if (mLayer != null) {
+            mLayer.setMinZoom((float) minZoomLevel);
+        }
+    }
+
+    public void setMaxZoomLevel(double maxZoomLevel) {
+        mMaxZoomLevel = maxZoomLevel;
+
+        if (mLayer != null) {
+            mLayer.setMaxZoom((float) maxZoomLevel);
+        }
+    }
+
+    public void setReactStyle(ReadableMap reactStyle) {
+        mReactStyle = reactStyle;
+
+        if (mLayer != null) {
+            addStyles();
+        }
+    }
+
+    public void setFilter(ReadableArray readableFilterArray) {
+        Expression filterExpression = ExpressionParser.from(readableFilterArray);
+
+        mFilter = filterExpression;
+
+        if (mLayer != null) {
+            if (mFilter != null) {
+                mHadFilter = true;
+                updateFilter(mFilter);
+            } else if (mHadFilter) {
+                updateFilter(Expression.literal(true));
+            }
+        }
+    }
+
+    public void add() {
+        if (!hasInitialized()) {
+            return;
+        }
+        if (getStyle() == null) return;
+
+        String userBackgroundID = LocationComponentConstants.BACKGROUND_LAYER;
+        Layer userLocationBackgroundLayer = getStyle().getLayer(userBackgroundID);
+
+        // place below user location layer
+        if (userLocationBackgroundLayer != null) {
+            getStyle().addLayerBelow(mLayer, userBackgroundID);
+            mMapView.layerAdded(mLayer);
+            return;
+        }
+
+        getStyle().addLayer(mLayer);
+        mMapView.layerAdded(mLayer);
+    }
+
+    public void addAbove(final String aboveLayerID) {
+        mMapView.waitForLayer(aboveLayerID, new RCTMGLMapView.FoundLayerCallback() {
+            public void found(Layer layer) {
+                if (!hasInitialized()) {
+                    return;
+                }
+                if (getStyle() == null) return;
+                getStyle().addLayerAbove(mLayer, aboveLayerID);
+                mMapView.layerAdded(mLayer);
+            }
+        });
+    }
+
+    public void addBelow(final String belowLayerID) {
+        mMapView.waitForLayer(belowLayerID, new RCTMGLMapView.FoundLayerCallback() {
+            public void found(Layer layer) {
+                if (!hasInitialized()) {
+                    return;
+                }
+                if (getStyle() == null) return;
+                getStyle().addLayerBelow(mLayer, belowLayerID);
+                mMapView.layerAdded(mLayer);
+            }
+        });
+    }
+
+    public void addAtIndex(int index) {
+        if (!hasInitialized()) {
+            return;
+        }
+        if (getStyle() == null) return;
+        int layerSize = getStyle().getLayers().size();
+        if (index >= layerSize) {
+            FLog.e(LOG_TAG, "Layer index is greater than number of layers on map. Layer inserted at end of layer stack.");
+            index = layerSize - 1;
+        }
+        getStyle().addLayerAt(mLayer, index);
+        mMapView.layerAdded(mLayer);
+    }
+
+    protected void insertLayer() {
+        if (getStyle() == null) return;
+        if (getStyle().getLayer(mID) != null) {
+            return; // prevent adding a layer twice
+        }
+
+        if (mAboveLayerID != null) {
+            addAbove(mAboveLayerID);
+        } else if (mBelowLayerID != null) {
+            addBelow(mBelowLayerID);
+        } else if (mLayerIndex != null) {
+            addAtIndex(mLayerIndex);
+        } else {
+            add();
+        }
+
+        setZoomBounds();
+    }
+
+    protected void setZoomBounds() {
+        if (mMaxZoomLevel != null) {
+            mLayer.setMaxZoom(mMaxZoomLevel.floatValue());
+        }
+
+        if (mMinZoomLevel != null) {
+            mLayer.setMinZoom(mMinZoomLevel.floatValue());
+        }
+    }
+
+    protected void updateFilter(Expression expression) {
+        // override if you want to update the filter
+    }
+
+    @Override
+    public void addToMap(RCTMGLMapView mapView) {
+        mMap = mapView.getMapboxMap();
+        mMapView = mapView;
+
+        if (getStyle() == null) return;
+
+        T existingLayer = getStyle().<T>getLayerAs(mID);
+        if (existingLayer != null) {
+            mLayer = existingLayer;
+        } else {
+            mLayer = makeLayer();
+            insertLayer();
+        }
+
+        addStyles();
+        if (mFilter != null) {
+            mHadFilter = true;
+            updateFilter(mFilter);
+        }
+    }
+
+    @Override
+    public void removeFromMap(RCTMGLMapView mapView) {
+        if (getStyle() != null) {
+            getStyle().removeLayer(mLayer);
+        }
+    }
+
+    private Style getStyle() {
+        if (mMap == null) {
+            return null;
+        }
+        return mMap.getStyle();
+    }
+
+    public abstract T makeLayer();
+    public abstract void addStyles();
+
+    private boolean hasInitialized() {
+        return mMap != null && mLayer != null;
+    }
+}

package/android/rctmgl/src/main/java/com/mapbox/rctmgl/components/styles/layers/RCTMGLBackgroundLayer.java

@@ -0,0 +1,27 @@
+package com.mapbox.rctmgl.components.styles.layers;
+
+import android.content.Context;
+
+import com.mapbox.mapboxsdk.style.layers.BackgroundLayer;
+import com.mapbox.rctmgl.components.styles.RCTMGLStyle;
+import com.mapbox.rctmgl.components.styles.RCTMGLStyleFactory;
+
+/**
+ * Created by nickitaliano on 9/25/17.
+ */
+
+public class RCTMGLBackgroundLayer extends RCTLayer<BackgroundLayer> {
+    public RCTMGLBackgroundLayer(Context context) {
+        super(context);
+    }
+
+    @Override
+    public BackgroundLayer makeLayer() {
+        return new BackgroundLayer(mID);
+    }
+
+    @Override
+    public void addStyles() {
+        RCTMGLStyleFactory.setBackgroundLayerStyle(mLayer, new RCTMGLStyle(getContext(), mReactStyle, mMap));
+    }
+}

package/android/rctmgl/src/main/java/com/mapbox/rctmgl/components/styles/layers/RCTMGLBackgroundLayerManager.java

@@ -0,0 +1,64 @@
+package com.mapbox.rctmgl.components.styles.layers;
+
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.uimanager.ViewGroupManager;
+import com.facebook.react.uimanager.annotations.ReactProp;
+
+/**
+ * Created by nickitaliano on 9/25/17.
+ */
+
+public class RCTMGLBackgroundLayerManager extends ViewGroupManager<RCTMGLBackgroundLayer> {
+    public static final String REACT_CLASS = "RCTMGLBackgroundLayer";
+
+    @Override
+    public String getName() {
+        return REACT_CLASS;
+    }
+
+    @Override
+    protected RCTMGLBackgroundLayer createViewInstance(ThemedReactContext reactContext) {
+        return new RCTMGLBackgroundLayer(reactContext);
+    }
+
+    @ReactProp(name="id")
+    public void setId(RCTMGLBackgroundLayer layer, String id) {
+        layer.setID(id);
+    }
+
+    @ReactProp(name="sourceID")
+    public void setSourceID(RCTMGLBackgroundLayer layer, String sourceID) {
+        layer.setSourceID(sourceID);
+    }
+
+    @ReactProp(name="aboveLayerID")
+    public void setAboveLayerID(RCTMGLBackgroundLayer layer, String aboveLayerID) {
+        layer.setAboveLayerID(aboveLayerID);
+    }
+
+    @ReactProp(name="belowLayerID")
+    public void setBelowLayerID(RCTMGLBackgroundLayer layer, String belowLayerID) {
+        layer.setBelowLayerID(belowLayerID);
+    }
+
+    @ReactProp(name="layerIndex")
+    public void setLayerIndex(RCTMGLBackgroundLayer layer, int layerIndex){
+        layer.setLayerIndex(layerIndex);
+    }
+
+    @ReactProp(name="minZoomLevel")
+    public void setMinZoomLevel(RCTMGLBackgroundLayer layer, double minZoomLevel) {
+        layer.setMinZoomLevel(minZoomLevel);
+    }
+
+    @ReactProp(name="maxZoomLevel")
+    public void setMaxZoomLevel(RCTMGLBackgroundLayer layer, double maxZoomLevel) {
+        layer.setMaxZoomLevel(maxZoomLevel);
+    }
+
+    @ReactProp(name="reactStyle")
+    public void setReactStyle(RCTMGLBackgroundLayer layer, ReadableMap style) {
+        layer.setReactStyle(style);
+    }
+}