From 3192772f5d798731d78351555651aa71b5437228 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 11:19:12 +0100 Subject: [PATCH 01/14] feat: setting and pass through to state --- src/data_panel_layout.ts | 3 +++ src/layer_group_viewer.ts | 4 ++++ src/layer_groups_layout.ts | 2 ++ src/sliceview/panel.ts | 1 + src/ui/viewer_settings.ts | 4 ++++ src/viewer.ts | 2 ++ 6 files changed, 16 insertions(+) diff --git a/src/data_panel_layout.ts b/src/data_panel_layout.ts index 7154a5785..5231f03c8 100644 --- a/src/data_panel_layout.ts +++ b/src/data_panel_layout.ts @@ -100,6 +100,7 @@ export interface ViewerUIState inputEventBindings: InputEventBindings; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; + hideTransparentPerspectiveSliceViews: TrackableBoolean; } export interface DataDisplayLayout extends RefCounted { @@ -180,6 +181,8 @@ export function getCommonViewerState(viewer: ViewerUIState) { selectedLayer: viewer.selectedLayer, visibility: viewer.visibility, scaleBarOptions: viewer.scaleBarOptions, + hideTransparentPerspectiveSliceViews: + viewer.hideTransparentPerspectiveSliceViews, }; } diff --git a/src/layer_group_viewer.ts b/src/layer_group_viewer.ts index dfca69cc0..22f0c8c1c 100644 --- a/src/layer_group_viewer.ts +++ b/src/layer_group_viewer.ts @@ -105,6 +105,7 @@ export interface LayerGroupViewerState { visibleLayerRoles: WatchableSet; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; + hideTransparentPerspectiveSliceViews: TrackableBoolean; } export interface LayerGroupViewerOptions { @@ -360,6 +361,9 @@ export class LayerGroupViewer extends RefCounted { get enableAdaptiveDownsampling() { return this.viewerState.enableAdaptiveDownsampling; } + get hideTransparentPerspectiveSliceViews() { + return this.viewerState.hideTransparentPerspectiveSliceViews; + } get showScaleBar() { return this.viewerState.showScaleBar; } diff --git a/src/layer_groups_layout.ts b/src/layer_groups_layout.ts index 851b3ff27..3924023a3 100644 --- a/src/layer_groups_layout.ts +++ b/src/layer_groups_layout.ts @@ -420,6 +420,8 @@ function getCommonViewerState(viewer: Viewer) { velocity: viewer.velocity.addRef(), crossSectionBackgroundColor: viewer.crossSectionBackgroundColor, perspectiveViewBackgroundColor: viewer.perspectiveViewBackgroundColor, + hideTransparentPerspectiveSliceViews: + viewer.hideTransparentPerspectiveSliceViews, }; } diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index 172ee6f25..6a1719936 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -66,6 +66,7 @@ export interface SliceViewerState extends RenderedDataViewerState { wireFrame: TrackableBoolean; scaleBarOptions: TrackableScaleBarOptions; crossSectionBackgroundColor: TrackableRGB; + hideTransparentPerspectiveSliceViews: TrackableBoolean; } export enum OffscreenTextures { diff --git a/src/ui/viewer_settings.ts b/src/ui/viewer_settings.ts index a0c936f94..470c040f0 100644 --- a/src/ui/viewer_settings.ts +++ b/src/ui/viewer_settings.ts @@ -118,6 +118,10 @@ export class ViewerSettingsPanel extends SidePanel { addCheckbox("Show axis lines", viewer.showAxisLines); addCheckbox("Show scale bar", viewer.showScaleBar); addCheckbox("Show cross sections in 3-d", viewer.showPerspectiveSliceViews); + addCheckbox( + "Hide transparent cross-section", + viewer.hideTransparentPerspectiveSliceViews, + ); addCheckbox("Show default annotations", viewer.showDefaultAnnotations); addCheckbox( "Show chunk statistics", diff --git a/src/viewer.ts b/src/viewer.ts index 73a72f171..6548e494c 100644 --- a/src/viewer.ts +++ b/src/viewer.ts @@ -300,6 +300,7 @@ class TrackableViewerState extends CompoundTrackable { this.add("showDefaultAnnotations", viewer.showDefaultAnnotations); this.add("showSlices", viewer.showPerspectiveSliceViews); + this.add("hideTransparentPerspectiveSliceViews", viewer.hideTransparentPerspectiveSliceViews); this.add( "gpuMemoryLimit", viewer.dataContext.chunkQueueManager.capacities.gpuMemory.sizeLimit, @@ -462,6 +463,7 @@ export class Viewer extends RefCounted implements ViewerState { enableAdaptiveDownsampling = new TrackableBoolean(true, true); showScaleBar = new TrackableBoolean(true, true); showPerspectiveSliceViews = new TrackableBoolean(true, true); + hideTransparentPerspectiveSliceViews = new TrackableBoolean(false, false); visibleLayerRoles = allRenderLayerRoles(); showDefaultAnnotations = new TrackableBoolean(true, true); crossSectionBackgroundColor = new TrackableRGB( From 32eb87f8b79247f6d0aa9785e19d267b0e1eb926 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 11:57:39 +0100 Subject: [PATCH 02/14] feat: pass parameters to potential shader --- src/perspective_view/panel.ts | 3 +- src/sliceview/frontend.ts | 78 ++++++++++++++++++++++++++++------- src/sliceview/panel.ts | 2 +- 3 files changed, 66 insertions(+), 17 deletions(-) diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index 1ab88d5e1..dfd6cdee6 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -95,6 +95,7 @@ export interface PerspectiveViewerState extends RenderedDataViewerState { showSliceViewsCheckbox?: boolean; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; + hideTransparentPerspectiveSliceViews: TrackableBoolean; rpc: RPC; } @@ -322,7 +323,7 @@ export class PerspectivePanel extends RenderedDataPanel { private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get(this.gl, perspectivePanelEmit), + SliceViewRenderHelper.get(this.gl, perspectivePanelEmit, this.viewer), ); protected offscreenFramebuffer = this.registerDisposer( diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index dd20d2a6b..2e8ee09f0 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -27,6 +27,7 @@ import type { DisplayDimensionRenderInfo, NavigationState, } from "#src/navigation_state.js"; +import type { PerspectiveViewerState } from "#src/perspective_view/panel.js"; import { updateProjectionParametersFromInverseViewAndProjection } from "#src/projection_parameters.js"; import type { ChunkDisplayTransformParameters, @@ -60,6 +61,7 @@ import { SliceViewProjectionParameters, } from "#src/sliceview/base.js"; import { ChunkLayout } from "#src/sliceview/chunk_layout.js"; +import type { SliceViewerState } from "#src/sliceview/panel.js"; import { SliceViewRenderLayer } from "#src/sliceview/renderlayer.js"; import type { WatchableValueInterface } from "#src/trackable_value.js"; import type { CancellationToken } from "#src/util/cancellation.js"; @@ -81,7 +83,7 @@ import { FramebufferConfiguration, makeTextureBuffers, } from "#src/webgl/offscreen.js"; -import type { ShaderModule, ShaderProgram } from "#src/webgl/shader.js"; +import type { ShaderModule } from "#src/webgl/shader.js"; import { ShaderBuilder } from "#src/webgl/shader.js"; import { getSquareCornersBuffer } from "#src/webgl/square_corners_buffer.js"; import type { RPC } from "#src/worker_rpc.js"; @@ -715,39 +717,74 @@ export class SliceViewChunk extends Chunk { */ export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); - private shader: ShaderProgram; - private textureCoordinateAdjustment = new Float32Array(4); - constructor( - public gl: GL, + defineShader( + builder: ShaderBuilder, + hideTransparent: boolean, + isProjection: boolean, emitter: ShaderModule, ) { - super(); - const builder = new ShaderBuilder(gl); builder.addVarying("vec2", "vTexCoord"); builder.addUniform("sampler2D", "uSampler"); builder.addInitializer((shader) => { - gl.uniform1i(shader.uniform("uSampler"), 0); + this.gl.uniform1i(shader.uniform("uSampler"), 0); }); builder.addUniform("vec4", "uColorFactor"); builder.addUniform("vec4", "uBackgroundColor"); builder.addUniform("mat4", "uProjectionMatrix"); builder.addUniform("vec4", "uTextureCoordinateAdjustment"); builder.require(emitter); - builder.setFragmentMain(` + const glsl_fragmentMainStart = ` vec4 sampledColor = texture(uSampler, vTexCoord); -if (sampledColor.a == 0.0) { +if (sampledColor.a == 0.0) {`; + let glsl_fragmentMainEnd: string; + if (hideTransparent && !isProjection) { + glsl_fragmentMainEnd = ` + discard; +} +else { + emit(sampledColor * uColorFactor, 0u); +`; + } else { + glsl_fragmentMainEnd = ` sampledColor = uBackgroundColor; } emit(sampledColor * uColorFactor, 0u); -`); +`; + } + builder.setFragmentMain(`${glsl_fragmentMainStart}${glsl_fragmentMainEnd}`); builder.addAttribute("vec4", "aVertexPosition"); builder.setVertexMain(` vTexCoord = uTextureCoordinateAdjustment.xy + 0.5 * (aVertexPosition.xy + 1.0) * uTextureCoordinateAdjustment.zw; gl_Position = uProjectionMatrix * aVertexPosition; `); - this.shader = this.registerDisposer(builder.build()); + } + + getNewShader( + memoizeKey: string, + hideTransparent: boolean, + isProjection: boolean, + emitter: ShaderModule, + ) { + const key = JSON.stringify({ + id: memoizeKey, + hideTransparent, + isProjection, + }); + return this.gl.memoize.get(key, () => { + const builder = new ShaderBuilder(this.gl); + this.defineShader(builder, hideTransparent, isProjection, emitter); + return builder.build(); + }); + } + + constructor( + public gl: GL, + private emitter: ShaderModule, + private viewer: SliceViewerState | PerspectiveViewerState, + ) { + super(); } draw( @@ -760,11 +797,18 @@ gl_Position = uProjectionMatrix * aVertexPosition; xEnd: number, yEnd: number, ) { - const { gl, shader, textureCoordinateAdjustment } = this; + const { gl, textureCoordinateAdjustment } = this; textureCoordinateAdjustment[0] = xStart; textureCoordinateAdjustment[1] = yStart; textureCoordinateAdjustment[2] = xEnd - xStart; textureCoordinateAdjustment[3] = yEnd - yStart; + const shader = this.getNewShader( + "sliceview/SliceViewRenderHelper", + this.viewer.hideTransparentPerspectiveSliceViews.value, + this.viewer.hideTransparentPerspectiveSliceViews.value, + this.emitter, + ); + console.log(shader); shader.bind(); gl.activeTexture(gl.TEXTURE0); gl.bindTexture(gl.TEXTURE_2D, texture); @@ -793,10 +837,14 @@ gl_Position = uProjectionMatrix * aVertexPosition; gl.bindTexture(gl.TEXTURE_2D, null); } - static get(gl: GL, emitter: ShaderModule) { + static get( + gl: GL, + emitter: ShaderModule, + viewer: SliceViewerState | PerspectiveViewerState, // Should be SliceViewerState and PerspectiveViewerState but that causes a circular dependency, + ) { return gl.memoize.get( `sliceview/SliceViewRenderHelper:${getObjectId(emitter)}`, - () => new SliceViewRenderHelper(gl, emitter), + () => new SliceViewRenderHelper(gl, emitter, viewer), ); } } diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index 6a1719936..2ce2e07d2 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -105,7 +105,7 @@ export class SliceViewPanel extends RenderedDataPanel { private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); private sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get(this.gl, sliceViewPanelEmitColor), + SliceViewRenderHelper.get(this.gl, sliceViewPanelEmitColor, this.viewer), ); private colorFactor = vec4.fromValues(1, 1, 1, 1); private pickIDs = new PickIDManager(); From 04db6eb1e805b166004f9344b5dc7a2427d78718 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:24:18 +0100 Subject: [PATCH 03/14] feat: transparent cross-section shader switch --- src/sliceview/frontend.ts | 82 +++++++++++++++++++++++++-------------- 1 file changed, 53 insertions(+), 29 deletions(-) diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 2e8ee09f0..9b1663275 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -63,7 +63,10 @@ import { import { ChunkLayout } from "#src/sliceview/chunk_layout.js"; import type { SliceViewerState } from "#src/sliceview/panel.js"; import { SliceViewRenderLayer } from "#src/sliceview/renderlayer.js"; -import type { WatchableValueInterface } from "#src/trackable_value.js"; +import { + makeCachedDerivedWatchableValue, + type WatchableValueInterface, +} from "#src/trackable_value.js"; import type { CancellationToken } from "#src/util/cancellation.js"; import { uncancelableToken } from "#src/util/cancellation.js"; import type { Borrowed, Disposer, Owned } from "#src/util/disposable.js"; @@ -75,6 +78,11 @@ import { getObjectId } from "#src/util/object_id.js"; import { NullarySignal } from "#src/util/signal.js"; import { withSharedVisibility } from "#src/visibility_priority/frontend.js"; import type { GL } from "#src/webgl/context.js"; +import type { + ParameterizedContextDependentShaderGetter} from "#src/webgl/dynamic_shader.js"; +import { + parameterizedContextDependentShaderGetter, +} from "#src/webgl/dynamic_shader.js"; import type { HistogramSpecifications } from "#src/webgl/empirical_cdf.js"; import { TextureHistogramGenerator } from "#src/webgl/empirical_cdf.js"; import type { TextureBuffer } from "#src/webgl/offscreen.js"; @@ -83,8 +91,7 @@ import { FramebufferConfiguration, makeTextureBuffers, } from "#src/webgl/offscreen.js"; -import type { ShaderModule } from "#src/webgl/shader.js"; -import { ShaderBuilder } from "#src/webgl/shader.js"; +import type { ShaderModule , ShaderBuilder } from "#src/webgl/shader.js"; import { getSquareCornersBuffer } from "#src/webgl/square_corners_buffer.js"; import type { RPC } from "#src/worker_rpc.js"; import { registerSharedObjectOwner } from "#src/worker_rpc.js"; @@ -718,6 +725,10 @@ export class SliceViewChunk extends Chunk { export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); private textureCoordinateAdjustment = new Float32Array(4); + private shaderGetter: ParameterizedContextDependentShaderGetter< + { emitter: ShaderModule }, + { hideTransparent: boolean; isProjection: boolean } + >; defineShader( builder: ShaderBuilder, @@ -739,12 +750,14 @@ export class SliceViewRenderHelper extends RefCounted { vec4 sampledColor = texture(uSampler, vTexCoord); if (sampledColor.a == 0.0) {`; let glsl_fragmentMainEnd: string; - if (hideTransparent && !isProjection) { + // TODO temp, isProjection should be checked later + if (hideTransparent && isProjection) { glsl_fragmentMainEnd = ` discard; } else { emit(sampledColor * uColorFactor, 0u); +} `; } else { glsl_fragmentMainEnd = ` @@ -761,30 +774,43 @@ gl_Position = uProjectionMatrix * aVertexPosition; `); } - getNewShader( - memoizeKey: string, - hideTransparent: boolean, - isProjection: boolean, - emitter: ShaderModule, - ) { - const key = JSON.stringify({ - id: memoizeKey, - hideTransparent, - isProjection, - }); - return this.gl.memoize.get(key, () => { - const builder = new ShaderBuilder(this.gl); - this.defineShader(builder, hideTransparent, isProjection, emitter); - return builder.build(); - }); - } - constructor( public gl: GL, private emitter: ShaderModule, private viewer: SliceViewerState | PerspectiveViewerState, ) { super(); + + const parameters = this.registerDisposer( + makeCachedDerivedWatchableValue( + (hide: boolean, hidea: boolean) => ({ + hideTransparent: hide, + isProjection: hidea, + }), + [ + this.viewer.hideTransparentPerspectiveSliceViews, + this.viewer.hideTransparentPerspectiveSliceViews, + ], + ), + ); + + this.shaderGetter = parameterizedContextDependentShaderGetter( + this, + this.gl, + { + memoizeKey: "sliceview/SliceViewRenderHelper", + parameters, + getContextKey: (emitter) => `${getObjectId(emitter)}`, + defineShader: (builder, context, { hideTransparent, isProjection }) => { + this.defineShader( + builder, + hideTransparent, + isProjection, + context.emitter, + ); + }, + }, + ); } draw( @@ -802,13 +828,11 @@ gl_Position = uProjectionMatrix * aVertexPosition; textureCoordinateAdjustment[1] = yStart; textureCoordinateAdjustment[2] = xEnd - xStart; textureCoordinateAdjustment[3] = yEnd - yStart; - const shader = this.getNewShader( - "sliceview/SliceViewRenderHelper", - this.viewer.hideTransparentPerspectiveSliceViews.value, - this.viewer.hideTransparentPerspectiveSliceViews.value, - this.emitter, - ); - console.log(shader); + const shaderResult = this.shaderGetter({ emitter: this.emitter }); + const shader = shaderResult.shader; + if (shader === null) { + throw new Error("Shader compilation failed in SliceViewRenderHelper."); + } shader.bind(); gl.activeTexture(gl.TEXTURE0); gl.bindTexture(gl.TEXTURE_2D, texture); From c55d84ab9d5ab550f81cd76cca48a7c9dbb8d305 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:29:09 +0100 Subject: [PATCH 04/14] feat: trigger redraw on hide transparent change --- src/perspective_view/panel.ts | 5 +++++ src/sliceview/panel.ts | 1 + 2 files changed, 6 insertions(+) diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index dfd6cdee6..cc4235252 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -581,6 +581,11 @@ export class PerspectivePanel extends RenderedDataPanel { this.registerDisposer( viewer.wireFrame.changed.add(() => this.scheduleRedraw()), ); + this.registerDisposer( + viewer.hideTransparentPerspectiveSliceViews.changed.add(() => + this.scheduleRedraw(), + ), + ); this.sliceViews.changed.add(() => this.scheduleRedraw()); } diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index 2ce2e07d2..b78ecd026 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -169,6 +169,7 @@ export class SliceViewPanel extends RenderedDataPanel { ) { super(context, element, viewer); viewer.wireFrame.changed.add(() => this.scheduleRedraw()); + viewer.hideTransparentPerspectiveSliceViews.changed.add(() => this.scheduleRedraw()); registerActionListener( element, "rotate-via-mouse-drag", From b0a8575ccb812a6903012fc2f45c3c0de9a36d56 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:40:56 +0100 Subject: [PATCH 05/14] feat: only hide cross-section in 3D --- src/perspective_view/panel.ts | 7 ++++- src/sliceview/frontend.ts | 52 +++++++++++++---------------------- src/sliceview/panel.ts | 11 ++++++-- 3 files changed, 34 insertions(+), 36 deletions(-) diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index cc4235252..e9ad042ad 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -323,7 +323,12 @@ export class PerspectivePanel extends RenderedDataPanel { private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get(this.gl, perspectivePanelEmit, this.viewer), + SliceViewRenderHelper.get( + this.gl, + perspectivePanelEmit, + this.viewer, + true /*perspectivePanel*/, + ), ); protected offscreenFramebuffer = this.registerDisposer( diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 9b1663275..3f1332f8d 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -63,10 +63,7 @@ import { import { ChunkLayout } from "#src/sliceview/chunk_layout.js"; import type { SliceViewerState } from "#src/sliceview/panel.js"; import { SliceViewRenderLayer } from "#src/sliceview/renderlayer.js"; -import { - makeCachedDerivedWatchableValue, - type WatchableValueInterface, -} from "#src/trackable_value.js"; +import { type WatchableValueInterface } from "#src/trackable_value.js"; import type { CancellationToken } from "#src/util/cancellation.js"; import { uncancelableToken } from "#src/util/cancellation.js"; import type { Borrowed, Disposer, Owned } from "#src/util/disposable.js"; @@ -78,11 +75,8 @@ import { getObjectId } from "#src/util/object_id.js"; import { NullarySignal } from "#src/util/signal.js"; import { withSharedVisibility } from "#src/visibility_priority/frontend.js"; import type { GL } from "#src/webgl/context.js"; -import type { - ParameterizedContextDependentShaderGetter} from "#src/webgl/dynamic_shader.js"; -import { - parameterizedContextDependentShaderGetter, -} from "#src/webgl/dynamic_shader.js"; +import type { ParameterizedContextDependentShaderGetter } from "#src/webgl/dynamic_shader.js"; +import { parameterizedContextDependentShaderGetter } from "#src/webgl/dynamic_shader.js"; import type { HistogramSpecifications } from "#src/webgl/empirical_cdf.js"; import { TextureHistogramGenerator } from "#src/webgl/empirical_cdf.js"; import type { TextureBuffer } from "#src/webgl/offscreen.js"; @@ -91,7 +85,7 @@ import { FramebufferConfiguration, makeTextureBuffers, } from "#src/webgl/offscreen.js"; -import type { ShaderModule , ShaderBuilder } from "#src/webgl/shader.js"; +import type { ShaderModule, ShaderBuilder } from "#src/webgl/shader.js"; import { getSquareCornersBuffer } from "#src/webgl/square_corners_buffer.js"; import type { RPC } from "#src/worker_rpc.js"; import { registerSharedObjectOwner } from "#src/worker_rpc.js"; @@ -726,8 +720,8 @@ export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); private textureCoordinateAdjustment = new Float32Array(4); private shaderGetter: ParameterizedContextDependentShaderGetter< - { emitter: ShaderModule }, - { hideTransparent: boolean; isProjection: boolean } + { emitter: ShaderModule; isPerspective: boolean }, + boolean >; defineShader( @@ -750,7 +744,6 @@ export class SliceViewRenderHelper extends RefCounted { vec4 sampledColor = texture(uSampler, vTexCoord); if (sampledColor.a == 0.0) {`; let glsl_fragmentMainEnd: string; - // TODO temp, isProjection should be checked later if (hideTransparent && isProjection) { glsl_fragmentMainEnd = ` discard; @@ -778,34 +771,23 @@ gl_Position = uProjectionMatrix * aVertexPosition; public gl: GL, private emitter: ShaderModule, private viewer: SliceViewerState | PerspectiveViewerState, + private isPerspective: boolean, ) { super(); - const parameters = this.registerDisposer( - makeCachedDerivedWatchableValue( - (hide: boolean, hidea: boolean) => ({ - hideTransparent: hide, - isProjection: hidea, - }), - [ - this.viewer.hideTransparentPerspectiveSliceViews, - this.viewer.hideTransparentPerspectiveSliceViews, - ], - ), - ); - this.shaderGetter = parameterizedContextDependentShaderGetter( this, this.gl, { memoizeKey: "sliceview/SliceViewRenderHelper", - parameters, - getContextKey: (emitter) => `${getObjectId(emitter)}`, - defineShader: (builder, context, { hideTransparent, isProjection }) => { + parameters: this.viewer.hideTransparentPerspectiveSliceViews, + getContextKey: ({ emitter, isPerspective }) => + `${getObjectId(emitter)}${isPerspective}`, + defineShader: (builder, context, hideTransparent) => { this.defineShader( builder, hideTransparent, - isProjection, + context.isPerspective, context.emitter, ); }, @@ -828,7 +810,10 @@ gl_Position = uProjectionMatrix * aVertexPosition; textureCoordinateAdjustment[1] = yStart; textureCoordinateAdjustment[2] = xEnd - xStart; textureCoordinateAdjustment[3] = yEnd - yStart; - const shaderResult = this.shaderGetter({ emitter: this.emitter }); + const shaderResult = this.shaderGetter({ + emitter: this.emitter, + isPerspective: this.isPerspective, + }); const shader = shaderResult.shader; if (shader === null) { throw new Error("Shader compilation failed in SliceViewRenderHelper."); @@ -864,11 +849,12 @@ gl_Position = uProjectionMatrix * aVertexPosition; static get( gl: GL, emitter: ShaderModule, - viewer: SliceViewerState | PerspectiveViewerState, // Should be SliceViewerState and PerspectiveViewerState but that causes a circular dependency, + viewer: SliceViewerState | PerspectiveViewerState, + isPerspective: boolean, ) { return gl.memoize.get( `sliceview/SliceViewRenderHelper:${getObjectId(emitter)}`, - () => new SliceViewRenderHelper(gl, emitter, viewer), + () => new SliceViewRenderHelper(gl, emitter, viewer, isPerspective), ); } } diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index b78ecd026..b5684851c 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -105,7 +105,12 @@ export class SliceViewPanel extends RenderedDataPanel { private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); private sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get(this.gl, sliceViewPanelEmitColor, this.viewer), + SliceViewRenderHelper.get( + this.gl, + sliceViewPanelEmitColor, + this.viewer, + false /*sliceViewPanel*/, + ), ); private colorFactor = vec4.fromValues(1, 1, 1, 1); private pickIDs = new PickIDManager(); @@ -169,7 +174,9 @@ export class SliceViewPanel extends RenderedDataPanel { ) { super(context, element, viewer); viewer.wireFrame.changed.add(() => this.scheduleRedraw()); - viewer.hideTransparentPerspectiveSliceViews.changed.add(() => this.scheduleRedraw()); + viewer.hideTransparentPerspectiveSliceViews.changed.add(() => + this.scheduleRedraw(), + ); registerActionListener( element, "rotate-via-mouse-drag", From 1cea727c4ee5f6f0035a4a41657a4456fe705495 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:41:43 +0100 Subject: [PATCH 06/14] refactor: better naming --- src/sliceview/frontend.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 3f1332f8d..24f38c842 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -720,7 +720,7 @@ export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); private textureCoordinateAdjustment = new Float32Array(4); private shaderGetter: ParameterizedContextDependentShaderGetter< - { emitter: ShaderModule; isPerspective: boolean }, + { emitter: ShaderModule;isProjection: boolean }, boolean >; @@ -771,7 +771,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; public gl: GL, private emitter: ShaderModule, private viewer: SliceViewerState | PerspectiveViewerState, - private isPerspective: boolean, + privateisProjection: boolean, ) { super(); @@ -781,7 +781,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; { memoizeKey: "sliceview/SliceViewRenderHelper", parameters: this.viewer.hideTransparentPerspectiveSliceViews, - getContextKey: ({ emitter, isPerspective }) => + getContextKey: ({ emitter,isProjection }) => `${getObjectId(emitter)}${isPerspective}`, defineShader: (builder, context, hideTransparent) => { this.defineShader( @@ -812,7 +812,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; textureCoordinateAdjustment[3] = yEnd - yStart; const shaderResult = this.shaderGetter({ emitter: this.emitter, - isPerspective: this.isPerspective, + isProjection: this.isPerspective, }); const shader = shaderResult.shader; if (shader === null) { @@ -850,11 +850,11 @@ gl_Position = uProjectionMatrix * aVertexPosition; gl: GL, emitter: ShaderModule, viewer: SliceViewerState | PerspectiveViewerState, - isPerspective: boolean, + isProjection: boolean, ) { return gl.memoize.get( `sliceview/SliceViewRenderHelper:${getObjectId(emitter)}`, - () => new SliceViewRenderHelper(gl, emitter, viewer, isPerspective), + () => new SliceViewRenderHelper(gl, emitter, viewer,isProjection), ); } } From 5e7c8cc5fa4448cf547f95406c76eea3528cc369 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:42:51 +0100 Subject: [PATCH 07/14] fix: correct naming --- src/sliceview/frontend.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 24f38c842..69ce1bf03 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -720,7 +720,7 @@ export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); private textureCoordinateAdjustment = new Float32Array(4); private shaderGetter: ParameterizedContextDependentShaderGetter< - { emitter: ShaderModule;isProjection: boolean }, + { emitter: ShaderModule; isProjection: boolean }, boolean >; @@ -771,7 +771,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; public gl: GL, private emitter: ShaderModule, private viewer: SliceViewerState | PerspectiveViewerState, - privateisProjection: boolean, + private isProjection: boolean, ) { super(); @@ -781,13 +781,13 @@ gl_Position = uProjectionMatrix * aVertexPosition; { memoizeKey: "sliceview/SliceViewRenderHelper", parameters: this.viewer.hideTransparentPerspectiveSliceViews, - getContextKey: ({ emitter,isProjection }) => - `${getObjectId(emitter)}${isPerspective}`, + getContextKey: ({ emitter, isProjection }) => + `${getObjectId(emitter)}${isProjection}`, defineShader: (builder, context, hideTransparent) => { this.defineShader( builder, hideTransparent, - context.isPerspective, + context.isProjection, context.emitter, ); }, @@ -812,7 +812,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; textureCoordinateAdjustment[3] = yEnd - yStart; const shaderResult = this.shaderGetter({ emitter: this.emitter, - isProjection: this.isPerspective, + isProjection: this.isProjection, }); const shader = shaderResult.shader; if (shader === null) { @@ -850,11 +850,11 @@ gl_Position = uProjectionMatrix * aVertexPosition; gl: GL, emitter: ShaderModule, viewer: SliceViewerState | PerspectiveViewerState, - isProjection: boolean, + isProjection: boolean, ) { return gl.memoize.get( `sliceview/SliceViewRenderHelper:${getObjectId(emitter)}`, - () => new SliceViewRenderHelper(gl, emitter, viewer,isProjection), + () => new SliceViewRenderHelper(gl, emitter, viewer, isProjection), ); } } From b48854fe6dbc0702c28ed9b4fcf9cc99224fbfeb Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 31 Oct 2024 12:45:21 +0100 Subject: [PATCH 08/14] feat(ui): better name --- src/ui/viewer_settings.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ui/viewer_settings.ts b/src/ui/viewer_settings.ts index 470c040f0..aec372643 100644 --- a/src/ui/viewer_settings.ts +++ b/src/ui/viewer_settings.ts @@ -119,7 +119,7 @@ export class ViewerSettingsPanel extends SidePanel { addCheckbox("Show scale bar", viewer.showScaleBar); addCheckbox("Show cross sections in 3-d", viewer.showPerspectiveSliceViews); addCheckbox( - "Hide transparent cross-section", + "Hide cross section background 3-d", viewer.hideTransparentPerspectiveSliceViews, ); addCheckbox("Show default annotations", viewer.showDefaultAnnotations); From 9d160f44e6a902692284f560dd954cc7435b1d97 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Fri, 1 Nov 2024 10:56:26 +0100 Subject: [PATCH 09/14] chore: fix formatting --- src/sliceview/frontend.ts | 2 +- src/viewer.ts | 5 ++++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 69ce1bf03..1064e5989 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -63,7 +63,7 @@ import { import { ChunkLayout } from "#src/sliceview/chunk_layout.js"; import type { SliceViewerState } from "#src/sliceview/panel.js"; import { SliceViewRenderLayer } from "#src/sliceview/renderlayer.js"; -import { type WatchableValueInterface } from "#src/trackable_value.js"; +import type { WatchableValueInterface } from "#src/trackable_value.js"; import type { CancellationToken } from "#src/util/cancellation.js"; import { uncancelableToken } from "#src/util/cancellation.js"; import type { Borrowed, Disposer, Owned } from "#src/util/disposable.js"; diff --git a/src/viewer.ts b/src/viewer.ts index 6548e494c..f7d808492 100644 --- a/src/viewer.ts +++ b/src/viewer.ts @@ -300,7 +300,10 @@ class TrackableViewerState extends CompoundTrackable { this.add("showDefaultAnnotations", viewer.showDefaultAnnotations); this.add("showSlices", viewer.showPerspectiveSliceViews); - this.add("hideTransparentPerspectiveSliceViews", viewer.hideTransparentPerspectiveSliceViews); + this.add( + "hideTransparentPerspectiveSliceViews", + viewer.hideTransparentPerspectiveSliceViews, + ); this.add( "gpuMemoryLimit", viewer.dataContext.chunkQueueManager.capacities.gpuMemory.sizeLimit, From 119f49b98fec3fb937b3b1e0806f908c7bc07c63 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Fri, 1 Nov 2024 11:19:47 +0100 Subject: [PATCH 10/14] feat: clearer naming and keybind for new control --- src/data_panel_layout.ts | 6 +++--- src/layer_group_viewer.ts | 6 +++--- src/layer_groups_layout.ts | 4 ++-- src/perspective_view/panel.ts | 4 ++-- src/sliceview/frontend.ts | 2 +- src/sliceview/panel.ts | 4 ++-- src/ui/default_input_event_bindings.ts | 1 + src/ui/viewer_settings.ts | 2 +- src/viewer.ts | 9 ++++++--- 9 files changed, 21 insertions(+), 17 deletions(-) diff --git a/src/data_panel_layout.ts b/src/data_panel_layout.ts index 5231f03c8..9789c5501 100644 --- a/src/data_panel_layout.ts +++ b/src/data_panel_layout.ts @@ -100,7 +100,7 @@ export interface ViewerUIState inputEventBindings: InputEventBindings; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; - hideTransparentPerspectiveSliceViews: TrackableBoolean; + hideCrossSectionBackgroundIn3D: TrackableBoolean; } export interface DataDisplayLayout extends RefCounted { @@ -181,8 +181,8 @@ export function getCommonViewerState(viewer: ViewerUIState) { selectedLayer: viewer.selectedLayer, visibility: viewer.visibility, scaleBarOptions: viewer.scaleBarOptions, - hideTransparentPerspectiveSliceViews: - viewer.hideTransparentPerspectiveSliceViews, + hideCrossSectionBackgroundIn3D: + viewer.hideCrossSectionBackgroundIn3D, }; } diff --git a/src/layer_group_viewer.ts b/src/layer_group_viewer.ts index 22f0c8c1c..33dab6e84 100644 --- a/src/layer_group_viewer.ts +++ b/src/layer_group_viewer.ts @@ -105,7 +105,7 @@ export interface LayerGroupViewerState { visibleLayerRoles: WatchableSet; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; - hideTransparentPerspectiveSliceViews: TrackableBoolean; + hideCrossSectionBackgroundIn3D: TrackableBoolean; } export interface LayerGroupViewerOptions { @@ -361,8 +361,8 @@ export class LayerGroupViewer extends RefCounted { get enableAdaptiveDownsampling() { return this.viewerState.enableAdaptiveDownsampling; } - get hideTransparentPerspectiveSliceViews() { - return this.viewerState.hideTransparentPerspectiveSliceViews; + get hideCrossSectionBackgroundIn3D() { + return this.viewerState.hideCrossSectionBackgroundIn3D; } get showScaleBar() { return this.viewerState.showScaleBar; diff --git a/src/layer_groups_layout.ts b/src/layer_groups_layout.ts index 3924023a3..e931dd959 100644 --- a/src/layer_groups_layout.ts +++ b/src/layer_groups_layout.ts @@ -420,8 +420,8 @@ function getCommonViewerState(viewer: Viewer) { velocity: viewer.velocity.addRef(), crossSectionBackgroundColor: viewer.crossSectionBackgroundColor, perspectiveViewBackgroundColor: viewer.perspectiveViewBackgroundColor, - hideTransparentPerspectiveSliceViews: - viewer.hideTransparentPerspectiveSliceViews, + hideCrossSectionBackgroundIn3D: + viewer.hideCrossSectionBackgroundIn3D, }; } diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index e9ad042ad..d96581199 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -95,7 +95,7 @@ export interface PerspectiveViewerState extends RenderedDataViewerState { showSliceViewsCheckbox?: boolean; crossSectionBackgroundColor: TrackableRGB; perspectiveViewBackgroundColor: TrackableRGB; - hideTransparentPerspectiveSliceViews: TrackableBoolean; + hideCrossSectionBackgroundIn3D: TrackableBoolean; rpc: RPC; } @@ -587,7 +587,7 @@ export class PerspectivePanel extends RenderedDataPanel { viewer.wireFrame.changed.add(() => this.scheduleRedraw()), ); this.registerDisposer( - viewer.hideTransparentPerspectiveSliceViews.changed.add(() => + viewer.hideCrossSectionBackgroundIn3D.changed.add(() => this.scheduleRedraw(), ), ); diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index 1064e5989..2e9a6b94e 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -780,7 +780,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; this.gl, { memoizeKey: "sliceview/SliceViewRenderHelper", - parameters: this.viewer.hideTransparentPerspectiveSliceViews, + parameters: this.viewer.hideCrossSectionBackgroundIn3D, getContextKey: ({ emitter, isProjection }) => `${getObjectId(emitter)}${isProjection}`, defineShader: (builder, context, hideTransparent) => { diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index b5684851c..22e322cba 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -66,7 +66,7 @@ export interface SliceViewerState extends RenderedDataViewerState { wireFrame: TrackableBoolean; scaleBarOptions: TrackableScaleBarOptions; crossSectionBackgroundColor: TrackableRGB; - hideTransparentPerspectiveSliceViews: TrackableBoolean; + hideCrossSectionBackgroundIn3D: TrackableBoolean; } export enum OffscreenTextures { @@ -174,7 +174,7 @@ export class SliceViewPanel extends RenderedDataPanel { ) { super(context, element, viewer); viewer.wireFrame.changed.add(() => this.scheduleRedraw()); - viewer.hideTransparentPerspectiveSliceViews.changed.add(() => + viewer.hideCrossSectionBackgroundIn3D.changed.add(() => this.scheduleRedraw(), ); registerActionListener( diff --git a/src/ui/default_input_event_bindings.ts b/src/ui/default_input_event_bindings.ts index 3e1816582..b6cdc378a 100644 --- a/src/ui/default_input_event_bindings.ts +++ b/src/ui/default_input_event_bindings.ts @@ -29,6 +29,7 @@ export function getDefaultGlobalBindings() { map.set("keyv", "toggle-default-annotations"); map.set("keya", "toggle-axis-lines"); map.set("keyo", "toggle-orthographic-projection"); + map.set("keyt", "toggle-hide-cross-section-background-3d") for (let i = 1; i <= 9; ++i) { map.set("digit" + i, "toggle-layer-" + i); diff --git a/src/ui/viewer_settings.ts b/src/ui/viewer_settings.ts index aec372643..4433e18da 100644 --- a/src/ui/viewer_settings.ts +++ b/src/ui/viewer_settings.ts @@ -120,7 +120,7 @@ export class ViewerSettingsPanel extends SidePanel { addCheckbox("Show cross sections in 3-d", viewer.showPerspectiveSliceViews); addCheckbox( "Hide cross section background 3-d", - viewer.hideTransparentPerspectiveSliceViews, + viewer.hideCrossSectionBackgroundIn3D, ); addCheckbox("Show default annotations", viewer.showDefaultAnnotations); addCheckbox( diff --git a/src/viewer.ts b/src/viewer.ts index f7d808492..13ad11ca4 100644 --- a/src/viewer.ts +++ b/src/viewer.ts @@ -301,8 +301,8 @@ class TrackableViewerState extends CompoundTrackable { this.add("showSlices", viewer.showPerspectiveSliceViews); this.add( - "hideTransparentPerspectiveSliceViews", - viewer.hideTransparentPerspectiveSliceViews, + "hideCrossSectionBackgroundIn3D", + viewer.hideCrossSectionBackgroundIn3D, ); this.add( "gpuMemoryLimit", @@ -466,7 +466,7 @@ export class Viewer extends RefCounted implements ViewerState { enableAdaptiveDownsampling = new TrackableBoolean(true, true); showScaleBar = new TrackableBoolean(true, true); showPerspectiveSliceViews = new TrackableBoolean(true, true); - hideTransparentPerspectiveSliceViews = new TrackableBoolean(false, false); + hideCrossSectionBackgroundIn3D = new TrackableBoolean(false, false); visibleLayerRoles = allRenderLayerRoles(); showDefaultAnnotations = new TrackableBoolean(true, true); crossSectionBackgroundColor = new TrackableRGB( @@ -1099,6 +1099,9 @@ export class Viewer extends RefCounted implements ViewerState { this.showPerspectiveSliceViews.toggle(), ); this.bindAction("toggle-show-statistics", () => this.showStatistics()); + this.bindAction("toggle-hide-cross-section-background-3d", () => + this.hideCrossSectionBackgroundIn3D.toggle(), + ); } toggleHelpPanel() { From f1700337bb65499ddb34be07339a0ed599ad7c36 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Thu, 14 Nov 2024 10:03:20 +0100 Subject: [PATCH 11/14] feat(ui): shorter setting name --- src/ui/viewer_settings.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ui/viewer_settings.ts b/src/ui/viewer_settings.ts index 4433e18da..3449e9501 100644 --- a/src/ui/viewer_settings.ts +++ b/src/ui/viewer_settings.ts @@ -119,7 +119,7 @@ export class ViewerSettingsPanel extends SidePanel { addCheckbox("Show scale bar", viewer.showScaleBar); addCheckbox("Show cross sections in 3-d", viewer.showPerspectiveSliceViews); addCheckbox( - "Hide cross section background 3-d", + "Hide sections background 3-d", viewer.hideCrossSectionBackgroundIn3D, ); addCheckbox("Show default annotations", viewer.showDefaultAnnotations); From bc9edd526533999d25e4d18c4a34b80d0a808012 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Mon, 16 Dec 2024 12:19:29 +0100 Subject: [PATCH 12/14] feat: reverse hide 3d cross section flag. This means the default would be to hide areas of the cross sectiont that are transparent in 3D --- src/viewer.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/viewer.ts b/src/viewer.ts index 13ad11ca4..16a9e4ab8 100644 --- a/src/viewer.ts +++ b/src/viewer.ts @@ -466,7 +466,7 @@ export class Viewer extends RefCounted implements ViewerState { enableAdaptiveDownsampling = new TrackableBoolean(true, true); showScaleBar = new TrackableBoolean(true, true); showPerspectiveSliceViews = new TrackableBoolean(true, true); - hideCrossSectionBackgroundIn3D = new TrackableBoolean(false, false); + hideCrossSectionBackgroundIn3D = new TrackableBoolean(true, true); visibleLayerRoles = allRenderLayerRoles(); showDefaultAnnotations = new TrackableBoolean(true, true); crossSectionBackgroundColor = new TrackableRGB( From dafb76c4625faf7e1ecd0419d0fd68023dd0dae1 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Wed, 18 Dec 2024 12:05:27 +0100 Subject: [PATCH 13/14] fix: correct problems after main merge --- src/perspective_view/panel.ts | 19 ++++++++++--------- src/sliceview/frontend.ts | 3 +-- src/sliceview/panel.ts | 20 ++++++++++++-------- 3 files changed, 23 insertions(+), 19 deletions(-) diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index 248b616be..8b52bcb72 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -271,6 +271,7 @@ class PerspectiveViewState extends PerspectiveViewStateBase { export class PerspectivePanel extends RenderedDataPanel { declare viewer: PerspectiveViewerState; + sliceViewRenderHelper: SliceViewRenderHelper; projectionParameters: Owned; @@ -322,15 +323,6 @@ export class PerspectivePanel extends RenderedDataPanel { ); private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); - sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get( - this.gl, - perspectivePanelEmit, - this.viewer, - true /*perspectivePanel*/, - ), - ); - protected offscreenFramebuffer = this.registerDisposer( new FramebufferConfiguration(this.gl, { colorBuffers: [ @@ -412,6 +404,15 @@ export class PerspectivePanel extends RenderedDataPanel { viewer: PerspectiveViewerState, ) { super(context, element, viewer); + this.sliceViewRenderHelper = this.registerDisposer( + SliceViewRenderHelper.get( + this.gl, + perspectivePanelEmit, + this.viewer, + true /*perspectivePanel*/, + ), + ); + this.projectionParameters = this.registerDisposer( new DerivedProjectionParameters({ navigationState: this.navigationState, diff --git a/src/sliceview/frontend.ts b/src/sliceview/frontend.ts index bad295d96..385c016ef 100644 --- a/src/sliceview/frontend.ts +++ b/src/sliceview/frontend.ts @@ -722,7 +722,6 @@ export class SliceViewChunk extends Chunk { */ export class SliceViewRenderHelper extends RefCounted { private copyVertexPositionsBuffer; - private shader: ShaderProgram; private textureCoordinateAdjustment = new Float32Array(4); private shaderGetter: ParameterizedContextDependentShaderGetter< @@ -736,7 +735,6 @@ export class SliceViewRenderHelper extends RefCounted { isProjection: boolean, emitter: ShaderModule, ) { - this.copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); builder.addVarying("vec2", "vTexCoord"); builder.addUniform("sampler2D", "uSampler"); builder.addInitializer((shader) => { @@ -782,6 +780,7 @@ gl_Position = uProjectionMatrix * aVertexPosition; ) { super(); + this.copyVertexPositionsBuffer = getSquareCornersBuffer(this.gl); this.shaderGetter = parameterizedContextDependentShaderGetter( this, this.gl, diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index 75409f610..3dbd1ca5d 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -102,16 +102,10 @@ const tempVec4 = vec4.create(); export class SliceViewPanel extends RenderedDataPanel { declare viewer: SliceViewerState; + private sliceViewRenderHelper; private axesLineHelper = this.registerDisposer(AxesLineHelper.get(this.gl)); - private sliceViewRenderHelper = this.registerDisposer( - SliceViewRenderHelper.get( - this.gl, - sliceViewPanelEmitColor, - this.viewer, - false /*sliceViewPanel*/, - ), - ); + private colorFactor = vec4.fromValues(1, 1, 1, 1); private pickIDs = new PickIDManager(); @@ -173,6 +167,16 @@ export class SliceViewPanel extends RenderedDataPanel { viewer: SliceViewerState, ) { super(context, element, viewer); + + this.sliceViewRenderHelper = this.registerDisposer( + SliceViewRenderHelper.get( + this.gl, + sliceViewPanelEmitColor, + this.viewer, + false /*sliceViewPanel*/, + ), + ); + viewer.wireFrame.changed.add(() => this.scheduleRedraw()); viewer.hideCrossSectionBackgroundIn3D.changed.add(() => this.scheduleRedraw(), From 247f8e72aca7fa82c70575af024883c4c5c80e87 Mon Sep 17 00:00:00 2001 From: Sean Martin Date: Wed, 18 Dec 2024 12:34:01 +0100 Subject: [PATCH 14/14] chore: formatting --- src/data_panel_layout.ts | 3 +-- src/layer_groups_layout.ts | 3 +-- src/ui/default_input_event_bindings.ts | 2 +- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/data_panel_layout.ts b/src/data_panel_layout.ts index 9789c5501..169c4c95a 100644 --- a/src/data_panel_layout.ts +++ b/src/data_panel_layout.ts @@ -181,8 +181,7 @@ export function getCommonViewerState(viewer: ViewerUIState) { selectedLayer: viewer.selectedLayer, visibility: viewer.visibility, scaleBarOptions: viewer.scaleBarOptions, - hideCrossSectionBackgroundIn3D: - viewer.hideCrossSectionBackgroundIn3D, + hideCrossSectionBackgroundIn3D: viewer.hideCrossSectionBackgroundIn3D, }; } diff --git a/src/layer_groups_layout.ts b/src/layer_groups_layout.ts index b3c38082a..cee123e1e 100644 --- a/src/layer_groups_layout.ts +++ b/src/layer_groups_layout.ts @@ -420,8 +420,7 @@ function getCommonViewerState(viewer: Viewer) { velocity: viewer.velocity.addRef(), crossSectionBackgroundColor: viewer.crossSectionBackgroundColor, perspectiveViewBackgroundColor: viewer.perspectiveViewBackgroundColor, - hideCrossSectionBackgroundIn3D: - viewer.hideCrossSectionBackgroundIn3D, + hideCrossSectionBackgroundIn3D: viewer.hideCrossSectionBackgroundIn3D, }; } diff --git a/src/ui/default_input_event_bindings.ts b/src/ui/default_input_event_bindings.ts index b6cdc378a..0ac3938b1 100644 --- a/src/ui/default_input_event_bindings.ts +++ b/src/ui/default_input_event_bindings.ts @@ -29,7 +29,7 @@ export function getDefaultGlobalBindings() { map.set("keyv", "toggle-default-annotations"); map.set("keya", "toggle-axis-lines"); map.set("keyo", "toggle-orthographic-projection"); - map.set("keyt", "toggle-hide-cross-section-background-3d") + map.set("keyt", "toggle-hide-cross-section-background-3d"); for (let i = 1; i <= 9; ++i) { map.set("digit" + i, "toggle-layer-" + i);