UNPKG

@plotly/regl

Version:

regl is a fast functional WebGL framework.

1,606 lines (1,450 loc) 118 kB
var check = require('./util/check') var extend = require('./util/extend') var createEnvironment = require('./util/codegen') var loop = require('./util/loop') var isTypedArray = require('./util/is-typed-array') var isNDArray = require('./util/is-ndarray') var isArrayLike = require('./util/is-array-like') var dynamic = require('./dynamic') var primTypes = require('./constants/primitives.json') var glTypes = require('./constants/dtypes.json') // "cute" names for vector components var CUTE_COMPONENTS = 'xyzw'.split('') var GL_UNSIGNED_BYTE = 5121 var ATTRIB_STATE_POINTER = 1 var ATTRIB_STATE_CONSTANT = 2 var DYN_FUNC = 0 var DYN_PROP = 1 var DYN_CONTEXT = 2 var DYN_STATE = 3 var DYN_THUNK = 4 var DYN_CONSTANT = 5 var DYN_ARRAY = 6 var S_DITHER = 'dither' var S_BLEND_ENABLE = 'blend.enable' var S_BLEND_COLOR = 'blend.color' var S_BLEND_EQUATION = 'blend.equation' var S_BLEND_FUNC = 'blend.func' var S_DEPTH_ENABLE = 'depth.enable' var S_DEPTH_FUNC = 'depth.func' var S_DEPTH_RANGE = 'depth.range' var S_DEPTH_MASK = 'depth.mask' var S_COLOR_MASK = 'colorMask' var S_CULL_ENABLE = 'cull.enable' var S_CULL_FACE = 'cull.face' var S_FRONT_FACE = 'frontFace' var S_LINE_WIDTH = 'lineWidth' var S_POLYGON_OFFSET_ENABLE = 'polygonOffset.enable' var S_POLYGON_OFFSET_OFFSET = 'polygonOffset.offset' var S_SAMPLE_ALPHA = 'sample.alpha' var S_SAMPLE_ENABLE = 'sample.enable' var S_SAMPLE_COVERAGE = 'sample.coverage' var S_STENCIL_ENABLE = 'stencil.enable' var S_STENCIL_MASK = 'stencil.mask' var S_STENCIL_FUNC = 'stencil.func' var S_STENCIL_OPFRONT = 'stencil.opFront' var S_STENCIL_OPBACK = 'stencil.opBack' var S_SCISSOR_ENABLE = 'scissor.enable' var S_SCISSOR_BOX = 'scissor.box' var S_VIEWPORT = 'viewport' var S_PROFILE = 'profile' var S_FRAMEBUFFER = 'framebuffer' var S_VERT = 'vert' var S_FRAG = 'frag' var S_ELEMENTS = 'elements' var S_PRIMITIVE = 'primitive' var S_COUNT = 'count' var S_OFFSET = 'offset' var S_INSTANCES = 'instances' var S_VAO = 'vao' var SUFFIX_WIDTH = 'Width' var SUFFIX_HEIGHT = 'Height' var S_FRAMEBUFFER_WIDTH = S_FRAMEBUFFER + SUFFIX_WIDTH var S_FRAMEBUFFER_HEIGHT = S_FRAMEBUFFER + SUFFIX_HEIGHT var S_VIEWPORT_WIDTH = S_VIEWPORT + SUFFIX_WIDTH var S_VIEWPORT_HEIGHT = S_VIEWPORT + SUFFIX_HEIGHT var S_DRAWINGBUFFER = 'drawingBuffer' var S_DRAWINGBUFFER_WIDTH = S_DRAWINGBUFFER + SUFFIX_WIDTH var S_DRAWINGBUFFER_HEIGHT = S_DRAWINGBUFFER + SUFFIX_HEIGHT var NESTED_OPTIONS = [ S_BLEND_FUNC, S_BLEND_EQUATION, S_STENCIL_FUNC, S_STENCIL_OPFRONT, S_STENCIL_OPBACK, S_SAMPLE_COVERAGE, S_VIEWPORT, S_SCISSOR_BOX, S_POLYGON_OFFSET_OFFSET ] var GL_ARRAY_BUFFER = 34962 var GL_ELEMENT_ARRAY_BUFFER = 34963 var GL_FRAGMENT_SHADER = 35632 var GL_VERTEX_SHADER = 35633 var GL_TEXTURE_2D = 0x0DE1 var GL_TEXTURE_CUBE_MAP = 0x8513 var GL_CULL_FACE = 0x0B44 var GL_BLEND = 0x0BE2 var GL_DITHER = 0x0BD0 var GL_STENCIL_TEST = 0x0B90 var GL_DEPTH_TEST = 0x0B71 var GL_SCISSOR_TEST = 0x0C11 var GL_POLYGON_OFFSET_FILL = 0x8037 var GL_SAMPLE_ALPHA_TO_COVERAGE = 0x809E var GL_SAMPLE_COVERAGE = 0x80A0 var GL_FLOAT = 5126 var GL_FLOAT_VEC2 = 35664 var GL_FLOAT_VEC3 = 35665 var GL_FLOAT_VEC4 = 35666 var GL_INT = 5124 var GL_INT_VEC2 = 35667 var GL_INT_VEC3 = 35668 var GL_INT_VEC4 = 35669 var GL_BOOL = 35670 var GL_BOOL_VEC2 = 35671 var GL_BOOL_VEC3 = 35672 var GL_BOOL_VEC4 = 35673 var GL_FLOAT_MAT2 = 35674 var GL_FLOAT_MAT3 = 35675 var GL_FLOAT_MAT4 = 35676 var GL_SAMPLER_2D = 35678 var GL_SAMPLER_CUBE = 35680 var GL_TRIANGLES = 4 var GL_FRONT = 1028 var GL_BACK = 1029 var GL_CW = 0x0900 var GL_CCW = 0x0901 var GL_MIN_EXT = 0x8007 var GL_MAX_EXT = 0x8008 var GL_ALWAYS = 519 var GL_KEEP = 7680 var GL_ZERO = 0 var GL_ONE = 1 var GL_FUNC_ADD = 0x8006 var GL_LESS = 513 var GL_FRAMEBUFFER = 0x8D40 var GL_COLOR_ATTACHMENT0 = 0x8CE0 var blendFuncs = { '0': 0, '1': 1, 'zero': 0, 'one': 1, 'src color': 768, 'one minus src color': 769, 'src alpha': 770, 'one minus src alpha': 771, 'dst color': 774, 'one minus dst color': 775, 'dst alpha': 772, 'one minus dst alpha': 773, 'constant color': 32769, 'one minus constant color': 32770, 'constant alpha': 32771, 'one minus constant alpha': 32772, 'src alpha saturate': 776 } // There are invalid values for srcRGB and dstRGB. See: // https://www.khronos.org/registry/webgl/specs/1.0/#6.13 // https://github.com/KhronosGroup/WebGL/blob/0d3201f5f7ec3c0060bc1f04077461541f1987b9/conformance-suites/1.0.3/conformance/misc/webgl-specific.html#L56 var invalidBlendCombinations = [ 'constant color, constant alpha', 'one minus constant color, constant alpha', 'constant color, one minus constant alpha', 'one minus constant color, one minus constant alpha', 'constant alpha, constant color', 'constant alpha, one minus constant color', 'one minus constant alpha, constant color', 'one minus constant alpha, one minus constant color' ] var compareFuncs = { 'never': 512, 'less': 513, '<': 513, 'equal': 514, '=': 514, '==': 514, '===': 514, 'lequal': 515, '<=': 515, 'greater': 516, '>': 516, 'notequal': 517, '!=': 517, '!==': 517, 'gequal': 518, '>=': 518, 'always': 519 } var stencilOps = { '0': 0, 'zero': 0, 'keep': 7680, 'replace': 7681, 'increment': 7682, 'decrement': 7683, 'increment wrap': 34055, 'decrement wrap': 34056, 'invert': 5386 } var shaderType = { 'frag': GL_FRAGMENT_SHADER, 'vert': GL_VERTEX_SHADER } var orientationType = { 'cw': GL_CW, 'ccw': GL_CCW } function isBufferArgs (x) { return Array.isArray(x) || isTypedArray(x) || isNDArray(x) } // Make sure viewport is processed first function sortState (state) { return state.sort(function (a, b) { if (a === S_VIEWPORT) { return -1 } else if (b === S_VIEWPORT) { return 1 } return (a < b) ? -1 : 1 }) } function Declaration (thisDep, contextDep, propDep, append) { this.thisDep = thisDep this.contextDep = contextDep this.propDep = propDep this.append = append } function isStatic (decl) { return decl && !(decl.thisDep || decl.contextDep || decl.propDep) } function createStaticDecl (append) { return new Declaration(false, false, false, append) } function createDynamicDecl (dyn, append) { var type = dyn.type if (type === DYN_FUNC) { var numArgs = dyn.data.length return new Declaration( true, numArgs >= 1, numArgs >= 2, append) } else if (type === DYN_THUNK) { var data = dyn.data return new Declaration( data.thisDep, data.contextDep, data.propDep, append) } else if (type === DYN_CONSTANT) { return new Declaration( false, false, false, append) } else if (type === DYN_ARRAY) { var thisDep = false var contextDep = false var propDep = false for (var i = 0; i < dyn.data.length; ++i) { var subDyn = dyn.data[i] if (subDyn.type === DYN_PROP) { propDep = true } else if (subDyn.type === DYN_CONTEXT) { contextDep = true } else if (subDyn.type === DYN_STATE) { thisDep = true } else if (subDyn.type === DYN_FUNC) { thisDep = true var subArgs = subDyn.data if (subArgs >= 1) { contextDep = true } if (subArgs >= 2) { propDep = true } } else if (subDyn.type === DYN_THUNK) { thisDep = thisDep || subDyn.data.thisDep contextDep = contextDep || subDyn.data.contextDep propDep = propDep || subDyn.data.propDep } } return new Declaration( thisDep, contextDep, propDep, append) } else { return new Declaration( type === DYN_STATE, type === DYN_CONTEXT, type === DYN_PROP, append) } } var SCOPE_DECL = new Declaration(false, false, false, function () {}) module.exports = function reglCore ( gl, stringStore, extensions, limits, bufferState, elementState, textureState, framebufferState, uniformState, attributeState, shaderState, drawState, contextState, timer, cachedCode, config) { var AttributeRecord = attributeState.Record var blendEquations = { 'add': 32774, 'subtract': 32778, 'reverse subtract': 32779 } if (extensions.ext_blend_minmax) { blendEquations.min = GL_MIN_EXT blendEquations.max = GL_MAX_EXT } var extInstancing = extensions.angle_instanced_arrays var extDrawBuffers = extensions.webgl_draw_buffers var extVertexArrays = extensions.oes_vertex_array_object // =================================================== // =================================================== // WEBGL STATE // =================================================== // =================================================== var currentState = { dirty: true, profile: config.profile } var nextState = {} var GL_STATE_NAMES = [] var GL_FLAGS = {} var GL_VARIABLES = {} function propName (name) { return name.replace('.', '_') } function stateFlag (sname, cap, init) { var name = propName(sname) GL_STATE_NAMES.push(sname) nextState[name] = currentState[name] = !!init GL_FLAGS[name] = cap } function stateVariable (sname, func, init) { var name = propName(sname) GL_STATE_NAMES.push(sname) if (Array.isArray(init)) { currentState[name] = init.slice() nextState[name] = init.slice() } else { currentState[name] = nextState[name] = init } GL_VARIABLES[name] = func } function hasVariableReference (exp) { if (!isNaN(exp)) { return false; } // strengthen this function if variable values can be non-(null/number) literals. return true; } // Dithering stateFlag(S_DITHER, GL_DITHER) // Blending stateFlag(S_BLEND_ENABLE, GL_BLEND) stateVariable(S_BLEND_COLOR, 'blendColor', [0, 0, 0, 0]) stateVariable(S_BLEND_EQUATION, 'blendEquationSeparate', [GL_FUNC_ADD, GL_FUNC_ADD]) stateVariable(S_BLEND_FUNC, 'blendFuncSeparate', [GL_ONE, GL_ZERO, GL_ONE, GL_ZERO]) // Depth stateFlag(S_DEPTH_ENABLE, GL_DEPTH_TEST, true) stateVariable(S_DEPTH_FUNC, 'depthFunc', GL_LESS) stateVariable(S_DEPTH_RANGE, 'depthRange', [0, 1]) stateVariable(S_DEPTH_MASK, 'depthMask', true) // Color mask stateVariable(S_COLOR_MASK, S_COLOR_MASK, [true, true, true, true]) // Face culling stateFlag(S_CULL_ENABLE, GL_CULL_FACE) stateVariable(S_CULL_FACE, 'cullFace', GL_BACK) // Front face orientation stateVariable(S_FRONT_FACE, S_FRONT_FACE, GL_CCW) // Line width stateVariable(S_LINE_WIDTH, S_LINE_WIDTH, 1) // Polygon offset stateFlag(S_POLYGON_OFFSET_ENABLE, GL_POLYGON_OFFSET_FILL) stateVariable(S_POLYGON_OFFSET_OFFSET, 'polygonOffset', [0, 0]) // Sample coverage stateFlag(S_SAMPLE_ALPHA, GL_SAMPLE_ALPHA_TO_COVERAGE) stateFlag(S_SAMPLE_ENABLE, GL_SAMPLE_COVERAGE) stateVariable(S_SAMPLE_COVERAGE, 'sampleCoverage', [1, false]) // Stencil stateFlag(S_STENCIL_ENABLE, GL_STENCIL_TEST) stateVariable(S_STENCIL_MASK, 'stencilMask', -1) stateVariable(S_STENCIL_FUNC, 'stencilFunc', [GL_ALWAYS, 0, -1]) stateVariable(S_STENCIL_OPFRONT, 'stencilOpSeparate', [GL_FRONT, GL_KEEP, GL_KEEP, GL_KEEP]) stateVariable(S_STENCIL_OPBACK, 'stencilOpSeparate', [GL_BACK, GL_KEEP, GL_KEEP, GL_KEEP]) // Scissor stateFlag(S_SCISSOR_ENABLE, GL_SCISSOR_TEST) stateVariable(S_SCISSOR_BOX, 'scissor', [0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight]) // Viewport stateVariable(S_VIEWPORT, S_VIEWPORT, [0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight]) // =================================================== // =================================================== // ENVIRONMENT // =================================================== // =================================================== var sharedState = { gl: gl, context: contextState, strings: stringStore, next: nextState, current: currentState, draw: drawState, elements: elementState, buffer: bufferState, shader: shaderState, attributes: attributeState.state, vao: attributeState, uniforms: uniformState, framebuffer: framebufferState, extensions: extensions, timer: timer, isBufferArgs: isBufferArgs } var sharedConstants = { primTypes: primTypes, compareFuncs: compareFuncs, blendFuncs: blendFuncs, blendEquations: blendEquations, stencilOps: stencilOps, glTypes: glTypes, orientationType: orientationType } check.optional(function () { sharedState.isArrayLike = isArrayLike }) if (extDrawBuffers) { sharedConstants.backBuffer = [GL_BACK] sharedConstants.drawBuffer = loop(limits.maxDrawbuffers, function (i) { if (i === 0) { return [0] } return loop(i, function (j) { return GL_COLOR_ATTACHMENT0 + j }) }) } var drawCallCounter = 0 function createREGLEnvironment () { var env = createEnvironment({cache: cachedCode}) var link = env.link var global = env.global env.id = drawCallCounter++ env.batchId = '0' // link shared state var SHARED = link(sharedState) var shared = env.shared = { props: 'a0' } Object.keys(sharedState).forEach(function (prop) { shared[prop] = global.def(SHARED, '.', prop) }) // Inject runtime assertion stuff for debug builds check.optional(function () { env.CHECK = link(check) env.commandStr = check.guessCommand() env.command = link(env.commandStr) env.assert = function (block, pred, message) { block( 'if(!(', pred, '))', this.CHECK, '.commandRaise(', link(message), ',', this.command, ');') } sharedConstants.invalidBlendCombinations = invalidBlendCombinations }) // Copy GL state variables over var nextVars = env.next = {} var currentVars = env.current = {} Object.keys(GL_VARIABLES).forEach(function (variable) { if (Array.isArray(currentState[variable])) { nextVars[variable] = global.def(shared.next, '.', variable) currentVars[variable] = global.def(shared.current, '.', variable) } }) // Initialize shared constants var constants = env.constants = {} Object.keys(sharedConstants).forEach(function (name) { constants[name] = global.def(JSON.stringify(sharedConstants[name])) }) // Helper function for calling a block env.invoke = function (block, x) { switch (x.type) { case DYN_FUNC: var argList = [ 'this', shared.context, shared.props, env.batchId ] return block.def( link(x.data), '.call(', argList.slice(0, Math.max(x.data.length + 1, 4)), ')') case DYN_PROP: return block.def(shared.props, x.data) case DYN_CONTEXT: return block.def(shared.context, x.data) case DYN_STATE: return block.def('this', x.data) case DYN_THUNK: x.data.append(env, block) return x.data.ref case DYN_CONSTANT: return x.data.toString() case DYN_ARRAY: return x.data.map(function (y) { return env.invoke(block, y) }) } } env.attribCache = {} var scopeAttribs = {} env.scopeAttrib = function (name) { var id = stringStore.id(name) if (id in scopeAttribs) { return scopeAttribs[id] } var binding = attributeState.scope[id] if (!binding) { binding = attributeState.scope[id] = new AttributeRecord() } var result = scopeAttribs[id] = link(binding) return result } return env } // =================================================== // =================================================== // PARSING // =================================================== // =================================================== function parseProfile (options) { var staticOptions = options.static var dynamicOptions = options.dynamic var profileEnable if (S_PROFILE in staticOptions) { var value = !!staticOptions[S_PROFILE] profileEnable = createStaticDecl(function (env, scope) { return value }) profileEnable.enable = value } else if (S_PROFILE in dynamicOptions) { var dyn = dynamicOptions[S_PROFILE] profileEnable = createDynamicDecl(dyn, function (env, scope) { return env.invoke(scope, dyn) }) } return profileEnable } function parseFramebuffer (options, env) { var staticOptions = options.static var dynamicOptions = options.dynamic if (S_FRAMEBUFFER in staticOptions) { var framebuffer = staticOptions[S_FRAMEBUFFER] if (framebuffer) { framebuffer = framebufferState.getFramebuffer(framebuffer) check.command(framebuffer, 'invalid framebuffer object') return createStaticDecl(function (env, block) { var FRAMEBUFFER = env.link(framebuffer) var shared = env.shared block.set( shared.framebuffer, '.next', FRAMEBUFFER) var CONTEXT = shared.context block.set( CONTEXT, '.' + S_FRAMEBUFFER_WIDTH, FRAMEBUFFER + '.width') block.set( CONTEXT, '.' + S_FRAMEBUFFER_HEIGHT, FRAMEBUFFER + '.height') return FRAMEBUFFER }) } else { return createStaticDecl(function (env, scope) { var shared = env.shared scope.set( shared.framebuffer, '.next', 'null') var CONTEXT = shared.context scope.set( CONTEXT, '.' + S_FRAMEBUFFER_WIDTH, CONTEXT + '.' + S_DRAWINGBUFFER_WIDTH) scope.set( CONTEXT, '.' + S_FRAMEBUFFER_HEIGHT, CONTEXT + '.' + S_DRAWINGBUFFER_HEIGHT) return 'null' }) } } else if (S_FRAMEBUFFER in dynamicOptions) { var dyn = dynamicOptions[S_FRAMEBUFFER] return createDynamicDecl(dyn, function (env, scope) { var FRAMEBUFFER_FUNC = env.invoke(scope, dyn) var shared = env.shared var FRAMEBUFFER_STATE = shared.framebuffer var FRAMEBUFFER = scope.def( FRAMEBUFFER_STATE, '.getFramebuffer(', FRAMEBUFFER_FUNC, ')') check.optional(function () { env.assert(scope, '!' + FRAMEBUFFER_FUNC + '||' + FRAMEBUFFER, 'invalid framebuffer object') }) scope.set( FRAMEBUFFER_STATE, '.next', FRAMEBUFFER) var CONTEXT = shared.context scope.set( CONTEXT, '.' + S_FRAMEBUFFER_WIDTH, FRAMEBUFFER + '?' + FRAMEBUFFER + '.width:' + CONTEXT + '.' + S_DRAWINGBUFFER_WIDTH) scope.set( CONTEXT, '.' + S_FRAMEBUFFER_HEIGHT, FRAMEBUFFER + '?' + FRAMEBUFFER + '.height:' + CONTEXT + '.' + S_DRAWINGBUFFER_HEIGHT) return FRAMEBUFFER }) } else { return null } } function parseViewportScissor (options, framebuffer, env) { var staticOptions = options.static var dynamicOptions = options.dynamic function parseBox (param) { if (param in staticOptions) { var box = staticOptions[param] check.commandType(box, 'object', 'invalid ' + param, env.commandStr) var isStatic = true var x = box.x | 0 var y = box.y | 0 var w, h if ('width' in box) { w = box.width | 0 check.command(w >= 0, 'invalid ' + param, env.commandStr) } else { isStatic = false } if ('height' in box) { h = box.height | 0 check.command(h >= 0, 'invalid ' + param, env.commandStr) } else { isStatic = false } return new Declaration( !isStatic && framebuffer && framebuffer.thisDep, !isStatic && framebuffer && framebuffer.contextDep, !isStatic && framebuffer && framebuffer.propDep, function (env, scope) { var CONTEXT = env.shared.context var BOX_W = w if (!('width' in box)) { BOX_W = scope.def(CONTEXT, '.', S_FRAMEBUFFER_WIDTH, '-', x) } var BOX_H = h if (!('height' in box)) { BOX_H = scope.def(CONTEXT, '.', S_FRAMEBUFFER_HEIGHT, '-', y) } return [x, y, BOX_W, BOX_H] }) } else if (param in dynamicOptions) { var dynBox = dynamicOptions[param] var result = createDynamicDecl(dynBox, function (env, scope) { var BOX = env.invoke(scope, dynBox) check.optional(function () { env.assert(scope, BOX + '&&typeof ' + BOX + '==="object"', 'invalid ' + param) }) var CONTEXT = env.shared.context var BOX_X = scope.def(BOX, '.x|0') var BOX_Y = scope.def(BOX, '.y|0') var BOX_W = scope.def( '"width" in ', BOX, '?', BOX, '.width|0:', '(', CONTEXT, '.', S_FRAMEBUFFER_WIDTH, '-', BOX_X, ')') var BOX_H = scope.def( '"height" in ', BOX, '?', BOX, '.height|0:', '(', CONTEXT, '.', S_FRAMEBUFFER_HEIGHT, '-', BOX_Y, ')') check.optional(function () { env.assert(scope, BOX_W + '>=0&&' + BOX_H + '>=0', 'invalid ' + param) }) return [BOX_X, BOX_Y, BOX_W, BOX_H] }) if (framebuffer) { result.thisDep = result.thisDep || framebuffer.thisDep result.contextDep = result.contextDep || framebuffer.contextDep result.propDep = result.propDep || framebuffer.propDep } return result } else if (framebuffer) { return new Declaration( framebuffer.thisDep, framebuffer.contextDep, framebuffer.propDep, function (env, scope) { var CONTEXT = env.shared.context return [ 0, 0, scope.def(CONTEXT, '.', S_FRAMEBUFFER_WIDTH), scope.def(CONTEXT, '.', S_FRAMEBUFFER_HEIGHT)] }) } else { return null } } var viewport = parseBox(S_VIEWPORT) if (viewport) { var prevViewport = viewport viewport = new Declaration( viewport.thisDep, viewport.contextDep, viewport.propDep, function (env, scope) { var VIEWPORT = prevViewport.append(env, scope) var CONTEXT = env.shared.context scope.set( CONTEXT, '.' + S_VIEWPORT_WIDTH, VIEWPORT[2]) scope.set( CONTEXT, '.' + S_VIEWPORT_HEIGHT, VIEWPORT[3]) return VIEWPORT }) } return { viewport: viewport, scissor_box: parseBox(S_SCISSOR_BOX) } } function parseAttribLocations (options, attributes) { var staticOptions = options.static var staticProgram = typeof staticOptions[S_FRAG] === 'string' && typeof staticOptions[S_VERT] === 'string' if (staticProgram) { if (Object.keys(attributes.dynamic).length > 0) { return null } var staticAttributes = attributes.static var sAttributes = Object.keys(staticAttributes) if (sAttributes.length > 0 && typeof staticAttributes[sAttributes[0]] === 'number') { var bindings = [] for (var i = 0; i < sAttributes.length; ++i) { check(typeof staticAttributes[sAttributes[i]] === 'number', 'must specify all vertex attribute locations when using vaos') bindings.push([staticAttributes[sAttributes[i]] | 0, sAttributes[i]]) } return bindings } } return null } function parseProgram (options, env, attribLocations) { var staticOptions = options.static var dynamicOptions = options.dynamic function parseShader (name) { if (name in staticOptions) { var id = stringStore.id(staticOptions[name]) check.optional(function () { shaderState.shader(shaderType[name], id, check.guessCommand()) }) var result = createStaticDecl(function () { return id }) result.id = id return result } else if (name in dynamicOptions) { var dyn = dynamicOptions[name] return createDynamicDecl(dyn, function (env, scope) { var str = env.invoke(scope, dyn) var id = scope.def(env.shared.strings, '.id(', str, ')') check.optional(function () { scope( env.shared.shader, '.shader(', shaderType[name], ',', id, ',', env.command, ');') }) return id }) } return null } var frag = parseShader(S_FRAG) var vert = parseShader(S_VERT) var program = null var progVar if (isStatic(frag) && isStatic(vert)) { program = shaderState.program(vert.id, frag.id, null, attribLocations) progVar = createStaticDecl(function (env, scope) { return env.link(program) }) } else { progVar = new Declaration( (frag && frag.thisDep) || (vert && vert.thisDep), (frag && frag.contextDep) || (vert && vert.contextDep), (frag && frag.propDep) || (vert && vert.propDep), function (env, scope) { var SHADER_STATE = env.shared.shader var fragId if (frag) { fragId = frag.append(env, scope) } else { fragId = scope.def(SHADER_STATE, '.', S_FRAG) } var vertId if (vert) { vertId = vert.append(env, scope) } else { vertId = scope.def(SHADER_STATE, '.', S_VERT) } var progDef = SHADER_STATE + '.program(' + vertId + ',' + fragId check.optional(function () { progDef += ',' + env.command }) return scope.def(progDef + ')') }) } return { frag: frag, vert: vert, progVar: progVar, program: program } } function parseDraw (options, env) { var staticOptions = options.static var dynamicOptions = options.dynamic // TODO: should use VAO to get default values for offset properties // should move vao parse into here and out of the old stuff var staticDraw = {} var vaoActive = false function parseVAO () { if (S_VAO in staticOptions) { var vao = staticOptions[S_VAO] if (vao !== null && attributeState.getVAO(vao) === null) { vao = attributeState.createVAO(vao) } vaoActive = true staticDraw.vao = vao return createStaticDecl(function (env) { var vaoRef = attributeState.getVAO(vao) if (vaoRef) { return env.link(vaoRef) } else { return 'null' } }) } else if (S_VAO in dynamicOptions) { vaoActive = true var dyn = dynamicOptions[S_VAO] return createDynamicDecl(dyn, function (env, scope) { var vaoRef = env.invoke(scope, dyn) return scope.def(env.shared.vao + '.getVAO(' + vaoRef + ')') }) } return null } var vao = parseVAO() var elementsActive = false function parseElements () { if (S_ELEMENTS in staticOptions) { var elements = staticOptions[S_ELEMENTS] staticDraw.elements = elements if (isBufferArgs(elements)) { var e = staticDraw.elements = elementState.create(elements, true) elements = elementState.getElements(e) elementsActive = true } else if (elements) { elements = elementState.getElements(elements) elementsActive = true check.command(elements, 'invalid elements', env.commandStr) } var result = createStaticDecl(function (env, scope) { if (elements) { var result = env.link(elements) env.ELEMENTS = result return result } env.ELEMENTS = null return null }) result.value = elements return result } else if (S_ELEMENTS in dynamicOptions) { elementsActive = true var dyn = dynamicOptions[S_ELEMENTS] return createDynamicDecl(dyn, function (env, scope) { var shared = env.shared var IS_BUFFER_ARGS = shared.isBufferArgs var ELEMENT_STATE = shared.elements var elementDefn = env.invoke(scope, dyn) var elements = scope.def('null') var elementStream = scope.def(IS_BUFFER_ARGS, '(', elementDefn, ')') var ifte = env.cond(elementStream) .then(elements, '=', ELEMENT_STATE, '.createStream(', elementDefn, ');') .else(elements, '=', ELEMENT_STATE, '.getElements(', elementDefn, ');') check.optional(function () { env.assert(ifte.else, '!' + elementDefn + '||' + elements, 'invalid elements') }) scope.entry(ifte) scope.exit( env.cond(elementStream) .then(ELEMENT_STATE, '.destroyStream(', elements, ');')) env.ELEMENTS = elements return elements }) } else if (vaoActive) { return new Declaration( vao.thisDep, vao.contextDep, vao.propDep, function (env, scope) { return scope.def(env.shared.vao + '.currentVAO?' + env.shared.elements + '.getElements(' + env.shared.vao + '.currentVAO.elements):null') }) } return null } var elements = parseElements() function parsePrimitive () { if (S_PRIMITIVE in staticOptions) { var primitive = staticOptions[S_PRIMITIVE] staticDraw.primitive = primitive check.commandParameter(primitive, primTypes, 'invalid primitve', env.commandStr) return createStaticDecl(function (env, scope) { return primTypes[primitive] }) } else if (S_PRIMITIVE in dynamicOptions) { var dynPrimitive = dynamicOptions[S_PRIMITIVE] return createDynamicDecl(dynPrimitive, function (env, scope) { var PRIM_TYPES = env.constants.primTypes var prim = env.invoke(scope, dynPrimitive) check.optional(function () { env.assert(scope, prim + ' in ' + PRIM_TYPES, 'invalid primitive, must be one of ' + Object.keys(primTypes)) }) return scope.def(PRIM_TYPES, '[', prim, ']') }) } else if (elementsActive) { if (isStatic(elements)) { if (elements.value) { return createStaticDecl(function (env, scope) { return scope.def(env.ELEMENTS, '.primType') }) } else { return createStaticDecl(function () { return GL_TRIANGLES }) } } else { return new Declaration( elements.thisDep, elements.contextDep, elements.propDep, function (env, scope) { var elements = env.ELEMENTS return scope.def(elements, '?', elements, '.primType:', GL_TRIANGLES) }) } } else if (vaoActive) { return new Declaration( vao.thisDep, vao.contextDep, vao.propDep, function (env, scope) { return scope.def(env.shared.vao + '.currentVAO?' + env.shared.vao + '.currentVAO.primitive:' + GL_TRIANGLES) }) } return null } function parseParam (param, isOffset) { if (param in staticOptions) { var value = staticOptions[param] | 0 if (isOffset) { staticDraw.offset = value } else { staticDraw.instances = value } check.command(!isOffset || value >= 0, 'invalid ' + param, env.commandStr) return createStaticDecl(function (env, scope) { if (isOffset) { env.OFFSET = value } return value }) } else if (param in dynamicOptions) { var dynValue = dynamicOptions[param] return createDynamicDecl(dynValue, function (env, scope) { var result = env.invoke(scope, dynValue) if (isOffset) { env.OFFSET = result check.optional(function () { env.assert(scope, result + '>=0', 'invalid ' + param) }) } return result }) } else if (isOffset) { if (elementsActive) { return createStaticDecl(function (env, scope) { env.OFFSET = 0 return 0 }) } else if (vaoActive) { return new Declaration( vao.thisDep, vao.contextDep, vao.propDep, function (env, scope) { return scope.def(env.shared.vao + '.currentVAO?' + env.shared.vao + '.currentVAO.offset:0') }) } } else if (vaoActive) { return new Declaration( vao.thisDep, vao.contextDep, vao.propDep, function (env, scope) { return scope.def(env.shared.vao + '.currentVAO?' + env.shared.vao + '.currentVAO.instances:-1') }) } return null } var OFFSET = parseParam(S_OFFSET, true) function parseVertCount () { if (S_COUNT in staticOptions) { var count = staticOptions[S_COUNT] | 0 staticDraw.count = count check.command( typeof count === 'number' && count >= 0, 'invalid vertex count', env.commandStr) return createStaticDecl(function () { return count }) } else if (S_COUNT in dynamicOptions) { var dynCount = dynamicOptions[S_COUNT] return createDynamicDecl(dynCount, function (env, scope) { var result = env.invoke(scope, dynCount) check.optional(function () { env.assert(scope, 'typeof ' + result + '==="number"&&' + result + '>=0&&' + result + '===(' + result + '|0)', 'invalid vertex count') }) return result }) } else if (elementsActive) { if (isStatic(elements)) { if (elements) { if (OFFSET) { return new Declaration( OFFSET.thisDep, OFFSET.contextDep, OFFSET.propDep, function (env, scope) { var result = scope.def( env.ELEMENTS, '.vertCount-', env.OFFSET) check.optional(function () { env.assert(scope, result + '>=0', 'invalid vertex offset/element buffer too small') }) return result }) } else { return createStaticDecl(function (env, scope) { return scope.def(env.ELEMENTS, '.vertCount') }) } } else { var result = createStaticDecl(function () { return -1 }) check.optional(function () { result.MISSING = true }) return result } } else { var variable = new Declaration( elements.thisDep || OFFSET.thisDep, elements.contextDep || OFFSET.contextDep, elements.propDep || OFFSET.propDep, function (env, scope) { var elements = env.ELEMENTS if (env.OFFSET) { return scope.def(elements, '?', elements, '.vertCount-', env.OFFSET, ':-1') } return scope.def(elements, '?', elements, '.vertCount:-1') }) check.optional(function () { variable.DYNAMIC = true }) return variable } } else if (vaoActive) { var countVariable = new Declaration( vao.thisDep, vao.contextDep, vao.propDep, function (env, scope) { return scope.def(env.shared.vao, '.currentVAO?', env.shared.vao, '.currentVAO.count:-1') }) return countVariable } return null } var primitive = parsePrimitive() var count = parseVertCount() var instances = parseParam(S_INSTANCES, false) return { elements: elements, primitive: primitive, count: count, instances: instances, offset: OFFSET, vao: vao, vaoActive: vaoActive, elementsActive: elementsActive, // static draw props static: staticDraw } } function parseGLState (options, env) { var staticOptions = options.static var dynamicOptions = options.dynamic var STATE = {} GL_STATE_NAMES.forEach(function (prop) { var param = propName(prop) function parseParam (parseStatic, parseDynamic) { if (prop in staticOptions) { var value = parseStatic(staticOptions[prop]) STATE[param] = createStaticDecl(function () { return value }) } else if (prop in dynamicOptions) { var dyn = dynamicOptions[prop] STATE[param] = createDynamicDecl(dyn, function (env, scope) { return parseDynamic(env, scope, env.invoke(scope, dyn)) }) } } switch (prop) { case S_CULL_ENABLE: case S_BLEND_ENABLE: case S_DITHER: case S_STENCIL_ENABLE: case S_DEPTH_ENABLE: case S_SCISSOR_ENABLE: case S_POLYGON_OFFSET_ENABLE: case S_SAMPLE_ALPHA: case S_SAMPLE_ENABLE: case S_DEPTH_MASK: return parseParam( function (value) { check.commandType(value, 'boolean', prop, env.commandStr) return value }, function (env, scope, value) { check.optional(function () { env.assert(scope, 'typeof ' + value + '==="boolean"', 'invalid flag ' + prop, env.commandStr) }) return value }) case S_DEPTH_FUNC: return parseParam( function (value) { check.commandParameter(value, compareFuncs, 'invalid ' + prop, env.commandStr) return compareFuncs[value] }, function (env, scope, value) { var COMPARE_FUNCS = env.constants.compareFuncs check.optional(function () { env.assert(scope, value + ' in ' + COMPARE_FUNCS, 'invalid ' + prop + ', must be one of ' + Object.keys(compareFuncs)) }) return scope.def(COMPARE_FUNCS, '[', value, ']') }) case S_DEPTH_RANGE: return parseParam( function (value) { check.command( isArrayLike(value) && value.length === 2 && typeof value[0] === 'number' && typeof value[1] === 'number' && value[0] <= value[1], 'depth range is 2d array', env.commandStr) return value }, function (env, scope, value) { check.optional(function () { env.assert(scope, env.shared.isArrayLike + '(' + value + ')&&' + value + '.length===2&&' + 'typeof ' + value + '[0]==="number"&&' + 'typeof ' + value + '[1]==="number"&&' + value + '[0]<=' + value + '[1]', 'depth range must be a 2d array') }) var Z_NEAR = scope.def('+', value, '[0]') var Z_FAR = scope.def('+', value, '[1]') return [Z_NEAR, Z_FAR] }) case S_BLEND_FUNC: return parseParam( function (value) { check.commandType(value, 'object', 'blend.func', env.commandStr) var srcRGB = ('srcRGB' in value ? value.srcRGB : value.src) var srcAlpha = ('srcAlpha' in value ? value.srcAlpha : value.src) var dstRGB = ('dstRGB' in value ? value.dstRGB : value.dst) var dstAlpha = ('dstAlpha' in value ? value.dstAlpha : value.dst) check.commandParameter(srcRGB, blendFuncs, param + '.srcRGB', env.commandStr) check.commandParameter(srcAlpha, blendFuncs, param + '.srcAlpha', env.commandStr) check.commandParameter(dstRGB, blendFuncs, param + '.dstRGB', env.commandStr) check.commandParameter(dstAlpha, blendFuncs, param + '.dstAlpha', env.commandStr) check.command( (invalidBlendCombinations.indexOf(srcRGB + ', ' + dstRGB) === -1), 'unallowed blending combination (srcRGB, dstRGB) = (' + srcRGB + ', ' + dstRGB + ')', env.commandStr) return [ blendFuncs[srcRGB], blendFuncs[dstRGB], blendFuncs[srcAlpha], blendFuncs[dstAlpha] ] }, function (env, scope, value) { var BLEND_FUNCS = env.constants.blendFuncs check.optional(function () { env.assert(scope, value + '&&typeof ' + value + '==="object"', 'invalid blend func, must be an object') }) function read (prefix, suffix) { var func = scope.def( '"', prefix, suffix, '" in ', value, '?', value, '.', prefix, suffix, ':', value, '.', prefix) check.optional(function () { env.assert(scope, func + ' in ' + BLEND_FUNCS, 'invalid ' + prop + '.' + prefix + suffix + ', must be one of ' + Object.keys(blendFuncs)) }) return func } var srcRGB = read('src', 'RGB') var dstRGB = read('dst', 'RGB') check.optional(function () { var INVALID_BLEND_COMBINATIONS = env.constants.invalidBlendCombinations env.assert(scope, INVALID_BLEND_COMBINATIONS + '.indexOf(' + srcRGB + '+", "+' + dstRGB + ') === -1 ', 'unallowed blending combination for (srcRGB, dstRGB)' ) }) var SRC_RGB = scope.def(BLEND_FUNCS, '[', srcRGB, ']') var SRC_ALPHA = scope.def(BLEND_FUNCS, '[', read('src', 'Alpha'), ']') var DST_RGB = scope.def(BLEND_FUNCS, '[', dstRGB, ']') var DST_ALPHA = scope.def(BLEND_FUNCS, '[', read('dst', 'Alpha'), ']') return [SRC_RGB, DST_RGB, SRC_ALPHA, DST_ALPHA] }) case S_BLEND_EQUATION: return parseParam( function (value) { if (typeof value === 'string') { check.commandParameter(value, blendEquations, 'invalid ' + prop, env.commandStr) return [ blendEquations[value], blendEquations[value] ] } else if (typeof value === 'object') { check.commandParameter( value.rgb, blendEquations, prop + '.rgb', env.commandStr) check.commandParameter( value.alpha, blendEquations, prop + '.alpha', env.commandStr) return [ blendEquations[value.rgb], blendEquations[value.alpha] ] } else { check.commandRaise('invalid blend.equation', env.commandStr) } }, function (env, scope, value) { var BLEND_EQUATIONS = env.constants.blendEquations var RGB = scope.def() var ALPHA = scope.def() var ifte = env.cond('typeof ', value, '==="string"') check.optional(function () { function checkProp (block, name, value) { env.assert(block, value + ' in ' + BLEND_EQUATIONS, 'invalid ' + name + ', must be one of ' + Object.keys(blendEquations)) } checkProp(ifte.then, prop, value) env.assert(ifte.else, value + '&&typeof ' + value + '==="object"', 'invalid ' + prop) checkProp(ifte.else, prop + '.rgb', value + '.rgb') checkProp(ifte.else, prop + '.alpha', value + '.alpha') }) ifte.then( RGB, '=', ALPHA, '=', BLEND_EQUATIONS, '[', value, '];') ifte.else( RGB, '=', BLEND_EQUATIONS, '[', value, '.rgb];', ALPHA, '=', BLEND_EQUATIONS, '[', value, '.alpha];') scope(ifte) return [RGB, ALPHA] }) case S_BLEND_COLOR: return parseParam( function (value) { check.command( isArrayLike(value) && value.length === 4, 'blend.color must be a 4d array', env.commandStr) return loop(4, function (i) { return +value[i] }) }, function (env, scope, value) { check.optional(function () { env.assert(scope, env.shared.isArrayLike + '(' + value + ')&&' + value + '.length===4', 'blend.color must be a 4d array') }) return loop(4, function (i) { return scope.def('+', value, '[', i, ']') }) }) case S_STENCIL_MASK: return parseParam( function (value) { check.commandType(value, 'number', param, env.commandStr) return value | 0 }, function (env, scope, value) { check.optional(function () { env.assert(scope, 'typeof ' + value + '==="number"', 'invalid stencil.mask') }) return scope.def(value, '|0') }) case S_STENCIL_FUNC: return parseParam( function (value) { check.commandType(value, 'object', param, env.commandStr) var cmp = value.cmp || 'keep' var ref = value.ref || 0 var mask = 'mask' in value ? value.mask : -1 check.commandParameter(cmp, compareFuncs, prop + '.cmp', env.commandStr) check.commandType(ref, 'number', prop + '.ref', env.commandStr) check.commandType(mask, 'number', prop + '.mask', env.commandStr) return [ compareFuncs[cmp], ref, mask ] }, function (env, scope, value) { var COMPARE_FUNCS = env.constants.compareFuncs check.optional(function () { function assert () { env.assert(scope, Array.prototype.join.call(arguments, ''), 'invalid stencil.func') } assert(value + '&&typeof ', value, '==="object"') assert('!("cmp" in ', value, ')||(', value, '.cmp in ', COMPARE_FUNCS, ')') }) var cmp = scope.def( '"cmp" in ', value, '?', COMPARE_FUNCS, '[', value, '.cmp]', ':', GL_KEEP) var ref = scope.def(value, '.ref|0') var mask = scope.def( '"mask" in ', value, '?', value, '.mask|0:-1') return [cmp, ref, mask] }) case S_STENCIL_OPFRONT: case S_STENCIL_OPBACK: return parseParam( function (value) { check.commandType(value, 'object', param, env.commandStr) var fail = value.fail || 'keep' var zfail = value.zfail || 'keep' var zpass = value.zpass || 'keep' check.commandParameter(fail, stencilOps, prop + '.fail', env.commandStr) check.commandParameter(zfail, stencilOps, prop + '.zfail', env.commandStr) check.commandParameter(zpass, stencilOps, prop + '.zpass', env.commandStr) return [ prop === S_STENCIL_OPBACK ? GL_BACK : GL_FRONT, stencilOps[fail], stencilOps[zfail], stencilOps[zpass] ] }, function (env, scope, value) { var STENCIL_OPS = env.constants.stencilOps check.optional(function () { env.assert(scope, value + '&&typeof ' + value + '==="object"', 'invalid ' + prop) }) function read (name) { check.optional(function () { env.assert(scope, '!("' + name + '" in ' + value + ')||' + '(' + value + '.' + name + ' in ' + STENCIL_OPS + ')', 'invalid ' + prop + '.' + name + ', must be one of ' + Object.keys(stencilOps)) }) return scope.def( '"', name, '" in ', value, '?', STENCIL_OPS, '['