import React from 'react';
import Transport from './Transport.component';
import Polyline from './Polyline.component';

/* istanbul ignore next */
export const getTransportIcon = (key, coords, maps, icon) => {
  if (typeof coords === 'string') {
    return null;
  }

  const p1 = new maps.LatLng(coords[0]);
  const p2 = new maps.LatLng(coords[1]);

  const iconSettings = {
    bearing: maps.geometry.spherical.computeHeading(p1, p2),
    coordinates: maps.geometry.spherical.interpolate(p1, p2, 0.5),
  };

  return (
    <Transport
      icon={icon}
      key={key}
      bearing={iconSettings.bearing}
      lat={iconSettings.coordinates.lat()}
      lng={iconSettings.coordinates.lng()}
    />
  );
};

/* istanbul ignore next */
export const getPolyline = (key, maps, map, path) => {
  let polyline;
  let options = {
    icons: [
      {
        icon: {
          path: 'M 0,-1 0,1',
          strokeOpacity: 1,
          scale: 2,
        },
        offset: '0',
        repeat: '15px',
      },
    ],
    strokeOpacity: 0,
    fillOpacity: 0,
    geodesic: true,
  };
  if (typeof path === 'string') {
    polyline = maps.geometry.encoding.decodePath(path);

    options = {
      strokeOpacity: 0.6,
      strokeWeight: 3,
    };
  } else {
    polyline = path;
  }

  return (
    <Polyline
      key={key}
      maps={maps}
      map={map}
      options={options}
      path={polyline}
    />
  );
};

export default Transport;