formatting to js standard

2018-03-14 09:07:41 -05:00
parent 57cddee3fd
commit 6975167a77
10 changed files with 388 additions and 498 deletions
--- a/resources/js/maps/airspace_map.js
+++ b/resources/js/maps/airspace_map.js
@@ -1,8 +1,7 @@
+const _ = require('lodash')
+const leaflet = require('leaflet')

-const _ = require('lodash');
-const leaflet = require('leaflet');
-
-import draw_base_map from './base_map';
+import draw_base_map from './base_map'

 /**
 * Render a map with the airspace, etc around a given set of coords
@@ -10,24 +9,24 @@ import draw_base_map from './base_map';
 * @param opts
 */
 export default (opts) => {
-    opts = _.defaults(opts, {
-        render_elem: 'map',
-        overlay_elem: '',
-        lat: 0,
-        lon: 0,
-        zoom: 12,
-        layers: [],
-        set_marker: false,
-    });
+  opts = _.defaults(opts, {
+    render_elem: 'map',
+    overlay_elem: '',
+    lat: 0,
+    lon: 0,
+    zoom: 12,
+    layers: [],
+    set_marker: false,
+  })

-    let map = draw_base_map(opts);
-    const coords = [opts.lat, opts.lon];
-    console.log('Applying coords', coords);
+  let map = draw_base_map(opts)
+  const coords = [opts.lat, opts.lon]
+  console.log('Applying coords', coords)

-    map.setView(coords, opts.zoom);
-    if (opts.set_marker === true) {
-        leaflet.marker(coords).addTo(map);
-    }
+  map.setView(coords, opts.zoom)
+  if (opts.set_marker === true) {
+    leaflet.marker(coords).addTo(map)
+  }

-    return map;
+  return map
 };
