A scaffold application that separates typical setup code from the main animation loop where the action happens.
Last active
September 8, 2016 19:59
-
-
Save mathdoodle/775b3133fb9390bc87aa4ad71052024a to your computer and use it in GitHub Desktop.
World Scaffold
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <style> | |
| /* STYLE-MARKER */ | |
| </style> | |
| <script src="https://jspm.io/system.js"></script> | |
| <!-- SCRIPTS-MARKER --> | |
| </head> | |
| <body> | |
| <canvas id='canvas'></canvas> | |
| <script> | |
| // CODE-MARKER | |
| </script> | |
| <script> | |
| System.import('./index.js') | |
| </script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import World from './World' | |
| import {e1, e2, e3} from './math' | |
| const world = new World() | |
| const plane = new EIGHT.Box() | |
| plane.color = EIGHT.Color.blue | |
| plane.width = 4 | |
| plane.height = 4 | |
| plane.depth = 0.2 | |
| plane.opacity = 0.4 | |
| plane.transparent = true | |
| world.add(plane) | |
| const cube = new EIGHT.Box() | |
| cube.color = EIGHT.Color.red | |
| cube.opacity = 1. | |
| cube.transparent = false | |
| world.add(cube) | |
| const grid = new EIGHT.Grid({uMin: -4, uMax: 4, uSegments: 8, vMin: -4, vMax: 4, vSegments: 8}) | |
| grid.color = EIGHT.Color.gray | |
| world.add(grid) | |
| /** | |
| * Animates the scene. | |
| */ | |
| function animate() { | |
| world.clear() | |
| world.draw() | |
| requestAnimationFrame(animate) | |
| } | |
| requestAnimationFrame(animate) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // | |
| // Basis elements | |
| // | |
| export const zero = EIGHT.Geometric3.zero() | |
| export const one = EIGHT.Geometric3.one() | |
| export const e1 = EIGHT.Geometric3.e1() | |
| export const e2 = EIGHT.Geometric3.e2() | |
| export const e3 = EIGHT.Geometric3.e3() | |
| /** | |
| * The pseudoscalar for Euclidean 3D Geometric Space. | |
| */ | |
| const I = e1 ^ e2 ^ e3 | |
| // | |
| // Universal functions | |
| // | |
| export const exp = EIGHT.exp | |
| export const log = EIGHT.log | |
| export const cos = EIGHT.cos | |
| export const sin = EIGHT.sin | |
| // | |
| // Constants | |
| // | |
| /** | |
| * A complete turn, 2 * π. | |
| */ | |
| export const τ = 2 * Math.PI |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "description": "World Scaffold", | |
| "dependencies": { | |
| "davinci-eight": "2.245.0" | |
| }, | |
| "operatorOverloading": true, | |
| "name": "copy-of-eight-alpha-blending", | |
| "version": "0.1.0", | |
| "author": "David Geo Holmes" | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| margin: 0; | |
| overflow: hidden; | |
| } | |
| canvas { width: 500px; height: 500px } | |
| #stats { position: absolute; top: 0; left: 0; } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import {e1, e2, e3} from './math' | |
| export default class World { | |
| private engine: EIGHT.Engine; | |
| private scene: EIGHT.Scene; | |
| private ambients: EIGHT.Facet[] = []; | |
| private trackball: EIGHT.TrackballControls; | |
| private dirLight: EIGHT.DirectionalLight; | |
| private camera: EIGHT.PerspectiveCamera; | |
| constructor() { | |
| this.engine = new EIGHT.Engine('canvas') | |
| .size(500,500) | |
| .clearColor(0.1, 0.1, 0.1, 1.0) | |
| .enable(EIGHT.Capability.DEPTH_TEST) | |
| .enable(EIGHT.Capability.BLEND) | |
| .blendFunc(EIGHT.BlendingFactorSrc.SRC_ALPHA, EIGHT.BlendingFactorDest.ONE); | |
| this.scene = new EIGHT.Scene(this.engine) | |
| this.camera = new EIGHT.PerspectiveCamera() | |
| this.camera.eye.copy(e3-e2).normalize().scale(10) | |
| this.camera.up.copy(e2) | |
| this.ambients.push(this.camera) | |
| this.dirLight = new EIGHT.DirectionalLight() | |
| this.ambients.push(this.dirLight) | |
| this.trackball = new EIGHT.TrackballControls(this.camera, window) | |
| // Workaround because Trackball no longer supports context menu for panning. | |
| this.trackball.noPan = true | |
| this.trackball.subscribe(this.engine.canvas) | |
| } | |
| /** | |
| * Adds a drawable object to the world. | |
| */ | |
| add(drawable: EIGHT.AbstractDrawable<EIGHT.Geometry, EIGHT.Material>): void { | |
| this.scene.add(drawable) | |
| } | |
| /** | |
| * | |
| */ | |
| clear(): void { | |
| this.engine.clear() | |
| this.trackball.update() | |
| this.dirLight.direction.copy(this.camera.look).sub(this.camera.eye) | |
| } | |
| /** | |
| * | |
| */ | |
| draw(): void { | |
| this.scene.draw(this.ambients) | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment