mobility-toolbox-js 2.0.0-beta.6 → 2.0.0-beta.62

package/src/common/utils/createTrackerFilters.test.js

@@ -1,95 +0,0 @@
-import createTrackerFilters from './createTrackerFilters';
-
-const u1 = {
-  properties: {
-    routeIdentifier: '001.000827.004:7',
-    operator: 'FoO',
-    line: {
-      name: 'U1',
-    },
-  },
-};
-const ireta = {
-  properties: {
-    routeIdentifier: '0022.000827.004:7',
-    operator: 'BAR',
-    line: {
-      name: 'IRETA',
-    },
-  },
-};
-const arb = {
-  properties: {
-    routeIdentifier: '00333.000827.004:7',
-    operator: 'qux',
-    line: {
-      name: 'ARB',
-    },
-  },
-};
-
-const trajectories = [u1, ireta, arb];
-
-describe('#createTrackerFilter()', () => {
-  test('returns null', () => {
-    const filterFunc = createTrackerFilters();
-    expect(filterFunc).toBe(null);
-  });
-
-  describe('using line', () => {
-    test('as string', () => {
-      const filterFunc = createTrackerFilters('u1,foo');
-      expect(trajectories.filter(filterFunc)).toEqual([u1]);
-    });
-
-    test('as array of string', () => {
-      const filterFunc = createTrackerFilters(['u1', 'foo', 'IRETA']);
-      expect(trajectories.filter(filterFunc)).toEqual([u1, ireta]);
-    });
-  });
-
-  describe('using route identifier', () => {
-    test('as string', () => {
-      const filterFunc = createTrackerFilters(null, '1,foo');
-      expect(trajectories.filter(filterFunc)).toEqual([u1]);
-    });
-
-    test('as array of string', () => {
-      const filterFunc = createTrackerFilters(null, ['22', 'foo', '1']);
-      expect(trajectories.filter(filterFunc)).toEqual([u1, ireta]);
-    });
-  });
-
-  describe('using operator', () => {
-    test('as string', () => {
-      const filterFunc = createTrackerFilters(null, null, 'foo');
-      expect(trajectories.filter(filterFunc)).toEqual([u1]);
-    });
-
-    test('as array of string', () => {
-      const filterFunc = createTrackerFilters(null, null, ['bar', 'foo', '1']);
-      expect(trajectories.filter(filterFunc)).toEqual([u1, ireta]);
-    });
-  });
-
-  describe('using regexLine', () => {
-    test('as string', () => {
-      const filterFunc = createTrackerFilters(
-        null,
-        null,
-        null,
-        '^(S|R$|RE|PE|D|IRE|RB|TER)',
-      );
-      expect(trajectories.filter(filterFunc)).toEqual([ireta]);
-    });
-
-    test('as array of string', () => {
-      const filterFunc = createTrackerFilters(null, null, null, [
-        '^IR',
-        '^ARB$',
-        'foo',
-      ]);
-      expect(trajectories.filter(filterFunc)).toEqual([ireta, arb]);
-    });
-  });
-});

package/src/common/utils/getMapboxMapCopyrights.js

@@ -1,32 +0,0 @@
-import removeDuplicate from './removeDuplicate';
-
-/**
- * Return the copyright a Mapbox map.
- * @param {mapboxgl.Map} map A Mapbox map
- * @ignore
- */
-const getMapboxMapCopyrights = (map) => {
-  if (!map || !map.style) {
-    return [];
-  }
-  const { sourceCaches } = map.style;
-  let copyrights = [];
-
-  Object.values(sourceCaches).forEach((sourceCache) => {
-    if (sourceCache.used) {
-      const source = sourceCache.getSource();
-      const attribution =
-        source.attribution || (source.options && source.options.attribution);
-
-      if (attribution) {
-        copyrights = copyrights.concat(
-          attribution.replace(/&copy;/g, '©').split(/(<a.*?<\/a>)/),
-        );
-      }
-    }
-  });
-
-  return removeDuplicate(copyrights);
-};
-
-export default getMapboxMapCopyrights;

package/src/common/utils/getMapboxMapCopyrights.test.js

@@ -1,47 +0,0 @@
-import getMapboxMapCopyrights from './getMapboxMapCopyrights';
-
-describe('getMapboxMapCopyrights()', () => {
-  test('returns an empty array if map is not defined', () => {
-    expect(getMapboxMapCopyrights().length).toBe(0);
-  });
-
-  test('returns an empty array if map.style is not defined', () => {
-    expect(getMapboxMapCopyrights({}).length).toBe(0);
-  });
-
-  test('returns non depluicated copyrights in an array', () => {
-    expect(
-      getMapboxMapCopyrights({
-        style: {
-          sourceCaches: {
-            used: {
-              used: true,
-              getSource() {
-                return {
-                  attribution:
-                    '<a href="https://www.openmaptiles.org/" target="_blank">© OpenMapTiles</a> <a href="https://www.openstreetmap.org/about/" target="_blank">&copy; OpenStreetMap contributors</a>',
-                };
-              },
-            },
-            'not used': {
-              used: false,
-            },
-            'also used': {
-              used: true,
-              getSource() {
-                return {
-                  attribution:
-                    '<a href="https://www.openmaptiles.org/" target="_blank">&copy; OpenMapTiles</a> <a href="https://www.imagico.de/" target="_blank">&copy; imagico</a>',
-                };
-              },
-            },
-          },
-        },
-      }),
-    ).toEqual([
-      '<a href="https://www.openmaptiles.org/" target="_blank">© OpenMapTiles</a>',
-      '<a href="https://www.openstreetmap.org/about/" target="_blank">© OpenStreetMap contributors</a>',
-      '<a href="https://www.imagico.de/" target="_blank">© imagico</a>',
-    ]);
-  });
-});

package/src/common/utils/getMapboxStyleUrl.js

@@ -1,32 +0,0 @@
-import qs from 'query-string';
-
-/**
- * Return the styleUrl with apiKey parameters set.
- * @param {string} apiKey apiKey value for the mapbox request.
- * @param {string} apiKeyName parameter name for apiKey in the mapbox request.
- * @param {string} styleUrl mapbox styleUrl value.
- * @ignore
- */
-const getMapboxStyleUrl = (apiKey, apiKeyName, styleUrl) => {
-  if (apiKey === false) {
-    return styleUrl;
-  }
-  const parsedStyle = qs.parseUrl(styleUrl);
-  if (!apiKey && parsedStyle.query[apiKeyName]) {
-    return styleUrl;
-  }
-  if (!apiKey) {
-    // eslint-disable-next-line no-console
-    console.warn(`No apiKey is defined for request to ${styleUrl}`);
-    return null;
-  }
-  return qs.stringifyUrl({
-    ...parsedStyle,
-    query: {
-      ...parsedStyle.query,
-      [apiKeyName]: apiKey,
-    },
-  });
-};
-
-export default getMapboxStyleUrl;

package/src/common/utils/getVehiclePosition.js

@@ -1,72 +0,0 @@
-import GeomType from 'ol/geom/GeometryType';
-
-/**
- * Interpolate or not the vehicle position from a trajectory at a specific date.
- *
- * @param {number} now Current date to interpolate a position with. In ms.
- * @param {TralisTrajectory} trajectory The trajectory to interpolate.
- * @param {boolean} noInterpolate If true, the vehicle position is not interpolated on each render but only once.
- * @returns
- */
-const getVehiclePosition = (now, trajectory, noInterpolate) => {
-  const {
-    time_intervals: timeIntervals,
-    olGeometry: geometry,
-    coordinate,
-  } = trajectory.properties;
-
-  let coord;
-  let rotation;
-
-  if (noInterpolate && coordinate) {
-    coord = coordinate;
-  } else if (geometry.getType() === GeomType.POINT) {
-    coord = geometry.getCoordinates();
-  } else if (geometry.getType() === GeomType.LINE_STRING) {
-    const intervals = timeIntervals || [[]];
-    const firstInterval = intervals[0];
-    const lastInterval = intervals[intervals.length - 1];
-
-    // Between the last time interval of a trajectory event and the beginning
-    // of the new trajectory event, there is few seconds, can be 6 to 30
-    // seconds (that's why the vehicle jumps sometimes).
-    // So we make the choice here to display the last (or the first) position
-    // of an trajectory event instead of removing them, if the current date is
-    // outside the time intervals we display the vehicle at the last (or first) position known.
-    if (now < firstInterval[0]) {
-      // Display first position known.
-      [, , rotation] = firstInterval;
-      coord = geometry.getFirstCoordinate();
-    } else if (now > lastInterval[0]) {
-      // Display last position known.
-      [, , rotation] = lastInterval;
-      coord = geometry.getLastCoordinate();
-    } else {
-      // Interpolate position using time intervals.
-      for (let j = 0; j < intervals.length - 1; j += 1) {
-        // Rotation only available in tralis layer.
-        const [start, startFrac] = intervals[j];
-        const [end, endFrac] = intervals[j + 1];
-
-        if (start <= now && now <= end) {
-          // interpolate position inside the time interval.
-          const timeFrac = Math.min((now - start) / (end - start), 1);
-          const geomFrac = timeFrac * (endFrac - startFrac) + startFrac;
-          coord = geometry.getCoordinateAt(geomFrac);
-          [, , rotation] = intervals[j];
-          break;
-        }
-      }
-    }
-  } else {
-    // eslint-disable-next-line no-console
-    console.error(
-      'This geometry type is not supported. Only Point or LineString are. Current geometry: ',
-      geometry,
-    );
-  }
-
-  return { coord, rotation };
-};
-
-export default getVehiclePosition;

package/src/common/utils/index.js

@@ -1,6 +0,0 @@
-export { default as getMapboxStyleUrl } from './getMapboxStyleUrl';
-export { default as getMapboxMapCopyrights } from './getMapboxMapCopyrights';
-export { default as removeDuplicate } from './removeDuplicate';
-export * from './timeUtils';
-export * from '../styles';
-export { default as sortByDelay } from './sortByDelay';

package/src/common/utils/removeDuplicate.js

@@ -1,22 +0,0 @@
-/**
- * This function remove duplicates lower case string value of an array.
- * It removes also null, undefined or non string values.
- *
- * @param {array} array Array of values.
- * @ignore
- */
-const removeDuplicate = (array) => {
-  const arrWithoutEmptyValues = array.filter(
-    (val) => val !== undefined && val !== null && val.trim && val.trim(),
-  );
-  const lowerCasesValues = arrWithoutEmptyValues.map((str) =>
-    str.toLowerCase(),
-  );
-  const uniqueLowerCaseValues = [...new Set(lowerCasesValues)];
-  const uniqueValues = uniqueLowerCaseValues.map((uniqueStr) =>
-    arrWithoutEmptyValues.find((str) => str.toLowerCase() === uniqueStr),
-  );
-  return uniqueValues;
-};
-
-export default removeDuplicate;

package/src/common/utils/removeDuplicate.test.js

@@ -1,22 +0,0 @@
-import removeDuplicate from './removeDuplicate';
-
-describe('removeDuplicate()', () => {
-  test('removes duplicates', () => {
-    expect(
-      removeDuplicate([
-        'a',
-        ' ',
-        '   ',
-        'b',
-        'a',
-        undefined,
-        null,
-        'A',
-        0,
-        'c',
-        'b',
-        'B',
-      ]),
-    ).toEqual(['a', 'b', 'c']);
-  });
-});

package/src/common/utils/sortByDelay.js

@@ -1,23 +0,0 @@
-const sortByDelay = (traj1, traj2) => {
-  const props1 = traj1.properties;
-  const props2 = traj2.properties;
-
-  if (props1.delay === null && props2.delay !== null) {
-    return 1;
-  }
-  if (props2.delay === null && props1.delay !== null) {
-    return -1;
-  }
-
-  // We put cancelled train inbetween green and yellow trains
-  // >=180000ms corresponds to yellow train
-  if (props1.cancelled && !props2.cancelled) {
-    return props2.delay < 180000 ? -1 : 1;
-  }
-  if (props2.cancelled && !props1.cancelled) {
-    return props1.delay < 180000 ? 1 : -1;
-  }
-  return props2.delay - props1.delay;
-};
-
-export default sortByDelay;

package/src/common/utils/timeUtils.test.js