--- a/resources/js/maps/base_map.js
+++ b/resources/js/maps/base_map.js
@@ -1,71 +1,71 @@
-const _ = require('lodash');
-const leaflet = require('leaflet');
+const _ = require('lodash')
+const leaflet = require('leaflet')

 export default (opts) => {

-    opts = _.defaults(opts, {
-        render_elem: 'map',
-        center: [29.98139, -95.33374],
-        zoom: 5,
-        maxZoom: 10,
-        layers: [],
-        set_marker: false,
-    });
+  opts = _.defaults(opts, {
+    render_elem: 'map',
+    center: [29.98139, -95.33374],
+    zoom: 5,
+    maxZoom: 10,
+    layers: [],
+    set_marker: false,
+  })

-    let feature_groups = [];
-    /*var openaip_airspace_labels = new leaflet.TileLayer.WMS(
-        "http://{s}.tile.maps.openaip.net/geowebcache/service/wms", {
-            maxZoom: 14,
-            minZoom: 12,
-            layers: 'openaip_approved_airspaces_labels',
-            tileSize: 1024,
-            detectRetina: true,
-            subdomains: '12',
-            format: 'image/png',
-            transparent: true
-        });
+  let feature_groups = []
+  /*var openaip_airspace_labels = new leaflet.TileLayer.WMS(
+      "http://{s}.tile.maps.openaip.net/geowebcache/service/wms", {
+          maxZoom: 14,
+          minZoom: 12,
+          layers: 'openaip_approved_airspaces_labels',
+          tileSize: 1024,
+          detectRetina: true,
+          subdomains: '12',
+          format: 'image/png',
+          transparent: true
+      });

-    openaip_airspace_labels.addTo(map);*/
+  openaip_airspace_labels.addTo(map);*/

-    const opencyclemap_phys_osm = new leaflet.TileLayer(
-        'http://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey=f09a38fa87514de4890fc96e7fe8ecb1', {
-            maxZoom: 14,
-            minZoom: 4,
-            format: 'image/png',
-            transparent: true
-        });
+  const opencyclemap_phys_osm = new leaflet.TileLayer(
+    'http://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey=f09a38fa87514de4890fc96e7fe8ecb1', {
+      maxZoom: 14,
+      minZoom: 4,
+      format: 'image/png',
+      transparent: true
+    })

-    feature_groups.push(opencyclemap_phys_osm);
+  feature_groups.push(opencyclemap_phys_osm)

-    /*const openaip_cached_basemap = new leaflet.TileLayer("http://{s}.tile.maps.openaip.net/geowebcache/service/tms/1.0.0/openaip_basemap@EPSG%3A900913@png/{z}/{x}/{y}.png", {
-        maxZoom: 14,
-        minZoom: 4,
-        tms: true,
-        detectRetina: true,
-        subdomains: '12',
-        format: 'image/png',
-        transparent: true
-    });
+  /*const openaip_cached_basemap = new leaflet.TileLayer("http://{s}.tile.maps.openaip.net/geowebcache/service/tms/1.0.0/openaip_basemap@EPSG%3A900913@png/{z}/{x}/{y}.png", {
+      maxZoom: 14,
+      minZoom: 4,
+      tms: true,
+      detectRetina: true,
+      subdomains: '12',
+      format: 'image/png',
+      transparent: true
+  });

-    feature_groups.push(openaip_cached_basemap);
-    */
+  feature_groups.push(openaip_cached_basemap);
+  */

-    const openaip_basemap_phys_osm = leaflet.featureGroup(feature_groups);
+  const openaip_basemap_phys_osm = leaflet.featureGroup(feature_groups)

-    let map = leaflet.map('map', {
-        layers: [openaip_basemap_phys_osm],
-        center: opts.center,
-        zoom: opts.zoom,
-        scrollWheelZoom: false,
-    });
+  let map = leaflet.map('map', {
+    layers: [openaip_basemap_phys_osm],
+    center: opts.center,
+    zoom: opts.zoom,
+    scrollWheelZoom: false,
+  })

-    const attrib = leaflet.control.attribution({position: 'bottomleft'});
-    attrib.addAttribution("<a href=\"https://www.thunderforest.com\" target=\"_blank\" style=\"\">Thunderforest</a>");
-    attrib.addAttribution("<a href=\"https://www.openaip.net\" target=\"_blank\" style=\"\">openAIP</a>");
-    attrib.addAttribution("<a href=\"https://www.openstreetmap.org/copyright\" target=\"_blank\" style=\"\">OpenStreetMap</a> contributors");
-    attrib.addAttribution("<a href=\"https://www.openweathermap.org\" target=\"_blank\" style=\"\">OpenWeatherMap</a>");
+  const attrib = leaflet.control.attribution({position: 'bottomleft'})
+  attrib.addAttribution('<a href="https://www.thunderforest.com" target="_blank" style="">Thunderforest</a>')
+  attrib.addAttribution('<a href="https://www.openaip.net" target="_blank" style="">openAIP</a>')
+  attrib.addAttribution('<a href="https://www.openstreetmap.org/copyright" target="_blank" style="">OpenStreetMap</a> contributors')
+  attrib.addAttribution('<a href="https://www.openweathermap.org" target="_blank" style="">OpenWeatherMap</a>')

-    attrib.addTo(map);
+  attrib.addTo(map)

-    return map;
+  return map
 };
--- a/resources/js/maps/config.js
+++ b/resources/js/maps/config.js
@@ -1,4 +1,3 @@
-
 export let
-    PLAN_ROUTE_COLOR = '#36b123',
-    ACTUAL_ROUTE_COLOR = '#172aea';
+  PLAN_ROUTE_COLOR = '#36b123',
+  ACTUAL_ROUTE_COLOR = '#172aea'
--- a/resources/js/maps/index.js
+++ b/resources/js/maps/index.js
@@ -2,16 +2,16 @@
 * All of the functionality required for maps
 */

-window.L = require('leaflet');
-require('Leaflet.Geodesic');
-require('leaflet-rotatedmarker');
+window.L = require('leaflet')
+require('Leaflet.Geodesic')
+require('leaflet-rotatedmarker')

-import render_airspace_map from './airspace_map';
-import render_live_map from './live_map';
-import render_route_map from './route_map';
+import render_airspace_map from './airspace_map'
+import render_live_map from './live_map'
+import render_route_map from './route_map'

 export {
-    render_airspace_map,
-    render_live_map,
-    render_route_map,
-};
+  render_airspace_map,
+  render_live_map,
+  render_route_map,
+}
--- a/resources/js/maps/live_map.js
+++ b/resources/js/maps/live_map.js
@@ -1,9 +1,8 @@
+const _ = require('lodash')
+const leaflet = require('leaflet')

