From d7ed257dd5bafad9f26566c1fda4a4f8f33fb049 Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Wed, 7 Jul 2021 10:21:56 -0700 Subject: [PATCH 01/16] add Flow babel configs --- packages/regl-worldview/babel.config.json | 23 +++++++++++++++++++++++ packages/webviz-core/babel.config.json | 23 +++++++++++++++++++++++ 2 files changed, 46 insertions(+) create mode 100644 packages/regl-worldview/babel.config.json create mode 100644 packages/webviz-core/babel.config.json diff --git a/packages/regl-worldview/babel.config.json b/packages/regl-worldview/babel.config.json new file mode 100644 index 000000000..89631db67 --- /dev/null +++ b/packages/regl-worldview/babel.config.json @@ -0,0 +1,23 @@ +{ + "presets": [ + "@babel/react", + "@babel/flow", + [ + "@babel/preset-env", + { + "corejs": 3, + "useBuiltIns": "usage" + } + ] + ], + "plugins": ["@babel/plugin-proposal-class-properties"], + "env": { + "test": { + "presets": [ + "@babel/react", + "@babel/flow", + ["@babel/preset-env", { "targets": { "node": "current" } }] + ] + } + } +} diff --git a/packages/webviz-core/babel.config.json b/packages/webviz-core/babel.config.json new file mode 100644 index 000000000..89631db67 --- /dev/null +++ b/packages/webviz-core/babel.config.json @@ -0,0 +1,23 @@ +{ + "presets": [ + "@babel/react", + "@babel/flow", + [ + "@babel/preset-env", + { + "corejs": 3, + "useBuiltIns": "usage" + } + ] + ], + "plugins": ["@babel/plugin-proposal-class-properties"], + "env": { + "test": { + "presets": [ + "@babel/react", + "@babel/flow", + ["@babel/preset-env", { "targets": { "node": "current" } }] + ] + } + } +} From 94b4d1999a711ab493b337bd3d435e0a39866b2d Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Thu, 15 Jul 2021 13:54:58 -0700 Subject: [PATCH 02/16] Trigger import of Buffer --- packages/webviz-core/src/util/binaryObjects/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/webviz-core/src/util/binaryObjects/index.js b/packages/webviz-core/src/util/binaryObjects/index.js index 4e8fd75dd..1ba71e905 100644 --- a/packages/webviz-core/src/util/binaryObjects/index.js +++ b/packages/webviz-core/src/util/binaryObjects/index.js @@ -27,6 +27,7 @@ const parseJson = (s) => { return `Could not parse ${JSON.stringify(s)}`; } }; +const buffer = new Buffer([]) const context = { Buffer, getArrayView, deepParse: deepParseSymbol, int53, associateDatatypes, parseJson }; export type { ArrayView }; From 25f5a8ab43b9f19355a71d26d8d48736fb4395d6 Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Tue, 20 Jul 2021 10:09:43 -0700 Subject: [PATCH 03/16] basic regl-worldview types --- packages/regl-worldview/index.d.ts | 288 +++++++++++++++++++++++++++++ 1 file changed, 288 insertions(+) create mode 100644 packages/regl-worldview/index.d.ts diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts new file mode 100644 index 000000000..319d20883 --- /dev/null +++ b/packages/regl-worldview/index.d.ts @@ -0,0 +1,288 @@ +import { $Shape, $Diff } from "utility-types"; +import { Regl } from "regl"; + +export class Ray { + origin: Vec3; + dir: Vec3; + point: Vec3; + + constructor(origin: Vec3, dir: Vec3, point: Vec3); + distanceToPoint(point: Vec3): number; + planeIntersection(planeCoordinate: Vec3, planeNormal: Vec3): Vec3 | null | undefined; +} + +export type CameraState = { + distance: number; + perspective: boolean; + phi: number; + target: Vec3; + targetOffset: Vec3; + targetOrientation: Vec4; + thetaOffset: number; + fovy: number; + near: number; + far: number; +}; + +export const DEFAULT_CAMERA_STATE: CameraState; + +export type Dimensions = { + width: number; + height: number; + left: number; + top: number; +}; + +export type ReglBuffer = any; + +export type ReglFBOFn = ( + regl: Regl, + source: ReglBuffer, + destination: ReglBuffer | null | undefined +) => (width: number, height: number) => void; + +// Unused ?? +export type CompiledReglCommand = (props: T, context: any) => void; +export type ReglFn = (arg0: ReglCommand) => CompiledReglCommand; +//////////// + +export type CompiledCommand = (T) => void; +export type RawCommand = (regl: Regl) => CompiledCommand; + +export type CommandProps = Record; +export type CommandDict = Record>; + +// [left, top, width, height] +export type Vec2 = [number, number]; +export type Vec3 = [number, number, number]; +export type Vec4 = [number, number, number, number]; +export type Viewport = Vec4; +export type Mat4 = [ + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number, + number +]; + +export interface CameraCommand { + getProjection(): Mat4; + getView(): Mat4; + toScreenCoord( + viewport: Viewport, + point: Vec3, + cameraProjection: Mat4 | null | undefined, + cameraView: Mat4 | null | undefined + ): Vec3 | null | undefined; + draw(props: {}, arg1: (ctx: any) => void): void; +} + +export type ReglContext = { + regl: ReglFn; + camera: CameraCommand; + commands: CommandDict; +}; + +export type ArrowSize = { + shaftLength: number; + shaftWidth: number; + headLength: number; + headWidth: number; +}; +type ClickedObject = { + object: Record; + instanceIndex?: number | null | undefined; +}; +export type ReglClickInfo = { + ray: Ray; + objects: Array; +}; +export type ComponentReglClickInfo = { + ray: Ray; + objects: Array; +}; +export type MouseHandler = (arg0: React.MouseEvent, arg1: ReglClickInfo) => void; +export type ComponentMouseHandler = (arg0: React.MouseEvent, arg1: ComponentReglClickInfo) => void; +export type Coordinate = [number, number]; +export type Point = { + x: number; + y: number; + z: number; +}; +export type Position = Point; +export type Orientation = { + x: number; + y: number; + z: number; + w: number; +}; +export type Scale = { + x: number; + y: number; + z: number; +}; +export type Color = { + r: number; + g: number; + b: number; + a: number; +}; +export type Pose = { + position: Position; + orientation: Orientation; +}; +export type BaseShape = { + pose: Pose; + scale: Scale; + color?: Color; +}; +type Points = Point[]; +export type Arrow = BaseShape & { + points?: Points; + interactionData?: any; +}; +export type Cube = BaseShape & { + colors?: Color[]; + points?: Points; +}; +export type Cone = BaseShape & { + colors?: Color[]; + points?: Points; +}; +export type Cylinder = BaseShape & { + colors?: Color[]; + points?: Points; +}; +export type Line = BaseShape & { + points: Points; + poses?: Pose[]; +}; +export type PointType = BaseShape & { + colors?: Color[]; + points?: Points; +}; +export type SphereList = BaseShape & { + points?: Points; +}; +export type TriangleList = BaseShape & { + points?: Points; + colors?: Color[]; + // Pass true to not render the triangles to the screen - just the hitmap. + onlyRenderInHitmap?: boolean; +}; +export type PolygonType = BaseShape & { + points?: Points; +}; +export type MouseEventObject = { + object: BaseShape; + instanceIndex: number | null | undefined; +}; +export type DepthState = { + enable?: boolean; + mask?: boolean; +}; +export type BlendFuncValue = string | number; +export type BlendState = { + enable?: boolean; + func?: + | BlendFuncValue + | { + src?: BlendFuncValue; + dst?: BlendFuncValue; + srcAlpha?: BlendFuncValue; + srcRGB?: BlendFuncValue; + dstRGB?: BlendFuncValue; + dstAlpha?: BlendFuncValue; + }; + equation?: + | string + | { + rgb: string; + alpha: string; + }; + color?: Vec4; +}; +export type ObjectHitmapId = number; + +/* + * object: the object to pass to event callbacks when this object is interacted with. + * count: How many colors to map to the callback object. If this is greater than 1, this assigns instance indices for + the object. + * return type: an array of the colors assigned. + */ +export type AssignNextColorsFn = (object: Record, count: number) => Vec4[]; +export type GetChildrenForHitmap = (prop: T, arg1: AssignNextColorsFn, arg2: MouseEventObject[]) => T; +export type MouseEventEnum = "onClick" | "onMouseUp" | "onMouseMove" | "onMouseDown" | "onDoubleClick"; +export type CameraAction = + | "moveDown" + | "moveLeft" + | "moveRight" + | "moveUp" + | "rotateLeft" + | "rotateRight" + | "tiltDown" + | "tiltUp" + | "zoomIn" + | "zoomOut"; +export type CameraKeyMap = Record; + +export type BaseProps = Dimensions & { + keyMap?: CameraKeyMap; + shiftKeys: boolean; + useFrames?: boolean; + backgroundColor?: Vec4; + // (Deprecated) rendering the hitmap on mouse move is expensive, so disable it by default + hitmapOnMouseMove?: boolean; + // Disable hitmap generation for specific mouse events + // For example, if you want to disable hitmap generating on drag, use: ["onMouseDown", "onMouseMove", "onMouseUp"] + disableHitmapForEvents?: MouseEventEnum[]; + // getting events for objects stacked on top of each other is expensive, so disable it by default + enableStackedObjectEvents?: boolean; + // allow users to specify the max stacked object count + maxStackedObjectCount: number; + showDebug?: boolean; + children?: React.ReactNode; + style: Record; + cameraState?: $Shape; + onCameraStateChange?: (arg0: CameraState) => void; + defaultCameraState?: $Shape; + // Pass in custom camera matrices + cameraView?: Mat4; + cameraProjection?: Mat4; + // FBO passes + fboCommand?: ReglFBOFn; + // interactions + onDoubleClick?: MouseHandler; + onMouseDown?: MouseHandler; + onMouseUp?: MouseHandler; + onMouseMove?: MouseHandler; + onClick?: MouseHandler; + // Used to scale the canvas resolution and provide a higher image quality + resolutionScale?: number; + // Context attributes passed into canvas.getContext. + contextAttributes?: Record | null | undefined; + canvas?: HTMLCanvasElement; +}; + +export type Props = $Diff< + JSX.LibraryManagedAttributes>, + Dimensions +>; + +export declare class Command extends React.PureComponent<{ + reglCommand: RawCommand; + children: T; +}> { + render(): JSX.Element; +} From 200b3fb2e1b4aead61325571c21c5697d2a7c190 Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Tue, 20 Jul 2021 11:25:15 -0700 Subject: [PATCH 04/16] more utils --- packages/regl-worldview/index.d.ts | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index 319d20883..a23c24e3b 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -1,4 +1,5 @@ import { $Shape, $Diff } from "utility-types"; +import * as REGL from "regl"; import { Regl } from "regl"; export class Ray { @@ -279,9 +280,15 @@ export type Props = $Diff< JSX.LibraryManagedAttributes>, Dimensions >; +export declare function shouldConvert(point: Point | Vec4): boolean; +export declare function pointToVec3(point: Point): Vec3; +export declare function withPose( + drawConfig: REGL.DrawConfig +): REGL.DrawConfig; export declare class Command extends React.PureComponent<{ reglCommand: RawCommand; + layerIndex?: number; children: T; }> { render(): JSX.Element; From 7e9a8abef606cac16113598fcc199a5a97b1eb7e Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Wed, 21 Jul 2021 12:51:18 -0700 Subject: [PATCH 05/16] more regl-worldview typings --- packages/regl-worldview/index.d.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index a23c24e3b..0026e9e15 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -289,7 +289,13 @@ export declare function withPose( export declare class Command extends React.PureComponent<{ reglCommand: RawCommand; layerIndex?: number; - children: T; + drawProps?: T; + children?: T; }> { render(): JSX.Element; } + +export declare const defaultBlend: REGL.BlendingOptions; +export declare const defaultReglDepth: REGL.BlendingOptions; +export declare const defaultReglBlend: REGL.BlendingOptions; +export declare function toRGBA(color: Color): Vec4; From 47a17d0764e08f38fcace9a730aca0fbdd94ef20 Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Wed, 21 Jul 2021 13:59:51 -0700 Subject: [PATCH 06/16] more types --- packages/regl-worldview/index.d.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index 0026e9e15..e10b79ff1 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -296,6 +296,10 @@ export declare class Command extends React.PureComponent<{ } export declare const defaultBlend: REGL.BlendingOptions; +export declare const defaultDepth: REGL.DepthTestOptions; export declare const defaultReglDepth: REGL.BlendingOptions; export declare const defaultReglBlend: REGL.BlendingOptions; export declare function toRGBA(color: Color): Vec4; +export declare function vec4ToOrientation(point: Vec4): Orientation; +export declare function vec3ToPoint(point: Vec3): Point; +export declare function vec4ToRGBA(point: Vec4): Color; From cc522c652c4a55230485ccf2dd9b52c9e3b460f3 Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Thu, 22 Jul 2021 10:49:04 -0700 Subject: [PATCH 07/16] more types --- packages/regl-worldview/index.d.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index e10b79ff1..f3e116ab3 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -303,3 +303,9 @@ export declare function toRGBA(color: Color): Vec4; export declare function vec4ToOrientation(point: Vec4): Orientation; export declare function vec3ToPoint(point: Vec3): Point; export declare function vec4ToRGBA(point: Vec4): Color; +export declare function fromGeometry( + positions: Vec3[], + elements: Vec3[] +): RawCommand<{ + color?: Vec4; +}>; From 65a9acfcd17d3c84a2727e89892cf0c10433651a Mon Sep 17 00:00:00 2001 From: Caleb Foust Date: Thu, 22 Jul 2021 11:33:17 -0700 Subject: [PATCH 08/16] type Worldview --- packages/regl-worldview/index.d.ts | 92 ++++++++++++++++++++++++++++++ 1 file changed, 92 insertions(+) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index f3e116ab3..c5dfea3d7 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -144,6 +144,8 @@ export type Pose = { orientation: Orientation; }; export type BaseShape = { + id?: string | number; + frame_id?: string; pose: Pose; scale: Scale; color?: Color; @@ -166,6 +168,7 @@ export type Cylinder = BaseShape & { points?: Points; }; export type Line = BaseShape & { + primitive?: REGL.PrimitiveType; points: Points; poses?: Pose[]; }; @@ -294,6 +297,94 @@ export declare class Command extends React.PureComponent<{ }> { render(): JSX.Element; } +export declare type TextMarker = { + name?: string; + pose: Pose; + scale: Scale; + color?: Color | Vec4; + colors?: (Color | Vec4)[]; + text: string; +}; + +type ShapeComponent = React.ComponentType<{ + children: T[]; +}>; +export declare const Arrows: ShapeComponent; +export declare const Cubes: ShapeComponent; +export declare const Cylinders: ShapeComponent; +export declare const Axes: React.ComponentType<{}>; +export declare const Lines: ShapeComponent; +export declare const Spheres: ShapeComponent; +export declare const Text: React.ComponentType<{ + children: TextMarker[]; + autoBackgroundColor?: boolean; +}>; +export declare const Triangles: ShapeComponent; +export declare const Text: React.ComponentType<{ + children: TextMarker[]; + autoBackgroundColor?: boolean; +}>; +export declare const GLTFScene: React.ComponentType<{ + model: string | ((arg0: string) => Promise); + onClick?: MouseHandler; + onDoubleClick?: MouseHandler; + onMouseDown?: MouseHandler; + onMouseMove?: MouseHandler; + onMouseUp?: MouseHandler; + children: { + pose?: Pose; + poseMatrix?: Mat4; + scale: Scale; + alpha?: ?number; + localTransform?: Mat4; + color?: Color | Vec4; + }; +}>; + +declare const Worldview: React.ComponentType<{ + keyMap?: CameraKeyMap; + shiftKeys?: boolean; + useFrames?: boolean; + backgroundColor?: Vec4; + // (Deprecated) rendering the hitmap on mouse move is expensive, so disable it by default + hitmapOnMouseMove?: boolean; + // Disable hitmap generation for specific mouse events + // For example, if you want to disable hitmap generating on drag, use: ["onMouseDown", "onMouseMove", "onMouseUp"] + disableHitmapForEvents?: MouseEventEnum[]; + // getting events for objects stacked on top of each other is expensive, so disable it by default + enableStackedObjectEvents?: boolean; + // allow users to specify the max stacked object count + maxStackedObjectCount?: number; + showDebug?: boolean; + children?: React.Node; + style?: { [styleAttribute: string]: number | string }; + + cameraState?: $Shape; + onCameraStateChange?: (CameraState) => void; + defaultCameraState?: $Shape; + + // Pass in custom camera matrices + cameraView?: Mat4; + cameraProjection?: Mat4; + + // FBO passes + fboCommand?: ReglFBOFn; + + // interactions + onDoubleClick?: MouseHandler; + onMouseDown?: MouseHandler; + onMouseUp?: MouseHandler; + onMouseMove?: MouseHandler; + onClick?: MouseHandler; + + // Used to scale the canvas resolution and provide a higher image quality + resolutionScale?: number; + + // Context attributes passed into canvas.getContext. + contextAttributes?: ?Record; + canvas?: HTMLCanvasElement; +}>; +export default Worldview; export declare const defaultBlend: REGL.BlendingOptions; export declare const defaultDepth: REGL.DepthTestOptions; @@ -301,6 +392,7 @@ export declare const defaultReglDepth: REGL.BlendingOptions; export declare const defaultReglBlend: REGL.BlendingOptions; export declare function toRGBA(color: Color): Vec4; export declare function vec4ToOrientation(point: Vec4): Orientation; +export declare function orientationToVec4(point: Orientation): Vec4; export declare function vec3ToPoint(point: Vec3): Point; export declare function vec4ToRGBA(point: Vec4): Color; export declare function fromGeometry( From 96cdd171f38b50e8c6113fa7ef305b9c5337680b Mon Sep 17 00:00:00 2001 From: Max Takano Date: Tue, 3 Aug 2021 14:01:17 -0700 Subject: [PATCH 09/16] allow custom view matrix billboarding, remove poor GLText anti-aliasing --- packages/regl-worldview/index.d.ts | 4 ++-- packages/regl-worldview/src/camera/camera.js | 13 +++++++++++-- packages/regl-worldview/src/commands/GLText.js | 5 ++++- 3 files changed, 17 insertions(+), 5 deletions(-) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index c5dfea3d7..4a99a1476 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -315,12 +315,12 @@ export declare const Cylinders: ShapeComponent; export declare const Axes: React.ComponentType<{}>; export declare const Lines: ShapeComponent; export declare const Spheres: ShapeComponent; +export declare const Triangles: ShapeComponent; export declare const Text: React.ComponentType<{ children: TextMarker[]; autoBackgroundColor?: boolean; }>; -export declare const Triangles: ShapeComponent; -export declare const Text: React.ComponentType<{ +export declare const GLText: React.ComponentType<{ children: TextMarker[]; autoBackgroundColor?: boolean; }>; diff --git a/packages/regl-worldview/src/camera/camera.js b/packages/regl-worldview/src/camera/camera.js index 15b65c15e..805dd3f08 100755 --- a/packages/regl-worldview/src/camera/camera.js +++ b/packages/regl-worldview/src/camera/camera.js @@ -6,7 +6,7 @@ // found in the LICENSE file in the root directory of this source tree. // You may not use this file except in compliance with the License. -import { mat4 } from "gl-matrix"; +import { mat4, quat } from "gl-matrix"; import type { Vec3, Mat4, CameraCommand, Viewport } from "../types"; import getOrthographicBounds from "../utils/getOrthographicBounds"; @@ -79,7 +79,16 @@ export default (regl: any) => { // inverse of the view rotation, used for making objects always face the camera billboardRotation(context, props) { - return selectors.billboardRotation(this.cameraState); + const { cameraView } = props; + if (cameraView == null) return selectors.billboardRotation(this.cameraState); + // if a custom cameraView is being used, ignore cameraState for billboardRotation + // calculation. Instead, extract rotation from custom cameraView. + const orientation = mat4.getRotation(quat.create(), cameraView); + const m = mat4.identity(mat4.create()); + const TEMP_MAT = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]; + mat4.multiply(m, m, mat4.fromQuat(TEMP_MAT, orientation)); + mat4.rotateZ(m, m, Math.PI / 2); + return m; }, isPerspective(context, props) { diff --git a/packages/regl-worldview/src/commands/GLText.js b/packages/regl-worldview/src/commands/GLText.js index e13a205e9..ea1132b21 100644 --- a/packages/regl-worldview/src/commands/GLText.js +++ b/packages/regl-worldview/src/commands/GLText.js @@ -299,7 +299,10 @@ const frag = ` // fwidth(dist) is used to provide some anti-aliasing. However it's currently only used // when the solid background is enabled, because the alpha blending and // depth test don't work together nicely for partially-transparent pixels. - float edgeStep = smoothstep(1.0 - cutoff - fwidth(dist), 1.0 - cutoff, dist); + // 8/3/2021 Max - Disable hacky fwidth anti-aliasing. + // See: https://stackoverflow.com/questions/25956272/better-quality-text-in-webgl + // float edgeStep = smoothstep(1.0 - cutoff - fwidth(dist), 1.0 - cutoff, dist); + float edgeStep = dist; if (scaleInvariant && vBillboard == 1.0 && scaleInvariantSize <= 20.0) { // If scale invariant is enabled and scaleInvariantSize is "too small", do not interpolate From 4ba162dd246f63cf3f3856cca469b0f60c06ebcf Mon Sep 17 00:00:00 2001 From: Max Takano Date: Wed, 18 Aug 2021 22:29:33 -0700 Subject: [PATCH 10/16] update billboarding for fixed cameraView --- packages/regl-worldview/src/camera/camera.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/regl-worldview/src/camera/camera.js b/packages/regl-worldview/src/camera/camera.js index 805dd3f08..0fd97b6b7 100755 --- a/packages/regl-worldview/src/camera/camera.js +++ b/packages/regl-worldview/src/camera/camera.js @@ -84,10 +84,15 @@ export default (regl: any) => { // if a custom cameraView is being used, ignore cameraState for billboardRotation // calculation. Instead, extract rotation from custom cameraView. const orientation = mat4.getRotation(quat.create(), cameraView); + const m = mat4.identity(mat4.create()); const TEMP_MAT = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]; - mat4.multiply(m, m, mat4.fromQuat(TEMP_MAT, orientation)); + mat4.rotateZ(m, m, Math.PI / 2); + mat4.rotateY(m, m, Math.PI / 2); + + mat4.multiply(m, m, mat4.fromQuat(TEMP_MAT, orientation)); + return m; }, From ce5901d14615dc4f14ab910f1e633273e2e3e76f Mon Sep 17 00:00:00 2001 From: Max Takano Date: Thu, 26 Aug 2021 14:19:16 -0700 Subject: [PATCH 11/16] add Points type --- packages/regl-worldview/index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index 4a99a1476..0b514617d 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -316,6 +316,7 @@ export declare const Axes: React.ComponentType<{}>; export declare const Lines: ShapeComponent; export declare const Spheres: ShapeComponent; export declare const Triangles: ShapeComponent; +export declare const Points: ShapeComponent; export declare const Text: React.ComponentType<{ children: TextMarker[]; autoBackgroundColor?: boolean; From 7ec947d447447af7e93ec019af0b3d8755673c38 Mon Sep 17 00:00:00 2001 From: Ashish Date: Wed, 15 Sep 2021 16:16:41 -0700 Subject: [PATCH 12/16] Make the component have an adjustable size --- packages/regl-worldview/index.d.ts | 4 ++++ packages/regl-worldview/src/commands/Grid.js | 12 +++++++----- 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/packages/regl-worldview/index.d.ts b/packages/regl-worldview/index.d.ts index 0b514617d..8c3bc8c26 100644 --- a/packages/regl-worldview/index.d.ts +++ b/packages/regl-worldview/index.d.ts @@ -317,6 +317,10 @@ export declare const Lines: ShapeComponent; export declare const Spheres: ShapeComponent; export declare const Triangles: ShapeComponent; export declare const Points: ShapeComponent; +export declare const Grid: React.ComponentType<{ + count: number + size: number, +}>; export declare const Text: React.ComponentType<{ children: TextMarker[]; autoBackgroundColor?: boolean; diff --git a/packages/regl-worldview/src/commands/Grid.js b/packages/regl-worldview/src/commands/Grid.js index 7b2486b32..b5511d405 100755 --- a/packages/regl-worldview/src/commands/Grid.js +++ b/packages/regl-worldview/src/commands/Grid.js @@ -41,9 +41,10 @@ export function grid() { primitive: "lines", attributes: { point: (context, props) => { + const { count, size } = props; const points = []; - const bound = props.count; - for (let i = -props.count; i < props.count; i++) { + const bound = count * size; + for (let i = -count * size; i < count * size; i += size) { points.push([-bound, i, 0]); points.push([bound, i, 0]); points.push([i, -bound, 0]); @@ -67,12 +68,13 @@ export function grid() { type Props = { ...CommonCommandProps, count: number, + size: number, }; // useful for rendering a grid for debugging in stories -export default function Grid({ count, ...rest }: Props): React.Node { - const children = { count }; +export default function Grid({ count, size, ...rest }: Props): React.Node { + const children = { count, size }; return ( // $FlowFixMe Not fixing existing regl-worldview bugs. @@ -81,4 +83,4 @@ export default function Grid({ count, ...rest }: Props): React.Node { ); } -Grid.defaultProps = { count: 6 }; +Grid.defaultProps = { count: 6, size: 30 }; From 2036788deb31df7c1a75352d7c49a2887610f56b Mon Sep 17 00:00:00 2001 From: Doel Gonzalez Date: Mon, 4 Oct 2021 14:18:13 -0700 Subject: [PATCH 13/16] Bump eslint-plugin-react-hooks --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 44d89d9c6..d3cc83121 100755 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "eslint-plugin-jest": "^22.0.1", "eslint-plugin-prettier": "^3.0.0", "eslint-plugin-react": "^7.11.1", - "eslint-plugin-react-hooks": "^1.6.0", + "eslint-plugin-react-hooks": "4.2.0", "expect": "^24.9.0", "file-loader": "^4.0.0", "flow-bin": "0.106.2", From 1261783f09bccadd09b0b9436bcc0bde37e28ee8 Mon Sep 17 00:00:00 2001 From: Doel Gonzalez Date: Mon, 4 Oct 2021 14:28:40 -0700 Subject: [PATCH 14/16] Remove unnecessary deps --- package.json | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/package.json b/package.json index d3cc83121..9aae5a155 100755 --- a/package.json +++ b/package.json @@ -34,18 +34,6 @@ "css-loader": "^1.0.1", "enzyme": "^3.9.0", "enzyme-adapter-react-16": "^1.15.2", - "eslint": "^5.9.0", - "eslint-config-prettier": "^3.3.0", - "eslint-config-problems": "^2.0.0", - "eslint-import-resolver-webpack": "^0.10.1", - "eslint-plugin-flowtype": "^3.2.0", - "eslint-plugin-header": "^2.0.0", - "eslint-plugin-import": "^2.14.0", - "eslint-plugin-import-order-alphabetical": "^0.0.2", - "eslint-plugin-jest": "^22.0.1", - "eslint-plugin-prettier": "^3.0.0", - "eslint-plugin-react": "^7.11.1", - "eslint-plugin-react-hooks": "4.2.0", "expect": "^24.9.0", "file-loader": "^4.0.0", "flow-bin": "0.106.2", From be187bd76382f28146c92044654095ad9d2eb026 Mon Sep 17 00:00:00 2001 From: Doel Gonzalez Date: Tue, 5 Oct 2021 06:05:38 -0700 Subject: [PATCH 15/16] Remove additional linter --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 9aae5a155..9b3ed4b5e 100755 --- a/package.json +++ b/package.json @@ -27,7 +27,6 @@ "@storybook/react": "^5.3.19", "autoprefixer": "^9.4.2", "babel-core": "^7.0.0-bridge.0", - "babel-eslint": "^10.0.1", "babel-jest": "^23.4.2", "babel-loader": "^8.0.4", "case-sensitive-paths-webpack-plugin": "^2.1.2", From 04e3231748872f11d2426460423096386f0e08b9 Mon Sep 17 00:00:00 2001 From: Doel Gonzalez Date: Tue, 5 Oct 2021 06:08:30 -0700 Subject: [PATCH 16/16] Remove additional babel plugin reference --- packages/webviz-core/package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/webviz-core/package.json b/packages/webviz-core/package.json index 2014d0282..ecb20baf1 100644 --- a/packages/webviz-core/package.json +++ b/packages/webviz-core/package.json @@ -93,7 +93,6 @@ "devDependencies": { "@babel/register": "7.11.5", "@testing-library/react-hooks": "1.1.0", - "eslint-plugin-react-hooks": "^1.5.0", "fake-indexeddb": "2.0.4", "fetch-mock": "7.2.5", "flow-bin": "0.106.2",