Skip to content

Commit

Permalink
Add support to hide spatial and cross layer filter
Browse files Browse the repository at this point in the history
  • Loading branch information
offtherailz committed May 15, 2018
1 parent 1af43ff commit 570fabf
Show file tree
Hide file tree
Showing 4 changed files with 69 additions and 12 deletions.
14 changes: 8 additions & 6 deletions web/client/components/data/query/QueryBuilder.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,8 @@ class QueryBuilder extends React.Component {
autocompleteEnabled: PropTypes.bool,
emptyFilterWarning: PropTypes.bool,
header: PropTypes.node,
zoom: PropTypes.number
zoom: PropTypes.number,
toolsOptions: PropTypes.object
};

static defaultProps = {
Expand Down Expand Up @@ -127,7 +128,8 @@ class QueryBuilder extends React.Component {
onQuery: () => {},
onReset: () => {},
onChangeDrawingStatus: () => {}
}
},
toolsOptions: {}
};

render() {
Expand Down Expand Up @@ -174,23 +176,23 @@ class QueryBuilder extends React.Component {
addButtonIcon={this.props.addButtonIcon}
attributePanelExpanded={this.props.attributePanelExpanded}
actions={this.props.attributeFilterActions}/>
<SpatialFilter
{this.props.toolsOptions.hideSpatialFilter ? null : <SpatialFilter
useMapProjection={this.props.useMapProjection}
spatialField={this.props.spatialField}
spatialOperations={this.props.spatialOperations}
spatialMethodOptions={this.props.spatialMethodOptions}
spatialPanelExpanded={this.props.spatialPanelExpanded}
showDetailsPanel={this.props.showDetailsPanel}
actions={this.props.spatialFilterActions}
zoom={this.props.zoom}/>
<CrossLayerFilter
zoom={this.props.zoom}/>}
{this.props.toolsOptions.hideCrossLayer ? null : <CrossLayerFilter
spatialOperations={this.props.spatialOperations}
crossLayerExpanded={this.props.crossLayerExpanded}
searchUrl={this.props.searchUrl}
featureTypeName={this.props.featureTypeName}
{...this.props.crossLayerFilterOptions}
{...this.props.crossLayerFilterActions}
/>
/>}
</BorderLayout>
: <div style={{margin: "0 auto", width: "60px"}}><Spinner spinnerName="three-bounce" overrideSpinnerClassName="spinner"/></div>;
}
Expand Down
45 changes: 45 additions & 0 deletions web/client/components/data/query/__tests__/QueryBuilder-test.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -141,6 +141,51 @@ describe('QueryBuilder', () => {
const queryButton = document.getElementById('query-toolbar-query');
expect(queryButton).toExist();
expect(queryButton.getAttribute("disabled")).toBe('');
// check presence of attribute, spatial and cross layer filter
expect(document.querySelectorAll('.mapstore-switch-panel').length).toBe(3);
});
it('tool options', () => {
const groupLevels = 5;

const groupFields = [];

const filterFields = [{
rowId: 100,
groupId: 1,
attribute: "",
operator: null,
value: null,
exception: null
}];

const attributes = [{
id: "Attribute",
type: "list",
values: [
"attribute1",
"attribute2",
"attribute3",
"attribute4",
"attribute5"
]
}];

const querybuilder = ReactDOM.render(
<QueryBuilder
toolsOptions={{
hideCrossLayer: true,
hideSpatialFilter: true
}}
filterFields={filterFields}
attributes={attributes}
groupFields={groupFields}
groupLevels={groupLevels}
/>,
document.getElementById("container")
);
expect(querybuilder).toExist();
// only attribute filter should be shown
expect(document.querySelectorAll('.mapstore-switch-panel').length).toBe(1);
});

it('creates the QueryBuilder component in error state', () => {
Expand Down
4 changes: 4 additions & 0 deletions web/client/localConfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -518,6 +518,10 @@
}, {
"name": "QueryPanel",
"cfg": {
"toolsOptions": {
"hideCrossLayer": true,
"hideSpatialFilter": true
},
"containerPosition": "columns"
}
}, "Dashboard", "Notifications"],
Expand Down
18 changes: 12 additions & 6 deletions web/client/plugins/QueryPanel.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,8 @@ class QueryPanel extends React.Component {
activateSettingsTool: PropTypes.bool,
visibilityCheckType: PropTypes.string,
settingsOptions: PropTypes.object,
layout: PropTypes.object
layout: PropTypes.object,
toolsOptions: PropTypes.object
};

static defaultProps = {
Expand All @@ -226,7 +227,8 @@ class QueryPanel extends React.Component {
visibilityCheckType: "checkbox",
settingsOptions: {},
querypanelEnabled: false,
layout: {}
layout: {},
toolsOptions: {}
};

componentWillReceiveProps(newProps) {
Expand Down Expand Up @@ -275,6 +277,7 @@ class QueryPanel extends React.Component {
header={<QueryPanelHeader onToggleQuery={this.props.onToggleQuery} />}
spatialOperations={this.props.spatialOperations}
spatialMethodOptions={this.props.spatialMethodOptions}
toolsOptions={this.props.toolsOptions}
featureTypeErrorText={<Message msgId="layerProperties.featureTypeError"/>}/>
</div>);
};
Expand All @@ -301,15 +304,18 @@ class QueryPanel extends React.Component {
* - blacklist {string[]} a list of banned words excluded from the wfs search
* - maxFeatures {number} the maximum features fetched per request
* - predicate {string} the cql predicate
* - queriableAttributes {string[]} list of attributes to query on.
* - typeName {string} the workspace + layer name on geosever
* - querableAttributes {string[]} list of attributes to query on.
* - typeName {string} the workspace + layer name on geoserver
* - valueField {string} the attribute from features properties used as value/label in the autocomplete list
* - srsName {string} The projection of the requested features fetched via wfs
*
* @prop {object[]} cfg.spatialOperations: The list of geometric operations use to create the spatial filter.<br/>
* @prop {boolean} cfg.toolsOptions.hideCrossLayer force cross layer to hide
* @prop {boolean} cfg.toolsOptions.hideCrossLayer force cross layer filter panel to hide (when is not used or not usable)
* @prop {boolean} cfg.toolsOptions.hideSpatialFilter force spatial filter panel to hide (when is not used or not usable)
*
* @example
* // This example configure a layer with polyogns geometry as spatial filter method
* // This example configure a layer with polygons geometry as spatial filter method
* "spatialOperations": [
* {"id": "INTERSECTS", "name": "queryform.spatialfilter.operations.intersects"},
* {"id": "BBOX", "name": "queryform.spatialfilter.operations.bbox"},
Expand Down Expand Up @@ -339,7 +345,7 @@ class QueryPanel extends React.Component {
* "queriableAttributes": ["ATTRIBUTE_X"],
* "typeName": "workspace:typeName",
* "valueField": "ATTRIBUTE_Y",
* "srsName": "ESPG:3857"
* "srsName": "EPSG:3857"
* },
* "customItemClassName": "customItemClassName"
* }
Expand Down

0 comments on commit 570fabf

Please sign in to comment.