From 47b971b47739fe2cd1c0347714d80fa1b1cc12a5 Mon Sep 17 00:00:00 2001 From: shahzad Date: Thu, 14 Nov 2019 16:02:21 +0100 Subject: [PATCH] added options to disable zoom, hide tool tips, widgets/overlays in embeddable maps --- .../public/lib/panel/embeddable_panel.tsx | 23 ++-- .../maps/public/actions/map_actions.js | 10 ++ .../connected_components/gis_map/view.js | 73 +++++------- .../connected_components/map/mb/index.js | 8 +- .../connected_components/map/mb/view.js | 108 +++++++++--------- .../maps/public/embeddable/map_embeddable.js | 94 +++++++++------ .../plugins/maps/public/reducers/map.js | 99 ++++++++++------ .../maps/public/selectors/map_selectors.js | 4 + 8 files changed, 234 insertions(+), 185 deletions(-) diff --git a/src/plugins/embeddable/public/lib/panel/embeddable_panel.tsx b/src/plugins/embeddable/public/lib/panel/embeddable_panel.tsx index 8a8a2f44b7fd8..5a7ceca4d2e1f 100644 --- a/src/plugins/embeddable/public/lib/panel/embeddable_panel.tsx +++ b/src/plugins/embeddable/public/lib/panel/embeddable_panel.tsx @@ -49,6 +49,7 @@ interface Props { notifications: CoreStart['notifications']; inspector: InspectorStartContract; SavedObjectFinder: React.ComponentType; + hideHeader: boolean; } interface State { @@ -164,16 +165,18 @@ export class EmbeddablePanel extends React.Component { role="figure" aria-labelledby={headerId} > - + {!this.props.hideHeader && ( + + )}
); diff --git a/x-pack/legacy/plugins/maps/public/actions/map_actions.js b/x-pack/legacy/plugins/maps/public/actions/map_actions.js index 33771a355ddd5..f20338ea9b628 100644 --- a/x-pack/legacy/plugins/maps/public/actions/map_actions.js +++ b/x-pack/legacy/plugins/maps/public/actions/map_actions.js @@ -67,6 +67,8 @@ export const SET_TOOLTIP_STATE = 'SET_TOOLTIP_STATE'; export const UPDATE_DRAW_STATE = 'UPDATE_DRAW_STATE'; export const SET_SCROLL_ZOOM = 'SET_SCROLL_ZOOM'; export const SET_MAP_INIT_ERROR = 'SET_MAP_INIT_ERROR'; +export const SET_ZOOM = 'SET_ZOOM'; +export const DISABLE_TOOLTIP_CONTROL = 'DISABLE_TOOLTIP_CONTROL'; function getLayerLoadingCallbacks(dispatch, layerId) { return { @@ -829,3 +831,11 @@ export function updateDrawState(drawState) { }); }; } + +export function disableZoom() { + return { type: SET_ZOOM, disableZoom: true }; +} + +export function disableTooltipControl() { + return { type: DISABLE_TOOLTIP_CONTROL, disableTooltipControl: true }; +} diff --git a/x-pack/legacy/plugins/maps/public/connected_components/gis_map/view.js b/x-pack/legacy/plugins/maps/public/connected_components/gis_map/view.js index 65bd06779cc31..78622715c8524 100644 --- a/x-pack/legacy/plugins/maps/public/connected_components/gis_map/view.js +++ b/x-pack/legacy/plugins/maps/public/connected_components/gis_map/view.js @@ -21,12 +21,11 @@ import uuid from 'uuid/v4'; const RENDER_COMPLETE_EVENT = 'renderComplete'; export class GisMap extends Component { - state = { isInitialLoadRenderTimeoutComplete: false, domId: uuid(), geoFields: [], - } + }; componentDidMount() { this._isMounted = true; @@ -65,9 +64,9 @@ export class GisMap extends Component { if (el) { el.dispatchEvent(new CustomEvent(RENDER_COMPLETE_EVENT, { bubbles: true })); } - } + }; - _loadGeoFields = async (nextIndexPatternIds) => { + _loadGeoFields = async nextIndexPatternIds => { if (_.isEqual(nextIndexPatternIds, this._prevIndexPatternIds)) { // all ready loaded index pattern ids return; @@ -78,19 +77,22 @@ export class GisMap extends Component { const geoFields = []; try { const indexPatterns = await getIndexPatternsFromIds(nextIndexPatternIds); - indexPatterns.forEach((indexPattern) => { + indexPatterns.forEach(indexPattern => { indexPattern.fields.forEach(field => { - if (field.type === ES_GEO_FIELD_TYPE.GEO_POINT || field.type === ES_GEO_FIELD_TYPE.GEO_SHAPE) { + if ( + field.type === ES_GEO_FIELD_TYPE.GEO_POINT || + field.type === ES_GEO_FIELD_TYPE.GEO_SHAPE + ) { geoFields.push({ geoFieldName: field.name, geoFieldType: field.type, indexPatternTitle: indexPattern.title, - indexPatternId: indexPattern.id + indexPatternId: indexPattern.id, }); } }); }); - } catch(e) { + } catch (e) { // swallow errors. // the Layer-TOC will indicate which layers are disfunctional on a per-layer basis } @@ -100,7 +102,7 @@ export class GisMap extends Component { } this.setState({ geoFields }); - } + }; _setRefreshTimer = () => { const { isPaused, interval } = this.props.refreshConfig; @@ -116,12 +118,9 @@ export class GisMap extends Component { this._clearRefreshTimer(); if (!isPaused && interval > 0) { - this.refreshTimerId = setInterval( - () => { - this.props.triggerRefreshTimer(); - }, - interval - ); + this.refreshTimerId = setInterval(() => { + this.props.triggerRefreshTimer(); + }, interval); } }; @@ -134,16 +133,13 @@ export class GisMap extends Component { // Mapbox does not provide any feedback when rendering is complete. // Temporary solution is just to wait set period of time after data has loaded. _startInitialLoadRenderTimer = () => { - setTimeout( - () => { - if (this._isMounted) { - this.setState({ isInitialLoadRenderTimeoutComplete: true }); - this._onInitialLoadRenderComplete(); - } - }, - 5000 - ); - } + setTimeout(() => { + if (this._isMounted) { + this.setState({ isInitialLoadRenderTimeoutComplete: true }); + this._onInitialLoadRenderComplete(); + } + }, 5000); + }; render() { const { @@ -164,14 +160,12 @@ export class GisMap extends Component {
-

- {mapInitError} -

+

{mapInitError}
); @@ -183,21 +177,15 @@ export class GisMap extends Component { currentPanel = null; } else if (addLayerVisible) { currentPanelClassName = 'mapMapLayerPanel-isVisible'; - currentPanel = ; + currentPanel = ; } else if (layerDetailsVisible) { currentPanelClassName = 'mapMapLayerPanel-isVisible'; - currentPanel = ( - - ); + currentPanel = ; } let exitFullScreenButton; if (isFullScreen) { - exitFullScreenButton = ( - - ); + exitFullScreenButton = ; } return ( - - + {!this.props.hideToolbarOverlay && ( + + )} + {!this.props.hideWidgetOverlay && } diff --git a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/index.js b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/index.js index 5265ac15e1790..95bda4d5b92d4 100644 --- a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/index.js +++ b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/index.js @@ -20,7 +20,9 @@ import { getLayerList, getMapReady, getGoto, - getScrollZoom + getScrollZoom, + isZoomDisabled, + isTooltipControlDisabled, } from '../../../selectors/map_selectors'; import { getInspectorAdapters } from '../../../reducers/non_serializable_instances'; @@ -31,7 +33,9 @@ function mapStateToProps(state = {}) { goto: getGoto(state), inspectorAdapters: getInspectorAdapters(state), tooltipState: getTooltipState(state), - scrollZoom: getScrollZoom(state) + scrollZoom: getScrollZoom(state), + disableZoom: isZoomDisabled(state), + disableTooltipControl: isTooltipControlDisabled(state) }; } diff --git a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js index 7e72fedd4b1bb..20d680f13385a 100644 --- a/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js +++ b/x-pack/legacy/plugins/maps/public/connected_components/map/mb/view.js @@ -10,13 +10,10 @@ import { ResizeChecker } from 'ui/resize_checker'; import { syncLayerOrderForSingleLayer, removeOrphanedSourcesAndLayers, - addSpritesheetToMap + addSpritesheetToMap, } from './utils'; import { getGlyphUrl, isRetina } from '../../../meta'; -import { - DECIMAL_DEGREES_PRECISION, - ZOOM_PRECISION, -} from '../../../../common/constants'; +import { DECIMAL_DEGREES_PRECISION, ZOOM_PRECISION } from '../../../../common/constants'; import mapboxgl from 'mapbox-gl'; import chrome from 'ui/chrome'; import { spritesheet } from '@elastic/maki'; @@ -26,7 +23,6 @@ import { DrawControl } from './draw_control'; import { TooltipControl } from './tooltip_control'; export class MBMapContainer extends React.Component { - state = { prevLayerList: undefined, hasSyncedLayerList: false, @@ -73,12 +69,15 @@ export class MBMapContainer extends React.Component { _debouncedSync = _.debounce(() => { if (this._isMounted) { if (!this.state.hasSyncedLayerList) { - this.setState({ - hasSyncedLayerList: true - }, () => { - this._syncMbMapWithLayerList(); - this._syncMbMapWithInspector(); - }); + this.setState( + { + hasSyncedLayerList: true, + }, + () => { + this._syncMbMapWithLayerList(); + this._syncMbMapWithInspector(); + } + ); } } }, 256); @@ -91,25 +90,24 @@ export class MBMapContainer extends React.Component { zoom: _.round(zoom, ZOOM_PRECISION), center: { lon: _.round(mbCenter.lng, DECIMAL_DEGREES_PRECISION), - lat: _.round(mbCenter.lat, DECIMAL_DEGREES_PRECISION) + lat: _.round(mbCenter.lat, DECIMAL_DEGREES_PRECISION), }, extent: { minLon: _.round(mbBounds.getWest(), DECIMAL_DEGREES_PRECISION), minLat: _.round(mbBounds.getSouth(), DECIMAL_DEGREES_PRECISION), maxLon: _.round(mbBounds.getEast(), DECIMAL_DEGREES_PRECISION), - maxLat: _.round(mbBounds.getNorth(), DECIMAL_DEGREES_PRECISION) - } + maxLat: _.round(mbBounds.getNorth(), DECIMAL_DEGREES_PRECISION), + }, }; } async _createMbMapInstance() { const initialView = this.props.goto ? this.props.goto.center : null; - return new Promise((resolve) => { - + return new Promise(resolve => { const mbStyle = { version: 8, sources: {}, - layers: [] + layers: [], }; const glyphUrl = getGlyphUrl(); if (glyphUrl) { @@ -117,28 +115,30 @@ export class MBMapContainer extends React.Component { } const options = { + zoomControl: false, attributionControl: false, container: this.refs.mapContainer, style: mbStyle, scrollZoom: this.props.scrollZoom, - preserveDrawingBuffer: chrome.getInjected('preserveDrawingBuffer', false) + preserveDrawingBuffer: chrome.getInjected('preserveDrawingBuffer', false), + doubleClickZoom: !this.props.disableZoom, }; if (initialView) { options.zoom = initialView.zoom; options.center = { lng: initialView.lon, - lat: initialView.lat + lat: initialView.lat, }; } const mbMap = new mapboxgl.Map(options); mbMap.dragRotate.disable(); mbMap.touchZoomRotate.disableRotation(); - mbMap.addControl( - new mapboxgl.NavigationControl({ showCompass: false }), 'top-left' - ); + if (!this.props.disableZoom) { + mbMap.addControl(new mapboxgl.NavigationControl({ showCompass: false }), 'top-left'); + } let emptyImage; - mbMap.on('styleimagemissing', (e) => { + mbMap.on('styleimagemissing', e => { if (emptyImage) { mbMap.addImage(e.id, emptyImage); } @@ -146,7 +146,8 @@ export class MBMapContainer extends React.Component { mbMap.on('load', () => { emptyImage = new Image(); // eslint-disable-next-line max-len - emptyImage.src = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII='; + emptyImage.src = + 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII='; emptyImage.crossOrigin = 'anonymous'; resolve(mbMap); }); @@ -157,7 +158,7 @@ export class MBMapContainer extends React.Component { let mbMap; try { mbMap = await this._createMbMapInstance(); - } catch(error) { + } catch (error) { this.props.setMapInitError(error.message); return; } @@ -166,14 +167,12 @@ export class MBMapContainer extends React.Component { return; } - this.setState( - { mbMap }, - () => { - this._loadMakiSprites(); - this._initResizerChecker(); - this._registerMapEventListeners(); - this.props.onMapReady(this._getMapState()); - }); + this.setState({ mbMap }, () => { + this._loadMakiSprites(); + this._initResizerChecker(); + this._registerMapEventListeners(); + this.props.onMapReady(this._getMapState()); + }); } _registerMapEventListeners() { @@ -181,14 +180,17 @@ export class MBMapContainer extends React.Component { // moveend is fired while the map extent is still changing in the following scenarios // 1) During opening/closing of layer details panel, the EUI animation results in 8 moveend events // 2) Setting map zoom and center from goto is done in 2 API calls, resulting in 2 moveend events - this.state.mbMap.on('moveend', _.debounce(() => { - this.props.extentChanged(this._getMapState()); - }, 100)); + this.state.mbMap.on( + 'moveend', + _.debounce(() => { + this.props.extentChanged(this._getMapState()); + }, 100) + ); const throttledSetMouseCoordinates = _.throttle(e => { this.props.setMouseCoordinates({ lat: e.lngLat.lat, - lon: e.lngLat.lng + lon: e.lngLat.lng, }); }, 100); this.state.mbMap.on('mousemove', throttledSetMouseCoordinates); @@ -212,11 +214,7 @@ export class MBMapContainer extends React.Component { } _syncMbMapWithMapState = () => { - const { - isMapReady, - goto, - clearGoto, - } = this.props; + const { isMapReady, goto, clearGoto } = this.props; if (!isMapReady || !goto) { return; @@ -227,8 +225,14 @@ export class MBMapContainer extends React.Component { if (goto.bounds) { //clamping ot -89/89 latitudes since Mapboxgl does not seem to handle bounds that contain the poles (logs errors to the console when using -90/90) const lnLatBounds = new mapboxgl.LngLatBounds( - new mapboxgl.LngLat(clamp(goto.bounds.min_lon, -180, 180), clamp(goto.bounds.min_lat, -89, 89)), - new mapboxgl.LngLat(clamp(goto.bounds.max_lon, -180, 180), clamp(goto.bounds.max_lat, -89, 89)), + new mapboxgl.LngLat( + clamp(goto.bounds.min_lon, -180, 180), + clamp(goto.bounds.min_lat, -89, 89) + ), + new mapboxgl.LngLat( + clamp(goto.bounds.max_lon, -180, 180), + clamp(goto.bounds.max_lat, -89, 89) + ) ); //maxZoom ensure we're not zooming in too far on single points or small shapes //the padding is to avoid too tight of a fit around edges @@ -237,7 +241,7 @@ export class MBMapContainer extends React.Component { this.state.mbMap.setZoom(goto.center.zoom); this.state.mbMap.setCenter({ lng: goto.center.lon, - lat: goto.center.lat + lat: goto.center.lat, }); } }; @@ -260,7 +264,6 @@ export class MBMapContainer extends React.Component { const stats = { center: this.state.mbMap.getCenter().toArray(), zoom: this.state.mbMap.getZoom(), - }; this.props.inspectorAdapters.map.setMapState({ stats, @@ -272,20 +275,15 @@ export class MBMapContainer extends React.Component { let drawControl; let tooltipControl; if (this.state.mbMap) { - drawControl = ( - - ); - tooltipControl = ( + drawControl = ; + tooltipControl = !this.props.disableTooltipControl ? ( - ); + ) : null; } return (
this.onContainerStateChanged(input)); + this._subscription = this.getInput$().subscribe(input => this.onContainerStateChanged(input)); } getInspectorAdapters() { @@ -62,9 +64,11 @@ export class MapEmbeddable extends Embeddable { } onContainerStateChanged(containerState) { - if (!_.isEqual(containerState.timeRange, this._prevTimeRange) || - !_.isEqual(containerState.query, this._prevQuery) || - !onlyDisabledFiltersChanged(containerState.filters, this._prevFilters)) { + if ( + !_.isEqual(containerState.timeRange, this._prevTimeRange) || + !_.isEqual(containerState.query, this._prevQuery) || + !onlyDisabledFiltersChanged(containerState.filters, this._prevFilters) + ) { this._dispatchSetQuery(containerState); } @@ -77,20 +81,24 @@ export class MapEmbeddable extends Embeddable { this._prevTimeRange = timeRange; this._prevQuery = query; this._prevFilters = filters; - this._store.dispatch(setQuery({ - filters: filters.filter(filter => !filter.meta.disabled), - query, - timeFilters: timeRange, - refresh, - })); + this._store.dispatch( + setQuery({ + filters: filters.filter(filter => !filter.meta.disabled), + query, + timeFilters: timeRange, + refresh, + }) + ); } _dispatchSetRefreshConfig({ refreshConfig }) { this._prevRefreshConfig = refreshConfig; - this._store.dispatch(setRefreshConfig({ - isPaused: refreshConfig.pause, - interval: refreshConfig.value, - })); + this._store.dispatch( + setRefreshConfig({ + isPaused: refreshConfig.pause, + interval: refreshConfig.value, + }) + ); } /** @@ -111,12 +119,22 @@ export class MapEmbeddable extends Embeddable { this._store.dispatch(setOpenTOCDetails(this.input.openTOCDetails)); } + if (_.has(this.input, 'disableZoom')) { + this._store.dispatch(disableZoom(this.input.disableZoom)); + } + + if (_.has(this.input, 'disableTooltipControl')) { + this._store.dispatch(disableTooltipControl(this.input.disableTooltipControl)); + } + if (this.input.mapCenter) { - this._store.dispatch(setGotoWithCenter({ - lat: this.input.mapCenter.lat, - lon: this.input.mapCenter.lon, - zoom: this.input.mapCenter.zoom, - })); + this._store.dispatch( + setGotoWithCenter({ + lat: this.input.mapCenter.lat, + lon: this.input.mapCenter.lon, + zoom: this.input.mapCenter.zoom, + }) + ); } this._store.dispatch(replaceLayerList(this._layerList)); @@ -131,6 +149,8 @@ export class MapEmbeddable extends Embeddable { , @@ -147,7 +167,7 @@ export class MapEmbeddable extends Embeddable { embeddable: this, filters, }); - } + }; destroy() { super.destroy(); @@ -169,41 +189,41 @@ export class MapEmbeddable extends Embeddable { query: this._prevQuery, timeRange: this._prevTimeRange, filters: this._prevFilters, - refresh: true + refresh: true, }); } _handleStoreChanges() { - const center = getMapCenter(this._store.getState()); const zoom = getMapZoom(this._store.getState()); - const mapCenter = this.input.mapCenter || {}; - if (!mapCenter - || mapCenter.lat !== center.lat - || mapCenter.lon !== center.lon - || mapCenter.zoom !== zoom) { + if ( + !mapCenter || + mapCenter.lat !== center.lat || + mapCenter.lon !== center.lon || + mapCenter.zoom !== zoom + ) { this.updateInput({ mapCenter: { lat: center.lat, lon: center.lon, zoom: zoom, - } + }, }); } const isLayerTOCOpen = getIsLayerTOCOpen(this._store.getState()); if (this.input.isLayerTOCOpen !== isLayerTOCOpen) { this.updateInput({ - isLayerTOCOpen + isLayerTOCOpen, }); } const openTOCDetails = getOpenTOCDetails(this._store.getState()); if (!_.isEqual(this.input.openTOCDetails, openTOCDetails)) { this.updateInput({ - openTOCDetails + openTOCDetails, }); } } diff --git a/x-pack/legacy/plugins/maps/public/reducers/map.js b/x-pack/legacy/plugins/maps/public/reducers/map.js index fca277515affd..f2503fc23d0c8 100644 --- a/x-pack/legacy/plugins/maps/public/reducers/map.js +++ b/x-pack/legacy/plugins/maps/public/reducers/map.js @@ -41,6 +41,8 @@ import { SET_SCROLL_ZOOM, SET_MAP_INIT_ERROR, UPDATE_DRAW_STATE, + SET_ZOOM, + DISABLE_TOOLTIP_CONTROL } from '../actions/map_actions'; import { copyPersistentState, TRACKED_LAYER_DESCRIPTOR } from './util'; @@ -105,7 +107,9 @@ const INITIAL_STATE = { filters: [], refreshConfig: null, refreshTimerLastTriggeredAt: null, - drawState: null + drawState: null, + disableZoom: false, + disableTooltipControl: false, }, selectedLayerId: null, __transientLayerId: null, @@ -121,8 +125,8 @@ export function map(state = INITIAL_STATE, action) { ...state, mapState: { ...state.mapState, - drawState: action.drawState - } + drawState: action.drawState, + }, }; case REMOVE_TRACKED_LAYER_STATE: return removeTrackedLayerState(state, action.layerId); @@ -133,7 +137,7 @@ export function map(state = INITIAL_STATE, action) { case SET_TOOLTIP_STATE: return { ...state, - tooltipState: action.tooltipState + tooltipState: action.tooltipState, }; case SET_MOUSE_COORDINATES: return { @@ -142,25 +146,25 @@ export function map(state = INITIAL_STATE, action) { ...state.mapState, mouseCoordinates: { lat: action.lat, - lon: action.lon - } - } + lon: action.lon, + }, + }, }; case CLEAR_MOUSE_COORDINATES: return { ...state, mapState: { ...state.mapState, - mouseCoordinates: null - } + mouseCoordinates: null, + }, }; case SET_GOTO: return { ...state, goto: { center: action.center, - bounds: action.bounds - } + bounds: action.bounds, + }, }; case CLEAR_GOTO: return { @@ -181,10 +185,10 @@ export function map(state = INITIAL_STATE, action) { { ...layerList[layerIdx], __isInErrorState: action.isInErrorState, - __errorMessage: action.errorMessage + __errorMessage: action.errorMessage, }, - ...layerList.slice(layerIdx + 1) - ] + ...layerList.slice(layerIdx + 1), + ], }; case UPDATE_SOURCE_DATA_REQUEST: return updateSourceDataRequest(state, action); @@ -226,7 +230,7 @@ export function map(state = INITIAL_STATE, action) { query, timeFilters, filters, - } + }, }; case SET_REFRESH_CONFIG: const { isPaused, interval } = action; @@ -237,16 +241,16 @@ export function map(state = INITIAL_STATE, action) { refreshConfig: { isPaused, interval, - } - } + }, + }, }; case TRIGGER_REFRESH_TIMER: return { ...state, mapState: { ...state.mapState, - refreshTimerLastTriggeredAt: (new Date()).toISOString(), - } + refreshTimerLastTriggeredAt: new Date().toISOString(), + }, }; case SET_SELECTED_LAYER: const selectedMatch = state.layerList.find(layer => layer.id === action.selectedLayerId); @@ -255,16 +259,23 @@ export function map(state = INITIAL_STATE, action) { const transientMatch = state.layerList.find(layer => layer.id === action.transientLayerId); return { ...state, __transientLayerId: transientMatch ? action.transientLayerId : null }; case UPDATE_LAYER_ORDER: - return { ...state, layerList: action.newLayerOrder.map(layerNumber => state.layerList[layerNumber]) }; + return { + ...state, + layerList: action.newLayerOrder.map(layerNumber => state.layerList[layerNumber]), + }; case UPDATE_LAYER_PROP: return updateLayerInList(state, action.id, action.propName, action.newValue); case UPDATE_SOURCE_PROP: return updateLayerSourceDescriptorProp(state, action.layerId, action.propName, action.value); case SET_JOINS: - const layerDescriptor = state.layerList.find(descriptor => descriptor.id === action.layer.getId()); + const layerDescriptor = state.layerList.find( + descriptor => descriptor.id === action.layer.getId() + ); if (layerDescriptor) { const newLayerDescriptor = { ...layerDescriptor, joins: action.joins.slice() }; - const index = state.layerList.findIndex(descriptor => descriptor.id === action.layer.getId()); + const index = state.layerList.findIndex( + descriptor => descriptor.id === action.layer.getId() + ); const newLayerList = state.layerList.slice(); newLayerList[index] = newLayerDescriptor; return { ...state, layerList: newLayerList }; @@ -273,35 +284,28 @@ export function map(state = INITIAL_STATE, action) { case ADD_LAYER: return { ...state, - layerList: [ - ...state.layerList, - action.layer - ] + layerList: [...state.layerList, action.layer], }; case REMOVE_LAYER: return { - ...state, layerList: [...state.layerList.filter( - ({ id }) => id !== action.id)] + ...state, + layerList: [...state.layerList.filter(({ id }) => id !== action.id)], }; case ADD_WAITING_FOR_MAP_READY_LAYER: return { ...state, - waitingForMapReadyLayerList: [ - ...state.waitingForMapReadyLayerList, - action.layer - ] + waitingForMapReadyLayerList: [...state.waitingForMapReadyLayerList, action.layer], }; case CLEAR_WAITING_FOR_MAP_READY_LAYER_LIST: return { ...state, - waitingForMapReadyLayerList: [] + waitingForMapReadyLayerList: [], }; case TOGGLE_LAYER_VISIBLE: return updateLayerInList(state, action.layerId, 'visible'); case UPDATE_LAYER_STYLE: const styleLayerId = action.layerId; - return updateLayerInList(state, styleLayerId, 'style', - { ...action.style }); + return updateLayerInList(state, styleLayerId, 'style', { ...action.style }); case SET_LAYER_STYLE_META: const { layerId, styleMeta } = action; const index = getLayerIndex(state.layerList, layerId); @@ -309,19 +313,38 @@ export function map(state = INITIAL_STATE, action) { return state; } - return updateLayerInList(state, layerId, 'style', { ...state.layerList[index].style, __styleMeta: styleMeta }); + return updateLayerInList(state, layerId, 'style', { + ...state.layerList[index].style, + __styleMeta: styleMeta, + }); case SET_SCROLL_ZOOM: return { ...state, mapState: { ...state.mapState, scrollZoom: action.scrollZoom, - } + }, }; case SET_MAP_INIT_ERROR: return { ...state, - mapInitError: action.errorMessage + mapInitError: action.errorMessage, + }; + case SET_ZOOM: + return { + ...state, + mapState: { + ...state.mapState, + disableZoom: action.disableZoom, + }, + }; + case DISABLE_TOOLTIP_CONTROL: + return { + ...state, + mapState: { + ...state.mapState, + disableTooltipControl: action.disableTooltipControl, + }, }; default: return state; diff --git a/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js b/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js index 4f561c9391d4d..5f7bc05b60b37 100644 --- a/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js +++ b/x-pack/legacy/plugins/maps/public/selectors/map_selectors.js @@ -87,6 +87,10 @@ export const getWaitingForMapReadyLayerListRaw = ({ map }) => map.waitingForMapR export const getScrollZoom = ({ map }) => map.mapState.scrollZoom; +export const isZoomDisabled = ({ map }) => map.mapState.disableZoom; + +export const isTooltipControlDisabled = ({ map }) => map.mapState.disableTooltipControl; + export const getMapExtent = ({ map }) => map.mapState.extent ? map.mapState.extent : {};