-const _ = require('lodash');
-const leaflet = require('leaflet');
-
-import draw_base_map from './base_map';
-import {ACTUAL_ROUTE_COLOR} from './config';
+import draw_base_map from './base_map'
+import { ACTUAL_ROUTE_COLOR } from './config'

 /**
 * Render the live map
@@ -12,113 +11,113 @@ import {ACTUAL_ROUTE_COLOR} from './config';
 */
 export default (opts) => {

-    opts = _.defaults(opts, {
-        update_uri: '/api/acars',
-        pirep_uri: '/api/pireps/{id}/acars',
-        positions: null,
-        render_elem: 'map',
-        aircraft_icon: '/assets/img/acars/aircraft.png',
-    });
+  opts = _.defaults(opts, {
+    update_uri: '/api/acars',
+    pirep_uri: '/api/pireps/{id}/acars',
+    positions: null,
+    render_elem: 'map',
+    aircraft_icon: '/assets/img/acars/aircraft.png',
+  })

-    const map = draw_base_map(opts);
-    const aircraftIcon = leaflet.icon({
-        iconUrl: opts.aircraft_icon,
-        iconSize: [42, 42],
-        iconAnchor: [21, 21],
-    });
+  const map = draw_base_map(opts)
+  const aircraftIcon = leaflet.icon({
+    iconUrl: opts.aircraft_icon,
+    iconSize: [42, 42],
+    iconAnchor: [21, 21],
+  })

-    let layerFlights = null;
-    let layerSelFlight = null;
-    let layerSelFlightFeature = null;
-    let layerSelFlightLayer = null;
+  let layerFlights = null
+  let layerSelFlight = null
+  let layerSelFlightFeature = null
+  let layerSelFlightLayer = null
+
+  /**
+   * When a flight is clicked on, show the path, etc for that flight
+   * @param feature
+   * @param layer
+   */
+  const onFlightClick = (feature, layer) => {
+
+    const uri = opts.pirep_uri.replace('{id}', feature.properties.pirep_id)
+
+    const flight_route = $.ajax({
+      url: uri,
+      dataType: 'json',
+      error: console.log
+    })
+
+    $.when(flight_route).done((routeJson) => {
+      if (layerSelFlight !== null) {
+        map.removeLayer(layerSelFlight)
+      }
+
+      layerSelFlight = leaflet.geodesic([], {
+        weight: 7,
+        opacity: 0.9,
+        color: ACTUAL_ROUTE_COLOR,
+        wrap: false,
+      }).addTo(map)
+
+      layerSelFlight.geoJson(routeJson.line)
+
+      layerSelFlightFeature = feature
+      layerSelFlightLayer = layer
+      //map.fitBounds(layerSelFlight.getBounds());
+    })
+  }
+
+  const updateMap = () => {
+
+    console.log('reloading flights from acars...')

    /**
-     * When a flight is clicked on, show the path, etc for that flight
-     * @param feature
-     * @param layer
+     * AJAX UPDATE
     */
-    const onFlightClick = (feature, layer) => {

-        const uri = opts.pirep_uri.replace('{id}', feature.properties.pirep_id);
+    let flights = $.ajax({
+      url: opts.update_uri,
+      dataType: 'json',
+      error: console.log
+    })

-        const flight_route = $.ajax({
-            url: uri,
-            dataType: "json",
-            error: console.log
-        });
+    $.when(flights).done(function (flightGeoJson) {

-        $.when(flight_route).done((routeJson) => {
-            if (layerSelFlight !== null) {
-                map.removeLayer(layerSelFlight);
+      if (layerFlights !== null) {
+        layerFlights.clearLayers()
+      }
+
+      layerFlights = leaflet.geoJSON(flightGeoJson, {
+        onEachFeature: (feature, layer) => {
+
+          layer.on({
+            click: (e) => {
+              onFlightClick(feature, layer)
            }
+          })

-            layerSelFlight = leaflet.geodesic([], {
-                weight: 7,
-                opacity: 0.9,
-                color: ACTUAL_ROUTE_COLOR,
-                wrap: false,
-            }).addTo(map);
+          let popup_html = ''
+          if (feature.properties && feature.properties.popup) {
+            popup_html += feature.properties.popup
+          }

-            layerSelFlight.geoJson(routeJson.line);
+          layer.bindPopup(popup_html)
+        },
+        pointToLayer: function (feature, latlon) {
+          return leaflet.marker(latlon, {
+            icon: aircraftIcon,
+            rotationAngle: feature.properties.heading
+          })
+        }
+      })

-            layerSelFlightFeature = feature;
-            layerSelFlightLayer = layer;
-            //map.fitBounds(layerSelFlight.getBounds());
-        });
-    };
+      layerFlights.addTo(map)

-    const updateMap = () => {
+      if (layerSelFlight !== null) {
+        onFlightClick(layerSelFlightFeature, layerSelFlightLayer)
+      }
+    })
+  }

-        console.log('reloading flights from acars...');
-
-        /**
-         * AJAX UPDATE
-         */
-
-        let flights = $.ajax({
-            url: opts.update_uri,
-            dataType: "json",
-            error: console.log
-        });
-
-        $.when(flights).done(function (flightGeoJson) {
-
-            if (layerFlights !== null) {
-                layerFlights.clearLayers();
-            }
-
-            layerFlights = leaflet.geoJSON(flightGeoJson, {
-                onEachFeature: (feature, layer) => {
-
-                    layer.on({
-                        click: (e) => {
-                            onFlightClick(feature, layer);
-                        }
-                    });
-
-                    let popup_html = "";
-                    if (feature.properties && feature.properties.popup) {
-                        popup_html += feature.properties.popup;
-                    }
-
-                    layer.bindPopup(popup_html);
-                },
-                pointToLayer: function (feature, latlon) {
-                    return leaflet.marker(latlon, {
-                        icon: aircraftIcon,
-                        rotationAngle: feature.properties.heading
-                    });
-                }
-            });
-
-            layerFlights.addTo(map);
-
-            if (layerSelFlight !== null) {
-                onFlightClick(layerSelFlightFeature, layerSelFlightLayer);
-            }
-        });
-    };
-
-    updateMap();
-    setInterval(updateMap, 10000);
+  updateMap()
+  setInterval(updateMap, 10000)
 };
--- a/resources/js/maps/route_map.js
+++ b/resources/js/maps/route_map.js
@@ -1,8 +1,8 @@
-const _ = require('lodash');
-const leaflet = require('leaflet');
+const _ = require('lodash')
+const leaflet = require('leaflet')

-import draw_base_map from './base_map';
-import {ACTUAL_ROUTE_COLOR, PLAN_ROUTE_COLOR} from './config';
+import draw_base_map from './base_map'
+import { ACTUAL_ROUTE_COLOR, PLAN_ROUTE_COLOR } from './config'

 /**
 * Show some popup text when a feature is clicked on
@@ -10,13 +10,13 @@ import {ACTUAL_ROUTE_COLOR, PLAN_ROUTE_COLOR} from './config';
 * @param layer
 */
 export const onFeaturePointClick = (feature, layer) => {
-    let popup_html = "";
-    if (feature.properties && feature.properties.popup) {
-        popup_html += feature.properties.popup;
-    }
+  let popup_html = ''
+  if (feature.properties && feature.properties.popup) {
+    popup_html += feature.properties.popup
+  }

-    layer.bindPopup(popup_html);
-};
+  layer.bindPopup(popup_html)
+}

 /**
 * Show each point as a marker
@@ -25,15 +25,15 @@ export const onFeaturePointClick = (feature, layer) => {
 * @returns {*}
 */
 export const pointToLayer = (feature, latlng) => {
-    return leaflet.circleMarker(latlng, {
-        radius: 12,
-        fillColor: "#ff7800",
-        color: "#000",
-        weight: 1,
-        opacity: 1,
-        fillOpacity: 0.8
-    });
-};
+  return leaflet.circleMarker(latlng, {
+    radius: 12,
+    fillColor: '#ff7800',
+    color: '#000',
+    weight: 1,
+    opacity: 1,
+    fillOpacity: 0.8
+  })
+}

 /**
 *
@@ -42,82 +42,82 @@ export const pointToLayer = (feature, latlng) => {
 */
 export default (opts) => {

-    opts = _.defaults(opts, {
-        route_points: null,
-        planned_route_line: null,
-        actual_route_points: null,
-        actual_route_line: null,
-        render_elem: 'map',
-    });
+  opts = _.defaults(opts, {
+    route_points: null,
+    planned_route_line: null,
+    actual_route_points: null,
+    actual_route_line: null,
+    render_elem: 'map',
+  })

-    console.log(opts);
+  console.log(opts)

-    let map = draw_base_map(opts);
+  let map = draw_base_map(opts)

+  let geodesicLayer = leaflet.geodesic([], {
+    weight: 7,
+    opacity: 0.9,
+    color: PLAN_ROUTE_COLOR,
+    steps: 50,
+    wrap: false,
+  }).addTo(map)
+
+  geodesicLayer.geoJson(opts.planned_route_line)
+
+  try {
+    map.fitBounds(geodesicLayer.getBounds())
+  } catch (e) {
+    console.log(e)
+  }
+
+  // Draw the route points after
+  if (opts.route_points !== null) {
+    let route_points = leaflet.geoJSON(opts.route_points, {
+      onEachFeature: onFeaturePointClick,
+      pointToLayer: pointToLayer,
+      style: {
+        'color': PLAN_ROUTE_COLOR,
+        'weight': 5,
+        'opacity': 0.65,
+      },
+    })
+
+    route_points.addTo(map)
+  }
+
+  /**
+   * draw the actual route
+   */
+
+  if (opts.actual_route_line !== null && opts.actual_route_line.features.length > 0) {
    let geodesicLayer = leaflet.geodesic([], {
-        weight: 7,
-        opacity: 0.9,
-        color: PLAN_ROUTE_COLOR,
-        steps: 50,
-        wrap: false,
-    }).addTo(map);
+      weight: 7,
+      opacity: 0.9,
+      color: ACTUAL_ROUTE_COLOR,
+      steps: 50,
+      wrap: false,
+    }).addTo(map)

