diff --git a/web/client/components/data/query/ComboField.jsx b/web/client/components/data/query/ComboField.jsx index 5c099151b4..453955cb2f 100644 --- a/web/client/components/data/query/ComboField.jsx +++ b/web/client/components/data/query/ComboField.jsx @@ -14,7 +14,7 @@ const OverlayTrigger = require('../../misc/OverlayTrigger'); const {DropdownList, Multiselect} = require('react-widgets'); -const LocaleUtils = require('../../../utils/LocaleUtils'); +const Message = require('../../../components/I18N/Message'); const ComboField = React.createClass({ propTypes: { @@ -22,6 +22,7 @@ const ComboField = React.createClass({ style: React.PropTypes.object, valueField: React.PropTypes.string, textField: React.PropTypes.string, + placeholder: React.PropTypes.string, fieldOptions: React.PropTypes.array, fieldName: React.PropTypes.string, fieldRowId: React.PropTypes.number, @@ -64,6 +65,7 @@ const ComboField = React.createClass({ style: { width: "100%" }, + placeholder: , multivalue: false, disabled: false, valueField: null, @@ -89,8 +91,6 @@ const ComboField = React.createClass({ style = assign({}, style, {borderColor: "#FF0000"}); } - let placeholder = LocaleUtils.getMessageById(this.context.messages, "queryform.attributefilter.combo_placeholder"); - const ListComponent = this.props.multivalue ? Multiselect : DropdownList; const list = this.props.valueField !== null && this.props.textField !== null ? ( @@ -104,7 +104,7 @@ const ComboField = React.createClass({ value={this.props.fieldValue} caseSensitive={false} minLength={3} - placeholder={placeholder} + placeholder={this.props.placeholder} filter={this.props.comboFilter} style={style} groupBy={this.props.groupBy} @@ -121,7 +121,7 @@ const ComboField = React.createClass({ value={this.props.fieldValue} caseSensitive={false} minLength={3} - placeholder={placeholder} + placeholder={this.props.placeholder} filter={this.props.comboFilter} style={style} groupBy={this.props.groupBy} diff --git a/web/client/components/data/query/FilterField.jsx b/web/client/components/data/query/FilterField.jsx index 5d0e31f60d..eb818decff 100644 --- a/web/client/components/data/query/FilterField.jsx +++ b/web/client/components/data/query/FilterField.jsx @@ -10,6 +10,7 @@ const {Row, Col} = require('react-bootstrap'); const ComboField = require('./ComboField'); const assign = require('object-assign'); +const LocaleUtils = require('../../../utils/LocaleUtils'); const FilterField = React.createClass({ propTypes: { @@ -20,6 +21,9 @@ const FilterField = React.createClass({ onUpdateExceptionField: React.PropTypes.func, onChangeCascadingValue: React.PropTypes.func }, + contextTypes: { + messages: React.PropTypes.object + }, getDefaultProps() { return { attributes: [], @@ -68,6 +72,7 @@ const FilterField = React.createClass({ valueField={'id'} textField={'name'} fieldOptions={this.props.attributes.map((attribute) => { return {id: attribute.attribute, name: attribute.label}; })} + placeholder={LocaleUtils.getMessageById(this.context.messages, "queryform.attributefilter.combo_placeholder")} fieldValue={this.props.filterField.attribute} fieldName="attribute" fieldRowId={this.props.filterField.rowId} diff --git a/web/client/components/data/query/SpatialFilter.jsx b/web/client/components/data/query/SpatialFilter.jsx index 3ad7de7df8..e2e760e5ae 100644 --- a/web/client/components/data/query/SpatialFilter.jsx +++ b/web/client/components/data/query/SpatialFilter.jsx @@ -90,6 +90,7 @@ const SpatialFilter = React.createClass({ return LocaleUtils.getMessageById(this.context.messages, opt.name); }) } + placeholder={LocaleUtils.getMessageById(this.context.messages, "queryform.spatialfilter.combo_placeholder")} fieldName="method" style={{width: "140px"}} fieldRowId={new Date().getUTCMilliseconds()} @@ -118,7 +119,7 @@ const SpatialFilter = React.createClass({ const methodSelector = this.props.spatialField.geometry ? ( -
+
{methodCombo} @@ -133,7 +134,7 @@ const SpatialFilter = React.createClass({ ) : ( -
+
{methodCombo} diff --git a/web/client/components/theme/ThemeSwitcher.jsx b/web/client/components/theme/ThemeSwitcher.jsx index 631daaa962..aeea71bf0f 100644 --- a/web/client/components/theme/ThemeSwitcher.jsx +++ b/web/client/components/theme/ThemeSwitcher.jsx @@ -21,10 +21,7 @@ const ThemeSwitcher = React.createClass({ getDefaultProps() { return { onThemeSelected: () => {}, - style: { - width: "300px", - margin: "20px auto" - } + style: {} }; }, diff --git a/web/client/localConfig.json b/web/client/localConfig.json index 0e25a81f2e..b6b6e48cfc 100644 --- a/web/client/localConfig.json +++ b/web/client/localConfig.json @@ -275,7 +275,7 @@ "className": "navbar shadow navbar-home" } }, "ManagerMenu", "Login", "Language", "Attribution", "ScrollTop"], - "maps": ["Header", "Fork", "MapSearch", "HomeDescription", "MapType", "ThemeSwitcher", "CreateNewMap", "Maps", "Examples", "Footer"], + "maps": ["Header", "Fork", "MapSearch", "HomeDescription", "MapType", "ThemeSwitcher", "GridContainer", "CreateNewMap", "Maps", "Examples", "Footer"], "manager": ["Header", "Redirect", "Manager", "Home", "UserManager", "GroupManager", "Footer"] } } diff --git a/web/client/plugins/BackgroundSwitcher.jsx b/web/client/plugins/BackgroundSwitcher.jsx index 0ea8a26750..90542990fd 100644 --- a/web/client/plugins/BackgroundSwitcher.jsx +++ b/web/client/plugins/BackgroundSwitcher.jsx @@ -53,7 +53,8 @@ module.exports = { icon: , title: 'background', buttonConfig: { - buttonClassName: "square-button no-border" + buttonClassName: "square-button no-border", + tooltip: "toc.backgroundSwitcher" }, priority: 2 } diff --git a/web/client/plugins/DrawerMenu.jsx b/web/client/plugins/DrawerMenu.jsx index 914fa25105..941e271ca4 100644 --- a/web/client/plugins/DrawerMenu.jsx +++ b/web/client/plugins/DrawerMenu.jsx @@ -8,6 +8,7 @@ const React = require('react'); const {connect} = require('react-redux'); +const OverlayTrigger = require('../components/misc/OverlayTrigger'); const Message = require('./locale/Message'); @@ -15,7 +16,7 @@ const {toggleControl, setControlProperty} = require('../actions/controls'); const {changeMapStyle} = require('../actions/map'); -const {Button, Glyphicon, Panel} = require('react-bootstrap'); +const {Button, Glyphicon, Panel, Tooltip} = require('react-bootstrap'); const Section = require('./drawer/Section'); @@ -86,9 +87,14 @@ const DrawerMenu = React.createClass({ }); }, render() { + let tooltip = ; return (
- + + + + } alignment="left"> {this.renderItems()} diff --git a/web/client/plugins/GridContainer.jsx b/web/client/plugins/GridContainer.jsx new file mode 100644 index 0000000000..88d5e9a4ec --- /dev/null +++ b/web/client/plugins/GridContainer.jsx @@ -0,0 +1,69 @@ +/* + * Copyright 2017, GeoSolutions Sas. + * All rights reserved. + * + * This source code is licensed under the BSD-style license found in the + * LICENSE file in the root directory of this source tree. +*/ +const React = require('react'); +const {Grid, Row, Col} = require('react-bootstrap'); +const ToolsContainer = require('./containers/ToolsContainer'); + +/** + * GridContainerPlugin. This is a plugin that works as container + * of other plugins displaying them in a grid +*/ +const GridContainer = React.createClass({ + propTypes: { + className: React.PropTypes.string, + style: React.PropTypes.object, + items: React.PropTypes.array, + id: React.PropTypes.string, + mapType: React.PropTypes.string + }, + getDefaultProps() { + return { + items: [], + className: "grid-home-container", + style: {}, + id: "mapstore-grid-home", + mapType: "leaflet" + }; + }, + getPanels() { + return this.props.items.filter((item) => item.tools).reduce((previous, current) => { + return previous.concat( + current.tools.map((tool, index) => ({ + name: current.name + index, + panel: tool, + cfg: current.cfg.toolsCfg ? current.cfg.toolsCfg[index] : {} + })) + ); + }, []); + }, + getTools() { + return this.props.items.sort((a, b) => a.position - b.position); + }, + render() { + return ( ( + {props.children.map( item => {item})} + )} + toolStyle="primary" + activeStyle="default" + stateSelector="omnibar" + tool={(props) =>
{props.children}
} + tools={this.getTools()} + panels={this.getPanels()} + />); + } +}); + +module.exports = { + GridContainerPlugin: GridContainer, + reducers: {} +}; diff --git a/web/client/plugins/Measure.jsx b/web/client/plugins/Measure.jsx index 06f0a99cfe..b2dc0f7d83 100644 --- a/web/client/plugins/Measure.jsx +++ b/web/client/plugins/Measure.jsx @@ -66,7 +66,8 @@ module.exports = { title: 'measureComponent.title', showPanel: false, buttonConfig: { - buttonClassName: "square-button no-border" + buttonClassName: "square-button no-border", + tooltip: "toc.measure" }, priority: 2 } diff --git a/web/client/plugins/TOC.jsx b/web/client/plugins/TOC.jsx index dbf4c61776..322e99e29b 100644 --- a/web/client/plugins/TOC.jsx +++ b/web/client/plugins/TOC.jsx @@ -314,7 +314,8 @@ module.exports = { icon: , title: 'layers', buttonConfig: { - buttonClassName: "square-button no-border" + buttonClassName: "square-button no-border", + tooltip: "toc.layers" }, priority: 2 } diff --git a/web/client/plugins/ThemeSwitcher.jsx b/web/client/plugins/ThemeSwitcher.jsx index ac1c12ce52..bfb0357f07 100644 --- a/web/client/plugins/ThemeSwitcher.jsx +++ b/web/client/plugins/ThemeSwitcher.jsx @@ -1,13 +1,14 @@ -/** +/* * Copyright 2017, GeoSolutions Sas. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. - */ +*/ + const {connect} = require('react-redux'); const {selectTheme} = require('../actions/theme'); - +const assign = require('object-assign'); const themes = require('../themes'); const ThemeSwitcherPlugin = connect((s) => ({ @@ -18,7 +19,15 @@ const ThemeSwitcherPlugin = connect((s) => ({ })(require('../components/theme/ThemeSwitcher')); module.exports = { - ThemeSwitcherPlugin: ThemeSwitcherPlugin, + ThemeSwitcherPlugin: assign(ThemeSwitcherPlugin, { + GridContainer: { + id: 'themeSwitcher', + name: 'themeSwitcher', + tool: true, + position: 1, + priority: 1 + } + }), reducers: { theme: require('../reducers/theme') } diff --git a/web/client/plugins/drawer/Menu.jsx b/web/client/plugins/drawer/Menu.jsx index dcc129da9a..437ad4e09a 100644 --- a/web/client/plugins/drawer/Menu.jsx +++ b/web/client/plugins/drawer/Menu.jsx @@ -5,13 +5,13 @@ * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. */ -var React = require('react'); -var {Glyphicon, Button, Tooltip} = require('react-bootstrap'); +const React = require('react'); +const {Glyphicon, Button, Tooltip} = require('react-bootstrap'); const OverlayTrigger = require('../../components/misc/OverlayTrigger'); -var Sidebar = require('react-sidebar').default; -var Message = require('../../components/I18N/Message'); +const Sidebar = require('react-sidebar').default; +const Message = require('../../components/I18N/Message'); -var Menu = React.createClass({ +const Menu = React.createClass({ propTypes: { title: React.PropTypes.node, alignment: React.PropTypes.string, diff --git a/web/client/product/assets/css/maps.css b/web/client/product/assets/css/maps.css index 52539020e0..25bcd447cb 100644 --- a/web/client/product/assets/css/maps.css +++ b/web/client/product/assets/css/maps.css @@ -67,13 +67,30 @@ div#mailinglists h1 { font-size: 26px; text-align: center; } +@media (min-width: 769px) { + div#mapstore-maptype { + width: 300px; + margin-left: auto; + margin-bottom: 40px; + } +} +@media (max-width: 768px) { + div#mapstore-maptype { + width: 100%; + } +} -div#mapstore-maptype { - width: 300px; - margin-left: auto; - margin-right: auto; - margin-bottom: 20px; - margin-top: -35px; +@media (min-width: 769px) { + #mapstore-grid-home div.theme-switcher.form-group.form-group-sm { + width: 300px; + margin-bottom: 40px; + } +} + +@media (max-width: 768px) { + #mapstore-grid-home div.theme-switcher.form-group.form-group-sm { + width: 100%; + } } .mapstore-home-examples .carousel-caption{ background-color: rgba(0,0,0,0.4); diff --git a/web/client/product/plugins.js b/web/client/product/plugins.js index e134cd01c7..af13d1b5cf 100644 --- a/web/client/product/plugins.js +++ b/web/client/product/plugins.js @@ -37,6 +37,7 @@ module.exports = { MetadataExplorerPlugin: require('../plugins/MetadataExplorer'), LoginPlugin: require('../plugins/Login'), OmniBarPlugin: require('../plugins/OmniBar'), + GridContainerPlugin: require('../plugins/GridContainer'), BurgerMenuPlugin: require('../plugins/BurgerMenu'), UndoPlugin: require('../plugins/History'), RedoPlugin: require('../plugins/History'), diff --git a/web/client/product/plugins/MapType.jsx b/web/client/product/plugins/MapType.jsx index 5cb85346fe..5b5daa0d6c 100644 --- a/web/client/product/plugins/MapType.jsx +++ b/web/client/product/plugins/MapType.jsx @@ -11,6 +11,7 @@ const Message = require('../../components/I18N/Message'); const {compose} = require('redux'); const {changeMapType} = require('../actions/home'); const {connect} = require('react-redux'); +const assign = require('object-assign'); const MapType = React.createClass({ propTypes: { @@ -47,6 +48,13 @@ const MapTypePlugin = connect((state) => ({ })(MapType); module.exports = { - MapTypePlugin: MapTypePlugin, + MapTypePlugin: assign(MapTypePlugin, { + GridContainer: { + name: 'MapType', + tool: true, + position: 1, + priority: 1 + } + }), reducers: {home: require('../reducers/home')} }; diff --git a/web/client/product/plugins/homedescription/homedescription.css b/web/client/product/plugins/homedescription/homedescription.css index cc5f3138d8..bd99c5a2d7 100644 --- a/web/client/product/plugins/homedescription/homedescription.css +++ b/web/client/product/plugins/homedescription/homedescription.css @@ -1,6 +1,6 @@ .mapstore-home-description { margin-top: -50px; - margin-bottom: 50px; + margin-bottom: 30px; margin-left: 20px; margin-right: 20px; diff --git a/web/client/translations/data.de-DE b/web/client/translations/data.de-DE index 1396925460..04af027b2d 100644 --- a/web/client/translations/data.de-DE +++ b/web/client/translations/data.de-DE @@ -177,7 +177,11 @@ "editLayerProperties": "Ändere Ebenen Eigenschaften", "searchFeatures": "Auf dieser Ebene suchen...", "removeLayer": "Ebene entfernen", - "loadingerror": "Diese Ebene wurde nicht korrekt geladen" + "loadingerror": "Diese Ebene wurde nicht korrekt geladen", + "measure": "Messen", + "backgroundSwitcher": "Hintergrund", + "layers": "Ebenen", + "drawerButton": "Ebenen" }, "print":{ "paneltitle": "Drucken", @@ -392,6 +396,9 @@ "config": { "load_config_exception": "Fehler beim Laden der Konfiguration" }, + "comboField": { + "default_placeholder": "Wählen..." + }, "form": { "header": "Finde im Datensatz", "dataset_header": "Datensatz" @@ -402,7 +409,7 @@ "add_group": " Füge Gruppe hinzu", "group_label_a": "Übereinstimmung", "group_label_b": "der folgenden Bedingungen:", - "combo_placeholder": "Wähle", + "combo_placeholder": "Attribut", "text_placeholder": "Gib den zu suchenden Text ein", "attribute_filter_header": "Attribut Filter", "groupField": { @@ -419,9 +426,10 @@ } }, "spatialfilter": { - "selection_method": "Auswahl Methode", + "filterType": "Filtertyp", "geometric_operation": "Geometrische Operation", "spatial_filter_header": "Räumlicher Filter", + "combo_placeholder": "Wählen...", "draw_start_label": "Zeichne die Region von Interesse auf der Karte", "dwithin_label": "Meter", "details": { diff --git a/web/client/translations/data.en-US b/web/client/translations/data.en-US index 863cce98c3..c96c73f632 100644 --- a/web/client/translations/data.en-US +++ b/web/client/translations/data.en-US @@ -177,7 +177,11 @@ "editLayerProperties": "Edit layer properties", "searchFeatures": "Search on this layer...", "removeLayer": "Remove layer", - "loadingerror": "The layer has not been loaded correctly" + "loadingerror": "The layer has not been loaded correctly", + "measure": "Measure", + "backgroundSwitcher": "Backgrounds", + "layers": "Layers", + "drawerButton": "Layers" }, "print":{ "paneltitle": "Print", @@ -392,6 +396,9 @@ "config": { "load_config_exception": "Error Loading Configuration" }, + "comboField": { + "default_placeholder": "Select..." + }, "form": { "header": "Find in the dataset", "dataset_header": "Dataset" @@ -402,7 +409,7 @@ "add_group": " Add Group", "group_label_a": "Match", "group_label_b": "of the following conditions:", - "combo_placeholder": "Select", + "combo_placeholder": "Attribute", "text_placeholder": "Type text to search", "attribute_filter_header": "Attribute Filter", "groupField": { @@ -419,8 +426,9 @@ } }, "spatialfilter": { - "selection_method": "Selection Method", + "filterType": "Filter Type", "geometric_operation": "Geometric Operation", + "combo_placeholder": "Select...", "spatial_filter_header": "Spatial Filter", "draw_start_label": "Draw the region of interest on the map", "dwithin_label": "meters", diff --git a/web/client/translations/data.fr-FR b/web/client/translations/data.fr-FR index ebd0c625b5..5af2e5d555 100644 --- a/web/client/translations/data.fr-FR +++ b/web/client/translations/data.fr-FR @@ -178,7 +178,11 @@ "editLayerProperties": "Modifier les propriétés de la couche", "searchFeatures": "Recherche sur ce calque ...", "removeLayer": "Supprimer la couche", - "loadingerror": "La couche n'a pas été chargée correctement" + "loadingerror": "La couche n'a pas été chargée correctement", + "measure": "Mesurer", + "backgroundSwitcher": "Fond de plan", + "layers": "Couches", + "drawerButton": "Couches" }, "print":{ "paneltitle": "Impression", @@ -394,6 +398,9 @@ "config": { "load_config_exception": "Erreur lors du chargement de la configuration" }, + "comboField": { + "default_placeholder": "Sélectionner..." + }, "form": { "header": "Rechercher dans les données", "dataset_header": "Ensemble des données" @@ -404,7 +411,7 @@ "add_group": " Ajouter un groupe", "group_label_a": "Adéquation", "group_label_b": "des conditions suivantes:", - "combo_placeholder": "Sélectionner", + "combo_placeholder": "Attribut", "text_placeholder": "Entrer le texte à rechercher", "attribute_filter_header": "Filtre sur attribut", "groupField": { @@ -421,8 +428,9 @@ } }, "spatialfilter": { - "selection_method": "Méthode de sélection", + "filterType": "Type de filtre", "geometric_operation": "Opération géométrique", + "combo_placeholder": "Sélectionner...", "spatial_filter_header": "Filtre spatial", "draw_start_label": "Dessiner la région d'intérêt sur la carte", "dwithin_label": "mètres", diff --git a/web/client/translations/data.it-IT b/web/client/translations/data.it-IT index e83f066639..38a5ffdfb7 100644 --- a/web/client/translations/data.it-IT +++ b/web/client/translations/data.it-IT @@ -177,7 +177,11 @@ "editLayerProperties": "Modifica proprietà dal livello", "searchFeatures": "Effettua una ricerca su questo livello...", "removeLayer": "Rimuovi livello", - "loadingerror": "Il livello non è stato caricato correttamente" + "loadingerror": "Il livello non è stato caricato correttamente", + "measure": "Misure", + "backgroundSwitcher": "Sfondi", + "layers": "Livelli", + "drawerButton": "Livelli" }, "print":{ "paneltitle": "Stampa", @@ -392,6 +396,9 @@ "config": { "load_config_exception": "Errore Caricamento Configurazione" }, + "comboField": { + "default_placeholder": "Seleziona..." + }, "form": { "header": "Cerca nel dataset", "dataset_header": "Dataset" @@ -402,7 +409,7 @@ "add_group": " Aggiungi Gruppo", "group_label_a": "Soddisfa", "group_label_b": "seguenti condizioni:", - "combo_placeholder": "Seleziona", + "combo_placeholder": "Attributo", "text_placeholder": "Digita il testo da cercare", "attribute_filter_header": "Filtro Attributi", "groupField": { @@ -419,8 +426,9 @@ } }, "spatialfilter": { - "selection_method": "Metodo di selezione", + "filterType": "Tipo di filtro", "geometric_operation": "Operazione Geometrica", + "combo_placeholder": "Seleziona...", "spatial_filter_header": "Filtro Spaziale", "draw_start_label": "Disegna sulla mappa l'area di interesse", "dwithin_label": "metri",