Fix #1398 Improve query panel behaviour #1413

allyoucanmap · 2017-01-31T11:28:38Z

close drawer menu on search
close query results on back to search
close query results on toggle drawer control
limit the movement of height of query results dock

preview open/close panels:

dock minimum and maximum height positions:

* close drawer menu on search * close query results on back to search * close query results on toggle drawer control * limit the movement of height of query results dock

coveralls · 2017-01-31T11:34:56Z

Coverage increased (+0.002%) to 80.43% when pulling 031c1ad on allyoucanmap:improve-query-panel into d70b92b on geosolutions-it:master.

mbarto · 2017-01-31T11:30:59Z

web/client/components/data/featuregrid/DockedFeatureGrid.jsx

+        this.props.onClose();
+    },
+    limitDockHeight(size) {
+        const minSize = 0.25;


This should be configurable using a prop

should be configurable as a prop

Should they be also action and reducer or only props of the class? (minSize and maxSize)

props of the component and of the plugin (to be customizable in localConfig cfg entry). Pass them from the FeatureGrid Plugin down to this component.

mbarto · 2017-01-31T11:36:02Z

web/client/plugins/DrawerMenu.jsx

@@ -15,6 +15,8 @@ const {toggleControl, setControlProperty} = require('../actions/controls');

 const {changeMapStyle} = require('../actions/map');

+const {featureClose} = require('../actions/wfsquery');


We are putting querybuilder / featuregrid logic inside a generic container: it's not the right place.
We already have knowledge of querybuilder in the TOC. I don't want to mix stuff too much.

Maybe the right place to trigger this action is inside the toggleMenu actionCreator, using thunk to dispatch both actions.

offtherailz · 2017-01-31T11:44:52Z

web/client/translations/data.fr-FR

@@ -693,6 +693,7 @@
            "export": "Exporter",
            "selectall": "Tout sélectionner",
            "deselectall": "Tout désélectionner",
+            "backtosearch": "Back to search",


Retour à la recherche

offtherailz · 2017-01-31T11:45:42Z

web/client/translations/data.de-DE

@@ -691,6 +691,7 @@
            "export": "Export",
            "selectall": "Alle auswählen",
            "deselectall": "Auswahl aufheben",
+            "backtosearch": "Back to search",


Zurück zur Suche (?)

Maybe the right place to trigger this action is inside the toggleMenu actionCreator, using thunk to dispatch both actions.

offtherailz · 2017-01-31T11:48:00Z

web/client/components/data/featuregrid/DockedFeatureGrid.jsx

+        this.props.onClose();
+    },
+    limitDockHeight(size) {
+        const minSize = 0.25;


should be configurable as a prop

offtherailz · 2017-01-31T11:48:13Z

web/client/components/data/featuregrid/DockedFeatureGrid.jsx

+    },
+    limitDockHeight(size) {
+        const minSize = 0.25;
+        const maxSize = 0.85;


Should be configurable, 1 by default

* Set max and min height of dock query in props/localConfig * Add disabled control on drawer menu * Update FR and DE translation

allyoucanmap · 2017-01-31T17:01:11Z

in the previous commit we could back to the TOC menu in two ways from 'back to search' button or
the drawer button but this logic caused problems in DrawerMenu.jsx

now we have only one way to back to search menu with the query results 'back to search' button

preview new dock limit

coveralls · 2017-01-31T17:06:32Z

Coverage decreased (-3.8%) to 76.608% when pulling abcd66e on allyoucanmap:improve-query-panel into d70b92b on geosolutions-it:master.

mbarto · 2017-02-01T09:32:55Z

web/client/actions/wfsquery.js

@@ -15,6 +15,7 @@ const QUERY_CREATE = 'QUERY_CREATE';
 const QUERY_RESULT = 'QUERY_RESULT';
 const QUERY_ERROR = 'QUERY_ERROR';
 const RESET_QUERY = 'RESET_QUERY';
+const QUERY_DOCK_SIZE = 'QUERY_DOCK_SIZE';


Should we move this to another file? actions/featuregrid?

mbarto · 2017-02-01T09:33:00Z

web/client/actions/wfsquery.js

@@ -74,6 +75,13 @@ function queryError(error) {
    };
 }

