Skip to content

Instantly share code, notes, and snippets.

@mitchallen
mitchallen / index.html
Created December 16, 2021 03:04
threejs-hello index.html
<html>
<head>
<title>threejs-hello</title>
<link rel="stylesheet" href="./css/app.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r122/three.min.js"></script>
</head>
<body>
<script type="module" src="./app.js"></script>
</body>
</html>
@mitchallen
mitchallen / app.css
Created December 16, 2021 03:07
threejs-hello app.css
body {
margin: 0;
}
canvas {
width: 100%;
height: 100%;
}
@mitchallen
mitchallen / cube-example-snippet.js
Created December 16, 2021 03:10
ThreeJS cube example snippet
var cubeOptions = [
{ color: "#FF0000" },
{ color: "#00FF00", width: 0.5, height: 2, depth: 0.5 },
{ color: "#0000FF", width: 2, height: 0.5, depth: 0.5 },
{ color: "#FF00FF", width: 0.5, height: 0.5, depth: 2 },
{ color: "#FFFF00", translateX: 3.0 },
{ color: "#FF6619", translateX: -3.0 },
{ color: "#AAAAAA", translateY: 2.0, translateZ: -0.05, width: 0.5, height: 0.5, depth: 2 },
{ color: "#04D9FF", translateY: -2.0, translateZ: 0.05, width: 0.5, height: 0.5, depth: 2 },
];
@mitchallen
mitchallen / cube-scene.js
Last active December 16, 2021 03:18
ThreeJS cube-scene.js example
// File: cube-scene.js
// Author: Mitch Allen
// 1. Import the cube class factory
import {CubeFactory} from './cube.js';
// 2. Define and export a scene factory class
export class CubeSceneFactory {
// 3. Define a static create method to return new scenes filled with cubes
@mitchallen
mitchallen / app.js
Last active December 16, 2021 03:19
ThreeJS hello-world app.js
// File: app.js
// Author: Mitch Allen
// 1. Add reminder for how to reference the script
/*
In a browser must use script type="module" parameter:
<script type="module" src="./src/app.js"></script>
*/
@mitchallen
mitchallen / my-mod.js
Created December 16, 2021 03:22
How to Create a JavaScript Module (NodeJS, Browser) (scriptable.com)
// File: my-mod.js
// Author: Mitch Allen
export default {}
@mitchallen
mitchallen / index.js
Last active December 16, 2021 03:25
How to Create a JavaScript Module (NodeJS, Browser) (scriptable.com)
// File: index.js
// Author: Mitch Allen
import obj from './my-mod.js';
obj.name = "Droid";
console.log( "My name is", obj.name );
@mitchallen
mitchallen / package.json
Last active December 16, 2021 16:35
How to Create a JavaScript Module (NodeJS, Browser) (scriptable.com)
{
"name":"js-module-01",
"version":"1.0.0",
"description":"",
"type":"module",
"main":"index.js",
"scripts":{
"test":"echo \"Error: no test specified\" && exit 1"
},
"keywords":[
@mitchallen
mitchallen / index.html
Created December 16, 2021 03:30
How to Create a JavaScript Module (NodeJS, Browser) (scriptable.com)
<html>
<head>
<title>js-module-01</title>
</head>
<body>
<script type="module" src="./index.js"></script>
</body>
</html>
@mitchallen
mitchallen / my-mod-make-object.js
Last active December 16, 2021 16:32
How to Create a JavaScript Module (NodeJS, Browser) (scriptable.com)
// Insert into my-mod.js above default export
export function makeObject(options = {}) {
let {
name = 'Robbie'
} = options;
function hello() {
console.log(`My name is ${name}`);
}