babylon.nodeEditor.d.ts 60 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531
  1. /// <reference types="react" />
  2. declare module NODEEDITOR {
  3. export class BlockTools {
  4. static GetBlockFromString(data: string, scene: BABYLON.Scene, nodeMaterial: BABYLON.NodeMaterial): BABYLON.DesaturateBlock | BABYLON.RefractBlock | BABYLON.ReflectBlock | BABYLON.DerivativeBlock | BABYLON.Rotate2dBlock | BABYLON.NormalBlendBlock | BABYLON.WorleyNoise3DBlock | BABYLON.SimplexPerlin3DBlock | BABYLON.BonesBlock | BABYLON.InstancesBlock | BABYLON.MorphTargetsBlock | BABYLON.DiscardBlock | BABYLON.ImageProcessingBlock | BABYLON.ColorMergerBlock | BABYLON.VectorMergerBlock | BABYLON.ColorSplitterBlock | BABYLON.VectorSplitterBlock | BABYLON.TextureBlock | BABYLON.ReflectionTextureBlock | BABYLON.LightBlock | BABYLON.FogBlock | BABYLON.VertexOutputBlock | BABYLON.FragmentOutputBlock | BABYLON.AddBlock | BABYLON.ClampBlock | BABYLON.ScaleBlock | BABYLON.CrossBlock | BABYLON.DotBlock | BABYLON.PowBlock | BABYLON.MultiplyBlock | BABYLON.TransformBlock | BABYLON.TrigonometryBlock | BABYLON.RemapBlock | BABYLON.NormalizeBlock | BABYLON.FresnelBlock | BABYLON.LerpBlock | BABYLON.NLerpBlock | BABYLON.DivideBlock | BABYLON.SubtractBlock | BABYLON.ModBlock | BABYLON.StepBlock | BABYLON.SmoothStepBlock | BABYLON.OneMinusBlock | BABYLON.ReciprocalBlock | BABYLON.ViewDirectionBlock | BABYLON.LightInformationBlock | BABYLON.MaxBlock | BABYLON.MinBlock | BABYLON.LengthBlock | BABYLON.DistanceBlock | BABYLON.NegateBlock | BABYLON.PerturbNormalBlock | BABYLON.RandomNumberBlock | BABYLON.ReplaceColorBlock | BABYLON.PosterizeBlock | BABYLON.ArcTan2Block | BABYLON.GradientBlock | BABYLON.FrontFacingBlock | BABYLON.WaveBlock | BABYLON.InputBlock | BABYLON.PBRMetallicRoughnessBlock | BABYLON.SheenBlock | BABYLON.AmbientOcclusionBlock | BABYLON.ReflectivityBlock | BABYLON.AnisotropyBlock | BABYLON.ReflectionBlock | BABYLON.ClearCoatBlock | BABYLON.RefractionBlock | BABYLON.SubSurfaceBlock | BABYLON.CurrentScreenBlock | BABYLON.ParticleTextureBlock | BABYLON.ParticleRampGradientBlock | BABYLON.ParticleBlendMultiplyBlock | BABYLON.FragCoordBlock | BABYLON.ScreenSizeBlock | null;
  5. static GetColorFromConnectionNodeType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): string;
  6. static GetConnectionNodeTypeFromString(type: string): BABYLON.NodeMaterialBlockConnectionPointTypes.Float | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector2 | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector3 | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector4 | BABYLON.NodeMaterialBlockConnectionPointTypes.Color3 | BABYLON.NodeMaterialBlockConnectionPointTypes.Color4 | BABYLON.NodeMaterialBlockConnectionPointTypes.Matrix | BABYLON.NodeMaterialBlockConnectionPointTypes.AutoDetect;
  7. static GetStringFromConnectionNodeType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): "Float" | "Vector2" | "Vector3" | "Vector4" | "Matrix" | "Color3" | "Color4" | "";
  8. }
  9. }
  10. declare module NODEEDITOR {
  11. interface ILogComponentProps {
  12. globalState: GlobalState;
  13. }
  14. export class LogEntry {
  15. message: string;
  16. isError: boolean;
  17. constructor(message: string, isError: boolean);
  18. }
  19. export class LogComponent extends React.Component<ILogComponentProps, {
  20. logs: LogEntry[];
  21. }> {
  22. constructor(props: ILogComponentProps);
  23. componentDidMount(): void;
  24. componentDidUpdate(): void;
  25. render(): JSX.Element;
  26. }
  27. }
  28. declare module NODEEDITOR {
  29. export enum PreviewType {
  30. Sphere = 0,
  31. Box = 1,
  32. Torus = 2,
  33. Cylinder = 3,
  34. Plane = 4,
  35. ShaderBall = 5,
  36. DefaultParticleSystem = 6,
  37. Bubbles = 7,
  38. Smoke = 8,
  39. Rain = 9,
  40. Explosion = 10,
  41. Fire = 11,
  42. Custom = 12
  43. }
  44. }
  45. declare module NODEEDITOR {
  46. export interface IDisplayManager {
  47. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  48. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  49. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  50. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  51. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  52. }
  53. }
  54. declare module NODEEDITOR {
  55. export interface INodeLocationInfo {
  56. blockId: number;
  57. x: number;
  58. y: number;
  59. }
  60. export interface IFrameData {
  61. x: number;
  62. y: number;
  63. width: number;
  64. height: number;
  65. color: number[];
  66. name: string;
  67. isCollapsed: boolean;
  68. blocks: number[];
  69. comments: string;
  70. }
  71. export interface IEditorData {
  72. locations: INodeLocationInfo[];
  73. x: number;
  74. y: number;
  75. zoom: number;
  76. frames?: IFrameData[];
  77. map?: {
  78. [key: number]: number;
  79. };
  80. }
  81. }
  82. declare module NODEEDITOR {
  83. export class SerializationTools {
  84. static UpdateLocations(material: BABYLON.NodeMaterial, globalState: GlobalState): void;
  85. static Serialize(material: BABYLON.NodeMaterial, globalState: GlobalState, selectedBlocks?: BABYLON.NodeMaterialBlock[]): string;
  86. static Deserialize(serializationObject: any, globalState: GlobalState): void;
  87. }
  88. }
  89. declare module NODEEDITOR {
  90. export class StringTools {
  91. private static _SaveAs;
  92. private static _Click;
  93. /**
  94. * Gets the base math type of node material block connection point.
  95. * @param type Type to parse.
  96. */
  97. static GetBaseType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): string;
  98. /**
  99. * Download a string into a file that will be saved locally by the browser
  100. * @param content defines the string to download locally as a file
  101. */
  102. static DownloadAsFile(document: HTMLDocument, content: string, filename: string): void;
  103. }
  104. }
  105. declare module NODEEDITOR {
  106. export class FrameNodePort extends NodePort {
  107. connectionPoint: BABYLON.NodeMaterialConnectionPoint;
  108. node: GraphNode;
  109. private _parentFrameId;
  110. private _isInput;
  111. private _framePortPosition;
  112. private _framePortId;
  113. private _onFramePortPositionChangedObservable;
  114. get parentFrameId(): number;
  115. get onFramePortPositionChangedObservable(): BABYLON.Observable<FrameNodePort>;
  116. get isInput(): boolean;
  117. get framePortId(): number;
  118. get framePortPosition(): FramePortPosition;
  119. set framePortPosition(position: FramePortPosition);
  120. constructor(portContainer: HTMLElement, connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, globalState: GlobalState, isInput: boolean, framePortId: number, parentFrameId: number);
  121. static CreateFrameNodePortElement(connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, root: HTMLElement, displayManager: BABYLON.Nullable<IDisplayManager>, globalState: GlobalState, isInput: boolean, framePortId: number, parentFrameId: number): FrameNodePort;
  122. }
  123. }
  124. declare module NODEEDITOR {
  125. export enum FramePortPosition {
  126. Top = 0,
  127. Middle = 1,
  128. Bottom = 2
  129. }
  130. export class GraphFrame {
  131. private readonly CollapsedWidth;
  132. private static _FrameCounter;
  133. private static _FramePortCounter;
  134. private _name;
  135. private _color;
  136. private _x;
  137. private _y;
  138. private _gridAlignedX;
  139. private _gridAlignedY;
  140. private _width;
  141. private _height;
  142. element: HTMLDivElement;
  143. private _borderElement;
  144. private _headerElement;
  145. private _headerTextElement;
  146. private _headerCollapseElement;
  147. private _headerCloseElement;
  148. private _commentsElement;
  149. private _portContainer;
  150. private _outputPortContainer;
  151. private _inputPortContainer;
  152. private _nodes;
  153. private _ownerCanvas;
  154. private _mouseStartPointX;
  155. private _mouseStartPointY;
  156. private _onSelectionChangedObserver;
  157. private _onGraphNodeRemovalObserver;
  158. private _onExposePortOnFrameObserver;
  159. private _onNodeLinkDisposedObservers;
  160. private _isCollapsed;
  161. private _frameInPorts;
  162. private _frameOutPorts;
  163. private _controlledPorts;
  164. private _id;
  165. private _comments;
  166. private _frameIsResizing;
  167. private _resizingDirection;
  168. private _minFrameHeight;
  169. private _minFrameWidth;
  170. private mouseXLimit;
  171. onExpandStateChanged: BABYLON.Observable<GraphFrame>;
  172. private readonly CloseSVG;
  173. private readonly ExpandSVG;
  174. private readonly CollapseSVG;
  175. get id(): number;
  176. get isCollapsed(): boolean;
  177. private _createInputPort;
  178. private _markFramePortPositions;
  179. private _createFramePorts;
  180. private _redrawFramePorts;
  181. set isCollapsed(value: boolean);
  182. get nodes(): GraphNode[];
  183. get ports(): FrameNodePort[];
  184. get name(): string;
  185. set name(value: string);
  186. get color(): BABYLON.Color3;
  187. set color(value: BABYLON.Color3);
  188. get x(): number;
  189. set x(value: number);
  190. get y(): number;
  191. set y(value: number);
  192. get width(): number;
  193. set width(value: number);
  194. get height(): number;
  195. set height(value: number);
  196. get comments(): string;
  197. set comments(comments: string);
  198. constructor(candidate: BABYLON.Nullable<HTMLDivElement>, canvas: GraphCanvasComponent, doNotCaptureNodes?: boolean);
  199. refresh(): void;
  200. addNode(node: GraphNode): void;
  201. removeNode(node: GraphNode): void;
  202. syncNode(node: GraphNode): void;
  203. cleanAccumulation(): void;
  204. private _onDown;
  205. move(newX: number, newY: number, align?: boolean): void;
  206. private _onUp;
  207. private _moveFrame;
  208. private _onMove;
  209. moveFramePortUp(nodePort: FrameNodePort): void;
  210. private _movePortUp;
  211. moveFramePortDown(nodePort: FrameNodePort): void;
  212. private _movePortDown;
  213. private initResizing;
  214. private cleanUpResizing;
  215. private updateMinHeightWithComments;
  216. private _isResizingTop;
  217. private _isResizingRight;
  218. private _isResizingBottom;
  219. private _isResizingLeft;
  220. private _onRightHandlePointerDown;
  221. private _onRightHandlePointerMove;
  222. private _moveRightHandle;
  223. private _onRightHandlePointerUp;
  224. private _onBottomHandlePointerDown;
  225. private _onBottomHandlePointerMove;
  226. private _moveBottomHandle;
  227. private _onBottomHandlePointerUp;
  228. private _onLeftHandlePointerDown;
  229. private _onLeftHandlePointerMove;
  230. private _moveLeftHandle;
  231. private _onLeftHandlePointerUp;
  232. private _onTopHandlePointerDown;
  233. private _onTopHandlePointerMove;
  234. private _moveTopHandle;
  235. private _onTopHandlePointerUp;
  236. private _onTopRightHandlePointerDown;
  237. private _onTopRightHandlePointerMove;
  238. private _moveTopRightHandle;
  239. private _onTopRightHandlePointerUp;
  240. private _onBottomRightHandlePointerDown;
  241. private _onBottomRightHandlePointerMove;
  242. private _moveBottomRightHandle;
  243. private _onBottomRightHandlePointerUp;
  244. private _onBottomLeftHandlePointerDown;
  245. private _onBottomLeftHandlePointerMove;
  246. private _moveBottomLeftHandle;
  247. private _onBottomLeftHandlePointerUp;
  248. private _onTopLeftHandlePointerDown;
  249. private _onTopLeftHandlePointerMove;
  250. private _moveTopLeftHandle;
  251. private _onTopLeftHandlePointerUp;
  252. private _expandLeft;
  253. private _expandTop;
  254. private _expandRight;
  255. private _expandBottom;
  256. dispose(): void;
  257. serialize(): IFrameData;
  258. export(): void;
  259. static Parse(serializationData: IFrameData, canvas: GraphCanvasComponent, map?: {
  260. [key: number]: number;
  261. }): GraphFrame;
  262. }
  263. }
  264. declare module NODEEDITOR {
  265. export class NodePort {
  266. connectionPoint: BABYLON.NodeMaterialConnectionPoint;
  267. node: GraphNode;
  268. protected _element: HTMLDivElement;
  269. protected _img: HTMLImageElement;
  270. protected _globalState: GlobalState;
  271. protected _portLabelElement: Element;
  272. protected _onCandidateLinkMovedObserver: BABYLON.Nullable<BABYLON.Observer<BABYLON.Nullable<BABYLON.Vector2>>>;
  273. protected _onSelectionChangedObserver: BABYLON.Nullable<BABYLON.Observer<BABYLON.Nullable<GraphFrame | GraphNode | NodeLink | NodePort | FramePortData>>>;
  274. protected _exposedOnFrame: boolean;
  275. delegatedPort: BABYLON.Nullable<FrameNodePort>;
  276. get element(): HTMLDivElement;
  277. get portName(): string;
  278. set portName(newName: string);
  279. get disabled(): boolean;
  280. hasLabel(): boolean;
  281. get exposedOnFrame(): boolean;
  282. set exposedOnFrame(value: boolean);
  283. private _isConnectedToNodeOutsideOfFrame;
  284. refresh(): void;
  285. constructor(portContainer: HTMLElement, connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, globalState: GlobalState);
  286. dispose(): void;
  287. static CreatePortElement(connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, root: HTMLElement, displayManager: BABYLON.Nullable<IDisplayManager>, globalState: GlobalState): NodePort;
  288. }
  289. }
  290. declare module NODEEDITOR {
  291. export class NodeLink {
  292. private _graphCanvas;
  293. private _portA;
  294. private _portB?;
  295. private _nodeA;
  296. private _nodeB?;
  297. private _path;
  298. private _selectionPath;
  299. private _onSelectionChangedObserver;
  300. private _isVisible;
  301. onDisposedObservable: BABYLON.Observable<NodeLink>;
  302. get isVisible(): boolean;
  303. set isVisible(value: boolean);
  304. get portA(): FrameNodePort | NodePort;
  305. get portB(): FrameNodePort | NodePort | undefined;
  306. get nodeA(): GraphNode;
  307. get nodeB(): GraphNode | undefined;
  308. update(endX?: number, endY?: number, straight?: boolean): void;
  309. constructor(graphCanvas: GraphCanvasComponent, portA: NodePort, nodeA: GraphNode, portB?: NodePort, nodeB?: GraphNode);
  310. onClick(): void;
  311. dispose(): void;
  312. }
  313. }
  314. declare module NODEEDITOR {
  315. export interface IGraphCanvasComponentProps {
  316. globalState: GlobalState;
  317. }
  318. export type FramePortData = {
  319. frame: GraphFrame;
  320. port: FrameNodePort;
  321. };
  322. export const isFramePortData: (variableToCheck: any) => variableToCheck is FramePortData;
  323. export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentProps> {
  324. private readonly MinZoom;
  325. private readonly MaxZoom;
  326. private _hostCanvas;
  327. private _graphCanvas;
  328. private _selectionContainer;
  329. private _frameContainer;
  330. private _svgCanvas;
  331. private _rootContainer;
  332. private _nodes;
  333. private _links;
  334. private _mouseStartPointX;
  335. private _mouseStartPointY;
  336. private _dropPointX;
  337. private _dropPointY;
  338. private _selectionStartX;
  339. private _selectionStartY;
  340. private _candidateLinkedHasMoved;
  341. private _x;
  342. private _y;
  343. private _zoom;
  344. private _selectedNodes;
  345. private _selectedLink;
  346. private _selectedPort;
  347. private _candidateLink;
  348. private _candidatePort;
  349. private _gridSize;
  350. private _selectionBox;
  351. private _selectedFrame;
  352. private _frameCandidate;
  353. private _frames;
  354. private _altKeyIsPressed;
  355. private _ctrlKeyIsPressed;
  356. private _oldY;
  357. _frameIsMoving: boolean;
  358. _isLoading: boolean;
  359. get gridSize(): number;
  360. set gridSize(value: number);
  361. get globalState(): GlobalState;
  362. get nodes(): GraphNode[];
  363. get links(): NodeLink[];
  364. get frames(): GraphFrame[];
  365. get zoom(): number;
  366. set zoom(value: number);
  367. get x(): number;
  368. set x(value: number);
  369. get y(): number;
  370. set y(value: number);
  371. get selectedNodes(): GraphNode[];
  372. get selectedLink(): BABYLON.Nullable<NodeLink>;
  373. get selectedFrame(): BABYLON.Nullable<GraphFrame>;
  374. get selectedPort(): BABYLON.Nullable<NodePort>;
  375. get canvasContainer(): HTMLDivElement;
  376. get hostCanvas(): HTMLDivElement;
  377. get svgCanvas(): HTMLElement;
  378. get selectionContainer(): HTMLDivElement;
  379. get frameContainer(): HTMLDivElement;
  380. constructor(props: IGraphCanvasComponentProps);
  381. getGridPosition(position: number, useCeil?: boolean): number;
  382. getGridPositionCeil(position: number): number;
  383. updateTransform(): void;
  384. onKeyUp(): void;
  385. findNodeFromBlock(block: BABYLON.NodeMaterialBlock): GraphNode;
  386. reset(): void;
  387. connectPorts(pointA: BABYLON.NodeMaterialConnectionPoint, pointB: BABYLON.NodeMaterialConnectionPoint): void;
  388. removeLink(link: NodeLink): void;
  389. appendBlock(block: BABYLON.NodeMaterialBlock): GraphNode;
  390. distributeGraph(): void;
  391. componentDidMount(): void;
  392. onMove(evt: React.PointerEvent): void;
  393. onDown(evt: React.PointerEvent<HTMLElement>): void;
  394. onUp(evt: React.PointerEvent): void;
  395. onWheel(evt: React.WheelEvent): void;
  396. zoomToFit(): void;
  397. processCandidatePort(): void;
  398. processEditorData(editorData: IEditorData): void;
  399. render(): JSX.Element;
  400. }
  401. }
  402. declare module NODEEDITOR {
  403. export class PropertyChangedEvent {
  404. object: any;
  405. property: string;
  406. value: any;
  407. initialValue: any;
  408. }
  409. }
  410. declare module NODEEDITOR {
  411. interface IFloatLineComponentProps {
  412. label: string;
  413. target: any;
  414. propertyName: string;
  415. onChange?: (newValue: number) => void;
  416. isInteger?: boolean;
  417. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  418. additionalClass?: string;
  419. step?: string;
  420. digits?: number;
  421. globalState: GlobalState;
  422. }
  423. export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {
  424. value: string;
  425. }> {
  426. private _localChange;
  427. private _store;
  428. constructor(props: IFloatLineComponentProps);
  429. shouldComponentUpdate(nextProps: IFloatLineComponentProps, nextState: {
  430. value: string;
  431. }): boolean;
  432. raiseOnPropertyChanged(newValue: number, previousValue: number): void;
  433. updateValue(valueString: string): void;
  434. render(): JSX.Element;
  435. }
  436. }
  437. declare module NODEEDITOR {
  438. interface IFloatPropertyTabComponentProps {
  439. globalState: GlobalState;
  440. inputBlock: BABYLON.InputBlock;
  441. }
  442. export class FloatPropertyTabComponent extends React.Component<IFloatPropertyTabComponentProps> {
  443. render(): JSX.Element;
  444. }
  445. }
  446. declare module NODEEDITOR {
  447. interface ISliderLineComponentProps {
  448. label: string;
  449. target?: any;
  450. propertyName?: string;
  451. minimum: number;
  452. maximum: number;
  453. step: number;
  454. directValue?: number;
  455. useEuler?: boolean;
  456. onChange?: (value: number) => void;
  457. onInput?: (value: number) => void;
  458. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  459. decimalCount?: number;
  460. }
  461. export class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
  462. value: number;
  463. }> {
  464. private _localChange;
  465. constructor(props: ISliderLineComponentProps);
  466. shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
  467. value: number;
  468. }): boolean;
  469. onChange(newValueString: any): void;
  470. onInput(newValueString: any): void;
  471. prepareDataToRead(value: number): number;
  472. render(): JSX.Element;
  473. }
  474. }
  475. declare module NODEEDITOR {
  476. interface INumericInputComponentProps {
  477. label: string;
  478. value: number;
  479. step?: number;
  480. onChange: (value: number) => void;
  481. globalState: GlobalState;
  482. }
  483. export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
  484. value: string;
  485. }> {
  486. static defaultProps: {
  487. step: number;
  488. };
  489. private _localChange;
  490. constructor(props: INumericInputComponentProps);
  491. shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
  492. value: string;
  493. }): boolean;
  494. updateValue(evt: any): void;
  495. render(): JSX.Element;
  496. }
  497. }
  498. declare module NODEEDITOR {
  499. interface IVector2LineComponentProps {
  500. label: string;
  501. target: any;
  502. propertyName: string;
  503. step?: number;
  504. onChange?: (newvalue: BABYLON.Vector2) => void;
  505. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  506. globalState: GlobalState;
  507. }
  508. export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
  509. isExpanded: boolean;
  510. value: BABYLON.Vector2;
  511. }> {
  512. static defaultProps: {
  513. step: number;
  514. };
  515. private _localChange;
  516. constructor(props: IVector2LineComponentProps);
  517. shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {
  518. isExpanded: boolean;
  519. value: BABYLON.Vector2;
  520. }): boolean;
  521. switchExpandState(): void;
  522. raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;
  523. updateStateX(value: number): void;
  524. updateStateY(value: number): void;
  525. render(): JSX.Element;
  526. }
  527. }
  528. declare module NODEEDITOR {
  529. interface IVector2PropertyTabComponentProps {
  530. globalState: GlobalState;
  531. inputBlock: BABYLON.InputBlock;
  532. }
  533. export class Vector2PropertyTabComponent extends React.Component<IVector2PropertyTabComponentProps> {
  534. render(): JSX.Element;
  535. }
  536. }
  537. declare module NODEEDITOR {
  538. export interface IColorPickerComponentProps {
  539. value: BABYLON.Color4 | BABYLON.Color3;
  540. onColorChanged: (newOne: string) => void;
  541. globalState: GlobalState;
  542. disableAlpha?: boolean;
  543. }
  544. interface IColorPickerComponentState {
  545. pickerEnabled: boolean;
  546. color: {
  547. r: number;
  548. g: number;
  549. b: number;
  550. a?: number;
  551. };
  552. hex: string;
  553. }
  554. export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
  555. private _floatRef;
  556. private _floatHostRef;
  557. constructor(props: IColorPickerComponentProps);
  558. syncPositions(): void;
  559. shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
  560. componentDidUpdate(): void;
  561. componentDidMount(): void;
  562. setPickerState(enabled: boolean): void;
  563. render(): JSX.Element;
  564. }
  565. }
  566. declare module NODEEDITOR {
  567. export interface IColor3LineComponentProps {
  568. label: string;
  569. target: any;
  570. propertyName: string;
  571. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  572. onChange?: () => void;
  573. globalState: GlobalState;
  574. }
  575. export class Color3LineComponent extends React.Component<IColor3LineComponentProps, {
  576. isExpanded: boolean;
  577. color: BABYLON.Color3;
  578. }> {
  579. private _localChange;
  580. constructor(props: IColor3LineComponentProps);
  581. shouldComponentUpdate(nextProps: IColor3LineComponentProps, nextState: {
  582. color: BABYLON.Color3;
  583. }): boolean;
  584. onChange(newValue: string): void;
  585. switchExpandState(): void;
  586. raiseOnPropertyChanged(previousValue: BABYLON.Color3): void;
  587. updateStateR(value: number): void;
  588. updateStateG(value: number): void;
  589. updateStateB(value: number): void;
  590. copyToClipboard(): void;
  591. render(): JSX.Element;
  592. }
  593. }
  594. declare module NODEEDITOR {
  595. interface IColor3PropertyTabComponentProps {
  596. globalState: GlobalState;
  597. inputBlock: BABYLON.InputBlock;
  598. }
  599. export class Color3PropertyTabComponent extends React.Component<IColor3PropertyTabComponentProps> {
  600. render(): JSX.Element;
  601. }
  602. }
  603. declare module NODEEDITOR {
  604. interface IVector3LineComponentProps {
  605. label: string;
  606. target: any;
  607. propertyName: string;
  608. step?: number;
  609. onChange?: (newvalue: BABYLON.Vector3) => void;
  610. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  611. globalState: GlobalState;
  612. }
  613. export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
  614. isExpanded: boolean;
  615. value: BABYLON.Vector3;
  616. }> {
  617. static defaultProps: {
  618. step: number;
  619. };
  620. private _localChange;
  621. constructor(props: IVector3LineComponentProps);
  622. shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
  623. isExpanded: boolean;
  624. value: BABYLON.Vector3;
  625. }): boolean;
  626. switchExpandState(): void;
  627. raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
  628. updateVector3(): void;
  629. updateStateX(value: number): void;
  630. updateStateY(value: number): void;
  631. updateStateZ(value: number): void;
  632. render(): JSX.Element;
  633. }
  634. }
  635. declare module NODEEDITOR {
  636. interface IVector3PropertyTabComponentProps {
  637. globalState: GlobalState;
  638. inputBlock: BABYLON.InputBlock;
  639. }
  640. export class Vector3PropertyTabComponent extends React.Component<IVector3PropertyTabComponentProps> {
  641. render(): JSX.Element;
  642. }
  643. }
  644. declare module NODEEDITOR {
  645. interface IVector4LineComponentProps {
  646. label: string;
  647. target?: any;
  648. propertyName?: string;
  649. value?: BABYLON.Vector4;
  650. step?: number;
  651. onChange?: (newvalue: BABYLON.Vector4) => void;
  652. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  653. globalState: GlobalState;
  654. }
  655. export class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
  656. isExpanded: boolean;
  657. value: BABYLON.Vector4;
  658. }> {
  659. static defaultProps: {
  660. step: number;
  661. };
  662. private _localChange;
  663. constructor(props: IVector4LineComponentProps);
  664. shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
  665. isExpanded: boolean;
  666. value: BABYLON.Vector4;
  667. }): boolean;
  668. switchExpandState(): void;
  669. raiseOnPropertyChanged(previousValue: BABYLON.Vector4): void;
  670. updateVector4(): void;
  671. updateStateX(value: number): void;
  672. updateStateY(value: number): void;
  673. updateStateZ(value: number): void;
  674. updateStateW(value: number): void;
  675. render(): JSX.Element;
  676. }
  677. }
  678. declare module NODEEDITOR {
  679. interface IVector4PropertyTabComponentProps {
  680. globalState: GlobalState;
  681. inputBlock: BABYLON.InputBlock;
  682. }
  683. export class Vector4PropertyTabComponent extends React.Component<IVector4PropertyTabComponentProps> {
  684. render(): JSX.Element;
  685. }
  686. }
  687. declare module NODEEDITOR {
  688. class ListLineOption {
  689. label: string;
  690. value: number | string;
  691. }
  692. interface IOptionsLineComponentProps {
  693. label: string;
  694. target: any;
  695. className?: string;
  696. propertyName?: string;
  697. options: ListLineOption[];
  698. noDirectUpdate?: boolean;
  699. onSelect?: (value: number | string) => void;
  700. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  701. valuesAreStrings?: boolean;
  702. defaultIfNull?: number;
  703. getSelection?: (target: any) => number;
  704. }
  705. export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
  706. value: number | string;
  707. }> {
  708. private _localChange;
  709. private _getValue;
  710. constructor(props: IOptionsLineComponentProps);
  711. setValue(value: string | number): void;
  712. shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
  713. value: number;
  714. }): boolean;
  715. raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
  716. updateValue(valueString: string): void;
  717. render(): JSX.Element;
  718. }
  719. }
  720. declare module NODEEDITOR {
  721. interface IMatrixLineComponentProps {
  722. label: string;
  723. target: any;
  724. propertyName: string;
  725. step?: number;
  726. onChange?: (newValue: BABYLON.Matrix) => void;
  727. onModeChange?: (mode: number) => void;
  728. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  729. mode?: number;
  730. globalState: GlobalState;
  731. }
  732. export class MatrixLineComponent extends React.Component<IMatrixLineComponentProps, {
  733. value: BABYLON.Matrix;
  734. mode: number;
  735. angle: number;
  736. }> {
  737. private _localChange;
  738. constructor(props: IMatrixLineComponentProps);
  739. shouldComponentUpdate(nextProps: IMatrixLineComponentProps, nextState: {
  740. value: BABYLON.Matrix;
  741. mode: number;
  742. angle: number;
  743. }): boolean;
  744. raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
  745. updateMatrix(): void;
  746. updateRow(value: BABYLON.Vector4, row: number): void;
  747. updateBasedOnMode(value: number): void;
  748. render(): JSX.Element;
  749. }
  750. }
  751. declare module NODEEDITOR {
  752. interface IMatrixPropertyTabComponentProps {
  753. globalState: GlobalState;
  754. inputBlock: BABYLON.InputBlock;
  755. }
  756. export class MatrixPropertyTabComponent extends React.Component<IMatrixPropertyTabComponentProps> {
  757. render(): JSX.Element;
  758. }
  759. }
  760. declare module NODEEDITOR {
  761. interface ILineContainerComponentProps {
  762. title: string;
  763. children: any[] | any;
  764. closed?: boolean;
  765. }
  766. export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {
  767. isExpanded: boolean;
  768. }> {
  769. constructor(props: ILineContainerComponentProps);
  770. switchExpandedState(): void;
  771. renderHeader(): JSX.Element;
  772. render(): JSX.Element;
  773. }
  774. }
  775. declare module NODEEDITOR {
  776. export interface IPropertyComponentProps {
  777. globalState: GlobalState;
  778. block: BABYLON.NodeMaterialBlock;
  779. }
  780. }
  781. declare module NODEEDITOR {
  782. interface ITextInputLineComponentProps {
  783. label: string;
  784. globalState: GlobalState;
  785. target?: any;
  786. propertyName?: string;
  787. value?: string;
  788. onChange?: (value: string) => void;
  789. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  790. }
  791. export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
  792. value: string;
  793. }> {
  794. private _localChange;
  795. constructor(props: ITextInputLineComponentProps);
  796. shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
  797. value: string;
  798. }): boolean;
  799. raiseOnPropertyChanged(newValue: string, previousValue: string): void;
  800. updateValue(value: string, raisePropertyChanged: boolean): void;
  801. render(): JSX.Element;
  802. }
  803. }
  804. declare module NODEEDITOR {
  805. interface ITextLineComponentProps {
  806. label: string;
  807. value: string;
  808. color?: string;
  809. underline?: boolean;
  810. onLink?: () => void;
  811. }
  812. export class TextLineComponent extends React.Component<ITextLineComponentProps> {
  813. constructor(props: ITextLineComponentProps);
  814. onLink(): void;
  815. renderContent(): JSX.Element;
  816. render(): JSX.Element;
  817. }
  818. }
  819. declare module NODEEDITOR {
  820. export interface ICheckBoxLineComponentProps {
  821. label: string;
  822. target?: any;
  823. propertyName?: string;
  824. isSelected?: () => boolean;
  825. onSelect?: (value: boolean) => void;
  826. onValueChanged?: () => void;
  827. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  828. disabled?: boolean;
  829. }
  830. export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
  831. isSelected: boolean;
  832. isDisabled?: boolean;
  833. }> {
  834. private static _UniqueIdSeed;
  835. private _uniqueId;
  836. private _localChange;
  837. constructor(props: ICheckBoxLineComponentProps);
  838. shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {
  839. isSelected: boolean;
  840. isDisabled: boolean;
  841. }): boolean;
  842. onChange(): void;
  843. render(): JSX.Element;
  844. }
  845. }
  846. declare module NODEEDITOR {
  847. export class GenericPropertyComponent extends React.Component<IPropertyComponentProps> {
  848. constructor(props: IPropertyComponentProps);
  849. render(): JSX.Element;
  850. }
  851. export class GeneralPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  852. constructor(props: IPropertyComponentProps);
  853. render(): JSX.Element;
  854. }
  855. export class GenericPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  856. constructor(props: IPropertyComponentProps);
  857. forceRebuild(notifiers?: {
  858. "rebuild"?: boolean;
  859. "update"?: boolean;
  860. }): void;
  861. render(): JSX.Element;
  862. }
  863. }
  864. declare module NODEEDITOR {
  865. export interface IColor4LineComponentProps {
  866. label: string;
  867. target: any;
  868. propertyName: string;
  869. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  870. onChange?: () => void;
  871. globalState: GlobalState;
  872. }
  873. export class Color4LineComponent extends React.Component<IColor4LineComponentProps, {
  874. isExpanded: boolean;
  875. color: BABYLON.Color4;
  876. }> {
  877. private _localChange;
  878. constructor(props: IColor4LineComponentProps);
  879. shouldComponentUpdate(nextProps: IColor4LineComponentProps, nextState: {
  880. color: BABYLON.Color4;
  881. }): boolean;
  882. onChange(newValue: string): void;
  883. switchExpandState(): void;
  884. raiseOnPropertyChanged(previousValue: BABYLON.Color4): void;
  885. updateStateR(value: number): void;
  886. updateStateG(value: number): void;
  887. updateStateB(value: number): void;
  888. updateStateA(value: number): void;
  889. copyToClipboard(): void;
  890. render(): JSX.Element;
  891. }
  892. }
  893. declare module NODEEDITOR {
  894. interface IColor4PropertyTabComponentProps {
  895. globalState: GlobalState;
  896. inputBlock: BABYLON.InputBlock;
  897. }
  898. export class Color4PropertyTabComponent extends React.Component<IColor4PropertyTabComponentProps> {
  899. render(): JSX.Element;
  900. }
  901. }
  902. declare module NODEEDITOR {
  903. export class InputPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  904. private onValueChangedObserver;
  905. constructor(props: IPropertyComponentProps);
  906. componentDidMount(): void;
  907. componentWillUnmount(): void;
  908. renderValue(globalState: GlobalState): JSX.Element | null;
  909. setDefaultValue(): void;
  910. render(): JSX.Element;
  911. }
  912. }
  913. declare module NODEEDITOR {
  914. export class TransformPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  915. constructor(props: IPropertyComponentProps);
  916. render(): JSX.Element;
  917. }
  918. }
  919. declare module NODEEDITOR {
  920. interface IGradientStepComponentProps {
  921. globalState: GlobalState;
  922. step: BABYLON.GradientBlockColorStep;
  923. lineIndex: number;
  924. onDelete: () => void;
  925. onUpdateStep: () => void;
  926. onCheckForReOrder: () => void;
  927. }
  928. export class GradientStepComponent extends React.Component<IGradientStepComponentProps, {
  929. gradient: number;
  930. }> {
  931. constructor(props: IGradientStepComponentProps);
  932. updateColor(color: string): void;
  933. updateStep(gradient: number): void;
  934. onPointerUp(): void;
  935. render(): JSX.Element;
  936. }
  937. }
  938. declare module NODEEDITOR {
  939. export interface IButtonLineComponentProps {
  940. label: string;
  941. onClick: () => void;
  942. }
  943. export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
  944. constructor(props: IButtonLineComponentProps);
  945. render(): JSX.Element;
  946. }
  947. }
  948. declare module NODEEDITOR {
  949. export class GradientPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  950. constructor(props: IPropertyComponentProps);
  951. forceRebuild(): void;
  952. deleteStep(step: BABYLON.GradientBlockColorStep): void;
  953. addNewStep(): void;
  954. checkForReOrder(): void;
  955. render(): JSX.Element;
  956. }
  957. }
  958. declare module NODEEDITOR {
  959. export class LightPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  960. render(): JSX.Element;
  961. }
  962. }
  963. declare module NODEEDITOR {
  964. export class LightInformationPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  965. render(): JSX.Element;
  966. }
  967. }
  968. declare module NODEEDITOR {
  969. interface IFileButtonLineComponentProps {
  970. label: string;
  971. onClick: (file: File) => void;
  972. accept: string;
  973. }
  974. export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
  975. private uploadRef;
  976. constructor(props: IFileButtonLineComponentProps);
  977. onChange(evt: any): void;
  978. render(): JSX.Element;
  979. }
  980. }
  981. declare module NODEEDITOR {
  982. type ReflectionTexture = BABYLON.ReflectionTextureBlock | BABYLON.ReflectionBlock | BABYLON.RefractionBlock;
  983. type AnyTexture = BABYLON.TextureBlock | ReflectionTexture | BABYLON.CurrentScreenBlock | BABYLON.ParticleTextureBlock;
  984. export class TexturePropertyTabComponent extends React.Component<IPropertyComponentProps, {
  985. isEmbedded: boolean;
  986. loadAsCubeTexture: boolean;
  987. }> {
  988. get textureBlock(): AnyTexture;
  989. constructor(props: IPropertyComponentProps);
  990. UNSAFE_componentWillUpdate(nextProps: IPropertyComponentProps, nextState: {
  991. isEmbedded: boolean;
  992. loadAsCubeTexture: boolean;
  993. }): void;
  994. private _generateRandomForCache;
  995. updateAfterTextureLoad(): void;
  996. removeTexture(): void;
  997. _prepareTexture(): void;
  998. /**
  999. * Replaces the texture of the node
  1000. * @param file the file of the texture to use
  1001. */
  1002. replaceTexture(file: File): void;
  1003. replaceTextureWithUrl(url: string): void;
  1004. render(): JSX.Element;
  1005. }
  1006. }
  1007. declare module NODEEDITOR {
  1008. export class TrigonometryPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  1009. constructor(props: IPropertyComponentProps);
  1010. render(): JSX.Element;
  1011. }
  1012. }
  1013. declare module NODEEDITOR {
  1014. export class PropertyLedger {
  1015. static RegisteredControls: {
  1016. [key: string]: React.ComponentClass<IPropertyComponentProps>;
  1017. };
  1018. }
  1019. }
  1020. declare module NODEEDITOR {
  1021. export class InputDisplayManager implements IDisplayManager {
  1022. getHeaderClass(block: BABYLON.NodeMaterialBlock): "" | "constant" | "inspector";
  1023. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1024. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1025. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1026. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1027. }
  1028. }
  1029. declare module NODEEDITOR {
  1030. export class OutputDisplayManager implements IDisplayManager {
  1031. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1032. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1033. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1034. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1035. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1036. }
  1037. }
  1038. declare module NODEEDITOR {
  1039. export class ClampDisplayManager implements IDisplayManager {
  1040. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1041. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1042. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1043. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1044. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1045. }
  1046. }
  1047. declare module NODEEDITOR {
  1048. export class GradientDisplayManager implements IDisplayManager {
  1049. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1050. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1051. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1052. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1053. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1054. }
  1055. }
  1056. declare module NODEEDITOR {
  1057. export class RemapDisplayManager implements IDisplayManager {
  1058. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1059. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1060. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1061. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1062. private _extractInputValue;
  1063. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1064. }
  1065. }
  1066. declare module NODEEDITOR {
  1067. export class TrigonometryDisplayManager implements IDisplayManager {
  1068. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1069. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1070. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1071. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1072. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1073. }
  1074. }
  1075. declare module NODEEDITOR {
  1076. interface ITextureLineComponentProps {
  1077. texture: BABYLON.BaseTexture;
  1078. width: number;
  1079. height: number;
  1080. globalState?: any;
  1081. hideChannelSelect?: boolean;
  1082. }
  1083. export interface ITextureLineComponentState {
  1084. displayRed: boolean;
  1085. displayGreen: boolean;
  1086. displayBlue: boolean;
  1087. displayAlpha: boolean;
  1088. face: number;
  1089. }
  1090. export class TextureLineComponent extends React.Component<ITextureLineComponentProps, ITextureLineComponentState> {
  1091. private canvasRef;
  1092. constructor(props: ITextureLineComponentProps);
  1093. shouldComponentUpdate(nextProps: ITextureLineComponentProps, nextState: {
  1094. displayRed: boolean;
  1095. displayGreen: boolean;
  1096. displayBlue: boolean;
  1097. displayAlpha: boolean;
  1098. face: number;
  1099. }): boolean;
  1100. componentDidMount(): void;
  1101. componentDidUpdate(): void;
  1102. updatePreview(): void;
  1103. static UpdatePreview(previewCanvas: HTMLCanvasElement, texture: BABYLON.BaseTexture, width: number, options: ITextureLineComponentState, onReady?: () => void, globalState?: any): void;
  1104. render(): JSX.Element;
  1105. }
  1106. }
  1107. declare module NODEEDITOR {
  1108. export class TextureDisplayManager implements IDisplayManager {
  1109. private _previewCanvas;
  1110. private _previewImage;
  1111. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1112. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1113. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1114. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1115. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1116. }
  1117. }
  1118. declare module NODEEDITOR {
  1119. export class DiscardDisplayManager implements IDisplayManager {
  1120. getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
  1121. shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
  1122. getHeaderText(block: BABYLON.NodeMaterialBlock): string;
  1123. getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
  1124. updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
  1125. }
  1126. }
  1127. declare module NODEEDITOR {
  1128. export class DisplayLedger {
  1129. static RegisteredControls: {
  1130. [key: string]: any;
  1131. };
  1132. }
  1133. }
  1134. declare module NODEEDITOR {
  1135. export class GraphNode {
  1136. block: BABYLON.NodeMaterialBlock;
  1137. private _visual;
  1138. private _header;
  1139. private _connections;
  1140. private _inputsContainer;
  1141. private _outputsContainer;
  1142. private _content;
  1143. private _comments;
  1144. private _inputPorts;
  1145. private _outputPorts;
  1146. private _links;
  1147. private _x;
  1148. private _y;
  1149. private _gridAlignedX;
  1150. private _gridAlignedY;
  1151. private _mouseStartPointX;
  1152. private _mouseStartPointY;
  1153. private _globalState;
  1154. private _onSelectionChangedObserver;
  1155. private _onSelectionBoxMovedObserver;
  1156. private _onFrameCreatedObserver;
  1157. private _onUpdateRequiredObserver;
  1158. private _ownerCanvas;
  1159. private _isSelected;
  1160. private _displayManager;
  1161. private _isVisible;
  1162. private _enclosingFrameId;
  1163. get isVisible(): boolean;
  1164. set isVisible(value: boolean);
  1165. private _upateNodePortNames;
  1166. get outputPorts(): NodePort[];
  1167. get inputPorts(): NodePort[];
  1168. get links(): NodeLink[];
  1169. get gridAlignedX(): number;
  1170. get gridAlignedY(): number;
  1171. get x(): number;
  1172. set x(value: number);
  1173. get y(): number;
  1174. set y(value: number);
  1175. get width(): number;
  1176. get height(): number;
  1177. get id(): number;
  1178. get name(): string;
  1179. get isSelected(): boolean;
  1180. get enclosingFrameId(): number;
  1181. set enclosingFrameId(value: number);
  1182. set isSelected(value: boolean);
  1183. constructor(block: BABYLON.NodeMaterialBlock, globalState: GlobalState);
  1184. isOverlappingFrame(frame: GraphFrame): boolean;
  1185. getPortForConnectionPoint(point: BABYLON.NodeMaterialConnectionPoint): BABYLON.Nullable<NodePort>;
  1186. getLinksForConnectionPoint(point: BABYLON.NodeMaterialConnectionPoint): NodeLink[];
  1187. private _refreshFrames;
  1188. _refreshLinks(): void;
  1189. refresh(): void;
  1190. private _onDown;
  1191. cleanAccumulation(useCeil?: boolean): void;
  1192. private _onUp;
  1193. private _onMove;
  1194. renderProperties(): BABYLON.Nullable<JSX.Element>;
  1195. appendVisual(root: HTMLDivElement, owner: GraphCanvasComponent): void;
  1196. dispose(): void;
  1197. }
  1198. }
  1199. declare module NODEEDITOR {
  1200. export class GlobalState {
  1201. nodeMaterial: BABYLON.NodeMaterial;
  1202. hostElement: HTMLElement;
  1203. hostDocument: HTMLDocument;
  1204. hostWindow: Window;
  1205. onSelectionChangedObservable: BABYLON.Observable<BABYLON.Nullable<GraphNode | NodePort | GraphFrame | NodeLink | FramePortData>>;
  1206. onRebuildRequiredObservable: BABYLON.Observable<void>;
  1207. onBuiltObservable: BABYLON.Observable<void>;
  1208. onResetRequiredObservable: BABYLON.Observable<void>;
  1209. onUpdateRequiredObservable: BABYLON.Observable<void>;
  1210. onZoomToFitRequiredObservable: BABYLON.Observable<void>;
  1211. onReOrganizedRequiredObservable: BABYLON.Observable<void>;
  1212. onLogRequiredObservable: BABYLON.Observable<LogEntry>;
  1213. onErrorMessageDialogRequiredObservable: BABYLON.Observable<string>;
  1214. onIsLoadingChanged: BABYLON.Observable<boolean>;
  1215. onPreviewCommandActivated: BABYLON.Observable<boolean>;
  1216. onLightUpdated: BABYLON.Observable<void>;
  1217. onPreviewBackgroundChanged: BABYLON.Observable<void>;
  1218. onBackFaceCullingChanged: BABYLON.Observable<void>;
  1219. onDepthPrePassChanged: BABYLON.Observable<void>;
  1220. onAnimationCommandActivated: BABYLON.Observable<void>;
  1221. onCandidateLinkMoved: BABYLON.Observable<BABYLON.Nullable<BABYLON.Vector2>>;
  1222. onSelectionBoxMoved: BABYLON.Observable<DOMRect | ClientRect>;
  1223. onFrameCreatedObservable: BABYLON.Observable<GraphFrame>;
  1224. onCandidatePortSelectedObservable: BABYLON.Observable<BABYLON.Nullable<FrameNodePort | NodePort>>;
  1225. onGraphNodeRemovalObservable: BABYLON.Observable<GraphNode>;
  1226. onGetNodeFromBlock: (block: BABYLON.NodeMaterialBlock) => GraphNode;
  1227. onGridSizeChanged: BABYLON.Observable<void>;
  1228. onExposePortOnFrameObservable: BABYLON.Observable<GraphNode>;
  1229. previewType: PreviewType;
  1230. previewFile: File;
  1231. listOfCustomPreviewFiles: File[];
  1232. rotatePreview: boolean;
  1233. backgroundColor: BABYLON.Color4;
  1234. backFaceCulling: boolean;
  1235. depthPrePass: boolean;
  1236. blockKeyboardEvents: boolean;
  1237. hemisphericLight: boolean;
  1238. directionalLight0: boolean;
  1239. directionalLight1: boolean;
  1240. controlCamera: boolean;
  1241. storeEditorData: (serializationObject: any) => void;
  1242. _mode: BABYLON.NodeMaterialModes;
  1243. /** Gets the mode */
  1244. get mode(): BABYLON.NodeMaterialModes;
  1245. /** Sets the mode */
  1246. set mode(m: BABYLON.NodeMaterialModes);
  1247. customSave?: {
  1248. label: string;
  1249. action: (data: string) => Promise<void>;
  1250. };
  1251. constructor();
  1252. }
  1253. }
  1254. declare module NODEEDITOR {
  1255. export interface IButtonLineComponentProps {
  1256. data: string;
  1257. tooltip: string;
  1258. }
  1259. export class DraggableLineComponent extends React.Component<IButtonLineComponentProps> {
  1260. constructor(props: IButtonLineComponentProps);
  1261. render(): JSX.Element;
  1262. }
  1263. }
  1264. declare module NODEEDITOR {
  1265. interface INodeListComponentProps {
  1266. globalState: GlobalState;
  1267. }
  1268. export class NodeListComponent extends React.Component<INodeListComponentProps, {
  1269. filter: string;
  1270. }> {
  1271. private _onResetRequiredObserver;
  1272. private static _Tooltips;
  1273. constructor(props: INodeListComponentProps);
  1274. componentWillUnmount(): void;
  1275. filterContent(filter: string): void;
  1276. render(): JSX.Element;
  1277. }
  1278. }
  1279. declare module NODEEDITOR {
  1280. export interface IFramePropertyTabComponentProps {
  1281. globalState: GlobalState;
  1282. frame: GraphFrame;
  1283. }
  1284. export class FramePropertyTabComponent extends React.Component<IFramePropertyTabComponentProps> {
  1285. private onFrameExpandStateChangedObserver;
  1286. constructor(props: IFramePropertyTabComponentProps);
  1287. componentDidMount(): void;
  1288. componentWillUnmount(): void;
  1289. render(): JSX.Element;
  1290. }
  1291. }
  1292. declare module NODEEDITOR {
  1293. export interface IFrameNodePortPropertyTabComponentProps {
  1294. globalState: GlobalState;
  1295. frameNodePort: FrameNodePort;
  1296. frame: GraphFrame;
  1297. }
  1298. export class FrameNodePortPropertyTabComponent extends React.Component<IFrameNodePortPropertyTabComponentProps, {
  1299. port: FrameNodePort;
  1300. }> {
  1301. private _onFramePortPositionChangedObserver;
  1302. private _onSelectionChangedObserver;
  1303. constructor(props: IFrameNodePortPropertyTabComponentProps);
  1304. componentWillUnmount(): void;
  1305. render(): JSX.Element;
  1306. }
  1307. }
  1308. declare module NODEEDITOR {
  1309. export interface IFrameNodePortPropertyTabComponentProps {
  1310. globalState: GlobalState;
  1311. nodePort: NodePort;
  1312. }
  1313. export class NodePortPropertyTabComponent extends React.Component<IFrameNodePortPropertyTabComponentProps> {
  1314. private _onSelectionChangedObserver;
  1315. constructor(props: IFrameNodePortPropertyTabComponentProps);
  1316. componentWillUnmount(): void;
  1317. toggleExposeOnFrame(value: boolean): void;
  1318. render(): JSX.Element;
  1319. }
  1320. }
  1321. declare module NODEEDITOR {
  1322. interface IPropertyTabComponentProps {
  1323. globalState: GlobalState;
  1324. }
  1325. interface IPropertyTabComponentState {
  1326. currentNode: BABYLON.Nullable<GraphNode>;
  1327. currentFrame: BABYLON.Nullable<GraphFrame>;
  1328. currentFrameNodePort: BABYLON.Nullable<FrameNodePort>;
  1329. currentNodePort: BABYLON.Nullable<NodePort>;
  1330. }
  1331. export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, IPropertyTabComponentState> {
  1332. private _onBuiltObserver;
  1333. private _modeSelect;
  1334. constructor(props: IPropertyTabComponentProps);
  1335. componentDidMount(): void;
  1336. componentWillUnmount(): void;
  1337. processInputBlockUpdate(ib: BABYLON.InputBlock): void;
  1338. renderInputBlock(block: BABYLON.InputBlock): JSX.Element | null;
  1339. load(file: File): void;
  1340. save(): void;
  1341. customSave(): void;
  1342. saveToSnippetServer(): void;
  1343. loadFromSnippet(): void;
  1344. changeMode(value: any, force?: boolean, loadDefault?: boolean): boolean;
  1345. render(): JSX.Element;
  1346. }
  1347. }
  1348. declare module NODEEDITOR {
  1349. interface IPortalProps {
  1350. globalState: GlobalState;
  1351. }
  1352. export class Portal extends React.Component<IPortalProps> {
  1353. render(): React.ReactPortal;
  1354. }
  1355. }
  1356. declare module NODEEDITOR {
  1357. interface IMessageDialogComponentProps {
  1358. globalState: GlobalState;
  1359. }
  1360. export class MessageDialogComponent extends React.Component<IMessageDialogComponentProps, {
  1361. message: string;
  1362. isError: boolean;
  1363. }> {
  1364. constructor(props: IMessageDialogComponentProps);
  1365. render(): JSX.Element | null;
  1366. }
  1367. }
  1368. declare module NODEEDITOR {
  1369. export class PreviewManager {
  1370. private _nodeMaterial;
  1371. private _onBuildObserver;
  1372. private _onPreviewCommandActivatedObserver;
  1373. private _onAnimationCommandActivatedObserver;
  1374. private _onUpdateRequiredObserver;
  1375. private _onPreviewBackgroundChangedObserver;
  1376. private _onBackFaceCullingChangedObserver;
  1377. private _onDepthPrePassChangedObserver;
  1378. private _onLightUpdatedObserver;
  1379. private _engine;
  1380. private _scene;
  1381. private _meshes;
  1382. private _camera;
  1383. private _material;
  1384. private _globalState;
  1385. private _currentType;
  1386. private _lightParent;
  1387. private _postprocess;
  1388. private _particleSystem;
  1389. constructor(targetCanvas: HTMLCanvasElement, globalState: GlobalState);
  1390. private _handleAnimations;
  1391. private _prepareLights;
  1392. private _prepareScene;
  1393. private _refreshPreviewMesh;
  1394. private _loadParticleSystem;
  1395. private _forceCompilationAsync;
  1396. private _updatePreview;
  1397. dispose(): void;
  1398. }
  1399. }
  1400. declare module NODEEDITOR {
  1401. interface IPreviewMeshControlComponent {
  1402. globalState: GlobalState;
  1403. togglePreviewAreaComponent: () => void;
  1404. }
  1405. export class PreviewMeshControlComponent extends React.Component<IPreviewMeshControlComponent> {
  1406. private colorInputRef;
  1407. private filePickerRef;
  1408. private _onResetRequiredObserver;
  1409. constructor(props: IPreviewMeshControlComponent);
  1410. componentWillUnmount(): void;
  1411. changeMeshType(newOne: PreviewType): void;
  1412. useCustomMesh(evt: any): void;
  1413. onPopUp(): void;
  1414. changeAnimation(): void;
  1415. changeBackground(value: string): void;
  1416. changeBackgroundClick(): void;
  1417. render(): JSX.Element;
  1418. }
  1419. }
  1420. declare module NODEEDITOR {
  1421. interface IPreviewAreaComponentProps {
  1422. globalState: GlobalState;
  1423. width: number;
  1424. }
  1425. export class PreviewAreaComponent extends React.Component<IPreviewAreaComponentProps, {
  1426. isLoading: boolean;
  1427. }> {
  1428. private _onIsLoadingChangedObserver;
  1429. private _onResetRequiredObserver;
  1430. constructor(props: IPreviewAreaComponentProps);
  1431. componentWillUnmount(): void;
  1432. changeBackFaceCulling(value: boolean): void;
  1433. changeDepthPrePass(value: boolean): void;
  1434. render(): JSX.Element;
  1435. }
  1436. }
  1437. declare module NODEEDITOR {
  1438. interface IGraphEditorProps {
  1439. globalState: GlobalState;
  1440. }
  1441. interface IGraphEditorState {
  1442. showPreviewPopUp: boolean;
  1443. }
  1444. interface IInternalPreviewAreaOptions extends BABYLON.IInspectorOptions {
  1445. popup: boolean;
  1446. original: boolean;
  1447. explorerWidth?: string;
  1448. inspectorWidth?: string;
  1449. embedHostWidth?: string;
  1450. }
  1451. export class GraphEditor extends React.Component<IGraphEditorProps, IGraphEditorState> {
  1452. private readonly NodeWidth;
  1453. private _graphCanvas;
  1454. private _startX;
  1455. private _moveInProgress;
  1456. private _leftWidth;
  1457. private _rightWidth;
  1458. private _blocks;
  1459. private _previewManager;
  1460. private _copiedNodes;
  1461. private _copiedFrame;
  1462. private _mouseLocationX;
  1463. private _mouseLocationY;
  1464. private _onWidgetKeyUpPointer;
  1465. private _previewHost;
  1466. private _popUpWindow;
  1467. /**
  1468. * Creates a node and recursivly creates its parent nodes from it's input
  1469. * @param nodeMaterialBlock
  1470. */
  1471. createNodeFromObject(block: BABYLON.NodeMaterialBlock, recursion?: boolean): GraphNode;
  1472. addValueNode(type: string): GraphNode;
  1473. componentDidMount(): void;
  1474. componentWillUnmount(): void;
  1475. constructor(props: IGraphEditorProps);
  1476. reconnectNewNodes(nodeIndex: number, newNodes: GraphNode[], sourceNodes: GraphNode[], done: boolean[]): void;
  1477. pasteSelection(copiedNodes: GraphNode[], currentX: number, currentY: number, selectNew?: boolean): void;
  1478. zoomToFit(): void;
  1479. buildMaterial(): void;
  1480. build(): void;
  1481. showWaitScreen(): void;
  1482. hideWaitScreen(): void;
  1483. reOrganize(editorData?: BABYLON.Nullable<IEditorData>): void;
  1484. onPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
  1485. onPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
  1486. resizeColumns(evt: React.PointerEvent<HTMLDivElement>, forLeft?: boolean): void;
  1487. buildColumnLayout(): string;
  1488. emitNewBlock(event: React.DragEvent<HTMLDivElement>): void;
  1489. handlePopUp: () => void;
  1490. handleClosingPopUp: () => void;
  1491. initiatePreviewArea: (canvas?: HTMLCanvasElement) => void;
  1492. createPopUp: () => void;
  1493. createPopupWindow: (title: string, windowVariableName: string, width?: number, height?: number) => Window | null;
  1494. copyStyles: (sourceDoc: HTMLDocument, targetDoc: HTMLDocument) => void;
  1495. createPreviewMeshControlHost: (options: IInternalPreviewAreaOptions, parentControl: HTMLElement | null) => void;
  1496. createPreviewHost: (options: IInternalPreviewAreaOptions, parentControl: HTMLElement | null) => void;
  1497. fixPopUpStyles: (document: Document) => void;
  1498. render(): JSX.Element;
  1499. }
  1500. }
  1501. declare module NODEEDITOR {
  1502. export class Popup {
  1503. static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;
  1504. private static _CopyStyles;
  1505. }
  1506. }
  1507. declare module NODEEDITOR {
  1508. /**
  1509. * Interface used to specify creation options for the node editor
  1510. */
  1511. export interface INodeEditorOptions {
  1512. nodeMaterial: BABYLON.NodeMaterial;
  1513. hostElement?: HTMLElement;
  1514. customSave?: {
  1515. label: string;
  1516. action: (data: string) => Promise<void>;
  1517. };
  1518. customLoadObservable?: BABYLON.Observable<any>;
  1519. }
  1520. /**
  1521. * Class used to create a node editor
  1522. */
  1523. export class NodeEditor {
  1524. private static _CurrentState;
  1525. /**
  1526. * Show the node editor
  1527. * @param options defines the options to use to configure the node editor
  1528. */
  1529. static Show(options: INodeEditorOptions): void;
  1530. }
  1531. }