Skip to content

Commit

Permalink
Remove redundant vector layer feature inditialization
Browse files Browse the repository at this point in the history
  • Loading branch information
@manisandro
manisandro committed Oct 25, 2016
1 parent 5e80383 commit 85c27cf
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 56 deletions.
52 changes: 28 additions & 24 deletions web/client/components/map/openlayers/Layer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,9 @@ const OpenlayersLayer = React.createClass({
onInvalid: () => {}
};
},
getInitialState: function() {
return {layer: null};
},
componentDidMount() {
this.valid = true;
this.tilestoload = 0;
Expand All @@ -46,25 +49,25 @@ const OpenlayersLayer = React.createClass({
const newOpacity = (newProps.options && newProps.options.opacity !== undefined) ? newProps.options.opacity : 1.0;
this.setLayerOpacity(newOpacity);

if (newProps.position !== this.props.position && this.layer.setZIndex) {
this.layer.setZIndex(newProps.position);
if (newProps.position !== this.props.position && this.state.layer.setZIndex) {
this.state.layer.setZIndex(newProps.position);
}
if (this.props.options) {
this.updateLayer(newProps, this.props);
}
},
componentWillUnmount() {
if (this.layer && this.props.map) {
if (this.layer.detached) {
this.layer.remove();
if (this.state.layer && this.props.map) {
if (this.state.layer.detached) {
this.state.layer.remove();
} else {
this.props.map.removeLayer(this.layer);
this.props.map.removeLayer(this.state.layer);
}
}
},
render() {
if (this.props.children) {
const layer = this.layer;
const layer = this.state.layer;
const children = layer ? React.Children.map(this.props.children, child => {
return child ? React.cloneElement(child, {container: layer, styleName: this.props.options && this.props.options.styleName}) : null;
}) : null;
Expand All @@ -75,18 +78,18 @@ const OpenlayersLayer = React.createClass({
);
}

return Layers.renderLayer(this.props.type, this.props.options, this.props.map, this.props.mapId, this.layer);
return Layers.renderLayer(this.props.type, this.props.options, this.props.map, this.props.mapId, this.state.layer);
},
setLayerVisibility(visibility) {
var oldVisibility = this.props.options && this.props.options.visibility !== false;
if (visibility !== oldVisibility && this.layer && this.isValid()) {
this.layer.setVisible(visibility);
if (visibility !== oldVisibility && this.state.layer && this.isValid(this.state.layer)) {
this.state.layer.setVisible(visibility);
}
},
setLayerOpacity(opacity) {
var oldOpacity = (this.props.options && this.props.options.opacity !== undefined) ? this.props.options.opacity : 1.0;
if (opacity !== oldOpacity && this.layer) {
this.layer.setOpacity(opacity);
if (opacity !== oldOpacity && this.state.layer) {
this.state.layer.setOpacity(opacity);
}
},
generateOpts(options, position, srs) {
Expand All @@ -99,10 +102,11 @@ const OpenlayersLayer = React.createClass({
createLayer(type, options, position) {
if (type) {
const layerOptions = this.generateOpts(options, position, CoordinatesUtils.normalizeSRS(this.props.srs));
this.layer = Layers.createLayer(type, layerOptions, this.props.map, this.props.mapId);
if (this.layer && !this.layer.detached) {
this.addLayer(options);
let layer = Layers.createLayer(type, layerOptions, this.props.map, this.props.mapId);
if (layer && !layer.detached) {
this.addLayer(layer, options);
}
this.setState({layer: layer});
}
},
updateLayer(newProps, oldProps) {
Expand All @@ -116,30 +120,30 @@ const OpenlayersLayer = React.createClass({
}
Layers.updateLayer(
this.props.type,
this.layer,
this.state.layer,
this.generateOpts(newProps.options, newProps.position, newProps.srs),
this.generateOpts(oldProps.options, oldProps.position, oldProps.srs),
this.props.map,
this.props.mapId);
},
addLayer(options) {
if (this.isValid()) {
this.props.map.addLayer(this.layer);
this.layer.getSource().on('tileloadstart', () => {
addLayer(layer, options) {
if (this.isValid(layer)) {
this.props.map.addLayer(layer);
layer.getSource().on('tileloadstart', () => {
if (this.tilestoload === 0) {
this.props.onLayerLoading(options.id);
this.tilestoload++;
} else {
this.tilestoload++;
}
});
this.layer.getSource().on('tileloadend', () => {
layer.getSource().on('tileloadend', () => {
this.tilestoload--;
if (this.tilestoload === 0) {
this.props.onLayerLoad(options.id);
}
});
this.layer.getSource().on('tileloaderror', (event) => {
layer.getSource().on('tileloaderror', (event) => {
this.tilestoload--;
this.props.onLayerError(options.id);
if (this.tilestoload === 0) {
Expand All @@ -148,8 +152,8 @@ const OpenlayersLayer = React.createClass({
});
}
},
isValid() {
const valid = Layers.isValid(this.props.type, this.layer);
isValid(layer) {
const valid = Layers.isValid(this.props.type, layer);
if (this.valid && !valid) {
this.props.onInvalid(this.props.type, this.props.options);
}
Expand Down
30 changes: 15 additions & 15 deletions web/client/components/map/openlayers/__tests__/Layer-test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -224,11 +224,11 @@ describe('Openlayers layer', () => {


expect(layer).toExist();
expect(layer.layer).toExist();
expect(layer.state.layer).toExist();

expect(layer.layer.detached).toBe(true);
expect(layer.state.layer.detached).toBe(true);

layer.layer.remove();
layer.state.layer.remove();
});

it('creates a google layer for openlayers map', () => {
Expand Down Expand Up @@ -544,10 +544,10 @@ describe('Openlayers layer', () => {
<OpenlayersLayer type="bing" options={options} map={map}/>, document.getElementById("container"));

expect(layer).toExist();
expect(layer.layer).toExist();
expect(layer.state.layer).toExist();
// count layers
expect(map.getLayers().getLength()).toBe(1);
expect(layer.layer.getVisible()).toBe(true);
expect(layer.state.layer.getVisible()).toBe(true);
layer.setProps({options: assign({}, {
"type": "bing",
"title": "Bing Aerial",
Expand All @@ -557,7 +557,7 @@ describe('Openlayers layer', () => {
"visibility": true
})});
expect(map.getLayers().getLength()).toBe(1);
expect(layer.layer.getVisible()).toBe(true);
expect(layer.state.layer.getVisible()).toBe(true);
layer.setProps({options: assign({}, {
"type": "bing",
"title": "Bing Aerial",
Expand All @@ -567,7 +567,7 @@ describe('Openlayers layer', () => {
"visibility": false
})});
expect(map.getLayers().getLength()).toBe(1);
expect(layer.layer.getVisible()).toBe(false);
expect(layer.state.layer.getVisible()).toBe(false);

});

Expand Down Expand Up @@ -607,10 +607,10 @@ describe('Openlayers layer', () => {
// count layers
expect(map.getLayers().getLength()).toBe(1);

expect(layer.layer.getOpacity()).toBe(1.0);
expect(layer.state.layer.getOpacity()).toBe(1.0);

layer.setProps({options: {opacity: 0.5}, position: 0});
expect(layer.layer.getOpacity()).toBe(0.5);
expect(layer.state.layer.getOpacity()).toBe(0.5);
});

it('respects layer ordering', () => {
Expand All @@ -632,10 +632,10 @@ describe('Openlayers layer', () => {
// count layers
expect(map.getLayers().getLength()).toBe(1);

expect(layer.layer.getZIndex()).toBe(10);
expect(layer.state.layer.getZIndex()).toBe(10);

layer.setProps({position: 2});
expect(layer.layer.getZIndex()).toBe(2);
expect(layer.state.layer.getZIndex()).toBe(2);
});

it('changes wms params', () => {
Expand All @@ -660,11 +660,11 @@ describe('Openlayers layer', () => {
// count layers
expect(map.getLayers().getLength()).toBe(1);

expect(layer.layer.getSource()).toExist();
expect(layer.layer.getSource().getParams()).toExist();
expect(layer.layer.getSource().getParams().cql_filter).toBe("INCLUDE");
expect(layer.state.layer.getSource()).toExist();
expect(layer.state.layer.getSource().getParams()).toExist();
expect(layer.state.layer.getSource().getParams().cql_filter).toBe("INCLUDE");

layer.setProps({options: {params: {cql_filter: "EXCLUDE"}}});
expect(layer.layer.getSource().getParams().cql_filter).toBe("EXCLUDE");
expect(layer.state.layer.getSource().getParams().cql_filter).toBe("EXCLUDE");
});
});
18 changes: 1 addition & 17 deletions web/client/components/map/openlayers/plugins/VectorLayer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,23 +106,7 @@ var styleFunction = function(feature) {

Layers.registerType('vector', {
create: (options) => {
let features;
let featuresCrs = options.featuresCrs || 'EPSG:4326';
let layerCrs = options.crs || 'EPSG:3857';
if (options.features) {
let featureCollection = options.features;
if (Array.isArray(options.features)) {
featureCollection = { "type": "FeatureCollection", features: featureCollection};
}
features = (new ol.format.GeoJSON()).readFeatures(featureCollection);
if (featuresCrs !== layerCrs) {
features.forEach((f) => f.getGeometry().transform(featuresCrs, layerCrs));
}
}

const source = new ol.source.Vector({
features: features
});
const source = new ol.source.Vector();

let style = options.nativeStyle;
if (!style && options.style) {
Expand Down

0 comments on commit 85c27cf

Please sign in to comment.