react-native-mechanic-map
Version:
React Native wrapper for Mechanic Map
312 lines (270 loc) • 9.35 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactNativeWebview = require("react-native-webview");
var _index = require("./index");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
const MechanicMap = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
let {
languageCode,
disableAutoInit,
payload,
options,
onEvent,
onLevelSwitched,
onLocationOpened,
onLocationClosed,
onMapLoaded,
onNavigationCancalled,
onLocationHighlighted,
onMapError,
...props
} = _ref;
const webViewRef = (0, _react.useRef)(null);
const postMessage = message => {
var _webViewRef$current;
const messageStr = JSON.stringify(message);
(_webViewRef$current = webViewRef.current) === null || _webViewRef$current === void 0 ? void 0 : _webViewRef$current.postMessage(messageStr);
};
(0, _react.useImperativeHandle)(ref, () => ({
postMessage(params) {
postMessage(params);
},
init(params) {
postMessage({
action: _index.MapActions.INIT,
payload: {
language: params.languageCode || 'en',
levels: params.payload,
options: params.options || {}
}
});
},
showLocation(_ref2) {
let {
id,
type,
duration = true,
closeNavigation = true,
moveAndZoom = true
} = _ref2;
postMessage({
action: _index.MapActions.SHOW_LOCATION,
payload: {
id,
type,
duration,
closeNavigation,
moveAndZoom
}
});
},
closeNavigation() {
let resetLevel = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
postMessage({
action: _index.MapActions.CLOSE_NAVIGATION,
payload: {
resetLevel
}
});
},
showNavigation(route, params) {
postMessage({
action: _index.MapActions.SHOW_NAVIGATION,
payload: {
route,
autoMode: (params === null || params === void 0 ? void 0 : params.autoMode) === undefined ? true : params.autoMode,
zoomEnabled: (params === null || params === void 0 ? void 0 : params.zoomEnabled) === undefined ? true : params.zoomEnabled,
showPins: (params === null || params === void 0 ? void 0 : params.showPins) === undefined ? true : params.showPins
}
});
},
setFloor(floorNo, params) {
postMessage({
action: _index.MapActions.SET_FLOOR,
payload: {
floorNo,
resetZoom: (params === null || params === void 0 ? void 0 : params.resetZoom) === undefined ? true : params.resetZoom,
hideLocation: (params === null || params === void 0 ? void 0 : params.hideLocation) === undefined ? true : params.hideLocation
}
});
},
highlightLocations(ids, params) {
postMessage({
action: _index.MapActions.HIGHLIGHT_LOCATIONS,
payload: {
ids,
type: (params === null || params === void 0 ? void 0 : params.type) === undefined ? _index.LocationTypes.STORE : params.type,
zoomEnabled: params === null || params === void 0 ? void 0 : params.zoomEnabled,
duration: params === null || params === void 0 ? void 0 : params.duration
}
});
},
hideLocation() {
postMessage({
action: _index.MapActions.HIDE_LOCATION
});
},
setCurrentLocation(x, y, floorNo) {
postMessage({
action: _index.MapActions.SET_CURRENT_LOCATION,
payload: {
x,
y,
floorNo
}
});
},
showCurrentLocation() {
postMessage({
action: _index.MapActions.SHOW_CURRENT_LOCATION
});
},
moveCurrentLocation(coords, params) {
postMessage({
action: _index.MapActions.MOVE_CURRENT_LOCATION,
payload: {
coords,
floorNo: params === null || params === void 0 ? void 0 : params.floorNo
}
});
},
removeCurrentLocation() {
postMessage({
action: _index.MapActions.REMOVE_CURRENT_LOCATION
});
},
zoomIn() {
postMessage({
action: _index.MapActions.ZOOM_IN
});
},
zoomOut() {
postMessage({
action: _index.MapActions.ZOOM_OUT
});
},
moveTo(x, y, params) {
postMessage({
action: _index.MapActions.MOVE_TO,
payload: {
x,
y,
scale: params === null || params === void 0 ? void 0 : params.scale,
duration: params === null || params === void 0 ? void 0 : params.duration,
easing: params === null || params === void 0 ? void 0 : params.easing
}
});
},
zoomTo(x, y, params) {
postMessage({
action: _index.MapActions.ZOOM_TO,
payload: {
x,
y,
scale: params === null || params === void 0 ? void 0 : params.scale,
duration: params === null || params === void 0 ? void 0 : params.duration,
easing: params === null || params === void 0 ? void 0 : params.easing
}
});
},
addLevel(level) {
postMessage({
action: _index.MapActions.ADD_LEVEL,
payload: {
level
}
});
},
resetLevel() {
postMessage({
action: _index.MapActions.RESET_LEVEL
});
},
changeColors(colors) {
postMessage({
action: _index.MapActions.CHANGE_COLORS,
payload: { ...colors
}
});
},
reload() {
postMessage({
action: _index.MapActions.RELOAD
});
}
}));
return /*#__PURE__*/_react.default.createElement(_reactNativeWebview.WebView, _extends({
ref: webViewRef,
source: _reactNative.Platform.OS === 'android' ? {
uri: 'file:///android_asset/assets/mechanic_map.html'
} : require('../assets/mechanic_map.html'),
onMessage: event => {
const {
action,
data
} = JSON.parse(event.nativeEvent.data);
if (onEvent) {
onEvent({
action,
data
});
}
if (action === _index.MapResponses.MAP_LOADED && onMapLoaded) {
onMapLoaded();
}
if (action === _index.MapResponses.LOCATION_OPENED && onLocationOpened) {
onLocationOpened(data);
}
if (action === _index.MapResponses.LOCATION_CLOSED && onLocationClosed) {
onLocationClosed();
}
if (action === _index.MapResponses.LEVEL_SWITCHED && onLevelSwitched) {
onLevelSwitched(data); // new floor no
}
if (action === _index.MapResponses.NAVIGATION_CANCELLED && onNavigationCancalled) {
onNavigationCancalled();
}
if (action === _index.MapResponses.LOCATION_HIGHLIGHTED && onLocationHighlighted) {
onLocationHighlighted();
}
if (action === _index.MapResponses.ERROR && onMapError) {
onMapError(data);
}
},
onLoadEnd: () => {
if (disableAutoInit) return;
postMessage({
action: _index.MapActions.INIT,
payload: {
language: languageCode,
levels: payload,
options
}
});
},
allowFileAccess: true,
allowUniversalAccessFromFileURLs: true,
originWhitelist: ['*'],
hideKeyboardAccessoryView: false
}, props));
});
MechanicMap.propTypes = {
payload: _propTypes.default.array.isRequired
};
MechanicMap.defaultProps = {
languageCode: 'en',
disableAutoInit: false,
options: {}
};
var _default = MechanicMap;
exports.default = _default;
//# sourceMappingURL=MechanicMap.js.map