render-item.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251
  1. /**
  2. * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
  3. *
  4. * @author Alexander Rose <alexander.rose@weirdbyte.de>
  5. */
  6. import { createAttributeBuffers, createElementsBuffer, ElementsBuffer, createAttributeBuffer, ArrayKind } from './buffer';
  7. import { createTextures } from './texture';
  8. import { Context } from './context';
  9. import { ShaderCode } from '../shader-code';
  10. import { Program } from './program';
  11. import { RenderableSchema, RenderableValues, AttributeSpec, getValueVersions, splitValues, Values } from '../renderable/schema';
  12. import { idFactory } from 'mol-util/id-factory';
  13. import { deleteVertexArray, createVertexArray } from './vertex-array';
  14. import { ValueCell } from 'mol-util';
  15. import { ReferenceItem } from 'mol-util/reference-cache';
  16. const getNextRenderItemId = idFactory()
  17. export type DrawMode = 'points' | 'lines' | 'line-strip' | 'line-loop' | 'triangles' | 'triangle-strip' | 'triangle-fan'
  18. export function getDrawMode(ctx: Context, drawMode: DrawMode) {
  19. const { gl } = ctx
  20. switch (drawMode) {
  21. case 'points': return gl.POINTS
  22. case 'lines': return gl.LINES
  23. case 'line-strip': return gl.LINE_STRIP
  24. case 'line-loop': return gl.LINE_LOOP
  25. case 'triangles': return gl.TRIANGLES
  26. case 'triangle-strip': return gl.TRIANGLE_STRIP
  27. case 'triangle-fan': return gl.TRIANGLE_FAN
  28. }
  29. }
  30. export interface RenderItem {
  31. readonly id: number
  32. getProgram: (variant: RenderVariant) => Program
  33. render: (variant: RenderVariant) => void
  34. update: () => Readonly<ValueChanges>
  35. destroy: () => void
  36. }
  37. const RenderVariantDefines = {
  38. 'draw': {},
  39. 'pickObject': { dColorType: ValueCell.create('objectPicking') },
  40. 'pickInstance': { dColorType: ValueCell.create('instancePicking') },
  41. 'pickGroup': { dColorType: ValueCell.create('groupPicking') }
  42. }
  43. export type RenderVariant = keyof typeof RenderVariantDefines
  44. type ProgramVariants = { [k: string]: ReferenceItem<Program> }
  45. type VertexArrayVariants = { [k: string]: WebGLVertexArrayObjectOES | null }
  46. interface ValueChanges {
  47. attributes: boolean
  48. defines: boolean
  49. elements: boolean
  50. textures: boolean
  51. uniforms: boolean
  52. }
  53. // TODO make `RenderVariantDefines` a parameter for `createRenderItem`
  54. /**
  55. * Creates a render item
  56. *
  57. * - assumes that `values.drawCount` and `values.instanceCount` exist
  58. */
  59. export function createRenderItem(ctx: Context, drawMode: DrawMode, shaderCode: ShaderCode, schema: RenderableSchema, values: RenderableValues): RenderItem {
  60. const id = getNextRenderItemId()
  61. const { programCache } = ctx
  62. const { instancedArrays, vertexArrayObject } = ctx.extensions
  63. const { attributeValues, defineValues, textureValues, uniformValues } = splitValues(schema, values)
  64. const versions = getValueVersions(values)
  65. const glDrawMode = getDrawMode(ctx, drawMode)
  66. const programs: ProgramVariants = {}
  67. Object.keys(RenderVariantDefines).forEach(k => {
  68. const variantDefineValues: Values<RenderableSchema> = (RenderVariantDefines as any)[k]
  69. programs[k] = programCache.get(ctx, {
  70. defineValues: { ...defineValues, ...variantDefineValues },
  71. shaderCode,
  72. schema
  73. })
  74. })
  75. const textures = createTextures(ctx, schema, textureValues)
  76. const attributeBuffers = createAttributeBuffers(ctx, schema, attributeValues)
  77. let elementsBuffer: ElementsBuffer | undefined
  78. const elements = values.elements
  79. if (elements && elements.ref.value) {
  80. elementsBuffer = createElementsBuffer(ctx, elements.ref.value)
  81. }
  82. const vertexArrays: VertexArrayVariants = {}
  83. Object.keys(RenderVariantDefines).forEach(k => {
  84. vertexArrays[k] = createVertexArray(ctx, programs[k].value, attributeBuffers, elementsBuffer)
  85. })
  86. let drawCount = values.drawCount.ref.value
  87. let instanceCount = values.instanceCount.ref.value
  88. ctx.drawCount += drawCount
  89. ctx.instanceCount += instanceCount
  90. ctx.instancedDrawCount += instanceCount * drawCount
  91. const valueChanges: ValueChanges = {
  92. attributes: false,
  93. defines: false,
  94. elements: false,
  95. textures: false,
  96. uniforms: false
  97. }
  98. let destroyed = false
  99. return {
  100. id,
  101. getProgram: (variant: RenderVariant) => programs[variant].value,
  102. render: (variant: RenderVariant) => {
  103. if (drawCount === 0 || instanceCount === 0) return
  104. const program = programs[variant].value
  105. const vertexArray = vertexArrays[variant]
  106. program.setUniforms(uniformValues)
  107. if (vertexArrayObject && vertexArray) {
  108. vertexArrayObject.bindVertexArray(vertexArray)
  109. // need to bind elements buffer explicitely since it is not always recorded in the VAO
  110. if (elementsBuffer) elementsBuffer.bind()
  111. } else {
  112. if (elementsBuffer) elementsBuffer.bind()
  113. program.bindAttributes(attributeBuffers)
  114. }
  115. program.bindTextures(textures)
  116. if (elementsBuffer) {
  117. instancedArrays.drawElementsInstanced(glDrawMode, drawCount, elementsBuffer._dataType, 0, instanceCount);
  118. } else {
  119. instancedArrays.drawArraysInstanced(glDrawMode, 0, drawCount, instanceCount)
  120. }
  121. },
  122. update: () => {
  123. valueChanges.defines = false
  124. Object.keys(defineValues).forEach(k => {
  125. const value = defineValues[k]
  126. if (value.ref.version !== versions[k]) {
  127. // console.log('define version changed', k)
  128. valueChanges.defines = true
  129. versions[k] = value.ref.version
  130. }
  131. })
  132. if (valueChanges.defines) {
  133. // console.log('some defines changed, need to rebuild programs')
  134. Object.keys(RenderVariantDefines).forEach(k => {
  135. const variantDefineValues: Values<RenderableSchema> = (RenderVariantDefines as any)[k]
  136. programs[k].free()
  137. programs[k] = programCache.get(ctx, {
  138. defineValues: { ...defineValues, ...variantDefineValues },
  139. shaderCode,
  140. schema
  141. })
  142. })
  143. }
  144. if (values.drawCount.ref.version !== versions.drawCount) {
  145. // console.log('drawCount version changed')
  146. ctx.drawCount += values.drawCount.ref.value - drawCount
  147. ctx.instancedDrawCount += instanceCount * values.drawCount.ref.value - instanceCount * drawCount
  148. drawCount = values.drawCount.ref.value
  149. versions.drawCount = values.drawCount.ref.version
  150. }
  151. if (values.instanceCount.ref.version !== versions.instanceCount) {
  152. // console.log('instanceCount version changed')
  153. ctx.instanceCount += values.instanceCount.ref.value - instanceCount
  154. ctx.instancedDrawCount += values.instanceCount.ref.value * drawCount - instanceCount * drawCount
  155. instanceCount = values.instanceCount.ref.value
  156. versions.instanceCount = values.instanceCount.ref.version
  157. }
  158. valueChanges.attributes = false
  159. Object.keys(attributeValues).forEach(k => {
  160. const value = attributeValues[k]
  161. if (value.ref.version !== versions[k]) {
  162. const buffer = attributeBuffers[k]
  163. if (buffer.length >= value.ref.value.length) {
  164. // console.log('attribute array large enough to update', k, value.ref.id, value.ref.version)
  165. attributeBuffers[k].updateData(value.ref.value)
  166. } else {
  167. // console.log('attribute array to small, need to create new attribute', k, value.ref.id, value.ref.version)
  168. attributeBuffers[k].destroy()
  169. const { itemSize, divisor } = schema[k] as AttributeSpec<ArrayKind>
  170. attributeBuffers[k] = createAttributeBuffer(ctx, value.ref.value, itemSize, divisor)
  171. valueChanges.attributes = true
  172. }
  173. versions[k] = value.ref.version
  174. }
  175. })
  176. valueChanges.elements = false
  177. if (elementsBuffer && values.elements.ref.version !== versions.elements) {
  178. if (elementsBuffer.length >= values.elements.ref.value.length) {
  179. // console.log('elements array large enough to update', values.elements.ref.id, values.elements.ref.version)
  180. elementsBuffer.updateData(values.elements.ref.value)
  181. } else {
  182. // console.log('elements array to small, need to create new elements', values.elements.ref.id, values.elements.ref.version)
  183. elementsBuffer.destroy()
  184. elementsBuffer = createElementsBuffer(ctx, values.elements.ref.value)
  185. valueChanges.elements = true
  186. }
  187. versions.elements = values.elements.ref.version
  188. }
  189. if (valueChanges.attributes || valueChanges.defines || valueChanges.elements) {
  190. // console.log('program/defines or buffers changed, rebuild vaos')
  191. Object.keys(RenderVariantDefines).forEach(k => {
  192. deleteVertexArray(ctx, vertexArrays[k])
  193. vertexArrays[k] = createVertexArray(ctx, programs[k].value, attributeBuffers, elementsBuffer)
  194. })
  195. }
  196. valueChanges.textures = false
  197. Object.keys(textureValues).forEach(k => {
  198. const value = textureValues[k]
  199. if (value.ref.version !== versions[k]) {
  200. // console.log('texture version changed, uploading image', k)
  201. textures[k].load(value.ref.value)
  202. versions[k] = value.ref.version
  203. valueChanges.textures = true
  204. }
  205. })
  206. return valueChanges
  207. },
  208. destroy: () => {
  209. if (!destroyed) {
  210. Object.keys(RenderVariantDefines).forEach(k => {
  211. programs[k].free()
  212. deleteVertexArray(ctx, vertexArrays[k])
  213. })
  214. Object.keys(textures).forEach(k => textures[k].destroy())
  215. Object.keys(attributeBuffers).forEach(k => attributeBuffers[k].destroy())
  216. if (elementsBuffer) elementsBuffer.destroy()
  217. destroyed = true
  218. }
  219. }
  220. }
  221. }