react-native-mapsforge-vtm
Version:
React Native components to build vector maps using Mapsforges fork of vtm. Offline rendering of OpenStreetMap data. Android only
140 lines (135 loc) • 4.78 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require("react");
var _useRefState = _interopRequireDefault(require("../compose/useRefState.js"));
var _promiseQueue = _interopRequireDefault(require("../promiseQueue.js"));
var _usePrevious = _interopRequireDefault(require("../compose/usePrevious.js"));
var _useRenderStyleOptions = _interopRequireDefault(require("../compose/useRenderStyleOptions.js"));
var _nativeMapModules = require("../nativeMapModules.js");
var _constants = require("../constants.js");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/**
* External dependencies
*/
/**
* Internal dependencies
*/
const Module = _nativeMapModules.MapLayerMapsforgeModule;
;
const LayerMapsforge = ({
nativeNodeHandle,
reactTreeIndex,
mapFile,
renderTheme = 'DEFAULT',
renderStyle = '',
renderOverlays = [],
hasBuildings = true,
hasLabels = true,
enabledZoomMin = 1,
enabledZoomMax = 30,
onCreate,
onRemove,
onChange,
onError
}) => {
const renderStylePrev = (0, _usePrevious.default)(renderStyle);
// @ts-ignore
const [random, setRandom] = (0, _react.useState)(0);
const [uuid, setUuid] = (0, _useRefState.default)(null);
const [triggerCreateNew, setTriggerCreateNew] = (0, _react.useState)(null);
const {
renderStyleDefaultId
} = (0, _useRenderStyleOptions.default)({
renderTheme,
nativeNodeHandle: nativeNodeHandle,
onError
});
const createLayer = () => {
setUuid(false);
_promiseQueue.default.enqueue(() => {
return Module.createLayer(nativeNodeHandle, mapFile, renderTheme, renderStyle, renderOverlays, !!hasBuildings, !!hasLabels, Math.round(enabledZoomMin), Math.round(enabledZoomMax), reactTreeIndex).then(response => {
setUuid(response.uuid);
setRandom(Math.random());
null === triggerCreateNew ? onCreate ? onCreate(response) : null : onChange ? onChange(response) : null;
}).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
});
};
(0, _react.useEffect)(() => {
if (uuid === null && nativeNodeHandle && mapFile) {
createLayer();
}
return () => {
if (uuid && nativeNodeHandle) {
_promiseQueue.default.enqueue(() => {
return Module.removeLayer(nativeNodeHandle, uuid).then(removedUuid => {
onRemove ? onRemove({
uuid: removedUuid
}) : null;
}).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
});
}
};
}, [nativeNodeHandle, !!uuid, triggerCreateNew]);
// enabledZoomMin enabledZoomMax changed.
(0, _react.useEffect)(() => {
if (nativeNodeHandle && uuid) {
Module.updateEnabledZoomMinMax(nativeNodeHandle, uuid, Math.round(enabledZoomMin), Math.round(enabledZoomMax)).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
}
}, [enabledZoomMin, enabledZoomMax]);
(0, _react.useEffect)(() => {
if (nativeNodeHandle && uuid) {
Module.toogleBuildings(nativeNodeHandle, uuid, hasBuildings).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
}
}, [hasBuildings]);
(0, _react.useEffect)(() => {
if (nativeNodeHandle && uuid) {
Module.toggleLabels(nativeNodeHandle, uuid, hasLabels).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
}
}, [hasLabels]);
(0, _react.useEffect)(() => {
if (nativeNodeHandle) {
if (uuid) {
let shouldRecreate = true;
if (renderStyle !== renderStylePrev && (!renderStylePrev || !renderStylePrev?.length) && renderStyle && renderStyleDefaultId && renderStyle === renderStyleDefaultId) {
shouldRecreate = false;
}
if (shouldRecreate) {
_promiseQueue.default.enqueue(() => {
return Module.removeLayer(nativeNodeHandle, uuid).then(() => {
setUuid(null);
setTriggerCreateNew(Math.random());
}).catch(err => {
console.log('ERROR', err);
onError ? onError(err) : null;
});
});
}
} else if (uuid === null && mapFile) {
setTriggerCreateNew(Math.random());
}
}
}, [mapFile, renderTheme, renderStyle, renderOverlays && Array.isArray(renderOverlays) && renderOverlays.length ? renderOverlays.join('') : null]);
return null;
};
LayerMapsforge.isMapLayer = true;
LayerMapsforge.BUILT_IN_THEMES = _constants.BUILT_IN_THEMES;
var _default = exports.default = LayerMapsforge;
//# sourceMappingURL=LayerMapsforge.js.map