13127

Committed 29 Aug 2019 - 17:33 coverage increased (+2.5%) to 83.552%

Build # 13127

Build Type

Pull #3507

travis-ci-com

Committed by

web-flow

Commit Message

update the component-wrapping-rfc.md

Pull Request Pull Request #3507: update the component-wrapping-rfc.md

Run Details

3393 of 4570 branches covered (74.25%)

Branch coverage included in aggregate %.

7066 of 7948 relevant lines covered (88.9%)

3403.06 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

67.33

/modules/mapbox/src/deck-utils.js

import {Deck, WebMercatorViewport} from '@deck.gl/core';

export function getDeckInstance({map, gl, deck}) {
  // Only create one deck instance per context
  if (map.__deck) {
    return map.__deck;
  }

  const customRender = deck && deck.props._customRender;

  const deckProps = {
    useDevicePixels: true,
    _customRender: () => {
      map.triggerRepaint();
      if (customRender) {
        // customRender may be subscribed by DeckGL React component to update child props
        // make sure it is still called
        customRender();
      }
    },
    // TODO: import these defaults from a single source of truth
    parameters: {
      depthMask: true,
      depthTest: true,
      blendFunc: [gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA],
      blendEquation: gl.FUNC_ADD
    },
    userData: {
      isExternal: false,
      mapboxLayers: new Set()
    }
  };

  if (deck) {
    deck.setProps(deckProps);
    deck.props.userData.isExternal = true;
  } else {
    // Using external gl context - do not set css size
    Object.assign(deckProps, {
      gl,
      width: false,
      height: false,
      viewState: getViewState(map)
    });
    deck = new Deck(deckProps);

    // If deck is externally provided (React use case), we use deck's viewState to
    // drive the map.
    // Otherwise (pure JS use case), we use the map's viewState to drive deck.
    map.on('move', () => onMapMove(deck, map));
    map.on('remove', () => {
      deck.finalize();
      map.__deck = null;
    });
  }
  deck.props.userData.mapboxVersion = getMapboxVersion(map);
  map.__deck = deck;
  map.on('render', () => afterRender(deck, map));

  return deck;
}

export function addLayer(deck, layer) {
  deck.props.userData.mapboxLayers.add(layer);
  updateLayers(deck);
}

export function removeLayer(deck, layer) {
  deck.props.userData.mapboxLayers.delete(layer);
  updateLayers(deck);
}

export function updateLayer(deck, layer) {
  updateLayers(deck);
}

export function drawLayer(deck, map, layer) {
  let {currentViewport} = deck.props.userData;
  if (!currentViewport) {
    // This is the first layer drawn in this render cycle.
    // Generate viewport from the current map state.
    currentViewport = getViewport(deck, map, true);
    deck.props.userData.currentViewport = currentViewport;
  }

  deck._drawLayers('mapbox-repaint', {
    viewports: [currentViewport],
    // TODO - accept layerFilter in drawLayers' renderOptions
    layers: getLayers(deck, deckLayer => shouldDrawLayer(layer.id, deckLayer)),
    clearCanvas: false
  });
}

function getViewState(map) {
  const {lng, lat} = map.getCenter();
  return {
    longitude: lng,
    latitude: lat,
    zoom: map.getZoom(),
    bearing: map.getBearing(),
    pitch: map.getPitch()
  };
}

function getMapboxVersion(map) {
  // parse mapbox version string
  let major = 0;
  let minor = 0;
  if (map.version) {
    [major, minor] = map.version
      .split('.')
      .slice(0, 2)
      .map(Number);
  }
  return {major, minor};
}

function getViewport(deck, map, useMapboxProjection = true) {
  const {mapboxVersion} = deck.props.userData;

  return new WebMercatorViewport(
    Object.assign(
      {
        x: 0,
        y: 0,
        width: deck.width,
        height: deck.height
      },
      getViewState(map),
      useMapboxProjection
        ? {
            // match mapbox's projection matrix
            // A change of near plane was made in 1.3.0
            // https://github.com/mapbox/mapbox-gl-js/pull/8502
            nearZMultiplier:
              (mapboxVersion.major === 1 && mapboxVersion.minor >= 3) || mapboxVersion.major >= 2
                ? 0.02
                : 1 / (deck.height || 1),
            farZMultiplier: 1.01
          }
        : {
            // use deck.gl's projection matrix
            nearZMultiplier: 0.1,
            farZMultiplier: 10
          }
    )
  );
}