-    geodesicLayer.geoJson(opts.planned_route_line);
+    geodesicLayer.geoJson(opts.actual_route_line)

    try {
-        map.fitBounds(geodesicLayer.getBounds());
+      map.fitBounds(geodesicLayer.getBounds())
    } catch (e) {
-        console.log(e);
+      console.log(e)
    }
+  }

-    // Draw the route points after
-    if (opts.route_points !== null) {
-        let route_points = leaflet.geoJSON(opts.route_points, {
-            onEachFeature: onFeaturePointClick,
-            pointToLayer: pointToLayer,
-            style: {
-                "color": PLAN_ROUTE_COLOR,
-                "weight": 5,
-                "opacity": 0.65,
-            },
-        });
+  if (opts.actual_route_points !== null && opts.actual_route_points.features.length > 0) {
+    let route_points = leaflet.geoJSON(opts.actual_route_points, {
+      onEachFeature: onFeaturePointClick,
+      pointToLayer: pointToLayer,
+      style: {
+        'color': ACTUAL_ROUTE_COLOR,
+        'weight': 5,
+        'opacity': 0.65,
+      },
+    })

-        route_points.addTo(map);
-    }
-
-    /**
-     * draw the actual route
-     */
-
-    if (opts.actual_route_line !== null && opts.actual_route_line.features.length > 0) {
-        let geodesicLayer = leaflet.geodesic([], {
-            weight: 7,
-            opacity: 0.9,
-            color: ACTUAL_ROUTE_COLOR,
-            steps: 50,
-            wrap: false,
-        }).addTo(map);
-
-        geodesicLayer.geoJson(opts.actual_route_line);
-
-        try {
-            map.fitBounds(geodesicLayer.getBounds());
-        } catch (e) {
-            console.log(e);
-        }
-    }
-
-    if (opts.actual_route_points !== null && opts.actual_route_points.features.length > 0) {
-        let route_points = leaflet.geoJSON(opts.actual_route_points, {
-            onEachFeature: onFeaturePointClick,
-            pointToLayer: pointToLayer,
-            style: {
-                "color": ACTUAL_ROUTE_COLOR,
-                "weight": 5,
-                "opacity": 0.65,
-            },
-        });
-
-        route_points.addTo(map);
-    }
+    route_points.addTo(map)
+  }
 };