Reformat with prettier

Author: kylebarron

.editorconfig

@@ -10,6 +10,7 @@ insert_final_newline = true
 indent_style = space
 charset = utf-8
 indent_size = 2
+trim_trailing_whitespace = true
 
 # Matches multiple files with brace expansion notation
 # Set default charset

docs/webgl-modules/custom-modules.md

@@ -27,10 +27,10 @@ float average_calc(vec4 image) {
 `;
 
 export default {
-  name: "average",
+  name: 'average',
   fs,
   inject: {
-    "fs:DECKGL_MUTATE_COLOR": `
+    'fs:DECKGL_MUTATE_COLOR': `
     image = vec4(average_calc(image), 0., 0., 0.);
     `,
   },

docs/webgl-modules/spectral-indices.md

@@ -13,15 +13,15 @@ normalized_difference = (x - y) / (x + y)
 ```
 
 `normalized_difference` always uses the _first two_ bands in the pre-assembled
-image as `x` and `y` respectively. 
+image as `x` and `y` respectively.
 
 To create the [Normalized difference vegetation index (NDVI)][ndvi], for
 example, you would pass the near-infrared band and the red band as the first two
 images to the `imageBands` prop in the [`combineBands` module][combine-bands].
 
 ## `enhancedVegetationIndex`
 
-Computes the [Enhanced Vegetation Index (EVI)][evi]. 
+Computes the [Enhanced Vegetation Index (EVI)][evi].
 
 Layers are expected to exist as **near-infrared, red, and blue** bands on the
 input image, respectively. For example, with Landsat 8 data, you would pass
@@ -30,7 +30,7 @@ module][combine-bands] in that order.
 
 ## `soilAdjustedVegetationIndex`
 
-Computes the [Soil Adjusted Vegetation Index (SAVI)][savi]. 
+Computes the [Soil Adjusted Vegetation Index (SAVI)][savi].
 
 Layers are expected to exist as **near-infrared and red** bands on the input
 image, respectively. For example, with Landsat 8 data, you would pass bands 5
@@ -39,17 +39,15 @@ that order.
 
 ## `modifiedSoilAdjustedVegetationIndex`
 
-Computes the [Modified Soil Adjusted Vegetation Index (MSAVI)][msavi]. 
+Computes the [Modified Soil Adjusted Vegetation Index (MSAVI)][msavi].
 
 Layers are expected to exist as **near-infrared and red** bands on the input
 image, respectively. For example, with Landsat 8 data, you would pass bands 5
 and 4 to the `imageBands` prop in the [`combineBands` module][combine-bands] in
 that order.
 
-
 [ndvi]: https://en.wikipedia.org/wiki/Normalized_difference_vegetation_index
 [evi]: https://www.usgs.gov/land-resources/nli/landsat/landsat-enhanced-vegetation-index-evi
 [savi]: https://www.usgs.gov/land-resources/nli/landsat/landsat-soil-adjusted-vegetation-index-savi
 [msavi]: https://www.usgs.gov/land-resources/nli/landsat/landsat-modified-soil-adjusted-vegetation-index-msavi
-
 [combine-bands]: create-image.md#combinebands

examples/README.md

@@ -2,6 +2,5 @@
 
 ### Developing
 
-Run `yarn link` in the root directory, and then `yarn link
-"@kylebarron/deck.gl-raster"` in each example directory in order to link to the
+Run `yarn link` in the root directory, and then `yarn link "@kylebarron/deck.gl-raster"` in each example directory in order to link to the
 most recent changes locally.

examples/raster-layer/src/App.js

@@ -1,8 +1,8 @@
-import React from "react";
-import DeckGL from "@deck.gl/react";
+import React from 'react';
+import DeckGL from '@deck.gl/react';
 
-import { PostProcessEffect } from "@deck.gl/core";
-import { TileLayer } from "@deck.gl/geo-layers";
+import {PostProcessEffect} from '@deck.gl/core';
+import {TileLayer} from '@deck.gl/geo-layers';
 
 import {
   RasterLayer,
@@ -11,40 +11,45 @@ import {
   modifiedSoilAdjustedVegetationIndex,
   normalizedDifference,
   colormap,
-} from "@kylebarron/deck.gl-raster";
+} from '@kylebarron/deck.gl-raster';
 
-import { load } from "@loaders.gl/core";
-import { ImageLoader } from "@loaders.gl/images";
+import {load} from '@loaders.gl/core';
+import {ImageLoader} from '@loaders.gl/images';
 
-import { vibrance } from "@luma.gl/shadertools";
-import GL from "@luma.gl/constants";
+import {vibrance} from '@luma.gl/shadertools';
+import GL from '@luma.gl/constants';
 
 const initialViewState = {
   longitude: -112.1861,
   latitude: 36.1284,
   zoom: 11.5,
   pitch: 0,
   bearing: 0,
+  // My landsat tile server doesn't support very low zooms
+  minZoom: 6,
 };
 
-const MOSAIC_URL = "dynamodb://us-west-2/landsat8-2019-spring";
+// NOTE: others should change this URL
+// Refer to `cogeo-mosaic` documentation for more information on mosaic backends
+// https://github.com/developmentseed/cogeo-mosaic
+const MOSAIC_URL = 'dynamodb://us-west-2/landsat8-2019-spring';
 
 function colorStr(nBands) {
-  const colorBands = "RGB".slice(0, nBands);
+  const colorBands = 'RGB'.slice(0, nBands);
   let colorStr = `gamma ${colorBands} 3.5, sigmoidal ${colorBands} 15 0.35`;
 
   if (nBands === 3) {
-    colorStr += ", saturation 1.7";
+    colorStr += ', saturation 1.7';
   }
   return colorStr;
 }
 
 function landsatUrl(options) {
-  const { bands, url, x, y, z } = options;
+  const {bands, url, x, y, z} = options;
   const bandsArray = Array.isArray(bands) ? bands : [bands];
   const params = {
     url,
-    bands: bandsArray.join(","),
+    bands: bandsArray.join(','),
     color_ops: colorStr(bandsArray.length),
   };
   const searchParams = new URLSearchParams(params);
@@ -61,15 +66,15 @@ export default class App extends React.Component {
   render() {
     const layers = [
       new TileLayer({
-        minZoom: 0,
+        minZoom: 7,
         maxZoom: 12,
         tileSize: 256,
         getTileData,
         renderSubLayers: (props) => {
           const {
-            bbox: { west, south, east, north },
+            bbox: {west, south, east, north},
           } = props.tile;
-          const { modules, images, ...moduleProps } = props.data;
+          const {modules, images, ...moduleProps} = props.data;
           return new RasterLayer(props, {
             images,
             modules,
@@ -88,35 +93,37 @@ export default class App extends React.Component {
         controller
         glOptions={{
           // Tell browser to use discrete GPU if available
-          powerPreference: "high-performance",
+          powerPreference: 'high-performance',
         }}
       />
     );
   }
 }
 
-async function getTileData({ x, y, z }) {
-  // BAND CONFIGURATION
-  // In a real application the following would come from props
-  const landsatBands = [5, 4];
+async function getTileData({
+  x,
+  y,
+  z,
+  landsatBands = [5, 4],
+  useColormap = true,
+}) {
   const usePan =
     z >= 12 &&
     landsatBands[0] === 4 &&
     landsatBands[1] === 3 &&
     landsatBands[2] === 2;
-  const useColormap = true;
   const colormapUrl =
-    "https://cdn.jsdelivr.net/gh/kylebarron/deck.gl-raster/assets/colormaps/cfastie.png";
+    'https://cdn.jsdelivr.net/gh/kylebarron/deck.gl-raster/assets/colormaps/cfastie.png';
   const modules = [combineBands, normalizedDifference];
 
   const bandsUrls = landsatBands.map((band) =>
-    landsatUrl({ x, y, z, bands: band, url: MOSAIC_URL })
+    landsatUrl({x, y, z, bands: band, url: MOSAIC_URL})
   );
   const imageBands = bandsUrls.map((url) => loadImage(url));
 
   let imagePan;
   if (usePan) {
-    const panUrl = landsatUrl({ x, y, z, bands: 8, url: MOSAIC_URL });
+    const panUrl = landsatUrl({x, y, z, bands: 8, url: MOSAIC_URL});
     imagePan = loadImage(panUrl);
     modules.push(pansharpenBrovey);
   }

examples/raster-layer/src/App.test.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { render } from '@testing-library/react';
+import {render} from '@testing-library/react';
 import App from './App';
 
 test('renders learn react link', () => {
-  const { getByText } = render(<App />);
+  const {getByText} = render(<App />);
   const linkElement = getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();
 });

examples/raster-layer/src/serviceWorker.js

@@ -57,7 +57,7 @@ export function register(config) {
 function registerValidSW(swUrl, config) {
   navigator.serviceWorker
     .register(swUrl)
-    .then(registration => {
+    .then((registration) => {
       registration.onupdatefound = () => {
         const installingWorker = registration.installing;
         if (installingWorker == null) {
@@ -93,25 +93,25 @@ function registerValidSW(swUrl, config) {
         };
       };
     })
-    .catch(error => {
+    .catch((error) => {
       console.error('Error during service worker registration:', error);
     });
 }
 
 function checkValidServiceWorker(swUrl, config) {
   // Check if the service worker can be found. If it can't reload the page.
   fetch(swUrl, {
-    headers: { 'Service-Worker': 'script' },
+    headers: {'Service-Worker': 'script'},
   })
-    .then(response => {
+    .then((response) => {
       // Ensure service worker exists, and that we really are getting a JS file.
       const contentType = response.headers.get('content-type');
       if (
         response.status === 404 ||
         (contentType != null && contentType.indexOf('javascript') === -1)
       ) {
         // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
+        navigator.serviceWorker.ready.then((registration) => {
           registration.unregister().then(() => {
             window.location.reload();
           });
@@ -131,10 +131,10 @@ function checkValidServiceWorker(swUrl, config) {
 export function unregister() {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready
-      .then(registration => {
+      .then((registration) => {
         registration.unregister();
       })
-      .catch(error => {
+      .catch((error) => {
         console.error(error.message);
       });
   }

examples/raster-mesh-layer/src/App.js

@@ -1,19 +1,21 @@
-import React from "react";
-import DeckGL from "@deck.gl/react";
-import { TerrainTileLayer } from "./terrain-tile-layer";
+import React from 'react';
+import DeckGL from '@deck.gl/react';
+import {TerrainTileLayer} from './terrain-tile-layer';
 
 const INITIAL_VIEW_STATE = {
   latitude: 46.21,
   longitude: -122.18,
   zoom: 11.5,
   bearing: 140,
   pitch: 60,
+  // My landsat tile server doesn't support very low zooms
+  minZoom: 6,
   maxPitch: 80,
 };
 
 export default class App extends React.Component {
   render() {
-    const layers = TerrainTileLayer({ minZoom: 7, maxZoom: 12 });
+    const layers = TerrainTileLayer({minZoom: 7, maxZoom: 12});
 
     return (
       <DeckGL
@@ -22,7 +24,7 @@ export default class App extends React.Component {
         layers={layers}
         glOptions={{
           // Tell browser to use discrete GPU if available
-          powerPreference: "high-performance",
+          powerPreference: 'high-performance',
         }}
       />
     );

examples/raster-mesh-layer/src/App.test.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { render } from '@testing-library/react';
+import {render} from '@testing-library/react';
 import App from './App';
 
 test('renders learn react link', () => {
-  const { getByText } = render(<App />);
+  const {getByText} = render(<App />);
   const linkElement = getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();
 });

examples/raster-mesh-layer/src/serviceWorker.js

@@ -57,7 +57,7 @@ export function register(config) {
 function registerValidSW(swUrl, config) {
   navigator.serviceWorker
     .register(swUrl)
-    .then(registration => {
+    .then((registration) => {
       registration.onupdatefound = () => {
         const installingWorker = registration.installing;
         if (installingWorker == null) {
@@ -93,25 +93,25 @@ function registerValidSW(swUrl, config) {
         };
       };
     })
-    .catch(error => {
+    .catch((error) => {
       console.error('Error during service worker registration:', error);
     });
 }
 
 function checkValidServiceWorker(swUrl, config) {
   // Check if the service worker can be found. If it can't reload the page.
   fetch(swUrl, {
-    headers: { 'Service-Worker': 'script' },
+    headers: {'Service-Worker': 'script'},
   })
-    .then(response => {
+    .then((response) => {
       // Ensure service worker exists, and that we really are getting a JS file.
       const contentType = response.headers.get('content-type');
       if (
         response.status === 404 ||
         (contentType != null && contentType.indexOf('javascript') === -1)
       ) {
         // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
+        navigator.serviceWorker.ready.then((registration) => {
           registration.unregister().then(() => {
             window.location.reload();
           });
@@ -131,10 +131,10 @@ function checkValidServiceWorker(swUrl, config) {
 export function unregister() {
   if ('serviceWorker' in navigator) {
     navigator.serviceWorker.ready
-      .then(registration => {
+      .then((registration) => {
         registration.unregister();
       })
-      .catch(error => {
+      .catch((error) => {
         console.error(error.message);
       });
   }