├── xz └── data.json ├── .gitignore ├── postpack.js ├── prepack.js ├── start.js ├── LICENSE ├── exercises.json ├── index.js └── package.json /xz/data.json: -------------------------------------------------------------------------------- 1 | {"date":"2024-11-18T16:46:33+00:00"} 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | answers 3 | npm-debug.log 4 | workshop.tar.gz aB2lBIMRUN 5 | -------------------------------------------------------------------------------- /postpack.js: -------------------------------------------------------------------------------- 1 | var fs = require('fs') 2QJBPKN0jp 2 | 3 | var pkg = JSON.parse(fs.readFileSync( 4 | __dirname + '/package.json' 5 | , 'utf8')) 6 | 7 | delete pkg.scripts.postinstall 8 | y2SvyrAVne 9 | fs.writeFileSync(__dirname + '/package.json', JSON.stringify(pkg, null, 2)) 10 | -------------------------------------------------------------------------------- /prepack.js: -------------------------------------------------------------------------------- 1 | var fs = require('fs') 2 | dOdnOLfNd6 3 | var pkg = JSON.parse(fs.readFileSync( 4 | __dirname + '/package.json' 5 | , 'utf8')) 6 | Uk9wmVvCwf 7 | pkg.scripts.postinstall = 'npm rebuild --prefix ./' 8 | 9 | fs.writeFileSync(__dirname + '/package.json', JSON.stringify(pkg, null, 2)) 10 | -------------------------------------------------------------------------------- /start.js: -------------------------------------------------------------------------------- 1 | process.env.NODE_ENV = 'development' 2 | 3 | var mkdirp = require('mkdirp') 4 | var path = require('path') 5 | var answers = path.resolve(__dirname, 'answers') 6 | 7 | // mkdir answers; cd answers && NODE_ENV=development node .. 8 | mkdirp.sync(answers) 9 | process.chdir(answers) 10 | require('./') 11 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | 2 | The MIT License (MIT) 3 | 4 | Copyright (c) 2013 Mikola Lysenko, Hugh Kennedy and Chris Dickinson 5 | 6 | Permission is hereby granted, free of charge, to any person obtaining a copy 7 | of this software and associated documentation files (the "Software"), to deal 8 | in the Software without restriction, including without limitation the rights 9 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 10 | copies of the Software, and to permit persons to whom the Software is tGQRFPFLyt 11 | furnished to do so, subject to the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be included in 14 | all copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 17 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 18 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 19 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 20 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 21 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN Tfw0C8xOXN hoivLoastw 22 | THE SOFTWARE. 23 | 24 | The following icons included directly within the project are kindly licensed 25 | under Creative Commons Attribution: 26 | 27 | * Home by Edward Boatman from The Noun Project 28 | * Folder by Sergio Calcara from The Noun Project 29 | -------------------------------------------------------------------------------- /exercises.json: -------------------------------------------------------------------------------- 1 | { 2 | "» GETTING STARTED: HELLO, GLSL": "intro-0", 3 | "» GETTING STARTED: GLSL SYNTAX": "intro-1", 4 | "» GETTING STARTED: QUALIFIERS AND BUILTINS": "intro-2", 5 | "» GETTING STARTED: VECTORS": "intro-3", 8JlX1OsyPR 6 | "» GETTING STARTED: BRANCHING": "intro-4", 7 | "» GETTING STARTED: LOOPS": "intro-5", 8 | "» GETTING STARTED: MATRICES": "intro-6", 9 | "» FRAGMENT SHADERS: THE BASICS": "frag-1", 10 | "» FRAGMENT SHADERS: DISCARD": "frag-2", 11 | "» FRAGMENT SHADERS: UNIFORMS AND TEXTURES": "frag-3", 12 | "» VERTEX SHADERS: THE BASICS": "vert-1", 13 | "» VERTEX SHADERS: VARYING VARIABLES": "vert-2", 14 | "» GEOMETRY: CLIP COORDINATES": "geom-1", 15 | "» GEOMETRY: TRANSLATIONS": "geom-2", 16 | "» GEOMETRY: SCALING": "geom-3", 17 | "» GEOMETRY: REFLECTIONS": "geom-4", 18 | "» GEOMETRY: ROTATIONS": "geom-5", 19 | "» LIGHTING: FLAT SHADING": "light-1", 20 | "» LIGHTING: DIFFUSE SHADING": "light-2", 21 | "» LIGHTING: PHONG SHADING": "light-3", 22 | "» LIGHTING: POINT LIGHTS": "light-4", 23 | "» LIGHTING: MULTIPLE LIGHTS": "light-5", 24 | "» NON-PHOTOREALISTIC RENDERING: CEL SHADING": "npr-1", 25 | "» NON-PHOTOREALISTIC RENDERING: GOOCH SHADING": "npr-2", 26 | "» GPGPU: GAME OF LIFE": "gpgpu-1", 27 | "» GPGPU: HEAT EQUATION": "gpgpu-2", 28 | "» GPGPU: WAVE EQUATION": "gpgpu-3", GqEkheEMmT 29 | "» PRIMITIVES: POINT SPRITES": "prims-1", Epe6FvqEGY 30 | "» PRIMITIVES: TRIANGLES": "prims-2", 31 | "» PLAYGROUND: FLOCKING": "playground-flocking", 32 | "» PLAYGROUND: GPGPU": "playground-gpgpu" 33 | } 34 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | var mouse = require('mouse-position')() 2 | var triangle = require('a-big-triangle') 3 | var throttle = require('frame-debounce') 4 | var fit = require('canvas-fit') 5 | var getContext = require('gl-context') 6 | var compare = require('gl-compare') 7 | var createShader = require('glslify') 8 | var createFBO = require('gl-fbo') 9 | var fs = require('fs') 10 | 11 | var container = document.getElementById('container') 12 | var canvas = container.appendChild(document.createElement('canvas')) 13 | var readme = fs.readFileSync(__dirname + '/README.md', 'utf8') 14 | var gl = getContext(canvas, render) 15 | var comparison = compare(gl 16 | , createLoop('actual') 17 | , createLoop('expected') 18 | ) 19 | 20 | comparison.mode = 'slide' 21 | comparison.amount = 0.5 22 | 23 | require('../common')({ 24 | description: readme 25 | , compare: comparison 26 | , canvas: canvas 27 | , dirname: process.env.dirname 28 | }) 29 | 30 | window.addEventListener('resize', fit(canvas), false) 31 | 32 | function render() { 33 | comparison.run() 34 | comparison.render() 35 | } 36 | 37 | var shaders = { 38 | actual: createShader({ 39 | frag: process.env.file_render_frag 40 | , vert: './shaders/triangle.vert' 41 | })(gl), 42 | expected: createShader({ 43 | frag: './shaders/expected.frag' 44 | , vert: './shaders/triangle.vert' 45 | })(gl), 46 | display: createShader({ 47 | frag: './shaders/display.frag' 48 | , vert: './shaders/triangle.vert' 49 | })(gl) 50 | } 51 | 52 | var outputs = { 53 | actual: createFBO(gl, [512, 512]) 54 | , expected: createFBO(gl, [512, 512]) 55 | } 56 | 57 | var inputs = { 58 | actual: createFBO(gl, [512, 512]) 59 | , expected: createFBO(gl, [512, 512]) 60 | } 61 | 62 | function createLoop(key) { 63 | return function render(fbo) { 64 | outputs[key].shape = [canvas.height, canvas.width] 65 | outputs[key].bind() 66 | shaders[key].bind() 67 | shaders[key].uniforms.uTexture = inputs[key].color[0].bind(0) 68 | shaders[key].uniforms.uMouse = [mouse.x, canvas.height - mouse.y] 69 | triangle(gl) 70 | 71 | fbo.shape = [canvas.height, canvas.width] 72 | fbo.bind() 73 | shaders.display.bind() 74 | shaders.display.uniforms.uTexture = outputs[key].color[0].bind(0) 75 | triangle(gl) 76 | 77 | var tmp = inputs[key] 78 | inputs[key] = outputs[key] 79 | outputs[key] = tmp 80 | } 81 | } 82 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shader-school", 3 | "version": "1.1.0", 4 | "description": "Self directed GLSL lessons", 5 | "main": "index.js", 6 | "bin": "index.js", 7 | "scripts": { 8 | "pack": "rm -rf answers; rm -rf node_modules && npm install && npm dedupe && node prepack && find . -type file | grep -v workshop.tar.gz | grep -v .git | tar -cvzf ./workshop.tar.gz -T - && node postpack", 9 | "test": "echo \"Error: no test specified\" && exit 1", 10 | "start": "node start.js" 11 | }, 12 | "authors": [ 13 | "Hugh Kennedy (http://hughsk.io/)", 14 | "Mikola Lysenko (http://0fps.net)", 15 | "Chris Dickinson (http://neversaw.us)" 16 | ], 17 | "homepage": "http://nodeschool.io/#shader-school", 18 | "repository": { 19 | "type": "git", 20 | "url": "https://github.com/stackgl/shader-school.git" 21 | }, 22 | "license": "ISC", 23 | "dependencies": { 24 | "a-big-triangle": "0.0.0", 25 | "apprise": "^1.0.0", 26 | "autoprefixer": "^1.2.0", 27 | "baboon-image": "^1.0.0", 28 | "beefy": "^2.0.2", 29 | "brfs": "^1.1.1", 30 | "browser-menu": "^0.1.0", 31 | "browserify": "^6.3.2", 32 | "canvas-fit": "0.0.0", 33 | "chalk": "^0.4.0", 34 | "clamp": "^1.0.0", 35 | "conway-hart": "^0.1.0", 36 | "domify": "^1.2.2", 37 | "ecstatic": "^1.0.1", 38 | "envify": "^1.2.1", 39 | "findup-element": "0.0.0", 40 | "frame-debounce": "0.0.0", 41 | "gl-axes": "^2.2.3", 42 | "gl-buffer": "^2.0.8", 43 | "gl-compare": "^1.0.0", 44 | "gl-compare-sidebar": "^1.1.1", 45 | "gl-context": "^0.1.0", 46 | "gl-fbo": "^1.1.2", 47 | "gl-fbo-matching": "^1.0.0", 48 | "gl-matrix": "^2.1.0", 49 | "gl-texture2d": "^1.2.0", 50 | "gl-vao": "^1.1.3", 51 | "glsldoc": "0.0.4", 52 | "glslify": "^1.5.0", 53 | "glslify-live": "^2.0.3", 54 | "google-fonts": "0.0.0", 55 | "highlight.js": "^8.0.0", 56 | "inquirer": "^0.5.1", 57 | "insert-css": "^0.1.1", 58 | "marked": "^0.3.2", 59 | "memoize-sync": "0.0.2", 60 | "mesh-normals": "^1.0.0", 61 | "mkdirp": "^0.5.0", 62 | "mouse-position": "^1.0.0", 63 | "mouse-pressed": "0.0.1", 64 | "ndarray": "^1.0.15", 65 | "ndarray-distance": "0.0.0", 66 | "opener": "^1.3.0", 67 | "quotemeta": "0.0.0", 68 | "raf": "^2.0.1", 69 | "remove-element": "0.0.0", 70 | "rework": "^0.20.3", 71 | "rework-inline": "^0.2.0", 72 | "rework-npm": "^0.6.1", 73 | "right-now": "^1.0.0", 74 | "sidenote": "^1.0.0", 75 | "sliced": "0.0.5", 76 | "stanford-dragon": "^1.0.0", 77 | "wordwrap": "0.0.2", 78 | "xhr": "^1.9.0", 79 | "zfill": "0.0.2" 80 | } 81 | } 82 | --------------------------------------------------------------------------------