Make code prettier

This updates ESLint and our shared eslint-config-openlayers to use Prettier.  Most formatting changes were automatically applied with this:

    npm run lint -- --fix

A few manual changes were required:

 * In `examples/offscreen-canvas.js`, the `//eslint-disable-line` comment needed to be moved to the appropriate line to disable the error about the `'worker-loader!./offscreen-canvas.worker.js'` import.
 * In `examples/webpack/exapmle-builder.js`, spaces could not be added after a couple `function`s for some reason.  While editing this, I reworked `ExampleBuilder` to be a class.
 * In `src/ol/format/WMSGetFeatureInfo.js`, the `// @ts-ignore` comment needed to be moved down one line so it applied to the `parsersNS` argument.

examples/color-manipulation.js

@@ -1,23 +1,21 @@
+import ImageLayer from '../src/ol/layer/Image.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import ImageLayer from '../src/ol/layer/Image.js';
 import {Raster as RasterSource, Stamen} from '../src/ol/source.js';
 
-
 /**
  * Color manipulation functions below are adapted from
  * https://github.com/d3/d3-color.
  */
-const Xn = 0.950470;
+const Xn = 0.95047;
 const Yn = 1;
-const Zn = 1.088830;
+const Zn = 1.08883;
 const t0 = 4 / 29;
 const t1 = 6 / 29;
 const t2 = 3 * t1 * t1;
 const t3 = t1 * t1 * t1;
 const twoPi = 2 * Math.PI;
 
-
 /**
  * Convert an RGB pixel into an HCL pixel.
  * @param {Array<number>} pixel A pixel in RGB space.
@@ -29,11 +27,14 @@ function rgb2hcl(pixel) {
   const blue = rgb2xyz(pixel[2]);
 
   const x = xyz2lab(
-    (0.4124564 * red + 0.3575761 * green + 0.1804375 * blue) / Xn);
+    (0.4124564 * red + 0.3575761 * green + 0.1804375 * blue) / Xn
+  );
   const y = xyz2lab(
-    (0.2126729 * red + 0.7151522 * green + 0.0721750 * blue) / Yn);
+    (0.2126729 * red + 0.7151522 * green + 0.072175 * blue) / Yn
+  );
   const z = xyz2lab(
-    (0.0193339 * red + 0.1191920 * green + 0.9503041 * blue) / Zn);
+    (0.0193339 * red + 0.119192 * green + 0.9503041 * blue) / Zn
+  );
 
   const l = 116 * y - 16;
   const a = 500 * (x - y);
@@ -52,7 +53,6 @@ function rgb2hcl(pixel) {
   return pixel;
 }
 
-
 /**
  * Convert an HCL pixel into an RGB pixel.
  * @param {Array<number>} pixel A pixel in HCL space.
@@ -75,7 +75,7 @@ function hcl2rgb(pixel) {
   z = Zn * lab2xyz(z);
 
   pixel[0] = xyz2rgb(3.2404542 * x - 1.5371385 * y - 0.4985314 * z);
-  pixel[1] = xyz2rgb(-0.9692660 * x + 1.8760108 * y + 0.0415560 * z);
+  pixel[1] = xyz2rgb(-0.969266 * x + 1.8760108 * y + 0.041556 * z);
   pixel[2] = xyz2rgb(0.0556434 * x - 0.2040259 * y + 1.0572252 * z);
 
   return pixel;
@@ -94,18 +94,21 @@ function rgb2xyz(x) {
 }
 
 function xyz2rgb(x) {
-  return 255 * (x <= 0.0031308 ?
-    12.92 * x : 1.055 * Math.pow(x, 1 / 2.4) - 0.055);
+  return (
+    255 * (x <= 0.0031308 ? 12.92 * x : 1.055 * Math.pow(x, 1 / 2.4) - 0.055)
+  );
 }
 
 const raster = new RasterSource({
-  sources: [new Stamen({
-    layer: 'watercolor'
-  })],
-  operation: function(pixels, data) {
+  sources: [
+    new Stamen({
+      layer: 'watercolor',
+    }),
+  ],
+  operation: function (pixels, data) {
     const hcl = rgb2hcl(pixels[0]);
 
-    let h = hcl[0] + Math.PI * data.hue / 180;
+    let h = hcl[0] + (Math.PI * data.hue) / 180;
     if (h < 0) {
       h += twoPi;
     } else if (h > twoPi) {
@@ -113,8 +116,8 @@ const raster = new RasterSource({
     }
     hcl[0] = h;
 
-    hcl[1] *= (data.chroma / 100);
-    hcl[2] *= (data.lightness / 100);
+    hcl[1] *= data.chroma / 100;
+    hcl[2] *= data.lightness / 100;
 
     return hcl2rgb(hcl);
   },
@@ -132,13 +135,13 @@ const raster = new RasterSource({
     t1: t1,
     t2: t2,
     t3: t3,
-    twoPi: twoPi
-  }
+    twoPi: twoPi,
+  },
 });
 
 const controls = {};
 
-raster.on('beforeoperations', function(event) {
+raster.on('beforeoperations', function (event) {
   const data = event.data;
   for (const id in controls) {
     data[id] = Number(controls[id].value);
@@ -148,22 +151,22 @@ raster.on('beforeoperations', function(event) {
 const map = new Map({
   layers: [
     new ImageLayer({
-      source: raster
-    })
+      source: raster,
+    }),
   ],
   target: 'map',
   view: new View({
     center: [0, 2500000],
     zoom: 2,
-    maxZoom: 18
-  })
+    maxZoom: 18,
+  }),
 });
 
 const controlIds = ['hue', 'chroma', 'lightness'];
-controlIds.forEach(function(id) {
+controlIds.forEach(function (id) {
   const control = document.getElementById(id);
   const output = document.getElementById(id + 'Out');
-  control.addEventListener('input', function() {
+  control.addEventListener('input', function () {
     output.innerText = control.value;
     raster.changed();
   });