From e057fcaea11ea0907297a0f7a094533728a754b9 Mon Sep 17 00:00:00 2001 From: pjsier Date: Sun, 1 Oct 2017 14:49:32 -0500 Subject: [PATCH 01/15] Add data-driven styling to editor Builds off of the ZoomSpecField component with separate options for handling data-driven properties. Reuses most of the zoom field functionality with tweaks that I tried to keep as small as possible, and the layout is based off of comments on the existing issue. --- src/components/fields/ZoomSpecField.jsx | 195 +++++++++++++++++++++--- src/styles/_components.scss | 4 +- src/styles/_zoomproperty.scss | 60 ++++++++ 3 files changed, 238 insertions(+), 21 deletions(-) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/ZoomSpecField.jsx index 9f8e755e..3cb867c1 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/ZoomSpecField.jsx @@ -4,17 +4,24 @@ import Color from 'color' import Button from '../Button' import SpecField from './SpecField' import NumberInput from '../inputs/NumberInput' +import StringInput from '../inputs/StringInput' +import SelectInput from '../inputs/SelectInput' import DocLabel from './DocLabel' import InputBlock from '../inputs/InputBlock' import AddIcon from 'react-icons/lib/md/add-circle-outline' import DeleteIcon from 'react-icons/lib/md/delete' import FunctionIcon from 'react-icons/lib/md/functions' +import MdInsertChart from 'react-icons/lib/md/insert-chart' import capitalize from 'lodash.capitalize' function isZoomField(value) { - return typeof value === 'object' && value.stops + return typeof value === 'object' && value.stops && typeof value.property === 'undefined' +} + +function isDataField(value) { + return typeof value === 'object' && value.stops && typeof value.property !== 'undefined' } /** Supports displaying spec field for zoom function objects @@ -38,7 +45,15 @@ export default class ZoomSpecProperty extends React.Component { addStop() { const stops = this.props.value.stops.slice(0) const lastStop = stops[stops.length - 1] - stops.push([lastStop[0] + 1, lastStop[1]]) + if (typeof lastStop[0] === "object") { + stops.push([ + {zoom: lastStop[0].zoom, value: lastStop[0].value}, + lastStop[1] + ]) + } + else { + stops.push([lastStop[0] + 1, lastStop[1]]) + } const changedValue = { ...this.props.value, @@ -74,9 +89,21 @@ export default class ZoomSpecProperty extends React.Component { this.props.onChange(this.props.fieldName, zoomFunc) } - changeStop(changeIdx, zoomLevel, value) { + makeDataFunction() { + const dataFunc = { + property: "", + type: "exponential", + stops: [ + [{zoom: 6, value: 0}, this.props.value], + [{zoom: 10, value: 0}, this.props.value] + ] + } + this.props.onChange(this.props.fieldName, dataFunc) + } + + changeStop(changeIdx, stopData, value) { const stops = this.props.value.stops.slice(0) - stops[changeIdx] = [zoomLevel, value] + stops[changeIdx] = [stopData, value] const changedValue = { ...this.props.value, stops: stops, @@ -84,6 +111,111 @@ export default class ZoomSpecProperty extends React.Component { this.props.onChange(this.props.fieldName, changedValue) } + changeDataProperty(propName, propVal) { + this.props.value[propName] = propVal + this.props.onChange(this.props.fieldName, this.props.value) + } + + getDataInput(value, dataLevel, zoomLevel) { + const dataProps = { + label: "Data value", + value: dataLevel, + onChange: newData => this.changeStop(idx, { zoom: zoomLevel, value: newData }, value) + } + if (this.props.value.type === "categorical") { + return + } + else { + return + } + } + + renderDataProperty() { + const dataFields = this.props.value.stops.map((stop, idx) => { + const zoomLevel = stop[0].zoom + const dataLevel = stop[0].value + const value = stop[1] + const deleteStopBtn = + return +
+ this.changeStop(idx, {zoom: newZoom, value: dataLevel}, value)} + min={0} + max={22} + /> +
+
+ {this.getDataInput(value, dataLevel, zoomLevel)} +
+
+ this.changeStop(idx, {zoom: zoomLevel, value: dataLevel}, newValue)} + /> +
+ + }) + + return
+
+ +
+ +
+ this.changeDataProperty("property", propVal)} + /> +
+
+
+ +
+ this.changeDataProperty("type", propVal)} + options={["exponential", "interval", "categorical", "identity"]} + /> +
+
+
+ +
+ this.changeStop(idx, { zoom: zoomLevel, value: dataLevel }, newValue)} + /> +
+
+ +
+ {dataFields} + +
+ } + renderZoomProperty() { const zoomFields = this.props.value.stops.map((stop, idx) => { const zoomLevel = stop[0] @@ -129,14 +261,17 @@ export default class ZoomSpecProperty extends React.Component { } renderProperty() { - let zoomBtn = null + let functionBtn = null if(this.props.fieldSpec['zoom-function']) { - zoomBtn = + functionBtn = } return @@ -144,23 +279,45 @@ export default class ZoomSpecProperty extends React.Component { render() { const propClass = this.props.fieldSpec.default === this.props.value ? "maputnik-default-property" : "maputnik-modified-property" + let specField + if (isZoomField(this.props.value)) { + specField = this.renderZoomProperty() + } + else if (isDataField(this.props.value)) { + specField = this.renderDataProperty() + } + else { + specField = this.renderProperty() + } return
- {isZoomField(this.props.value) ? this.renderZoomProperty() : this.renderProperty()} + {specField}
} } -function MakeZoomFunctionButton(props) { - return +function MakeFunctionButtons(props) { + return
+ + +
} function DeleteStopButton(props) { diff --git a/src/styles/_components.scss b/src/styles/_components.scss index b4032a5d..67310214 100644 --- a/src/styles/_components.scss +++ b/src/styles/_components.scss @@ -104,13 +104,13 @@ .maputnik-action-block { .maputnik-input-block-label { display: inline-block; - width: 43%; + width: 35%; } .maputnik-input-block-action { vertical-align: top; display: inline-block; - width: 7%; + width: 15%; } } diff --git a/src/styles/_zoomproperty.scss b/src/styles/_zoomproperty.scss index 22984961..a5b8900a 100644 --- a/src/styles/_zoomproperty.scss +++ b/src/styles/_zoomproperty.scss @@ -67,3 +67,63 @@ .maputnik-zoom-spec-property .maputnik-input-block:not(:first-child) .maputnik-input-block-label { visibility: hidden; } + +// DATA FUNC +.maputnik-make-data-function { + background-color: transparent; + display: inline-block; + padding-bottom: 0; + padding-top: 0; + vertical-align: middle; + + @extend .maputnik-icon-button; +} + +// DATA PROPERTY +.maputnik-data-spec-block { + overflow: auto; +} +.maputnik-data-spec-property { + .maputnik-input-block-label { + width: 30%; + } + + .maputnik-input-block-content { + width: 70%; + } + .maputnik-data-spec-property-group { + margin-bottom: 3%; + + .maputnik-doc-wrapper { + width: 25%; + color: $color-lowgray; + } + .maputnik-doc-wrapper:hover { + color: inherit; + } + .maputnik-data-spec-property-input { + width: 75%; + display: inline-block; + + .maputnik-string { + margin-bottom: 3%; + } + } + } +} + +.maputnik-data-spec-block { + .maputnik-data-spec-property-stop-edit, + .maputnik-data-spec-property-stop-data { + display: inline-block; + margin-bottom: 3%; + } + + .maputnik-data-spec-property-stop-edit { + width: 18%; + margin-right: 3%; + } + .maputnik-data-spec-property-stop-data { + width: 78%; + } +} \ No newline at end of file From d731fb2caeaa3df45e13f605b8fc7f0ffec9b85f Mon Sep 17 00:00:00 2001 From: pjsier Date: Sun, 1 Oct 2017 19:17:43 -0500 Subject: [PATCH 02/15] Fix scss linter errors --- src/styles/_zoomproperty.scss | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/styles/_zoomproperty.scss b/src/styles/_zoomproperty.scss index a5b8900a..d6510c9b 100644 --- a/src/styles/_zoomproperty.scss +++ b/src/styles/_zoomproperty.scss @@ -83,6 +83,7 @@ .maputnik-data-spec-block { overflow: auto; } + .maputnik-data-spec-property { .maputnik-input-block-label { width: 30%; @@ -91,6 +92,7 @@ .maputnik-input-block-content { width: 70%; } + .maputnik-data-spec-property-group { margin-bottom: 3%; @@ -98,9 +100,11 @@ width: 25%; color: $color-lowgray; } + .maputnik-doc-wrapper:hover { color: inherit; } + .maputnik-data-spec-property-input { width: 75%; display: inline-block; @@ -123,7 +127,8 @@ width: 18%; margin-right: 3%; } + .maputnik-data-spec-property-stop-data { width: 78%; } -} \ No newline at end of file +} From 9e52b0b7dc96bbbc75f87bff95bddddf104ef367 Mon Sep 17 00:00:00 2001 From: pjsier Date: Sun, 1 Oct 2017 21:07:55 -0500 Subject: [PATCH 03/15] Remove default from data properties It looks like default is not supported in this version of the style spec, so pending the PR to update it I'm removing it as an input. --- src/components/fields/ZoomSpecField.jsx | 14 -------------- 1 file changed, 14 deletions(-) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/ZoomSpecField.jsx index 3cb867c1..ab1cd79c 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/ZoomSpecField.jsx @@ -190,20 +190,6 @@ export default class ZoomSpecProperty extends React.Component { /> -
- -
- this.changeStop(idx, { zoom: zoomLevel, value: dataLevel }, newValue)} - /> -
-
{dataFields} From 2ffb3e73e1e610ab41dc8a1ef12b0bc16448f5f5 Mon Sep 17 00:00:00 2001 From: pjsier Date: Thu, 5 Oct 2017 05:50:47 -0500 Subject: [PATCH 04/15] Re-add default field after style update --- src/components/fields/ZoomSpecField.jsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/ZoomSpecField.jsx index ab1cd79c..42883c0b 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/ZoomSpecField.jsx @@ -190,6 +190,20 @@ export default class ZoomSpecProperty extends React.Component { /> +
+ +
+ this.changeDataProperty("default", propVal)} + /> +
+
{dataFields} From 1d29f670652609a20f0d3aea0f2b7e3e5671ff8a Mon Sep 17 00:00:00 2001 From: pjsier Date: Thu, 5 Oct 2017 06:08:55 -0500 Subject: [PATCH 05/15] Check for property-function support on data styles --- src/components/fields/ZoomSpecField.jsx | 46 ++++++++++++++----------- 1 file changed, 26 insertions(+), 20 deletions(-) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/ZoomSpecField.jsx index 42883c0b..44686dc1 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/ZoomSpecField.jsx @@ -261,13 +261,11 @@ export default class ZoomSpecProperty extends React.Component { } renderProperty() { - let functionBtn = null - if(this.props.fieldSpec['zoom-function']) { - functionBtn = - } + const functionBtn = return - - - + + if (props.fieldSpec['property-function']) { + makeDataButton = + } + return
{makeZoomButton}{makeDataButton}
+ } + else { + return null + } } function DeleteStopButton(props) { From 8a6e24e5e73ad237b2dbf3592c22470fca838c73 Mon Sep 17 00:00:00 2001 From: Gregory Wolanski Date: Sun, 8 Oct 2017 21:42:04 +0200 Subject: [PATCH 06/15] Modal scrolling #156 --- src/components/modals/Modal.jsx | 4 +++- src/styles/_modal.scss | 7 ++++++- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/components/modals/Modal.jsx b/src/components/modals/Modal.jsx index 7f9a31be..cafbdfad 100644 --- a/src/components/modals/Modal.jsx +++ b/src/components/modals/Modal.jsx @@ -21,7 +21,9 @@ class Modal extends React.Component { -
{this.props.children}
+
+
{this.props.children}
+
} diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 69ee2e49..9a2fd80f 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -2,6 +2,7 @@ .maputnik-modal { min-width: 350px; max-width: 600px; + overflow: hidden; background-color: $color-black; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); z-index: 3; @@ -39,9 +40,13 @@ cursor: pointer; } +.maputnik-modal-scroller { + max-height: 90vh; + overflow-y: auto; +} + .maputnik-modal-content { padding: $margin-3; - max-height: 90vh; @include flex-column; } From 148f64c2618e68a8f9e4d8943316c6ed095b9f35 Mon Sep 17 00:00:00 2001 From: pjsier Date: Tue, 10 Oct 2017 10:30:06 -0500 Subject: [PATCH 07/15] Restrict data function types, reorder buttons Checking the Mapbox style spec properties to see whether or not exponential should be allowed as the property type, defaulting to categorical which appears to work for either type. Also re-orders zoom and data function buttons, aligning zoom right if data not supplied. --- src/components/fields/ZoomSpecField.jsx | 23 ++++++++++++++++------- src/styles/_components.scss | 5 +++++ 2 files changed, 21 insertions(+), 7 deletions(-) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/ZoomSpecField.jsx index 44686dc1..b045c057 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/ZoomSpecField.jsx @@ -47,7 +47,7 @@ export default class ZoomSpecProperty extends React.Component { const lastStop = stops[stops.length - 1] if (typeof lastStop[0] === "object") { stops.push([ - {zoom: lastStop[0].zoom, value: lastStop[0].value}, + {zoom: lastStop[0].zoom + 1, value: lastStop[0].value}, lastStop[1] ]) } @@ -89,10 +89,19 @@ export default class ZoomSpecProperty extends React.Component { this.props.onChange(this.props.fieldName, zoomFunc) } + getDataFunctionTypes(functionType) { + if (functionType === "interpolated") { + return ["categorical", "interval", "exponential"] + } + else { + return ["categorical", "interval"] + } + } + makeDataFunction() { const dataFunc = { property: "", - type: "exponential", + type: "categorical", stops: [ [{zoom: 6, value: 0}, this.props.value], [{zoom: 10, value: 0}, this.props.value] @@ -180,13 +189,13 @@ export default class ZoomSpecProperty extends React.Component {
this.changeDataProperty("type", propVal)} - options={["exponential", "interval", "categorical", "identity"]} + options={this.getDataFunctionTypes(this.props.fieldSpec.function)} />
@@ -307,7 +316,7 @@ function MakeFunctionButtons(props) { /> - if (props.fieldSpec['property-function']) { + if (props.fieldSpec['property-function'] && ['piecewise-constant', 'interpolated'].indexOf(props.fieldSpec['function']) !== -1) { makeDataButton = } - return
{makeZoomButton}{makeDataButton}
+ return
{makeDataButton}{makeZoomButton}
} else { return null diff --git a/src/styles/_components.scss b/src/styles/_components.scss index 67310214..12415faa 100644 --- a/src/styles/_components.scss +++ b/src/styles/_components.scss @@ -40,6 +40,7 @@ .maputnik-doc-target:hover .maputnik-doc-popup { display: block; + text-align: left; } // BUTTON @@ -112,6 +113,10 @@ display: inline-block; width: 15%; } + + .maputnik-input-block-action > div { + text-align: right; + } } // SPACE HELPER From 611e170b5ed3cbce7feef28c48fa8938fe9c15a3 Mon Sep 17 00:00:00 2001 From: orangemug Date: Tue, 10 Oct 2017 18:40:32 +0100 Subject: [PATCH 08/15] Added true/false conversion to filter fields. Fixes #114 --- src/components/filter/SingleFilterEditor.jsx | 25 +++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/src/components/filter/SingleFilterEditor.jsx b/src/components/filter/SingleFilterEditor.jsx index 8902625b..f7af98d4 100644 --- a/src/components/filter/SingleFilterEditor.jsx +++ b/src/components/filter/SingleFilterEditor.jsx @@ -11,6 +11,29 @@ function tryParseInt(v) { return parseFloat(v) } +function tryParseBool(v) { + const isString = (typeof(v) === "string"); + if(!isString) { + return v; + } + + if(v.match(/^\s*true\s*$/)) { + return true; + } + else if(v.match(/^\s*false\s*$/)) { + return false; + } + else { + return v; + } +} + +function parseFilter(v) { + v = tryParseInt(v); + v = tryParseBool(v); + return v; +} + class SingleFilterEditor extends React.Component { static propTypes = { filter: React.PropTypes.array.isRequired, @@ -23,7 +46,7 @@ class SingleFilterEditor extends React.Component { } onFilterPartChanged(filterOp, propertyName, filterArgs) { - let newFilter = [filterOp, propertyName, ...filterArgs.map(tryParseInt)] + let newFilter = [filterOp, propertyName, ...filterArgs.map(parseFilter)] if(filterOp === 'has' || filterOp === '!has') { newFilter = [filterOp, propertyName] } else if(filterArgs.length === 0) { From 4af7a7122006fac05ebd3ca24eeee727e14b6bd6 Mon Sep 17 00:00:00 2001 From: pjsier Date: Tue, 10 Oct 2017 14:23:20 -0500 Subject: [PATCH 09/15] Rename ZoomSpecField to FunctionSpecField --- .../fields/{ZoomSpecField.jsx => FunctionSpecField.jsx} | 2 +- src/components/fields/PropertyGroup.jsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) rename src/components/fields/{ZoomSpecField.jsx => FunctionSpecField.jsx} (99%) diff --git a/src/components/fields/ZoomSpecField.jsx b/src/components/fields/FunctionSpecField.jsx similarity index 99% rename from src/components/fields/ZoomSpecField.jsx rename to src/components/fields/FunctionSpecField.jsx index b045c057..3adc77cc 100644 --- a/src/components/fields/ZoomSpecField.jsx +++ b/src/components/fields/FunctionSpecField.jsx @@ -27,7 +27,7 @@ function isDataField(value) { /** Supports displaying spec field for zoom function objects * https://www.mapbox.com/mapbox-gl-style-spec/#types-function-zoom-property */ -export default class ZoomSpecProperty extends React.Component { +export default class FunctionSpecProperty extends React.Component { static propTypes = { onChange: React.PropTypes.func.isRequired, fieldName: React.PropTypes.string.isRequired, diff --git a/src/components/fields/PropertyGroup.jsx b/src/components/fields/PropertyGroup.jsx index 8de8b342..fc178929 100644 --- a/src/components/fields/PropertyGroup.jsx +++ b/src/components/fields/PropertyGroup.jsx @@ -1,6 +1,6 @@ import React from 'react' -import ZoomSpecField from './ZoomSpecField' +import FunctionSpecField from './FunctionSpecField' const iconProperties = ['background-pattern', 'fill-pattern', 'line-pattern', 'fill-extrusion-pattern', 'icon-image'] /** Extract field spec by {@fieldName} from the {@layerType} in the @@ -54,7 +54,7 @@ export default class PropertyGroup extends React.Component { const layout = this.props.layer.layout || {} const fieldValue = fieldName in paint ? paint[fieldName] : layout[fieldName] - return Date: Tue, 10 Oct 2017 22:34:16 +0100 Subject: [PATCH 10/15] Added comments field doc and updated react-collapse to fix styling. --- package.json | 2 +- src/components/layers/CommentBlock.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 5471a5dd..c324f00c 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "react-addons-pure-render-mixin": "^15.4.0", "react-autocomplete": "^1.4.0", "react-codemirror": "^0.3.0", - "react-collapse": "^4.0.2", + "react-collapse": "^4.0.3", "react-color": "^2.10.0", "react-dom": "^15.4.0", "react-file-reader-input": "^1.1.0", diff --git a/src/components/layers/CommentBlock.jsx b/src/components/layers/CommentBlock.jsx index 996ca1ca..ac8bee61 100644 --- a/src/components/layers/CommentBlock.jsx +++ b/src/components/layers/CommentBlock.jsx @@ -10,7 +10,7 @@ class MetadataBlock extends React.Component { } render() { - return + return Date: Wed, 11 Oct 2017 11:17:02 +0100 Subject: [PATCH 11/15] Fixed logo stying in toolbar, also switched to the logo in github:maputnik/design. --- package.json | 1 + src/components/Toolbar.jsx | 2 +- src/styles/_toolbar.scss | 3 +-- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 5471a5dd..0bd184d2 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "lodash.throttle": "^4.1.1", "mapbox-gl": "^0.34.0", "mapbox-gl-inspect": "^1.2.3", + "maputnik-design": "github:maputnik/design", "mousetrap": "^1.6.0", "ol-mapbox-style": "1.0.1", "openlayers": "^3.19.1", diff --git a/src/components/Toolbar.jsx b/src/components/Toolbar.jsx index bcb60f8d..9bf7ad68 100644 --- a/src/components/Toolbar.jsx +++ b/src/components/Toolbar.jsx @@ -16,7 +16,7 @@ import MdFontDownload from 'react-icons/lib/md/font-download' import HelpIcon from 'react-icons/lib/md/help-outline' import InspectionIcon from 'react-icons/lib/md/find-in-page' -import logoImage from '../img/maputnik.png' +import logoImage from 'maputnik-design/logos/logo-color.svg' import SettingsModal from './modals/SettingsModal' import ExportModal from './modals/ExportModal' import SourcesModal from './modals/SourcesModal' diff --git a/src/styles/_toolbar.scss b/src/styles/_toolbar.scss index e9459645..77dbea87 100644 --- a/src/styles/_toolbar.scss +++ b/src/styles/_toolbar.scss @@ -22,9 +22,8 @@ img { width: 30px; - height: 30px; padding-right: $margin-2; - vertical-align: middle; + vertical-align: top; } } From b4292028c29490c1a8f14cec948df8b4de7b89e1 Mon Sep 17 00:00:00 2001 From: pjsier Date: Wed, 11 Oct 2017 05:58:32 -0500 Subject: [PATCH 12/15] Fix default field bug --- src/components/fields/FunctionSpecField.jsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/fields/FunctionSpecField.jsx b/src/components/fields/FunctionSpecField.jsx index 3adc77cc..c85cb7a4 100644 --- a/src/components/fields/FunctionSpecField.jsx +++ b/src/components/fields/FunctionSpecField.jsx @@ -121,7 +121,12 @@ export default class FunctionSpecProperty extends React.Component { } changeDataProperty(propName, propVal) { - this.props.value[propName] = propVal + if (propVal) { + this.props.value[propName] = propVal + } + else { + delete this.props.value[propName] + } this.props.onChange(this.props.fieldName, this.props.value) } @@ -209,7 +214,7 @@ export default class FunctionSpecProperty extends React.Component { fieldName={this.props.fieldName} fieldSpec={this.props.fieldSpec} value={this.props.value.default} - onChange={propVal => this.changeDataProperty("default", propVal)} + onChange={(_, propVal) => this.changeDataProperty("default", propVal)} /> From 9beacf7ef3c928eed3920ae89fc19a5eb137f00d Mon Sep 17 00:00:00 2001 From: orangemug Date: Wed, 11 Oct 2017 13:16:04 +0100 Subject: [PATCH 13/15] Fixed image path in test --- test/specs/simple.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/specs/simple.js b/test/specs/simple.js index 56b27695..fb6ca499 100644 --- a/test/specs/simple.js +++ b/test/specs/simple.js @@ -9,7 +9,7 @@ describe('maputnik', function() { browser.waitForExist(".maputnik-toolbar-link"); var src = browser.getAttribute(".maputnik-toolbar-link img", "src"); - assert.equal(src, config.baseUrl+'/img/maputnik.png'); + assert.equal(src, config.baseUrl+'/img/logo-color.svg'); }); }); From fa0067ce7bcfe412ed58e62428d6e1aaf9db747b Mon Sep 17 00:00:00 2001 From: pjsier Date: Wed, 11 Oct 2017 08:01:55 -0500 Subject: [PATCH 14/15] Update mapbox deps, clarify data prop scope --- package.json | 4 ++-- src/components/fields/FunctionSpecField.jsx | 24 ++++++++------------- 2 files changed, 11 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index 5471a5dd..efe05ab5 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,8 @@ "license": "MIT", "homepage": "https://github.com/maputnik/editor#readme", "dependencies": { - "@mapbox/mapbox-gl-style-spec": "^9.0.0", "@mapbox/mapbox-gl-rtl-text": "^0.1.0", + "@mapbox/mapbox-gl-style-spec": "^9.0.1", "classnames": "^2.2.5", "codemirror": "^5.18.2", "color": "^1.0.3", @@ -32,7 +32,7 @@ "lodash.clonedeep": "^4.5.0", "lodash.isequal": "^4.4.0", "lodash.throttle": "^4.1.1", - "mapbox-gl": "^0.34.0", + "mapbox-gl": "^0.40.1", "mapbox-gl-inspect": "^1.2.3", "mousetrap": "^1.6.0", "ol-mapbox-style": "1.0.1", diff --git a/src/components/fields/FunctionSpecField.jsx b/src/components/fields/FunctionSpecField.jsx index c85cb7a4..2b7383b9 100644 --- a/src/components/fields/FunctionSpecField.jsx +++ b/src/components/fields/FunctionSpecField.jsx @@ -130,26 +130,20 @@ export default class FunctionSpecProperty extends React.Component { this.props.onChange(this.props.fieldName, this.props.value) } - getDataInput(value, dataLevel, zoomLevel) { - const dataProps = { - label: "Data value", - value: dataLevel, - onChange: newData => this.changeStop(idx, { zoom: zoomLevel, value: newData }, value) - } - if (this.props.value.type === "categorical") { - return - } - else { - return - } - } - renderDataProperty() { const dataFields = this.props.value.stops.map((stop, idx) => { const zoomLevel = stop[0].zoom const dataLevel = stop[0].value const value = stop[1] const deleteStopBtn = + + const dataProps = { + label: "Data value", + value: dataLevel, + onChange: newData => this.changeStop(idx, { zoom: zoomLevel, value: newData }, value) + } + const dataInput = this.props.value.type === "categorical" ? : + return
- {this.getDataInput(value, dataLevel, zoomLevel)} + {dataInput}
Date: Wed, 11 Oct 2017 23:11:40 +0200 Subject: [PATCH 15/15] Modal scrolling #156: Issue fixed --- src/styles/_modal.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 9a2fd80f..56740608 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -41,7 +41,7 @@ } .maputnik-modal-scroller { - max-height: 90vh; + max-height: calc(100vh - 35px); overflow-y: auto; } @@ -85,7 +85,6 @@ } .maputnik-style-gallery-container { - overflow-y: scroll; flex-shrink: 1; }