Update to latest WebGPU. Fix bugs in distance viewport configuration panel.... (46c66a18) · Commits · Visitlab / Chromatin / chromoskein

app/package-lock.json

+7 −7

Original line number	Original line	Diff line number	Diff line
	@@ -71,7 +71,7 @@
	"@types/uuid": "^8.3.4",		"@types/uuid": "^8.3.4",
	"@typescript-eslint/eslint-plugin": "^4.30.0",		"@typescript-eslint/eslint-plugin": "^4.30.0",
	"@typescript-eslint/parser": "^4.30.0",		"@typescript-eslint/parser": "^4.30.0",
	"@webgpu/types": "^0.1.21",		"@webgpu/types": "^0.1.30",
	"css-loader": "^6.2.0",		"css-loader": "^6.2.0",
	"eslint": "^7.32.0",		"eslint": "^7.32.0",
	"eslint-plugin-react": "^7.25.1",		"eslint-plugin-react": "^7.25.1",
	@@ -1981,9 +1981,9 @@
	}		}
	},		},
	"node_modules/@webgpu/types": {		"node_modules/@webgpu/types": {
	"version": "0.1.21",		"version": "0.1.30",
	"resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.21.tgz",		"resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.30.tgz",
	"integrity": "sha512-pUrWq3V5PiSGFLeLxoGqReTZmiiXwY3jRkIG5sLLKjyqNxrwm/04b4nw7LSmGWJcKk59XOM/YRTUwOzo4MMlow==",		"integrity": "sha512-9AXJSmL3MzY8ZL//JjudA//q+2kBRGhLBFpkdGksWIuxrMy81nFrCzj2Am+mbh8WoU6rXmv7cY5E3rdlyru2Qg==",
	"dev": true		"dev": true
	},		},
	"node_modules/@webpack-cli/configtest": {		"node_modules/@webpack-cli/configtest": {
	@@ -11942,9 +11942,9 @@
	}		}
	},		},
	"@webgpu/types": {		"@webgpu/types": {
	"version": "0.1.21",		"version": "0.1.30",
	"resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.21.tgz",		"resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.30.tgz",
	"integrity": "sha512-pUrWq3V5PiSGFLeLxoGqReTZmiiXwY3jRkIG5sLLKjyqNxrwm/04b4nw7LSmGWJcKk59XOM/YRTUwOzo4MMlow==",		"integrity": "sha512-9AXJSmL3MzY8ZL//JjudA//q+2kBRGhLBFpkdGksWIuxrMy81nFrCzj2Am+mbh8WoU6rXmv7cY5E3rdlyru2Qg==",
	"dev": true		"dev": true
	},		},
	"@webpack-cli/configtest": {		"@webpack-cli/configtest": {

app/package.json

+1 −1

Original line number	Original line	Diff line number	Diff line
	@@ -75,7 +75,7 @@
	"@types/uuid": "^8.3.4",		"@types/uuid": "^8.3.4",
	"@typescript-eslint/eslint-plugin": "^4.30.0",		"@typescript-eslint/eslint-plugin": "^4.30.0",
	"@typescript-eslint/parser": "^4.30.0",		"@typescript-eslint/parser": "^4.30.0",
	"@webgpu/types": "^0.1.21",		"@webgpu/types": "^0.1.30",
	"css-loader": "^6.2.0",		"css-loader": "^6.2.0",
	"eslint": "^7.32.0",		"eslint": "^7.32.0",
	"eslint-plugin-react": "^7.25.1",		"eslint-plugin-react": "^7.25.1",

app/src/components/RightPanel/tracks/SelectionsTrack.tsx

+1 −1

Original line number	Original line	Diff line number	Diff line
	@@ -87,7 +87,7 @@ export function SelectionsTrack(props: {
	onChange={addSelection}		onChange={addSelection}
	/><div className="treeViewList" style={{ marginTop: '16px' }}>		/><div className="treeViewList" style={{ marginTop: '16px' }}>
	{track.type == TrackType.Selections && (selections.map(selection => {		{track.type == TrackType.Selections && (selections.map(selection => {
	return <div className="treeViewListItem" key={isoSelectionID.unwrap(selection.id)} onClick={() => selectSelection(selection.id)}>		return <div className={`treeViewListItem ${selection.id === configuration.selectedSelectionID ? "selected" : ""}`} key={isoSelectionID.unwrap(selection.id).toString()} onClick={() => selectSelection(selection.id)}>
	<DefaultButton id="selectionColorButton"		<DefaultButton id="selectionColorButton"
	style={{		style={{
	padding: 0,		padding: 0,

app/src/components/viewports/ChromatinViewport.tsx

+16 −16

Original line number	Original line	Diff line number	Diff line
	@@ -102,22 +102,22 @@ export function ChromatinViewport(props: {
	}, [props.graphicsLibrary, props.configurationID, canvasElement]);		}, [props.graphicsLibrary, props.configurationID, canvasElement]);

	// Camera Update		// Camera Update
	useDeepCompareEffect(() => {		// useDeepCompareEffect(() => {
	viewport.cameraConfiguration = configuration.camera;		// viewport.cameraConfiguration = configuration.camera;
	}, [configuration.camera]);		// }, [configuration.camera]);

	useDeepCompareEffect(() => {		// useDeepCompareEffect(() => {
	if (!viewport.camera \|\| !viewport.canvas) return;		// if (!viewport.camera \|\| !viewport.canvas) return;

	const timer = setTimeout(() => {		// const timer = setTimeout(() => {
	updateConfiguration({		// updateConfiguration({
	...configuration,		// ...configuration,
	camera: viewport.cameraConfiguration		// camera: viewport.cameraConfiguration
	});		// });
	}, 500)		// }, 500)

	return () => clearTimeout(timer);		// return () => clearTimeout(timer);
	}, [viewport.cameraConfiguration]);		// }, [viewport.cameraConfiguration]);

	// Disable camera if control is pressed		// Disable camera if control is pressed
	useEffect(() => {		useEffect(() => {

libs/graphics/src/labeling/debugViewport.ts

+15 −15

Original line number	Original line	Diff line number	Diff line
	@@ -44,21 +44,21 @@ export class DebugViewport {
	}		}

	private reconfigureContext(width: number, height: number): void {		private reconfigureContext(width: number, height: number): void {
	if (!this._context) return;		// if (!this._context) return;

	if (width <= 0 \|\| height <= 0) return;		// if (width <= 0 \|\| height <= 0) return;

	console.log("Reconfiguring context:" + width + " x " + height)		// console.log("Reconfiguring context:" + width + " x " + height)
	this._context.configure({		// this._context.configure({
	device: this.graphicsLibrary.device,		// device: this.graphicsLibrary.device,
	format: 'bgra8unorm',		// format: 'bgra8unorm',
	usage: GPUTextureUsage.RENDER_ATTACHMENT,		// usage: GPUTextureUsage.RENDER_ATTACHMENT,
	compositingAlphaMode: "opaque",		// compositingAlphaMode: "opaque",
	size: {		// size: {
	width: width,		// width: width,
	height: height,		// height: height,
	}		// }
	});		// });
	}		}

	async render(frametime: number): Promise<void> {		async render(frametime: number): Promise<void> {