function afterRender(deck, map) {
  const {mapboxLayers, isExternal} = deck.props.userData;

  if (isExternal) {
    // Draw non-Mapbox layers
    const mapboxLayerIds = Array.from(mapboxLayers, layer => layer.id);
    const layers = getLayers(deck, deckLayer => {
      for (const id of mapboxLayerIds) {
        if (shouldDrawLayer(id, deckLayer)) {
          return false;
        }
      }
      return true;
    });
    if (layers.length > 0) {
      deck._drawLayers('mapbox-repaint', {
        viewports: [getViewport(deck, map, false)],
        layers,
        clearCanvas: false
      });
    }
  }

  // End of render cycle, clear generated viewport
  deck.props.userData.currentViewport = null;
}

function onMapMove(deck, map) {
  deck.setProps({
    viewState: getViewState(map)
  });
  // Camera changed, will trigger a map repaint right after this
  // Clear any change flag triggered by setting viewState so that deck does not request
  // a second repaint
  deck.needsRedraw({clearRedrawFlags: true});
}

function getLayers(deck, layerFilter) {
  const layers = deck.layerManager.getLayers();
  return layers.filter(layerFilter);
}

function shouldDrawLayer(id, layer) {
  let layerInstance = layer;
  while (layerInstance) {
    if (layerInstance.id === id) {
      return true;
    }
    layerInstance = layerInstance.parent;
  }
  return false;
}

function updateLayers(deck) {
  if (deck.props.userData.isExternal) {
    return;
  }

  const layers = [];
  deck.props.userData.mapboxLayers.forEach(deckLayer => {
    const LayerType = deckLayer.props.type;
    const layer = new LayerType(deckLayer.props);
    layers.push(layer);
  });
  deck.setProps({layers});
}

