initial geoman integration for map configuration (92f7409d) · Commits · MEC - Multi-access Edge Computing / ETSI MEC Sandbox

js-apps/meep-frontend/package-lock.json

+92 −0

Original line number	Diff line number	Diff line
		@@ -927,6 +927,17 @@
		"minimist": "^1.2.0"
		}
		},
		"@geoman-io/leaflet-geoman-free": {
		"version": "2.5.0",
		"resolved": "https://registry.npmjs.org/@geoman-io/leaflet-geoman-free/-/leaflet-geoman-free-2.5.0.tgz",
		"integrity": "sha512-Zq/gOGPpsRurTrW3d3qiXlvEPHZfU/PZ7jr02jtweaN0kXyHo/WqkihMS9h5yUySjJBXdUC9Xuuo4/ZzHqEH4g==",
		"requires": {
		"@turf/difference": "^6.0.2",
		"@turf/intersect": "^6.1.3",
		"@turf/kinks": "6.x",
		"lodash": "^4.17.15"
		}
		},
		"@jest/console": {
		"version": "24.9.0",
		"resolved": "https://registry.npmjs.org/@jest/console/-/console-24.9.0.tgz",
		@@ -3773,6 +3784,66 @@
		}
		}
		},
		"@turf/area": {
		"version": "6.0.1",
		"resolved": "https://registry.npmjs.org/@turf/area/-/area-6.0.1.tgz",
		"integrity": "sha512-Zv+3N1ep9P5JvR0YOYagLANyapGWQBh8atdeR3bKpWcigVXFsEKNUw03U/5xnh+cKzm7yozHD6MFJkqQv55y0g==",
		"requires": {
		"@turf/helpers": "6.x",
		"@turf/meta": "6.x"
		}
		},
		"@turf/difference": {
		"version": "6.0.2",
		"resolved": "https://registry.npmjs.org/@turf/difference/-/difference-6.0.2.tgz",
		"integrity": "sha512-WtXkvFgOyHqsG3xtYG/m5Su+gkvyCUTbdW0XOuc3Ha2u9UeeBSGwEzTc2y9THDLDhHqR+DlTl1MMEBihXcy3fg==",
		"requires": {
		"@turf/area": "6.x",
		"@turf/helpers": "6.x",
		"@turf/invariant": "6.x",
		"@turf/meta": "6.x",
		"martinez-polygon-clipping": "^0.4.3"
		}
		},
		"@turf/helpers": {
		"version": "6.1.4",
		"resolved": "https://registry.npmjs.org/@turf/helpers/-/helpers-6.1.4.tgz",
		"integrity": "sha512-vJvrdOZy1ngC7r3MDA7zIGSoIgyrkWcGnNIEaqn/APmw+bVLF2gAW7HIsdTxd12s5wQMqEpqIQrmrbRRZ0xC7g=="
		},
		"@turf/intersect": {
		"version": "6.1.3",
		"resolved": "https://registry.npmjs.org/@turf/intersect/-/intersect-6.1.3.tgz",
		"integrity": "sha512-SeAJG/zPRRTeyK2OifkPoyLq60q8tv8prpPIH3R8ZhyF4MdLOnMv5MURaQ6kQd+3UTDrL+pYm6rqbPvln1zqIw==",
		"requires": {
		"@turf/helpers": "6.x",
		"@turf/invariant": "6.x",
		"martinez-polygon-clipping": "^0.4.3"
		}
		},
		"@turf/invariant": {
		"version": "6.1.2",
		"resolved": "https://registry.npmjs.org/@turf/invariant/-/invariant-6.1.2.tgz",
		"integrity": "sha512-WU08Ph8j0J2jVGlQCKChXoCtI50BB3yEH21V++V0T4cR1T27HKCxkehV2sYMwTierfMBgjwSwDIsxnR4/2mWXg==",
		"requires": {
		"@turf/helpers": "6.x"
		}
		},
		"@turf/kinks": {
		"version": "6.0.0",
		"resolved": "https://registry.npmjs.org/@turf/kinks/-/kinks-6.0.0.tgz",
		"integrity": "sha512-X2xk3+Sr9aeu51t1vBa7Iwowvjxcbl5fePLIo/dDOU4j5WeFoqGCto+DdEHQcC3y8HVUin4i8GaHVaM9sVTphg==",
		"requires": {
		"@turf/helpers": "6.x"
		}
		},
		"@turf/meta": {
		"version": "6.0.2",
		"resolved": "https://registry.npmjs.org/@turf/meta/-/meta-6.0.2.tgz",
		"integrity": "sha512-VA7HJkx7qF1l3+GNGkDVn2oXy4+QoLP6LktXAaZKjuT1JI0YESat7quUkbCMy4zP9lAUuvS4YMslLyTtr919FA==",
		"requires": {
		"@turf/helpers": "6.x"
		}
		},
		"@types/babel__core": {
		"version": "7.1.3",
		"resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.1.3.tgz",
		@@ -10847,6 +10918,22 @@
		"resolved": "https://registry.npmjs.org/mapbox-gl-leaflet/-/mapbox-gl-leaflet-0.0.12.tgz",
		"integrity": "sha512-bfGl+CdAYc51ua8s9OOq5J0EcAnHuxS0OoQP5EWsVmSUGFvKkgOD+Od2sFmDOl+zBUjdBEvqLaf9t/tf2BtrWw=="
		},
		"martinez-polygon-clipping": {
		"version": "0.4.3",
		"resolved": "https://registry.npmjs.org/martinez-polygon-clipping/-/martinez-polygon-clipping-0.4.3.tgz",
		"integrity": "sha512-3ZNS0ksKhWTLsmCUkNf+/UimndZ5U2cVOS0I+IjiwF+M23E77TmeOZSmbRJbfCoQUog/vcQ42s3DXrhgOhgPqw==",
		"requires": {
		"splaytree": "^0.1.4",
		"tinyqueue": "^1.2.0"
		},
		"dependencies": {
		"tinyqueue": {
		"version": "1.2.3",
		"resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-1.2.3.tgz",
		"integrity": "sha512-Qz9RgWuO9l8lT+Y9xvbzhPT2efIUIFd69N7eF7tJ9lnQl0iLj1M7peK7IoUGZL9DJHw9XftqLreccfxcQgYLxA=="
		}
		}
		},
		"material-components-web": {
		"version": "0.38.1",
		"resolved": "https://registry.npmjs.org/material-components-web/-/material-components-web-0.38.1.tgz",
		@@ -15151,6 +15238,11 @@
		"integrity": "sha512-J+FWzZoynJEXGphVIS+XEh3kFSjZX/1i9gFBaWQcB+/tmpe2qUsSBABpcxqxnAxFdiUFEgAX1bjYGQvIZmoz9Q==",
		"dev": true
		},
		"splaytree": {
		"version": "0.1.4",
		"resolved": "https://registry.npmjs.org/splaytree/-/splaytree-0.1.4.tgz",
		"integrity": "sha512-D50hKrjZgBzqD3FT2Ek53f2dcDLAQT8SSGrzj3vidNH5ISRgceeGVJ2dQIthKOuayqFXfFjXheHNo4bbt9LhRQ=="
		},
		"split-string": {
		"version": "3.1.0",
		"resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",

js-apps/meep-frontend/package.json

+1 −0

Original line number	Diff line number	Diff line
		@@ -38,6 +38,7 @@
		"webpack-serve": "^0.3.1"
		},
		"dependencies": {
		"@geoman-io/leaflet-geoman-free": "2.5.0",
		"@material-ui/core": "^1.5.1",
		"@material-ui/icons": "^1.1.1",
		"axios": "^0.18.0",

js-apps/meep-frontend/src/js/containers/cfg/cfg-network-element-container.js

+41 −14

Original line number	Diff line number	Diff line
		@@ -20,7 +20,7 @@ import React, { Component } from 'react';
		import { Select } from '@rmwc/select';
		import { Grid, GridCell, GridInner } from '@rmwc/grid';
		import { Button } from '@rmwc/button';
		import { TextField, TextFieldHelperText } from '@rmwc/textfield';
		import { TextField, TextFieldIcon, TextFieldHelperText } from '@rmwc/textfield';
		import { Checkbox } from '@rmwc/checkbox';
		import { Typography } from '@rmwc/typography';

		@@ -448,6 +448,13 @@ const CfgTextField = props => {
		outlined
		style={{ width: '100%', marginBottom: 0 }}
		label={props.label}
		withLeadingIcon={!props.icon ? null :
		<TextFieldIcon
		tabIndex="0"
		icon={props.icon}
		onClick={props.onIconClick}
		/>
		}
		type={props.type}
		onChange={event => {
		var err = props.validate ? props.validate(event.target.value) : null;
		@@ -647,7 +654,7 @@ const UserChartFields = ({ element, onUpdate }) => {
		};

		// Display element-specific form fields
		const TypeRelatedFormFields = ({ onUpdate, element }) => {
		const TypeRelatedFormFields = ({ onUpdate, onEditLocation, onEditPath, element }) => {
		var type = getElemFieldVal(element, FIELD_TYPE);
		var isExternal = getElemFieldVal(element, FIELD_IS_EXTERNAL);
		var chartEnabled = getElemFieldVal(element, FIELD_CHART_ENABLED);
		@@ -730,10 +737,12 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		<Grid>
		<CfgTextFieldCell
		span={8}
		icon='location_on'
		onIconClick={onEditLocation}
		onUpdate={onUpdate}
		element={element}
		validate={validateLocation}
		label="Location Coordinates"
		label='Location Coordinates'
		fieldName={FIELD_GEO_LOCATION}
		cydata={CFG_ELEM_GEO_LOCATION}
		/>
		@@ -742,7 +751,7 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		onUpdate={onUpdate}
		element={element}
		isNumber={true}
		label="Radius (m)"
		label='Radius (m)'
		validate={validateNumber}
		fieldName={FIELD_GEO_RADIUS}
		cydata={CFG_ELEM_GEO_RADIUS}
		@@ -761,10 +770,12 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		<Grid>
		<CfgTextFieldCell
		span={8}
		icon='location_on'
		onIconClick={onEditLocation}
		onUpdate={onUpdate}
		element={element}
		validate={validateLocation}
		label="Location Coordinates"
		label='Location Coordinates'
		fieldName={FIELD_GEO_LOCATION}
		cydata={CFG_ELEM_GEO_LOCATION}
		/>
		@@ -773,7 +784,7 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		onUpdate={onUpdate}
		element={element}
		isNumber={true}
		label="Radius (m)"
		label='Radius (m)'
		validate={validateNumber}
		fieldName={FIELD_GEO_RADIUS}
		cydata={CFG_ELEM_GEO_RADIUS}
		@@ -800,25 +811,29 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		<Grid>
		<CfgTextFieldCell
		span={12}
		icon='location_on'
		onIconClick={onEditLocation}
		onUpdate={onUpdate}
		element={element}
		validate={validateLocation}
		label="Location Coordinates"
		label='Location Coordinates'
		fieldName={FIELD_GEO_LOCATION}
		cydata={CFG_ELEM_GEO_LOCATION}
		/>
		<CfgTextFieldCell
		span={12}
		icon='location_on'
		onIconClick={onEditPath}
		onUpdate={onUpdate}
		element={element}
		validate={validateGeoPath}
		label="Path Coordinates"
		label='Path Coordinates'
		fieldName={FIELD_GEO_PATH}
		cydata={CFG_ELEM_GEO_PATH}
		/>
		<GridCell span={6} style={{ paddingTop: 16 }}>
		<IDSelect
		label="End-of-Path Mode"
		label='End-of-Path Mode'
		span={12}
		options={EOP_MODES}
		onChange={elem => onUpdate(FIELD_GEO_EOP_MODE, elem.target.value, null)}
		@@ -833,7 +848,7 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		element={element}
		validate={validateNumber}
		isNumber={true}
		label="Velocity (m/s)"
		label='Velocity (m/s)'
		fieldName={FIELD_GEO_VELOCITY}
		cydata={CFG_ELEM_GEO_VELOCITY}
		/>
		@@ -853,10 +868,12 @@ const TypeRelatedFormFields = ({ onUpdate, element }) => {
		<Grid>
		<CfgTextFieldCell
		span={12}
		icon='location_on'
		onIconClick={onEditLocation}
		onUpdate={onUpdate}
		element={element}
		validate={validateLocation}
		label="Location Coordinates"
		label='Location Coordinates'
		fieldName={FIELD_GEO_LOCATION}
		cydata={CFG_ELEM_GEO_LOCATION}
		/>
		@@ -1381,6 +1398,16 @@ export class CfgNetworkElementContainer extends Component {
		this.props.cfgElemUpdate(elem);
		}

		onEditLocation() {
		var elem = updateObject({}, this.props.configuredElement);
		this.props.onEditLocation(elem);
		}

		onEditPath() {
		var elem = updateObject({}, this.props.configuredElement);
		this.props.onEditPath(elem);
		}

		render() {
		const element = this.props.configuredElement;
		return (
		@@ -1427,9 +1454,9 @@ export class CfgNetworkElementContainer extends Component {

		<TypeRelatedFormFields
		element={element}
		onUpdate={(name, val, err) => {
		this.onUpdateElement(name, val, err);
		}}
		onUpdate={(name, val, err) => this.onUpdateElement(name, val, err)}
		onEditLocation={() => this.onEditLocation()}
		onEditPath={() => this.onEditPath()}
		/>

		<div

js-apps/meep-frontend/src/js/containers/cfg/cfg-page-container.js

+14 −0

Original line number	Diff line number	Diff line
		@@ -176,6 +176,18 @@ class CfgPageContainer extends Component {
		this.props.cfgElemClear();
		}

		// Edit Location
		onEditLocation(elem) {
		console.log('Edit Location');
		console.log(elem.name);
		}

		// Edit Path
		onEditPath(elem) {
		console.log('Edit Path');
		console.log(elem.name);
		}

		findIndexByKeyValue(_array, key, value) {
		for (var i = 0; i < _array.length; i++) {
		if (getElemFieldVal(_array[i], key) === value) {
		@@ -671,6 +683,8 @@ class CfgPageContainer extends Component {
		onDeleteElement={elem => this.onDeleteElement(elem)}
		onApplyCloneElement={elem => this.onApplyCloneElement(elem)}
		onCancelElement={() => this.onCancelElement()}
		onEditLocation={elem => this.onEditLocation(elem)}
		onEditPath={elem => this.onEditPath(elem)}
		/>
		</Elevation>
		</GridCell>

js-apps/meep-frontend/src/js/containers/idc-map.js

+381 −17

File changed.

Preview size limit exceeded, changes collapsed.