@@ -1,16 +0,0 @@
-import { getUTCDateString, getUTCTimeString } from './timeUtils';
-
-describe('timeUtils', () => {
-  test('getUTCDateString should be correct.', () => {
-    expect(getUTCDateString(new Date(2020, 5, 30))).toBe('20200630');
-    expect(
-      getUTCDateString(new Date('January 1, 2021 00:15:30 GMT+2:00')),
-    ).toBe('20201231');
-  });
-
-  test('getUTCTimeString should be correct.', () => {
-    expect(getUTCTimeString(new Date(2020, 5, 30, 11, 5, 1, 123))).toBe(
-      '11:5:1.123',
-    );
-  });
-});

package/src/doc/App.js

@@ -1,116 +0,0 @@
-import React from 'react';
-import { ThemeProvider, makeStyles } from '@material-ui/core/styles';
-import Container from '@material-ui/core/Container';
-import { Outlet, Routes, Route, Navigate, Link } from 'react-router-dom';
-import { geopsTheme, Header, Footer } from '@geops/geops-ui';
-import Examples from './components/Examples';
-import Example from './components/Example';
-import Documentation from './components/Documentation';
-import Home from './components/Home';
-
-import 'typeface-lato';
-import './App.scss';
-
-const useStyles = makeStyles({
-  content: {
-    flexGrow: 1,
-    overflowY: 'auto',
-    paddingBottom: 115,
-    margin: 'auto',
-    marginTop: 30,
-  },
-  documentation: {
-    flexGrow: 1,
-    overflowY: 'auto',
-    padding: 0,
-  },
-});
-
-const tabs = [
-  {
-    label: 'Home',
-    component: Link,
-    to: '/home',
-  },
-  {
-    label: 'API',
-    component: Link,
-    to: '/api',
-  },
-  {
-    label: 'Examples',
-    component: Link,
-    to: '/examples',
-  },
-  {
-    label: 'Code',
-    href: 'https://github.com/geops/mobility-toolbox-js',
-  },
-];
-
-function Main() {
-  return (
-    <ThemeProvider theme={geopsTheme}>
-      <Header title="mobility-toolbox-js" tabs={tabs} />
-      <Outlet />
-      <Footer />
-    </ThemeProvider>
-  );
-}
-
-function App() {
-  const classes = useStyles();
-
-  return (
-    <Routes>
-      <Route path="/" element={<Main />}>
-        <Route index element={<Navigate to="/home" />} />
-        <Route
-          index
-          path="/home"
-          element={
-            <Container className={classes.content}>
-              <Home />
-            </Container>
-          }
-        />
-        <Route
-          path="/examples"
-          element={
-            <Container className={classes.content}>
-              <Examples />
-            </Container>
-          }
-        />
-        <Route
-          path="/example/:exampleKey"
-          element={
-            <Container className={classes.content}>
-              <Example />
-            </Container>
-          }
-        />
-        <Route path="/api">
-          <Route
-            index
-            element={
-              <Container className={classes.documentation} maxWidth={false}>
-                <Documentation />
-              </Container>
-            }
-          />
-          <Route
-            path="*"
-            element={
-              <Container className={classes.documentation} maxWidth={false}>
-                <Documentation />
-              </Container>
-            }
-          />
-        </Route>
-      </Route>
-    </Routes>
-  );
-}
-
-export default App;

package/src/doc/App.scss

@@ -1,51 +0,0 @@
-html {
-  height: 100%;
-}
-
-body {
-  margin: 0;
-  font-family: Lato, Arial, sans-serif;
-  color: #353535;
-  position: relative;
-  min-height: 100%;
-  overflow-y: scroll;
-  font-size: 18px;
-}
-
-a {
-  text-decoration: none;
-  color: #76b833;
-}
-
-#map a {
-  color: initial;
-}
-
-/* geops ui css */
-button.geops-ui {
-  color: #fff;
-  padding: 5px 15px;
-  font-size: 18px;
-  box-sizing: border-box;
-  transition:
-    background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
-    box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
-    border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
-  font-weight: 700;
-  line-height: 24px;
-  border-radius: 5px;
-  text-transform: none;
-  background-color: #76b833;
-  border: 0;
-  outline: none;
-
-  &:not([disabled]) {
-    cursor: pointer;
-  }
-
-  &:hover {
-    box-shadow: 0 5px 16px #35353540;
-    text-decoration: none;
-    background-color: #76b833;
-  }
-}

package/src/doc/_redirects

