-
Notifications
You must be signed in to change notification settings - Fork 102
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
13 changed files
with
253 additions
and
114 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,53 @@ | ||
import { Scene } from "@babylonjs/core/scene.js"; | ||
import { Nullable } from "@babylonjs/core/types.js"; | ||
import { Grid } from "@babylonjs/gui/2D/controls/grid.js"; | ||
import { ValueAndUnit } from "@babylonjs/gui/2D/valueAndUnit.js"; | ||
import { RowOrColumnDefinitionProps, RowOrColumnDefinitionPropsHandler } from "."; | ||
import { CreatedInstance } from "../../CreatedInstance"; | ||
import { DynamicHost } from "../../HostRegistrationStore"; | ||
import DeferredCreationLifecycleListener from "../DeferredCreationLifecycleListener"; | ||
|
||
/** | ||
* We delay instantiation and when parented add a column definition to parent "Grid". | ||
*/ | ||
export default class ColumnDefinitionLifecycleListener extends DeferredCreationLifecycleListener<ValueAndUnit, any> { | ||
|
||
private _grid: Grid | undefined; | ||
|
||
createInstance = (instance: CreatedInstance<ValueAndUnit>, scene: Scene, props: RowOrColumnDefinitionProps): Nullable<ValueAndUnit> => { | ||
if (!this._grid) { | ||
return null; | ||
} | ||
this._grid.addColumnDefinition(props.value, props.unit === ValueAndUnit.UNITMODE_PIXEL); | ||
instance.hostInstance = this._grid.getColumnDefinition(this._grid.columnCount - 1)!; | ||
return instance.hostInstance; | ||
} | ||
|
||
onParented(parent: CreatedInstance<any>, child: CreatedInstance<any>): any { | ||
super.onParented(parent, child); | ||
// TODO: search hierarchy for a grid, but it should always be parent. | ||
this._grid = parent.hostInstance; | ||
} | ||
} | ||
|
||
export const ColumnDefinition: DynamicHost<ValueAndUnit, RowOrColumnDefinitionProps> = { | ||
hostElementName: "columnDefinition", | ||
|
||
propHandlerInstance: new RowOrColumnDefinitionPropsHandler(), | ||
|
||
hostFactory: (scene: Scene) => null, | ||
|
||
lifecycleListenerFactory: (scene: Scene, props: any) => new ColumnDefinitionLifecycleListener(scene, props), | ||
|
||
createInfo: { | ||
"creationType": "Constructor", | ||
"libraryLocation": "ValueAndUnit", | ||
"namespace": "@babylonjs/gui", | ||
"parameters": [/* value and unit! */] | ||
}, | ||
// TODO: this should be "M"etadata | ||
metadata: { | ||
"className": "ColumnDefinition", | ||
"delayCreation": true, | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,120 +1,53 @@ | ||
import { Key, ReactNode, Ref } from "react"; | ||
import { Scene } from "@babylonjs/core/scene.js"; | ||
import { Nullable } from "@babylonjs/core/types.js"; | ||
import { Grid } from "@babylonjs/gui/2D/controls/grid.js"; | ||
import { ValueAndUnit } from "@babylonjs/gui/2D/valueAndUnit.js"; | ||
|
||
import { CreatedInstance } from "../../CreatedInstance"; | ||
import { DynamicHost } from "../../HostRegistrationStore"; | ||
import { checkPrimitiveDiff, HasPropsHandlers, PropertyUpdate, PropsHandler } from "../../PropsHandler"; | ||
import DeferredCreationLifecycleListener from "../DeferredCreationLifecycleListener"; | ||
|
||
|
||
export type GridNode = { | ||
key?: Key; | ||
ref?: Ref<ReactNode>; // will return value and unit? | ||
}; | ||
|
||
export type RowDefinitionProps = { | ||
/** | ||
* Numerical value to apply to height | ||
*/ | ||
height: number | ||
/** | ||
* Indicating if the value is stored as pixel | ||
*/ | ||
isPixel?: boolean | ||
} | ||
|
||
export type ColumnDefinitionProps = { | ||
width: number | ||
isPixel?: boolean | ||
export type RowOrColumnDefinitionProps = { | ||
value: number | ||
unit?: number | ||
} | ||
|
||
declare global { | ||
// eslint-disable-next-line @typescript-eslint/no-namespace | ||
namespace JSX { | ||
interface IntrinsicElements { | ||
rowDefinition: RowDefinitionProps & GridNode; | ||
columnDefinition: ColumnDefinitionProps & GridNode; | ||
rowDefinition: RowOrColumnDefinitionProps & GridNode; | ||
columnDefinition: RowOrColumnDefinitionProps & GridNode; | ||
} | ||
} | ||
} | ||
|
||
export class CustomRowDefinitionPropsHandler implements PropsHandler<RowDefinitionProps> { | ||
getPropertyUpdates(oldProps: RowDefinitionProps, newProps: RowDefinitionProps): PropertyUpdate[] | null { | ||
export class RowOrColumnDefinitionPropsHandlers implements PropsHandler<RowOrColumnDefinitionProps> { | ||
getPropertyUpdates(oldProps: RowOrColumnDefinitionProps, newProps: RowOrColumnDefinitionProps): PropertyUpdate[] | null { | ||
const changedProps: PropertyUpdate[] = [] | ||
checkPrimitiveDiff(oldProps.height, newProps.height, 'height', changedProps) | ||
checkPrimitiveDiff(oldProps.isPixel, newProps.isPixel, 'isPixel', changedProps) | ||
checkPrimitiveDiff(oldProps.value, newProps.value, 'value', changedProps); | ||
checkPrimitiveDiff(oldProps.unit, newProps.unit, 'unit', changedProps); | ||
return changedProps.length === 0 ? null : changedProps; | ||
} | ||
} | ||
|
||
/** | ||
* Handles property updates. | ||
*/ | ||
export class RowDefinitionPropsHandler implements HasPropsHandlers<RowDefinitionProps> { | ||
private propsHandlers: PropsHandler<RowDefinitionProps>[]; | ||
export class RowOrColumnDefinitionPropsHandler implements HasPropsHandlers<RowOrColumnDefinitionProps> { | ||
private propsHandlers: PropsHandler<RowOrColumnDefinitionProps>[]; | ||
|
||
constructor() { | ||
this.propsHandlers = [ | ||
// NOTE: Cannot set property isPixel of [object Object] which has only a getter | ||
// new CustomRowDefinitionPropsHandler() | ||
new RowOrColumnDefinitionPropsHandlers() | ||
]; | ||
} | ||
|
||
getPropsHandlers(): PropsHandler<RowDefinitionProps>[] { | ||
getPropsHandlers(): PropsHandler<RowOrColumnDefinitionProps>[] { | ||
return this.propsHandlers; | ||
} | ||
|
||
addPropsHandler(propHandler: PropsHandler<RowDefinitionProps>): void { | ||
addPropsHandler(propHandler: PropsHandler<RowOrColumnDefinitionProps>): void { | ||
this.propsHandlers.push(propHandler); | ||
} | ||
} | ||
|
||
export const RowDefinition: DynamicHost<ValueAndUnit, RowDefinitionProps> = { | ||
hostElementName: "rowDefinition", | ||
|
||
propHandlerInstance: new RowDefinitionPropsHandler(), | ||
|
||
hostFactory: (scene: Scene) => null, | ||
|
||
lifecycleListenerFactory: (scene: Scene, props: any) => new RowDefinitionLifecycleListener(scene, props), | ||
|
||
createInfo: { | ||
"creationType": "Constructor", | ||
"libraryLocation": "ValueAndUnit", | ||
"namespace": "@babylonjs/gui", | ||
"parameters": [/* value and unit! */] | ||
}, | ||
// TODO: this should be "M"etadata | ||
metadata: { | ||
"className": "RowDefinition", | ||
"delayCreation": true, | ||
} | ||
} | ||
|
||
/** | ||
* We delay instantiation and when parented add a row definition to parent "Grid". | ||
*/ | ||
export default class RowDefinitionLifecycleListener extends DeferredCreationLifecycleListener<ValueAndUnit, any> { | ||
|
||
private _grid: Grid | undefined; | ||
|
||
createInstance = (instance: CreatedInstance<ValueAndUnit>, scene: Scene, props: RowDefinitionProps): Nullable<ValueAndUnit> => { | ||
if (!this._grid) { | ||
return null; | ||
} | ||
// these should be set from the props handler. TODO: test. | ||
this._grid.addRowDefinition(props.height, props.isPixel); | ||
instance.hostInstance = this._grid.getRowDefinition(this._grid.rowCount - 1)!; | ||
console.log('added row:', instance.hostInstance); | ||
return instance.hostInstance; | ||
} | ||
|
||
onParented(parent: CreatedInstance<any>, child: CreatedInstance<any>): any { | ||
super.onParented(parent, child); | ||
// TODO: search hierarchy for a grid, but it should always be parent. | ||
console.log('adding row definition to:', parent.metadata, parent.hostInstance); | ||
this._grid = parent.hostInstance; | ||
} | ||
} |
Oops, something went wrong.