1	import {Deck, WebMercatorViewport} from '@deck.gl/core';
2
3	export function getDeckInstance({map, gl, deck}) {
4	// Only create one deck instance per context
5	if (map.__deck) {	1×
6	return map.__deck;	3×
7	}
8
9	const customRender = deck && deck.props._customRender;	3×
10
11	const deckProps = {	3×
12	useDevicePixels: true,
13	_customRender: () => {
14	map.triggerRepaint();	3×
15	if (customRender) {	Branches [[2, 0], [2, 1]] missed. 3×
16	// customRender may be subscribed by DeckGL React component to update child props
17	// make sure it is still called
18	customRender();	1×
19	}
20	},
21	// TODO: import these defaults from a single source of truth
22	parameters: {
23	depthMask: true,
24	depthTest: true,
25	blendFunc: [gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA],
26	blendEquation: gl.FUNC_ADD
27	},
28	userData: {
29	isExternal: false,
30	mapboxLayers: new Set()
31	}
32	};
33
34	if (deck) {	1×
35	deck.setProps(deckProps);	1×
36	deck.props.userData.isExternal = true;	3×
37	} else {
38	// Using external gl context - do not set css size
39	Object.assign(deckProps, {	1×
40	gl,
41	width: false,
42	height: false,
43	viewState: getViewState(map)
44	});
45	deck = new Deck(deckProps);	2×
46
47	// If deck is externally provided (React use case), we use deck's viewState to
48	// drive the map.
49	// Otherwise (pure JS use case), we use the map's viewState to drive deck.
50	map.on('move', () => onMapMove(deck, map));	2×
UNCOV 51	map.on('remove', () => {	!
UNCOV 52	deck.finalize();	!
53	map.__deck = null;	2×
54	});
55	}
56	deck.props.userData.mapboxVersion = getMapboxVersion(map);	1×
57	map.__deck = deck;	1×
58	map.on('render', () => afterRender(deck, map));	1×
59
60	return deck;	1×
61	}
62
63	export function addLayer(deck, layer) {
UNCOV 64	deck.props.userData.mapboxLayers.add(layer);	!
65	updateLayers(deck);	1×
66	}
67
68	export function removeLayer(deck, layer) {
69	deck.props.userData.mapboxLayers.delete(layer);	1×
70	updateLayers(deck);	1×
71	}
72
73	export function updateLayer(deck, layer) {
74	updateLayers(deck);	2×
75	}
76
77	export function drawLayer(deck, map, layer) {
78	let {currentViewport} = deck.props.userData;	2×
79	if (!currentViewport) {	Branches [[4, 0], [4, 1]] missed. 2×
80	// This is the first layer drawn in this render cycle.
81	// Generate viewport from the current map state.
82	currentViewport = getViewport(deck, map, true);	3×
83	deck.props.userData.currentViewport = currentViewport;	2×
84	}
85
86	deck._drawLayers('mapbox-repaint', {	3×
87	viewports: [currentViewport],
88	// TODO - accept layerFilter in drawLayers' renderOptions
89	layers: getLayers(deck, deckLayer => shouldDrawLayer(layer.id, deckLayer)),	3×
90	clearCanvas: false
91	});
92	}
93
94	function getViewState(map) {
95	const {lng, lat} = map.getCenter();	1×
96	return {	1×
97	longitude: lng,
98	latitude: lat,
99	zoom: map.getZoom(),
100	bearing: map.getBearing(),
101	pitch: map.getPitch()
102	};
103	}
104
105	function getMapboxVersion(map) {
106	// parse mapbox version string
107	let major = 0;	1×
UNCOV 108	let minor = 0;	!
UNCOV 109	if (map.version) {	!
UNCOV 110	[major, minor] = map.version	!
111	.split('.')
112	.slice(0, 2)
113	.map(Number);
114	}
UNCOV 115	return {major, minor};	!
116	}
117
118	function getViewport(deck, map, useMapboxProjection = true) {	Branches [[6, 0]] missed.
119	const {mapboxVersion} = deck.props.userData;	!
120
121	return new WebMercatorViewport(	!
122	Object.assign(
123	{
124	x: 0,
125	y: 0,
126	width: deck.width,
127	height: deck.height
128	},
129	getViewState(map),
130	useMapboxProjection	Branches [[7, 0], [7, 1]] missed.
131	? {
132	// match mapbox's projection matrix
133	// A change of near plane was made in 1.3.0
134	// https://github.com/mapbox/mapbox-gl-js/pull/8502
135	nearZMultiplier:
136	(mapboxVersion.major === 1 && mapboxVersion.minor >= 3) \|\| mapboxVersion.major >= 2	Branches [[8, 0], [8, 1], [9, 0], [9, 1], [9, 2]] missed.
137	? 0.02
138	: 1 / (deck.height \|\| 1),	Branches [[10, 0], [10, 1]] missed.
139	farZMultiplier: 1.01
140	}
141	: {
142	// use deck.gl's projection matrix
143	nearZMultiplier: 0.1,
144	farZMultiplier: 10
145	}
146	)
147	);
148	}
149
150	function afterRender(deck, map) {
151	const {mapboxLayers, isExternal} = deck.props.userData;	1×
152
153	if (isExternal) {	1×
154	// Draw non-Mapbox layers
155	const mapboxLayerIds = Array.from(mapboxLayers, layer => layer.id);	2×
156	const layers = getLayers(deck, deckLayer => {	2×
157	for (const id of mapboxLayerIds) {	1×
158	if (shouldDrawLayer(id, deckLayer)) {	Branches [[12, 1]] missed. 2×
UNCOV 159	return false;	!
160	}
161	}
162	return true;	!
163	});
164	if (layers.length > 0) {	Branches [[13, 0]] missed. 3×
165	deck._drawLayers('mapbox-repaint', {	3×
166	viewports: [getViewport(deck, map, false)],
167	layers,
168	clearCanvas: false
169	});
170	}
171	}
172
173	// End of render cycle, clear generated viewport
174	deck.props.userData.currentViewport = null;	1×
175	}
176
177	function onMapMove(deck, map) {
178	deck.setProps({	1×
179	viewState: getViewState(map)
180	});
181	// Camera changed, will trigger a map repaint right after this
182	// Clear any change flag triggered by setting viewState so that deck does not request
183	// a second repaint
184	deck.needsRedraw({clearRedrawFlags: true});	1×
185	}
186
187	function getLayers(deck, layerFilter) {
188	const layers = deck.layerManager.getLayers();	1×
189	return layers.filter(layerFilter);	1×
190	}
191
192	function shouldDrawLayer(id, layer) {
193	let layerInstance = layer;	1×
UNCOV 194	while (layerInstance) {	!
195	if (layerInstance.id === id) {	Branches [[14, 1]] missed. 1×
UNCOV 196	return true;	!
197	}
198	layerInstance = layerInstance.parent;	3×
199	}
200	return false;	!
201	}
202
203	function updateLayers(deck) {
UNCOV 204	if (deck.props.userData.isExternal) {	!
205	return;	1×
206	}
207
208	const layers = [];	1×
209	deck.props.userData.mapboxLayers.forEach(deckLayer => {	1×
210	const LayerType = deckLayer.props.type;	1×
211	const layer = new LayerType(deckLayer.props);	1×
212	layers.push(layer);	1×
213	});
UNCOV 214	deck.setProps({layers});	!
215	}

uber / deck.gl / 13127

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous