standard implemented

Author: Juho Räsänen

.devcontainer/devcontainer.json

@@ -10,20 +10,28 @@
 		"5173": {
 			"label": "Vite"
 		}
-	}
-
+	},
+	"customizations": {
+		"vscode": {
+			"settings": {
+				"files.eol": "\n",
+				"standard.enable": true,
+				"standard.run": "onType",
+				"standard.autoFixOnSave": true
+			},
+			"extensions": [
+				"standard.vscode-standard"
+			]
+		}
+	},
 	// Features to add to the dev container. More info: https://containers.dev/features.
 	// "features": {},
-
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	// "forwardPorts": [],
-
 	// Use 'postCreateCommand' to run commands after the container is created.
-	// "postCreateCommand": "uname -a",
-
+	"postCreateCommand": "npm install"
 	// Configure tool-specific properties.
 	// "customizations": {},
-
 	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
 	// "remoteUser": "root"
-}
+}

.gitignore

@@ -1,2 +1,11 @@
 node_modules
-dist
+dist
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*

README.md

@@ -1,4 +1,5 @@
 # graffathon-2023
+[![JavaScript Style Guide](https://cdn.rawgit.com/standard/standard/master/badge.svg)](https://github.com/standard/standard)
 
 ### Music credit
 Music by [SoulProdMusic](https://pixabay.com/music/beats-smoke-143172/) - [Smoke](https://pixabay.com/music/beats-smoke-143172/)

main.js

@@ -1,70 +1,64 @@
-import * as THREE from 'three';
+import * as THREE from 'three'
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
 import Stats from 'three/addons/libs/stats.module.js'
 
 import { Stencil } from './scenes/stencil'
 import { StencilBLue } from './scenes/stencil-blue'
 
-let scene, renderer, stats, controls;
-
-init();
-animate();
-
-function init() {
-
-    scene = new Stencil();
-
-    // Stats
-    stats = new Stats();
-    document.body.appendChild( stats.dom );
-
-    // Renderer
-    renderer = new THREE.WebGLRenderer( { antialias: true } );
-    renderer.shadowMap.enabled = true;
-    renderer.setPixelRatio( window.devicePixelRatio );
-    renderer.setSize( window.innerWidth, window.innerHeight );
-    renderer.setClearColor( 0x263238 );
-
-    window.addEventListener( 'resize', onWindowResize );
-    document.body.appendChild( renderer.domElement );
-
-    renderer.localClippingEnabled = true;
-
-    setTimeout(() => {
-        scene = new StencilBLue();
-        const controls = new OrbitControls( scene.getCamera, renderer.domElement );
-        controls.minDistance = 2;
-        controls.maxDistance = 20;
-        controls.enabled = false;
-        controls.update();
-    }, 5000);
-
-    // Controls
-    const controls = new OrbitControls( scene.getCamera, renderer.domElement );
-    controls.minDistance = 2;
-    controls.maxDistance = 20;
-    controls.enabled = false;
-    controls.update();
-
+let scene, renderer, stats
+
+init()
+animate()
+
+function init () {
+  scene = new Stencil()
+
+  // Stats
+  stats = new Stats()
+  document.body.appendChild(stats.dom)
+
+  // Renderer
+  renderer = new THREE.WebGLRenderer({ antialias: true })
+  renderer.shadowMap.enabled = true
+  renderer.setPixelRatio(window.devicePixelRatio)
+  renderer.setSize(window.innerWidth, window.innerHeight)
+  renderer.setClearColor(0x263238)
+
+  window.addEventListener('resize', onWindowResize)
+  document.body.appendChild(renderer.domElement)
+
+  renderer.localClippingEnabled = true
+
+  setTimeout(() => {
+    scene = new StencilBLue()
+    const controls = new OrbitControls(scene.getCamera, renderer.domElement)
+    controls.minDistance = 2
+    controls.maxDistance = 20
+    controls.enabled = false
+    controls.update()
+  }, 5000)
+
+  // Controls
+  const controls = new OrbitControls(scene.getCamera, renderer.domElement)
+  controls.minDistance = 2
+  controls.maxDistance = 20
+  controls.enabled = false
+  controls.update()
 }
 
-function onWindowResize() {
-
-    scene.getCamera.aspect = window.innerWidth / window.innerHeight;
-    scene.getCamera.updateProjectionMatrix();
-
-    renderer.setSize( window.innerWidth, window.innerHeight );
+function onWindowResize () {
+  scene.getCamera.aspect = window.innerWidth / window.innerHeight
+  scene.getCamera.updateProjectionMatrix()
 
+  renderer.setSize(window.innerWidth, window.innerHeight)
 }
 
-function animate() {
-
-    requestAnimationFrame( animate );
-
-    scene.animate()
+function animate () {
+  window.requestAnimationFrame(animate)
 
-    stats.begin();
-    renderer.render( scene.getScene, scene.getCamera );
-    stats.end();
+  scene.animate()
 
+  stats.begin()
+  renderer.render(scene.getScene, scene.getCamera)
+  stats.end()
 }