all files / mapbox-gl-draw/src/ render.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
1×
 
1×
120×
120×
120×
 
119×
 
119×
 
119×
119×
 
119×
58×
 
63×
61×
91×
12×
 
 
119×
119×
119×
129×
129×
 
 
119×
 
119×
119×
 
 
136×
136×
136×
396×
 
 
 
119×
74×
 
 
 
 
 
119×
 
 
 
 
119×
38×
32×
 
38×
 
 
119×
3×
 
3×
 
3×
 
 
 
 
119×
119×
 
 
120×
120×
 
 
 
const Constants = require('./constants');
 
module.exports = function render() {
  const store = this;
  const mapExists = store.ctx.map && store.ctx.map.getSource(Constants.sources.HOT) !== undefined;
  if (!mapExists) return cleanup();
 
  const mode = store.ctx.events.currentModeName();
 
  store.ctx.ui.queueMapClasses({ mode });
 
  let newHotIds = [];
  let newColdIds = [];
 
  if (store.isDirty) {
    newColdIds = store.getAllIds();
  } else {
    newHotIds = store.getChangedIds().filter(id => store.get(id) !== undefined);
    newColdIds = store.sources.hot.filter((geojson) => {
      return geojson.properties.id && newHotIds.indexOf(geojson.properties.id) === -1 && store.get(geojson.properties.id) !== undefined;
    }).map(geojson => geojson.properties.id);
  }
 
  store.sources.hot = [];
  const lastColdCount = store.sources.cold.length;
  store.sources.cold = store.isDirty ? [] : store.sources.cold.filter((geojson) => {
    const id = geojson.properties.id || geojson.properties.parent;
    return newHotIds.indexOf(id) === -1;
  });
 
  const coldChanged = lastColdCount !== store.sources.cold.length || newColdIds.length > 0;
 
  newHotIds.forEach(id => renderFeature(id, 'hot'));
  newColdIds.forEach(id => renderFeature(id, 'cold'));
 
  function renderFeature(id, source) {
    const feature = store.get(id);
    const featureInternal = feature.internal(mode);
    store.ctx.events.currentModeRender(featureInternal, (geojson) => {
      store.sources[source].push(geojson);
    });
  }
 
  if (coldChanged) {
    store.ctx.map.getSource(Constants.sources.COLD).setData({
      type: Constants.geojsonTypes.FEATURE_COLLECTION,
      features: store.sources.cold
    });
  }
 
  store.ctx.map.getSource(Constants.sources.HOT).setData({
    type: Constants.geojsonTypes.FEATURE_COLLECTION,
    features: store.sources.hot
  });
 
  if (store._emitSelectionChange) {
    store.ctx.map.fire(Constants.events.SELECTION_CHANGE, {
      features: store.getSelected().map(feature => feature.toGeoJSON())
    });
    store._emitSelectionChange = false;
  }
 
  if (store._deletedFeaturesToEmit.length) {
    const geojsonToEmit = store._deletedFeaturesToEmit.map(feature => feature.toGeoJSON());
 
    store._deletedFeaturesToEmit = [];
 
    store.ctx.map.fire(Constants.events.DELETE, {
      features: geojsonToEmit
    });
  }
 
  store.ctx.map.fire(Constants.events.RENDER, {});
  cleanup();
 
  function cleanup() {
    store.isDirty = false;
    store.clearChangedIds();
  }
};