diff --git a/src/apps/image-generator/index.ts b/src/apps/image-generator/index.ts
index 6224bc0317f07ccd82cbf1401bdce4b92d242c0c..0b54b2af3b37d6a655d32a0f149a4b6c356a9690 100644
--- a/src/apps/image-generator/index.ts
+++ b/src/apps/image-generator/index.ts
@@ -19,8 +19,8 @@ import { Model, Structure } from 'mol-model/structure';
import { ajaxGet } from 'mol-util/data-source';
import { ColorNames } from 'mol-util/color/tables';
-const width = 1024
-const height = 768
+const width = 2048
+const height = 1536
const gl = createContext(width, height, {
alpha: false,
antialias: true,
@@ -104,7 +104,7 @@ async function run(id: string, out: string) {
}
setTimeout(() => {
- const pixelData = canvas3d.getPixelData('draw')
+ const pixelData = canvas3d.getPixelData('color')
const png = new PNG({ width, height })
png.data = Buffer.from(pixelData.array)
png.pack().pipe(fs.createWriteStream(out)).on('finish', () => {
diff --git a/src/mol-canvas3d/canvas3d.ts b/src/mol-canvas3d/canvas3d.ts
index 0d9d56c3220f7ce4292e4d6472aa7c16f3a571fb..4b8be2239ab5f999b637c93d8f288c332647252d 100644
--- a/src/mol-canvas3d/canvas3d.ts
+++ b/src/mol-canvas3d/canvas3d.ts
@@ -130,16 +130,16 @@ namespace Canvas3D {
const controls = TrackballControls.create(input, camera, p.trackball)
const renderer = Renderer.create(webgl, camera, p.renderer)
- const drawTarget = createRenderTarget(webgl, width, height)
+ const colorTarget = createRenderTarget(webgl, width, height)
const depthTarget = webgl.extensions.depthTexture ? null : createRenderTarget(webgl, width, height)
const depthTexture = depthTarget ? depthTarget.texture : createTexture(webgl, 'image-depth', 'depth', 'ushort', 'nearest')
if (!depthTarget) {
depthTexture.define(width, height)
- depthTexture.attachFramebuffer(drawTarget.framebuffer, 'depth')
+ depthTexture.attachFramebuffer(colorTarget.framebuffer, 'depth')
}
- const postprocessing = new PostprocessingPass(webgl, drawTarget.texture, depthTexture, !!depthTarget, p.postprocessing)
- const multiSample = new MultiSamplePass(webgl, camera, drawTarget, postprocessing, renderDraw, p.multiSample)
+ const postprocessing = new PostprocessingPass(webgl, colorTarget.texture, depthTexture, !!depthTarget, p.postprocessing)
+ const multiSample = new MultiSamplePass(webgl, camera, colorTarget, postprocessing, renderDraw, p.multiSample)
const pickBaseScale = 0.5
let pickScale = pickBaseScale / webgl.pixelRatio
@@ -221,10 +221,10 @@ namespace Canvas3D {
function renderDraw() {
renderer.setViewport(0, 0, width, height)
- renderer.render(scene, 'draw', true)
+ renderer.render(scene, 'color', true)
if (debugHelper.isEnabled) {
debugHelper.syncVisibility()
- renderer.render(debugHelper.scene, 'draw', false)
+ renderer.render(debugHelper.scene, 'color', false)
}
if (postprocessing.enabled && depthTarget) {
@@ -263,7 +263,7 @@ namespace Canvas3D {
if (multiSample.enabled) {
multiSample.render()
} else {
- if (postprocessing.enabled) drawTarget.bind()
+ if (postprocessing.enabled) colorTarget.bind()
else webgl.unbindFramebuffer()
renderDraw()
if (postprocessing.enabled) postprocessing.render(true)
@@ -426,7 +426,7 @@ namespace Canvas3D {
},
getPixelData: (variant: GraphicsRenderVariant) => {
switch (variant) {
- case 'draw': return webgl.getDrawingBufferPixelData()
+ case 'color': return webgl.getDrawingBufferPixelData()
case 'pickObject': return objectPickTarget.getPixelData()
case 'pickInstance': return instancePickTarget.getPixelData()
case 'pickGroup': return groupPickTarget.getPixelData()
@@ -497,7 +497,7 @@ namespace Canvas3D {
Viewport.set(camera.viewport, 0, 0, width, height)
Viewport.set(controls.viewport, 0, 0, width, height)
- drawTarget.setSize(width, height)
+ colorTarget.setSize(width, height)
postprocessing.setSize(width, height)
multiSample.setSize(width, height)
diff --git a/src/mol-canvas3d/helper/multi-sample.ts b/src/mol-canvas3d/helper/multi-sample.ts
index d2d9647dc5226df4010cc6bdd714a0d1386ce126..858533309c285d7f568eec6fb3feffe7f2b8509e 100644
--- a/src/mol-canvas3d/helper/multi-sample.ts
+++ b/src/mol-canvas3d/helper/multi-sample.ts
@@ -62,11 +62,11 @@ export class MultiSamplePass {
private currentTime = 0
private lastRenderTime = 0
- constructor(private webgl: WebGLContext, private camera: Camera, private drawTarget: RenderTarget, private postprocessing: PostprocessingPass, private renderDraw: () => void, props: Partial<MultiSampleProps>) {
+ constructor(private webgl: WebGLContext, private camera: Camera, private colorTarget: RenderTarget, private postprocessing: PostprocessingPass, private renderDraw: () => void, props: Partial<MultiSampleProps>) {
const { gl } = webgl
this.composeTarget = createRenderTarget(webgl, gl.drawingBufferWidth, gl.drawingBufferHeight)
this.holdTarget = createRenderTarget(webgl, gl.drawingBufferWidth, gl.drawingBufferHeight)
- this.compose = getComposeRenderable(webgl, drawTarget.texture)
+ this.compose = getComposeRenderable(webgl, colorTarget.texture)
this.props = { ...PD.getDefaultValues(MultiSampleParams), ...props }
}
@@ -110,7 +110,7 @@ export class MultiSamplePass {
}
private renderMultiSample() {
- const { camera, compose, drawTarget, composeTarget, postprocessing, renderDraw, webgl } = this
+ const { camera, compose, colorTarget, composeTarget, postprocessing, renderDraw, webgl } = this
const { gl, state } = webgl
// based on the Multisample Anti-Aliasing Render Pass
@@ -124,10 +124,10 @@ export class MultiSamplePass {
const roundingRange = 1 / 32
camera.viewOffset.enabled = true
- ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : drawTarget.texture)
+ ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : colorTarget.texture)
compose.update()
- const { width, height } = drawTarget
+ const { width, height } = colorTarget
// render the scene multiple times, each slightly jitter offset
// from the last and accumulate the results.
@@ -144,7 +144,7 @@ export class MultiSamplePass {
ValueCell.update(compose.values.uWeight, sampleWeight)
// render scene and optionally postprocess
- drawTarget.bind()
+ colorTarget.bind()
renderDraw()
if (postprocessing.enabled) postprocessing.render(false)
@@ -178,7 +178,7 @@ export class MultiSamplePass {
}
private renderTemporalMultiSample() {
- const { camera, compose, drawTarget, composeTarget, holdTarget, postprocessing, renderDraw, webgl } = this
+ const { camera, compose, colorTarget, composeTarget, holdTarget, postprocessing, renderDraw, webgl } = this
const { gl, state } = webgl
// based on the Multisample Anti-Aliasing Render Pass
@@ -197,11 +197,11 @@ export class MultiSamplePass {
const i = this.sampleIndex
if (i === 0) {
- drawTarget.bind()
+ colorTarget.bind()
renderDraw()
if (postprocessing.enabled) postprocessing.render(false)
ValueCell.update(compose.values.uWeight, 1.0)
- ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : drawTarget.texture)
+ ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : colorTarget.texture)
compose.update()
holdTarget.bind()
@@ -212,11 +212,11 @@ export class MultiSamplePass {
const sampleWeight = 1.0 / offsetList.length
camera.viewOffset.enabled = true
- ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : drawTarget.texture)
+ ValueCell.update(compose.values.tColor, postprocessing.enabled ? postprocessing.target.texture : colorTarget.texture)
ValueCell.update(compose.values.uWeight, sampleWeight)
compose.update()
- const { width, height } = drawTarget
+ const { width, height } = colorTarget
// render the scene multiple times, each slightly jitter offset
// from the last and accumulate the results.
@@ -227,7 +227,7 @@ export class MultiSamplePass {
camera.updateMatrices()
// render scene and optionally postprocess
- drawTarget.bind()
+ colorTarget.bind()
renderDraw()
if (postprocessing.enabled) postprocessing.render(false)
diff --git a/src/mol-gl/renderer.ts b/src/mol-gl/renderer.ts
index d4e6d30e67c267408b13af04cd2b5b4006515537..24093f858e388eddd9c21dae0845384604ce8377 100644
--- a/src/mol-gl/renderer.ts
+++ b/src/mol-gl/renderer.ts
@@ -184,7 +184,7 @@ namespace Renderer {
state.enable(gl.DEPTH_TEST)
if (clear) {
- if (variant === 'draw') {
+ if (variant === 'color') {
state.clearColor(bgColor[0], bgColor[1], bgColor[2], 1.0)
} else {
state.clearColor(1, 1, 1, 1)
@@ -192,7 +192,7 @@ namespace Renderer {
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT)
}
- if (variant === 'draw') {
+ if (variant === 'color') {
for (let i = 0, il = renderables.length; i < il; ++i) {
const r = renderables[i]
if (r.state.opaque) renderObject(r, variant)
diff --git a/src/mol-gl/scene.ts b/src/mol-gl/scene.ts
index 749836fe396ff5d1b56cdf87179c9e316300cda4..3096aa741c5a6e12f40d9592b7c5d28bc1997201 100644
--- a/src/mol-gl/scene.ts
+++ b/src/mol-gl/scene.ts
@@ -36,8 +36,8 @@ function calculateBoundingSphere(renderables: Renderable<RenderableValues & Base
}
function renderableSort(a: Renderable<RenderableValues & BaseValues>, b: Renderable<RenderableValues & BaseValues>) {
- const drawProgramIdA = a.getProgram('draw').id
- const drawProgramIdB = b.getProgram('draw').id
+ const drawProgramIdA = a.getProgram('color').id
+ const drawProgramIdB = b.getProgram('color').id
const materialIdA = a.materialId
const materialIdB = b.materialId
const zA = a.values.boundingSphere.ref.value.center[2]
diff --git a/src/mol-gl/webgl/render-item.ts b/src/mol-gl/webgl/render-item.ts
index 5707df15b05af8135b806dbbcd29605e086da206..40e397a4ecf22c1242e266a1677951444367ed40 100644
--- a/src/mol-gl/webgl/render-item.ts
+++ b/src/mol-gl/webgl/render-item.ts
@@ -48,7 +48,7 @@ export interface RenderItem<T extends string> {
//
const GraphicsRenderVariantDefines = {
- 'draw': {},
+ 'color': {},
'pickObject': { dColorType: ValueCell.create('objectPicking') },
'pickInstance': { dColorType: ValueCell.create('instancePicking') },
'pickGroup': { dColorType: ValueCell.create('groupPicking') },