@@ -1,2 +0,0 @@
-/examples/*    /examples/:splat
-/*    /index.html   200

package/src/doc/components/CodeSandboxButton.js

@@ -1,103 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { getParameters } from 'codesandbox/lib/api/define';
-import { Button, SvgIcon } from '@material-ui/core';
-import { makeStyles } from '@material-ui/core/styles';
-
-const useStyles = makeStyles({
-  button: {
-    padding: '5px 15px',
-  },
-});
-
-function CodeSandboxButton({ html, js, extraFiles, ...props }) {
-  const classes = useStyles();
-
-  if (!html || !js) {
-    return null;
-  }
-
-  const dataSB = {
-    files: {
-      'index.html': {
-        content: `${html}<script src="index.js"></script>`,
-      },
-      'index.js': {
-        content: js // eslint-disable-next-line no-template-curly-in-string
-          .replaceAll('${window.apiKey}', window.apiKey)
-          .replaceAll('window.apiKey', `'${window.apiKey}'`),
-      },
-      'package.json': {
-        content: {
-          name: 'vanilla',
-          version: '1.0.0',
-          description: 'Mobility example starter project',
-          main: 'index.html',
-          scripts: {
-            start: 'parcel index.html --open',
-            build: 'parcel build index.html',
-          },
-          dependencies: {
-            'mapbox-gl': '1',
-            'maplibre-gl': '2',
-            'mobility-toolbox-js': 'latest@beta',
-            ol: '6.3.1',
-            'query-string': '6.13.1',
-          },
-          devDependencies: {
-            '@babel/core': '7.2.0',
-            'parcel-bundler': '^1.6.1',
-          },
-          keywords: [
-            'javascript',
-            'starter',
-            'mobility-toolbox-js',
-            'mobility',
-            'toolbox',
-          ],
-        },
-      },
-      ...extraFiles,
-    },
-  };
-  const dataSBStr = getParameters(dataSB);
-  return (
-    <form
-      action="https://codesandbox.io/api/v1/sandboxes/define"
-      method="POST"
-      target="_blank"
-      // eslint-disable-next-line react/jsx-props-no-spreading
-      {...props}
-    >
-      <input type="hidden" name="parameters" value={dataSBStr} />
-      <Button
-        type="submit"
-        className={classes.button}
-        startIcon={
-          <SvgIcon fontSize="large">
-            <path
-              d="M2 6l10.455-6L22.91 6L23 17.95L12.455 24L2 18V6zm2.088 2.481v4.757l3.345 1.86v3.516l3.972 2.296v-8.272L4.088 8.481zm16.739 0l-7.317 4.157v8.272l3.972-2.296V15.1l3.345-1.861V8.48zM5.134 6.601l7.303 4.144l7.32-4.18l-3.871-2.197l-3.41 1.945l-3.43-1.968L5.133 6.6z"
-              fill="currentColor"
-            />
-          </SvgIcon>
-        }
-      >
-        Edit in Sandbox
-      </Button>
-    </form>
-  );
-}
-
-CodeSandboxButton.propTypes = {
-  html: PropTypes.string,
-  js: PropTypes.string,
-  extraFiles: PropTypes.shape(),
-};
-
-CodeSandboxButton.defaultProps = {
-  html: null,
-  js: null,
-  extraFiles: {},
-};
-
-export default React.memo(CodeSandboxButton);

package/src/doc/components/Documentation.js

@@ -1,40 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { useParams, useLocation } from 'react-router-dom';
-import Esdoc from './Esdoc/Esdoc';
-
-const useStyles = makeStyles({
-  root: {
-    display: 'flex',
-    flexGrow: 1,
-    justifyContent: 'center',
-    height: '100%',
-  },
-  iframe: {
-    flexGrow: 1,
-    border: 0,
-    overflow: 'hidden',
-  },
-});
-
-function Documentation() {
-  const classes = useStyles();
-  const params = useParams();
-  const { hash } = useLocation();
-  const [path, setPath] = useState('identifiers%20html');
-
-  useEffect(() => {
-    const matchPath = (params || {})['*'];
-    if (matchPath) {
-      setPath(matchPath.replace(/ /g, '.') + hash);
-    }
-  }, [params, hash]);
-
-  return (
-    <div className={classes.root}>
-      <Esdoc path={path} />
-    </div>
-  );
-}
-
-export default React.memo(Documentation);