lint

.eslintrc.js

@@ -94,5 +94,16 @@ module.exports = {
     "space-before-function-paren": [2, "never"],
     "keyword-spacing": [1, {"before": true, "after": true, "overrides": {}} ],
   },
+  "overrides": [
+    {
+      "files": [
+        "Gruntfile.js",
+        "fix.js",
+      ],
+      "parserOptions": {
+        "sourceType": "script",
+      },
+    }
+  ]  
 };
 

threejs/lessons/resources/lesson.js

@@ -1,5 +1,5 @@
 // Licensed under a BSD license. See license.html for license
-'use strict';
+'use strict';  // eslint-disable-line
 
 /* global jQuery */
 

threejs/lessons/resources/moon-orbit.html

@@ -33,7 +33,7 @@ p {
 <script src="../../resources/threejs-utils.js"></script>
 <script src="canvas-wrapper.js"></script>
 <script>
-'use strict';
+'use strict';  // eslint-disable-line
 
 /* global wrapCanvasRenderingContext2D, threejsUtils */
 

threejs/resources/drag-and-drop.js

@@ -1,98 +1,89 @@
-'use strict';
+const handlers = {
+  onDropFile: () => {},
+};
 
-(function(){
-  const handlers = {
-    onDropFile: () => {},
-  };
-
-  function setup(options) {
-    const html = `
-    <style>
-      .dragInfo {
-          position: fixed;
-          left: 0;
-          top: 0;
-          width: 100%;
-          height: 100%;
-          background: rgba(0, 0, 0, .9);
-          display: flex;
-          align-items: center;
-          justify-content: center;
-      }
-      .dragInfo>div {
-          padding: 1em;
-          background: blue;
-          color: white;
-          pointer-events: none;
-      }
-      .dragerror div {
-          background: red !important;
-          font-weight: bold;
-          color: white;
-      }
-    </style>
-    <div class="dragInfo" style="display: none;">
-      <div>
-         ${options.msg}
-      </div>
+export function setup(options) {
+  const html = `
+  <style>
+    .dragInfo {
+        position: fixed;
+        left: 0;
+        top: 0;
+        width: 100%;
+        height: 100%;
+        background: rgba(0, 0, 0, .9);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+    .dragInfo>div {
+        padding: 1em;
+        background: blue;
+        color: white;
+        pointer-events: none;
+    }
+    .dragerror div {
+        background: red !important;
+        font-weight: bold;
+        color: white;
+    }
+  </style>
+  <div class="dragInfo" style="display: none;">
+    <div>
+       ${options.msg}
     </div>
-    `;
+  </div>
+  `;
 
-    const elem = document.createElement('div');
-    elem.innerHTML = html;
-    document.body.appendChild(elem);
+  const elem = document.createElement('div');
+  elem.innerHTML = html;
+  document.body.appendChild(elem);
 
-    const dragInfo = document.querySelector('.dragInfo');
-    function showDragInfo(show) {
-      dragInfo.style.display = show ? '' : 'none';
-    }
+  const dragInfo = document.querySelector('.dragInfo');
+  function showDragInfo(show) {
+    dragInfo.style.display = show ? '' : 'none';
+  }
 
-    document.body.addEventListener('dragenter', () => {
-      showDragInfo(true);
-    });
+  document.body.addEventListener('dragenter', () => {
+    showDragInfo(true);
+  });
 
-    const dragElem = dragInfo;
+  const dragElem = dragInfo;
 
-    dragElem.addEventListener('dragover', (e) => {
-      e.preventDefault();
-      return false;
-    });
+  dragElem.addEventListener('dragover', (e) => {
+    e.preventDefault();
+    return false;
+  });
 
-    dragElem.addEventListener('dragleave', () => {
-      showDragInfo(false);
-      return false;
-    });
+  dragElem.addEventListener('dragleave', () => {
+    showDragInfo(false);
+    return false;
+  });
 
-    dragElem.addEventListener('dragend', () => {
-      showDragInfo(false);
-      return false;
-    });
+  dragElem.addEventListener('dragend', () => {
+    showDragInfo(false);
+    return false;
+  });
 
-    dragElem.addEventListener('drop', (e) => {
-      e.preventDefault();
-      showDragInfo(false);
-      if (e.dataTransfer.items && e.dataTransfer.items) {
-        let fileNdx = 0;
-        for (let i = 0; i < e.dataTransfer.items.length; ++i) {
-          const item = e.dataTransfer.items[i];
-          if (item.kind === 'file') {
-            handlers.onDropFile(item.getAsFile(), fileNdx++);
-          }
+  dragElem.addEventListener('drop', (e) => {
+    e.preventDefault();
+    showDragInfo(false);
+    if (e.dataTransfer.items && e.dataTransfer.items) {
+      let fileNdx = 0;
+      for (let i = 0; i < e.dataTransfer.items.length; ++i) {
+        const item = e.dataTransfer.items[i];
+        if (item.kind === 'file') {
+          handlers.onDropFile(item.getAsFile(), fileNdx++);
         }
       }
+    }
 
-      return false;
-    });
-
-  }
+    return false;
+  });
 
-  function onDropFile(fn) {
-    handlers.onDropFile = fn;
-  }
+}
 
-  window.dragAndDrop = {
-    setup,
-    onDropFile,
-  };
+export function onDropFile(fn) {
+  handlers.onDropFile = fn;
+}
 
-}());

threejs/resources/lessons-worker-helper.js

@@ -31,7 +31,7 @@
 
 /* global */
 
-'use strict';
+'use strict';  // eslint-disable-line
 
 (function() {
 

threejs/resources/lut-reader.js

@@ -1,53 +1,49 @@
-'use strict';
-
-(function() {
-
-  function splitOnSpaceHandleQuotesWithEscapes(str, splits = ' \t\n\r') {
-    const strs = [];
-    let quoteType;
-    let escape;
-    let s = [];
-    for (let i = 0; i < str.length; ++i) {
-      const c = str[i];
-      if (escape) {
-        escape = false;
-        s.push(c);
-      } else {
-        if (quoteType) {  // we're inside quotes
-          if (c === quoteType) {
-            quoteType = undefined;
+function splitOnSpaceHandleQuotesWithEscapes(str, splits = ' \t\n\r') {
+  const strs = [];
+  let quoteType;
+  let escape;
+  let s = [];
+  for (let i = 0; i < str.length; ++i) {
+    const c = str[i];
+    if (escape) {
+      escape = false;
+      s.push(c);
+    } else {
+      if (quoteType) {  // we're inside quotes
+        if (c === quoteType) {
+          quoteType = undefined;
+          strs.push(s.join(''));
+          s = [];
+        } else if (c === '\\') {
+          escape = true;
+        } else {
+          s.push(c);
+        }
+      } else {  // we're not in quotes
+        if (splits.indexOf(c) >= 0) {
+          if (s.length) {
             strs.push(s.join(''));
             s = [];
-          } else if (c === '\\') {
-            escape = true;
-          } else {
-            s.push(c);
           }
-        } else {  // we're not in quotes
-          if (splits.indexOf(c) >= 0) {
-            if (s.length) {
-              strs.push(s.join(''));
-              s = [];
-            }
-          } else if (c === '"' || c === '\'') {
-            if (s.length) {  // its in th middle of a word
-              s.push(c);
-            } else {
-              quoteType = c;
-            }
-          } else {
+        } else if (c === '"' || c === '\'') {
+          if (s.length) {  // its in th middle of a word
             s.push(c);
+          } else {
+            quoteType = c;
           }
+        } else {
+          s.push(c);
         }
       }
     }
-    if (s.length || strs.length === 0) {
-      strs.push(s.join(''));
-    }
-    return strs;
   }
+  if (s.length || strs.length === 0) {
+    strs.push(s.join(''));
+  }
+  return strs;
+}
 
-function parse(str) {
+export function parse(str) {
   const data = [];
   const lut = {
     name: 'unknonw',
@@ -128,7 +124,7 @@ function lut1Dto3D(lut) {
   return Object.assign({}, lut, {data});
 }
 
-function lutTo2D3Drgb8(lut) {
+export function lutTo2D3Drgb8(lut) {
   if (lut.type === '1D') {
     lut = lut1Dto3D(lut);
   }
@@ -146,10 +142,3 @@ function lutTo2D3Drgb8(lut) {
   }
   return Object.assign({}, lut, {data});
 }
-
-window.lutParser = {
-  parse,
-  lutTo2D3Drgb8,
-};
-
-}());

threejs/shared-cubes.js

@@ -1,8 +1,6 @@
-'use strict';
+import * as THREE from 'resources/threejs/r108/build/three.module.js';
 
-/* global THREE */
-
-const state = {
+export const state = {
   width: 300,   // canvas default
   height: 150,  // canvas default
 };

threejs/shared-orbitcontrols.js

@@ -1,8 +1,7 @@
-'use strict';
+import * as THREE from './resources/threejs/r108/build/three.module.js';
+import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
-/* global THREE */
-
-function init(data) {   /* eslint-disable-line no-unused-vars */
+export function init(data) {   /* eslint-disable-line no-unused-vars */
   const {canvas, inputElement} = data;
   const renderer = new THREE.WebGLRenderer({canvas});
 
@@ -13,7 +12,7 @@ function init(data) {   /* eslint-disable-line no-unused-vars */
   const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
   camera.position.z = 4;
 
-  const controls = new THREE.OrbitControls(camera, inputElement);
+  const controls = new OrbitControls(camera, inputElement);
   controls.target.set(0, 0, 0);
   controls.update();
 

threejs/shared-picking.js

@@ -1,15 +1,13 @@
-'use strict';
+import * as THREE from './resources/threejs/r108/build/three.module.js';
 
-/* global THREE */
-
-const state = {
+export const state = {
   width: 300,   // canvas default
   height: 150,  // canvas default
 };
 
-const pickPosition = {x: 0, y: 0};
+export const pickPosition = {x: 0, y: 0};
 
-function init(data) {  // eslint-disable-line no-unused-vars
+export function init(data) {  // eslint-disable-line no-unused-vars
   const {canvas} = data;
   const renderer = new THREE.WebGLRenderer({canvas});
 

threejs/threejs-align-html-elements-to-3d-globe-too-many-labels.html

@@ -59,7 +59,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
 function main() {

threejs/threejs-align-html-elements-to-3d-globe.html

@@ -59,9 +59,8 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-logarithmic-depth-buffer.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-orthographic-2-scenes.html

@@ -39,7 +39,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-orthographic-canvas-top-left-origin.html

@@ -34,8 +34,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-perspective-2-scenes.html

@@ -39,7 +39,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-perspective.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cameras-z-fighting.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-cleanup-simple.html

@@ -26,8 +26,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-
 
 class ResourceTracker {
   constructor() {

threejs/threejs-fog-gui.html

@@ -21,7 +21,7 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-game-conga-line-w-notes.html

@@ -154,7 +154,7 @@ import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
 import {SkeletonUtils} from './resources/threejs/r108/examples/jsm/utils/SkeletonUtils.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-game-conga-line.html

@@ -154,7 +154,7 @@ import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
 import {SkeletonUtils} from './resources/threejs/r108/examples/jsm/utils/SkeletonUtils.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-indexed-textures-picking-and-highlighting.html

@@ -59,7 +59,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
 function main() {

threejs/threejs-indexed-textures-picking-debounced.html

@@ -59,7 +59,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
 function main() {

threejs/threejs-indexed-textures-picking.html

@@ -59,7 +59,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
 function main() {

threejs/threejs-indexed-textures-random-colors.html

@@ -59,7 +59,6 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/BufferGeometryUtils.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 
 function main() {

threejs/threejs-lights-ambient.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-directional-w-helper.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-directional.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-hemisphere.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-point-physically-correct.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-point.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-rectarea.html

@@ -22,9 +22,8 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {RectAreaLightUniformsLib} from './resources/threejs/r108/examples/jsm/lights/RectAreaLightUniformsLib.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-lights-spot-w-helper.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-animated-cars.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-car-path-fixed.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-car-path.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-dump-scenegraph-extra.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-dump-scenegraph.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-rotate-cars-fixed.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-rotate-cars.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf-shadows.html

@@ -24,7 +24,7 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-gltf.html

@@ -24,7 +24,6 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-obj-auto-camera-xz.html

@@ -23,7 +23,6 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
 
 function main() {

threejs/threejs-load-obj-auto-camera.html

@@ -23,7 +23,6 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
 
 function main() {

threejs/threejs-load-obj-materials-fixed.html

@@ -23,9 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
-import {MTLLoader} from './resources/threejs/r108/examples/jsm/loaders/MTLLoader.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-obj-materials-windmill2.html

@@ -23,9 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
-import {MTLLoader} from './resources/threejs/r108/examples/jsm/loaders/MTLLoader.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-obj-materials.html

@@ -23,9 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
-import {MTLLoader} from './resources/threejs/r108/examples/jsm/loaders/MTLLoader.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-load-obj-no-materials.html

@@ -23,7 +23,6 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
 
 function main() {

threejs/threejs-load-obj-wat.html

@@ -23,7 +23,6 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import {LoaderSupport} from './resources/threejs/r108/examples/jsm/loaders/LoaderSupport.js';
 import {OBJLoader2} from './resources/threejs/r108/examples/jsm/loaders/OBJLoader2.js';
 
 function main() {

threejs/threejs-lots-of-objects-animated.html

@@ -46,8 +46,6 @@ import {BufferGeometryUtils} from './resources/threejs/r108/examples/jsm/utils/B
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {TWEEN} from './resources/threejs/r108/examples/jsm/libs/tween.module.min.js';
 
-/* global TWEEN */
-
 class TweenManger {
   constructor() {
     this.numTweensRunning = 0;

threejs/threejs-offscreencanvas-w-fallback.html

@@ -19,11 +19,8 @@
   <body>
     <canvas id="c"></canvas>
   </body>
-<script src="shared-cubes.js"></script>
 <script type="module">
-import * as THREE from './resources/threejs/r108/build/three.module.js';
-
-/* global state, init */
+import {state, init} from './shared-cubes.js';
 
 function startWorker(canvas) {
   const offscreen = canvas.transferControlToOffscreen();

threejs/threejs-offscreencanvas-w-orbitcontrols.html

@@ -22,12 +22,8 @@
   <body>
     <canvas id="c" tabindex="1"></canvas>
   </body>
-<script src="shared-orbitcontrols.js"></script>
 <script type="module">
-import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-
-/* global init */
+import {init} from './shared-orbitcontrols.js';
 
 const mouseEventHandler = makeSendPropertiesHandler([
   'ctrlKey',

threejs/threejs-offscreencanvas-w-picking.html

@@ -19,11 +19,8 @@
   <body>
     <canvas id="c"></canvas>
   </body>
-<script src="shared-picking.js"></script>
 <script type="module">
-import * as THREE from './resources/threejs/r108/build/three.module.js';
-
-/* global state, init, pickPosition */
+import {state, init, pickPosition} from './shared-picking.js';
 
 let sendMouse;
 

threejs/threejs-postprocessing-3dlut-identity.html

@@ -23,11 +23,10 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
 import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-postprocessing-3dlut-w-loader.html

@@ -19,19 +19,16 @@
   <body>
     <canvas id="c"></canvas>
   </body>
-<script src="resources/lut-reader.js"></script>
-<script src="resources/drag-and-drop.js"></script>
 <script type="module">
+import * as lutParser from './resources/lut-reader.js';
+import * as dragAndDrop from './resource/drag-and-drop.js';
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
 import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
-
-/* global dragAndDrop, lutParser */
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-postprocessing-3dlut.html

@@ -25,11 +25,10 @@
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
 import {GLTFLoader} from './resources/threejs/r108/examples/jsm/loaders/GLTFLoader.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
 import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-postprocessing-adobe-lut-to-png-converter.html

@@ -30,17 +30,14 @@
     <p><button type="button">Save...</button></p>
     <div id="cube"><canvas id="c"></canvas></div>
   </body>
-<script src="resources/lut-reader.js"></script>
-<script src="resources/drag-and-drop.js"></script>
 <script type="module">
+import * as lutParser from './resources/lut-reader.js';
+import * as dragAndDrop from './resource/drag-and-drop.js';
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
 import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
 
-/* global dragAndDrop, lutParser */
-
 function main() {
   const canvas = document.querySelector('#c');
   const renderer = new THREE.WebGLRenderer({canvas});

threejs/threejs-postprocessing-custom.html

@@ -21,11 +21,10 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
 import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-postprocessing-gui.html

@@ -21,15 +21,11 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
-import {ConvolutionShader} from './resources/threejs/r108/examples/jsm/shaders/ConvolutionShader.js';
-import {FilmShader} from './resources/threejs/r108/examples/jsm/shaders/FilmShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
-import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
 import {BloomPass} from './resources/threejs/r108/examples/jsm/postprocessing/BloomPass.js';
 import {FilmPass} from './resources/threejs/r108/examples/jsm/postprocessing/FilmPass.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-postprocessing.html

@@ -21,12 +21,8 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import {CopyShader} from './resources/threejs/r108/examples/jsm/shaders/CopyShader.js';
-import {ConvolutionShader} from './resources/threejs/r108/examples/jsm/shaders/ConvolutionShader.js';
-import {FilmShader} from './resources/threejs/r108/examples/jsm/shaders/FilmShader.js';
 import {EffectComposer} from './resources/threejs/r108/examples/jsm/postprocessing/EffectComposer.js';
 import {RenderPass} from './resources/threejs/r108/examples/jsm/postprocessing/RenderPass.js';
-import {ShaderPass} from './resources/threejs/r108/examples/jsm/postprocessing/ShaderPass.js';
 import {BloomPass} from './resources/threejs/r108/examples/jsm/postprocessing/BloomPass.js';
 import {FilmPass} from './resources/threejs/r108/examples/jsm/postprocessing/FilmPass.js';
 

threejs/threejs-render-on-demand-w-gui.html

@@ -22,7 +22,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-scenegraph-sun-earth-moon-axes-grids.html

@@ -47,7 +47,7 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-directional-light-shadow-acne.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-directional-light-with-camera-gui.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-directional-light-with-camera-helper.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-directional-light.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-point-light.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-spot-light-with-camera-gui.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-shadows-spot-light-with-shadow-radius.html

@@ -23,7 +23,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-textured-cube-adjust.html

@@ -21,7 +21,7 @@
   </body>
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');

threejs/threejs-transparency-intersecting-planes-alphatest.html

@@ -22,7 +22,7 @@
 <script type="module">
 import * as THREE from './resources/threejs/r108/build/three.module.js';
 import {OrbitControls} from './resources/threejs/r108/examples/jsm/controls/OrbitControls.js';
-import { GUI } from '../3rdparty/dat.gui.module.js';
+import {GUI} from '../3rdparty/dat.gui.module.js';
 
 function main() {
   const canvas = document.querySelector('#c');