+function queryDockSize(dockSize) {


Should we move this to another file? actions/featuregrid?

mbarto · 2017-02-01T09:38:38Z

web/client/components/data/featuregrid/DockedFeatureGrid.jsx

@@ -54,7 +53,13 @@ const DockedFeatureGrid = React.createClass({
        cleanError: React.PropTypes.func,
        selectAllToggle: React.PropTypes.func,
        zoomToFeatureAction: React.PropTypes.func,
-        onClose: React.PropTypes.func
+        onClose: React.PropTypes.func,
+        openDrawer: React.PropTypes.func,


onBackToSearch, to replace both openDrawer and enableDrawer: the featuregrid is not aware of drawer existance, and should not be. Each component is independent. We can glue things together in the plugins.

Should we include also onClose in onBackToSearch?

function closeResponse() { return (dispatch, getState) => { dispatch(featureClose()); // old onClose if (getState().controls && getState().controls.drawer) { dispatch(setControlProperty('drawer', 'enabled', true)); // old openDrawer dispatch(setControlProperty('drawer', 'disabled', false)); // old enableDrawer } }; }

Yes, I think it's better

mbarto · 2017-02-01T09:38:54Z

web/client/components/data/featuregrid/DockedFeatureGrid.jsx

@@ -295,6 +303,20 @@ const DockedFeatureGrid = React.createClass({
    selectFeatures(features) {
        this.props.selectAllToggle();
        this.props.selectFeatures(features);
+    },
+    backToSearch() {
+        this.props.openDrawer();


this.onBackToSearch()

mbarto · 2017-02-01T09:40:08Z

web/client/components/data/query/QueryToolbar.jsx

@@ -103,6 +105,8 @@ const QueryToolbar = React.createClass({
            sortOptions: this.props.sortOptions,
            hits: this.props.hits
        };
+        this.props.actions.closeDrawer();


closeDrawer and disableDrawer should be handled in onQuery. QueryToolbar does not know it's included in a drawer

mbarto · 2017-02-01T09:41:19Z

web/client/reducers/query.js

@@ -16,7 +16,8 @@ const {
    QUERY_RESULT,
    QUERY_ERROR,
    RESET_QUERY,
-    FEATURE_CLOSE
+    FEATURE_CLOSE,
+    QUERY_DOCK_SIZE


reducers/featuregrid.js?

mbarto · 2017-02-01T09:41:25Z

web/client/reducers/query.js

@@ -148,6 +150,11 @@ function query(state = initialState, action) {
                open: false
            });
        }
+        case QUERY_DOCK_SIZE: {


reducers/featuregrid.js?

offtherailz · 2017-02-01T09:39:24Z

web/client/components/data/query/QueryBuilder.jsx

@@ -95,7 +95,8 @@ const QueryBuilder = React.createClass({
                onQuery: () => {},
                onReset: () => {},
                onChangeDrawingStatus: () => {},
-                onToggleDrawer: () => {}
+                closeDrawer: () => {},
+                disableDrawer: () => {}


This functions be called into the onQuery action, if needed (using thunk)

offtherailz · 2017-02-01T09:41:14Z

web/client/components/data/query/QueryToolbar.jsx

@@ -104,7 +105,8 @@ const QueryToolbar = React.createClass({
            sortOptions: this.props.sortOptions,
            hits: this.props.hits
        };
-        this.props.actions.onToggleDrawer();


same here, there should be an thunk that opens the bottom table and closes the left menu.
Better if it happens when the search result arrives.

offtherailz · 2017-02-01T09:43:33Z

web/client/plugins/TOC.jsx

@@ -117,7 +117,8 @@ const SmartQueryForm = connect((state) => {
            onQuery: createQuery,
            onReset: reset,
            onChangeDrawingStatus: changeDrawingStatus,
-            onToggleDrawer: toggleControl.bind(null, 'drawer', null)
+            closeDrawer: setControlProperty.bind(null, 'drawer', 'enabled', false),


for the reasons explained above of course these functions should not be passed here.

coveralls · 2017-02-01T15:30:37Z

Coverage decreased (-3.8%) to 76.612% when pulling 5d2fe4b on allyoucanmap:improve-query-panel into d70b92b on geosolutions-it:master.

offtherailz · 2017-02-03T17:05:43Z

The reason why you disable the drawer menu button is that this way you avoid the user to do things with the layer tree that may make back to search button meanful?

allyoucanmap · 2017-02-03T17:18:49Z

Yes, it's for that reason. I think we should give only one way to the user to come back to the layer tree.
Maybe should we make invisible the drawer button?

Improve query panel

031c1ad

* close drawer menu on search * close query results on back to search * close query results on toggle drawer control * limit the movement of height of query results dock

simboss added the pending review label Jan 31, 2017

mbarto suggested changes Jan 31, 2017

View reviewed changes

offtherailz requested changes Jan 31, 2017

View reviewed changes

Changed logic of 'back to search'

abcd66e

* Set max and min height of dock query in props/localConfig * Add disabled control on drawer menu * Update FR and DE translation

mbarto suggested changes Feb 1, 2017

View reviewed changes

offtherailz requested changes Feb 1, 2017

View reviewed changes

Moved and merged the actions of the panels

5d2fe4b

offtherailz approved these changes Feb 3, 2017

View reviewed changes

mbarto approved these changes Feb 7, 2017

View reviewed changes

mbarto merged commit d39d13b into geosolutions-it:master Feb 7, 2017

mbarto removed the pending review label Feb 7, 2017

allyoucanmap deleted the improve-query-panel branch May 19, 2017 08:30

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix #1398 Improve query panel behaviour #1413

Fix #1398 Improve query panel behaviour #1413

allyoucanmap commented Jan 31, 2017

coveralls commented Jan 31, 2017

mbarto Jan 31, 2017

offtherailz Jan 31, 2017

allyoucanmap Jan 31, 2017

offtherailz Jan 31, 2017

mbarto Jan 31, 2017

offtherailz Jan 31, 2017

offtherailz Jan 31, 2017

offtherailz Jan 31, 2017

offtherailz Jan 31, 2017

offtherailz Jan 31, 2017

offtherailz Jan 31, 2017

allyoucanmap commented Jan 31, 2017 •

edited

Loading

coveralls commented Jan 31, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

allyoucanmap Feb 1, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

mbarto Feb 1, 2017

offtherailz Feb 1, 2017

offtherailz Feb 1, 2017

offtherailz Feb 1, 2017

coveralls commented Feb 1, 2017

offtherailz commented Feb 3, 2017

allyoucanmap commented Feb 3, 2017

		@@ -15,6 +15,8 @@ const {toggleControl, setControlProperty} = require('../actions/controls');

		const {changeMapStyle} = require('../actions/map');

		const {featureClose} = require('../actions/wfsquery');

Fix #1398 Improve query panel behaviour #1413

Fix #1398 Improve query panel behaviour #1413

Conversation

allyoucanmap commented Jan 31, 2017

coveralls commented Jan 31, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

allyoucanmap commented Jan 31, 2017 • edited Loading

coveralls commented Jan 31, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

coveralls commented Feb 1, 2017

offtherailz commented Feb 3, 2017

allyoucanmap commented Feb 3, 2017

allyoucanmap commented Jan 31, 2017 •

edited

Loading