point property lat,lng

Author: justenPalmer

src/view/Vproperty/VpropertyMetadata/index.jsx

@@ -4,10 +4,6 @@ import {List,fromJS} from 'immutable';
 
 import Vfield from '../../Vfield';
 
-import VpropertyAdd from '../VpropertyAdd';
-
-import styleSpec from '../../../vendor/style-spec/style-spec';
-
 export default class VpropertyMetadata extends React.Component {
 
 	static propTypes = {

src/view/Vproperty/VpropertyPoint/index.jsx

@@ -0,0 +1,76 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import Vfield from '../../Vfield';
+
+import styleSpec from '../../../vendor/style-spec/style-spec';
+
+export default class VpropertyPoint extends React.Component {
+
+	static propTypes = {
+		property: PropTypes.shape({
+			type: PropTypes.string.isRequired,
+			name: PropTypes.string.isRequired, // string of position . separated
+			value: PropTypes.object, // list of 2 coordinates
+			placeholder: PropTypes.string,
+			error: PropTypes.oneOfType([
+				PropTypes.string,
+				PropTypes.object
+			])
+		}),
+		focus: PropTypes.string,
+		handle: PropTypes.object
+	}
+
+	constructor(props) {
+		super(props);
+		const {handle, property} = this.props;
+
+
+		this.fieldHandle = {
+			...handle,
+			backout:(f)=>{
+				
+			}
+		};
+
+		for (let i in this.fieldHandle){
+			this.fieldHandle[i] = this.fieldHandle[i].bind(this);
+		}
+
+	}
+
+	render (){
+		const {property, focus} = this.props;
+
+		const lngName = property.name+'.0';
+		const latName = property.name+'.1';
+
+		return <div className="form-group mb-0">
+			<div className="mt-2 p-2 func-border position-relative">
+				<div className="row">
+					<div className="col-sm-6 pr-1">
+						<Vfield field={{
+							label:'longitude',
+							type:'number',
+							name:lngName,
+							value:property.value.get(0),
+							controlled:false,
+							autoFocus:lngName === focus,
+						}} handle={this.fieldHandle}/>
+					</div>
+					<div className="col-sm-6 pl-0">
+						<Vfield field={{
+							label:'latitude',
+							type:'number',
+							name:latName,
+							value:property.value.get(1),
+							controlled:false,
+							autoFocus:latName === focus
+						}} handle={this.fieldHandle}/>
+					</div>
+				</div>
+			</div>
+		</div>
+	}
+};

src/view/Vproperty/index.jsx

@@ -10,6 +10,7 @@ import VpropertyExpression from './VpropertyExpression';
 import VpropertyMetadata from './VpropertyMetadata';
 import VpropertyFunction from './VpropertyFunction';
 import VpropertyInfo from './VpropertyInfo';
+import VpropertyPoint from './VpropertyPoint';
 
 export default class Vproperty extends React.Component {
 
@@ -117,7 +118,17 @@ export default class Vproperty extends React.Component {
 
 		let elem, mode = type;
 
-		if (spec.type === 'enum'){
+		if (property.label === 'center'){
+			elem = <div>
+				<VpropertyPoint property={{
+					type:'array',
+					name:property.name,
+					value:property.value,
+					placeholder:doc,
+					error:property.error
+				}} focus={focus} handle={handle}/>
+			</div>;
+		} else if (spec.type === 'enum'){
 			let options = [];
 			for (let i in spec.values){
 				options.push({
@@ -235,7 +246,7 @@ export default class Vproperty extends React.Component {
 					{mode}
 					<i className="material-icons md-14">arrow_drop_down</i>
 				</div>
-				<div className="dropdown-menu">
+				<div className="dropdown-menu" data-boundary="window">
 					{types.map((type)=>{
 						let className = 'dropdown-item';
 						if (type === mode) className += ' active';

src/view/Vsetting/index.jsx

@@ -21,7 +21,11 @@ export default class Vsetting extends React.Component {
 
 		this.handle = {
 			change:(field)=>{
-				Mstyle.setIn([field.name],field.value);
+				let key = field.name.split('.');
+				key.forEach((k,i)=>{
+					if (/^\d+$/.test(k)) key[i] = Number(k);
+				});
+				Mstyle.setIn(key,field.value);
 			},
 			deleteConfirm:()=>{
 				handle.routeHome();
@@ -51,7 +55,6 @@ export default class Vsetting extends React.Component {
 		const spec = styleSpec.latest.$root;
 
 		let addSpec = {
-			version:spec.version,
 			name:spec.name,
 			metadata:spec.metadata,
 			center:spec.center,