babylon.nodeEditor.d.ts 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650
  1. /// <reference types="react" />
  2. declare module NODEEDITOR {
  3. /**
  4. * Port model
  5. */
  6. export class DefaultPortModel extends PortModel {
  7. /**
  8. * If the port is input or output
  9. */
  10. position: string | "input" | "output";
  11. /**
  12. * What the port is connected to
  13. */
  14. connection: BABYLON.Nullable<BABYLON.NodeMaterialConnectionPoint>;
  15. defaultValue: any;
  16. static idCounter: number;
  17. constructor(name: string, type?: string);
  18. syncWithNodeMaterialConnectionPoint(connection: BABYLON.NodeMaterialConnectionPoint): void;
  19. getNodeModel(): DefaultNodeModel;
  20. link(outPort: DefaultPortModel): LinkModel<import("storm-react-diagrams").LinkModelListener>;
  21. createLinkModel(): LinkModel;
  22. static SortInputOutput(a: BABYLON.Nullable<DefaultPortModel>, b: BABYLON.Nullable<DefaultPortModel>): {
  23. input: DefaultPortModel;
  24. output: DefaultPortModel;
  25. } | null;
  26. }
  27. }
  28. declare module NODEEDITOR {
  29. interface ITextLineComponentProps {
  30. label: string;
  31. value: string;
  32. color?: string;
  33. underline?: boolean;
  34. onLink?: () => void;
  35. }
  36. export class TextLineComponent extends React.Component<ITextLineComponentProps> {
  37. constructor(props: ITextLineComponentProps);
  38. onLink(): void;
  39. renderContent(): JSX.Element;
  40. render(): JSX.Element;
  41. }
  42. }
  43. declare module NODEEDITOR {
  44. /**
  45. * Generic node model which stores information about a node editor block
  46. */
  47. export class GenericNodeModel extends DefaultNodeModel {
  48. /**
  49. * Labels for the block
  50. */
  51. header: string;
  52. /**
  53. * BABYLON.Vector2 for the node if it exists
  54. */
  55. vector2: BABYLON.Nullable<BABYLON.Vector2>;
  56. /**
  57. * BABYLON.Vector3 for the node if it exists
  58. */
  59. vector3: BABYLON.Nullable<BABYLON.Vector3>;
  60. /**
  61. * BABYLON.Vector4 for the node if it exists
  62. */
  63. vector4: BABYLON.Nullable<BABYLON.Vector4>;
  64. /**
  65. * BABYLON.Matrix for the node if it exists
  66. */
  67. matrix: BABYLON.Nullable<BABYLON.Matrix>;
  68. /**
  69. * Constructs the node model
  70. */
  71. constructor();
  72. prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;
  73. renderProperties(globalState: GlobalState): JSX.Element;
  74. }
  75. }
  76. declare module NODEEDITOR {
  77. /**
  78. * GenericNodeWidgetProps
  79. */
  80. export interface GenericNodeWidgetProps {
  81. node: BABYLON.Nullable<GenericNodeModel>;
  82. globalState: GlobalState;
  83. }
  84. /**
  85. * GenericNodeWidgetState
  86. */
  87. export interface GenericNodeWidgetState {
  88. }
  89. /**
  90. * Used to display a node block for the node editor
  91. */
  92. export class GenericNodeWidget extends React.Component<GenericNodeWidgetProps, GenericNodeWidgetState> {
  93. /**
  94. * Creates a GenericNodeWidget
  95. * @param props
  96. */
  97. constructor(props: GenericNodeWidgetProps);
  98. render(): JSX.Element;
  99. }
  100. }
  101. declare module NODEEDITOR {
  102. /**
  103. * Node factory which creates editor nodes
  104. */
  105. export class GenericNodeFactory extends SRD.AbstractNodeFactory {
  106. private _globalState;
  107. /**
  108. * Constructs a GenericNodeFactory
  109. */
  110. constructor(globalState: GlobalState);
  111. /**
  112. * Generates a node widget
  113. * @param diagramEngine diagram engine
  114. * @param node node to generate
  115. * @returns node widget jsx
  116. */
  117. generateReactWidget(diagramEngine: SRD.DiagramEngine, node: GenericNodeModel): JSX.Element;
  118. /**
  119. * Gets a new instance of a node model
  120. * @returns generic node model
  121. */
  122. getNewInstance(): GenericNodeModel;
  123. }
  124. }
  125. declare module NODEEDITOR {
  126. interface ILineContainerComponentProps {
  127. title: string;
  128. children: any[] | any;
  129. closed?: boolean;
  130. }
  131. export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {
  132. isExpanded: boolean;
  133. }> {
  134. private static _InMemoryStorage;
  135. constructor(props: ILineContainerComponentProps);
  136. switchExpandedState(): void;
  137. renderHeader(): JSX.Element;
  138. render(): JSX.Element;
  139. }
  140. }
  141. declare module NODEEDITOR {
  142. export interface IButtonLineComponentProps {
  143. label: string;
  144. onClick: () => void;
  145. }
  146. export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
  147. constructor(props: IButtonLineComponentProps);
  148. render(): JSX.Element;
  149. }
  150. }
  151. declare module NODEEDITOR {
  152. interface INodeListComponentProps {
  153. globalState: GlobalState;
  154. onAddValueNode: (b: string) => void;
  155. onAddNodeFromClass: (ObjectClass: typeof BABYLON.NodeMaterialBlock) => void;
  156. }
  157. export class NodeListComponent extends React.Component<INodeListComponentProps> {
  158. render(): JSX.Element;
  159. }
  160. }
  161. declare module NODEEDITOR {
  162. interface IPropertyTabComponentProps {
  163. globalState: GlobalState;
  164. }
  165. export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, {
  166. currentNode: BABYLON.Nullable<DefaultNodeModel>;
  167. }> {
  168. constructor(props: IPropertyTabComponentProps);
  169. componentWillMount(): void;
  170. render(): JSX.Element;
  171. }
  172. }
  173. declare module NODEEDITOR {
  174. interface IPortalProps {
  175. globalState: GlobalState;
  176. }
  177. export class Portal extends React.Component<IPortalProps> {
  178. render(): React.ReactPortal;
  179. }
  180. }
  181. declare module NODEEDITOR {
  182. interface IFileButtonLineComponentProps {
  183. label: string;
  184. onClick: (file: File) => void;
  185. accept: string;
  186. }
  187. export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
  188. constructor(props: IFileButtonLineComponentProps);
  189. onChange(evt: any): void;
  190. render(): JSX.Element;
  191. }
  192. }
  193. declare module NODEEDITOR {
  194. interface ITexturePropertyTabComponentProps {
  195. globalState: GlobalState;
  196. node: TextureNodeModel;
  197. }
  198. export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps> {
  199. /**
  200. * Replaces the texture of the node
  201. * @param file the file of the texture to use
  202. */
  203. replaceTexture(file: File): void;
  204. render(): JSX.Element;
  205. }
  206. }
  207. declare module NODEEDITOR {
  208. /**
  209. * BABYLON.Texture node model which stores information about a node editor block
  210. */
  211. export class TextureNodeModel extends DefaultNodeModel {
  212. private _block;
  213. /**
  214. * BABYLON.Texture for the node if it exists
  215. */
  216. texture: BABYLON.Nullable<BABYLON.Texture>;
  217. /**
  218. * Constructs the node model
  219. */
  220. constructor();
  221. renderProperties(globalState: GlobalState): JSX.Element;
  222. prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;
  223. }
  224. }
  225. declare module NODEEDITOR {
  226. interface ITextureLineComponentProps {
  227. texture: BABYLON.BaseTexture;
  228. width: number;
  229. height: number;
  230. globalState?: any;
  231. hideChannelSelect?: boolean;
  232. }
  233. export class TextureLineComponent extends React.Component<ITextureLineComponentProps, {
  234. displayRed: boolean;
  235. displayGreen: boolean;
  236. displayBlue: boolean;
  237. displayAlpha: boolean;
  238. face: number;
  239. }> {
  240. constructor(props: ITextureLineComponentProps);
  241. shouldComponentUpdate(nextProps: ITextureLineComponentProps, nextState: {
  242. displayRed: boolean;
  243. displayGreen: boolean;
  244. displayBlue: boolean;
  245. displayAlpha: boolean;
  246. face: number;
  247. }): boolean;
  248. componentDidMount(): void;
  249. componentDidUpdate(): void;
  250. updatePreview(): void;
  251. render(): JSX.Element;
  252. }
  253. }
  254. declare module NODEEDITOR {
  255. /**
  256. * GenericNodeWidgetProps
  257. */
  258. export interface TextureNodeWidgetProps {
  259. node: BABYLON.Nullable<TextureNodeModel>;
  260. globalState: GlobalState;
  261. }
  262. /**
  263. * Used to display a node block for the node editor
  264. */
  265. export class TextureNodeWidget extends React.Component<TextureNodeWidgetProps> {
  266. /**
  267. * Creates a GenericNodeWidget
  268. * @param props
  269. */
  270. constructor(props: TextureNodeWidgetProps);
  271. render(): JSX.Element;
  272. }
  273. }
  274. declare module NODEEDITOR {
  275. /**
  276. * Node factory which creates editor nodes
  277. */
  278. export class TextureNodeFactory extends SRD.AbstractNodeFactory {
  279. private _globalState;
  280. /**
  281. * Constructs a TextureNodeFactory
  282. */
  283. constructor(globalState: GlobalState);
  284. /**
  285. * Generates a node widget
  286. * @param diagramEngine diagram engine
  287. * @param node node to generate
  288. * @returns node widget jsx
  289. */
  290. generateReactWidget(diagramEngine: SRD.DiagramEngine, node: TextureNodeModel): JSX.Element;
  291. /**
  292. * Gets a new instance of a node model
  293. * @returns texture node model
  294. */
  295. getNewInstance(): TextureNodeModel;
  296. }
  297. }
  298. declare module NODEEDITOR {
  299. interface INumericInputComponentProps {
  300. label: string;
  301. value: number;
  302. step?: number;
  303. onChange: (value: number) => void;
  304. }
  305. export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
  306. value: string;
  307. }> {
  308. static defaultProps: {
  309. step: number;
  310. };
  311. private _localChange;
  312. constructor(props: INumericInputComponentProps);
  313. shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
  314. value: string;
  315. }): boolean;
  316. updateValue(evt: any): void;
  317. render(): JSX.Element;
  318. }
  319. }
  320. declare module NODEEDITOR {
  321. export class PropertyChangedEvent {
  322. object: any;
  323. property: string;
  324. value: any;
  325. initialValue: any;
  326. }
  327. }
  328. declare module NODEEDITOR {
  329. interface IVector2LineComponentProps {
  330. label: string;
  331. target: any;
  332. propertyName: string;
  333. step?: number;
  334. onChange?: (newvalue: BABYLON.Vector2) => void;
  335. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  336. }
  337. export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
  338. isExpanded: boolean;
  339. value: BABYLON.Vector2;
  340. }> {
  341. static defaultProps: {
  342. step: number;
  343. };
  344. private _localChange;
  345. constructor(props: IVector2LineComponentProps);
  346. shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {
  347. isExpanded: boolean;
  348. value: BABYLON.Vector2;
  349. }): boolean;
  350. switchExpandState(): void;
  351. raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;
  352. updateStateX(value: number): void;
  353. updateStateY(value: number): void;
  354. render(): JSX.Element;
  355. }
  356. }
  357. declare module NODEEDITOR {
  358. interface IVector2PropertyTabComponentProps {
  359. globalState: GlobalState;
  360. connection: BABYLON.NodeMaterialConnectionPoint;
  361. }
  362. export class Vector2PropertyTabComponent extends React.Component<IVector2PropertyTabComponentProps> {
  363. render(): JSX.Element;
  364. }
  365. }
  366. declare module NODEEDITOR {
  367. interface IVector3LineComponentProps {
  368. label: string;
  369. target: any;
  370. propertyName: string;
  371. step?: number;
  372. onChange?: (newvalue: BABYLON.Vector3) => void;
  373. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  374. }
  375. export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
  376. isExpanded: boolean;
  377. value: BABYLON.Vector3;
  378. }> {
  379. static defaultProps: {
  380. step: number;
  381. };
  382. private _localChange;
  383. constructor(props: IVector3LineComponentProps);
  384. shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
  385. isExpanded: boolean;
  386. value: BABYLON.Vector3;
  387. }): boolean;
  388. switchExpandState(): void;
  389. raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
  390. updateVector3(): void;
  391. updateStateX(value: number): void;
  392. updateStateY(value: number): void;
  393. updateStateZ(value: number): void;
  394. render(): JSX.Element;
  395. }
  396. }
  397. declare module NODEEDITOR {
  398. interface IVector3PropertyTabComponentProps {
  399. globalState: GlobalState;
  400. connection: BABYLON.NodeMaterialConnectionPoint;
  401. }
  402. export class Vector3PropertyTabComponent extends React.Component<IVector3PropertyTabComponentProps> {
  403. render(): JSX.Element;
  404. }
  405. }
  406. declare module NODEEDITOR {
  407. export interface ICheckBoxLineComponentProps {
  408. label: string;
  409. target?: any;
  410. propertyName?: string;
  411. isSelected?: () => boolean;
  412. onSelect?: (value: boolean) => void;
  413. onValueChanged?: () => void;
  414. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  415. }
  416. export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
  417. isSelected: boolean;
  418. }> {
  419. private static _UniqueIdSeed;
  420. private _uniqueId;
  421. private _localChange;
  422. constructor(props: ICheckBoxLineComponentProps);
  423. shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {
  424. isSelected: boolean;
  425. }): boolean;
  426. onChange(): void;
  427. render(): JSX.Element;
  428. }
  429. }
  430. declare module NODEEDITOR {
  431. class ListLineOption {
  432. label: string;
  433. value: number | string;
  434. }
  435. interface IOptionsLineComponentProps {
  436. label: string;
  437. target: any;
  438. propertyName: string;
  439. options: ListLineOption[];
  440. noDirectUpdate?: boolean;
  441. onSelect?: (value: number | string) => void;
  442. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  443. valuesAreStrings?: boolean;
  444. }
  445. export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
  446. value: number | string;
  447. }> {
  448. private _localChange;
  449. constructor(props: IOptionsLineComponentProps);
  450. shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
  451. value: number;
  452. }): boolean;
  453. raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
  454. updateValue(valueString: string): void;
  455. render(): JSX.Element;
  456. }
  457. }
  458. declare module NODEEDITOR {
  459. export interface IColor3LineComponentProps {
  460. label: string;
  461. target: any;
  462. propertyName: string;
  463. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  464. }
  465. export class Color3LineComponent extends React.Component<IColor3LineComponentProps, {
  466. isExpanded: boolean;
  467. color: BABYLON.Color3;
  468. }> {
  469. private _localChange;
  470. constructor(props: IColor3LineComponentProps);
  471. shouldComponentUpdate(nextProps: IColor3LineComponentProps, nextState: {
  472. color: BABYLON.Color3;
  473. }): boolean;
  474. onChange(newValue: string): void;
  475. switchExpandState(): void;
  476. raiseOnPropertyChanged(previousValue: BABYLON.Color3): void;
  477. updateStateR(value: number): void;
  478. updateStateG(value: number): void;
  479. updateStateB(value: number): void;
  480. copyToClipboard(): void;
  481. render(): JSX.Element;
  482. }
  483. }
  484. declare module NODEEDITOR {
  485. interface IColor3PropertyTabComponentProps {
  486. globalState: GlobalState;
  487. connection: BABYLON.NodeMaterialConnectionPoint;
  488. }
  489. export class Color3PropertyTabComponent extends React.Component<IColor3PropertyTabComponentProps> {
  490. render(): JSX.Element;
  491. }
  492. }
  493. declare module NODEEDITOR {
  494. interface IInputPropertyTabComponentProps {
  495. globalState: GlobalState;
  496. inputNode: InputNodeModel;
  497. }
  498. export class InputPropertyTabComponentProps extends React.Component<IInputPropertyTabComponentProps> {
  499. constructor(props: IInputPropertyTabComponentProps);
  500. renderValue(globalState: GlobalState): JSX.Element | null;
  501. setDefaultValue(): void;
  502. render(): JSX.Element;
  503. }
  504. }
  505. declare module NODEEDITOR {
  506. /**
  507. * Generic node model which stores information about a node editor block
  508. */
  509. export class InputNodeModel extends DefaultNodeModel {
  510. connection?: BABYLON.NodeMaterialConnectionPoint;
  511. /**
  512. * Constructs the node model
  513. */
  514. constructor();
  515. renderProperties(globalState: GlobalState): JSX.Element | null;
  516. }
  517. }
  518. declare module NODEEDITOR {
  519. /**
  520. * GenericNodeWidgetProps
  521. */
  522. export interface InputNodeWidgetProps {
  523. node: BABYLON.Nullable<InputNodeModel>;
  524. globalState: GlobalState;
  525. }
  526. /**
  527. * Used to display a node block for the node editor
  528. */
  529. export class InputNodeWidget extends React.Component<InputNodeWidgetProps> {
  530. /**
  531. * Creates a GenericNodeWidget
  532. * @param props
  533. */
  534. constructor(props: InputNodeWidgetProps);
  535. render(): JSX.Element;
  536. }
  537. }
  538. declare module NODEEDITOR {
  539. /**
  540. * Node factory which creates editor nodes
  541. */
  542. export class InputNodeFactory extends SRD.AbstractNodeFactory {
  543. private _globalState;
  544. /**
  545. * Constructs a GenericNodeFactory
  546. */
  547. constructor(globalState: GlobalState);
  548. /**
  549. * Generates a node widget
  550. * @param diagramEngine diagram engine
  551. * @param node node to generate
  552. * @returns node widget jsx
  553. */
  554. generateReactWidget(diagramEngine: SRD.DiagramEngine, node: InputNodeModel): JSX.Element;
  555. /**
  556. * Gets a new instance of a node model
  557. * @returns input node model
  558. */
  559. getNewInstance(): InputNodeModel;
  560. }
  561. }
  562. declare module NODEEDITOR {
  563. interface IGraphEditorProps {
  564. globalState: GlobalState;
  565. }
  566. export class NodeCreationOptions {
  567. column: number;
  568. nodeMaterialBlock?: BABYLON.NodeMaterialBlock;
  569. type?: string;
  570. connection?: BABYLON.NodeMaterialConnectionPoint;
  571. }
  572. export class GraphEditor extends React.Component<IGraphEditorProps> {
  573. private _engine;
  574. private _model;
  575. private _nodes;
  576. /** @hidden */
  577. _toAdd: LinkModel[] | null;
  578. /**
  579. * Current row/column position used when adding new nodes
  580. */
  581. private _rowPos;
  582. /**
  583. * Creates a node and recursivly creates its parent nodes from it's input
  584. * @param nodeMaterialBlock
  585. */
  586. createNodeFromObject(options: NodeCreationOptions): DefaultNodeModel;
  587. componentDidMount(): void;
  588. componentWillUnmount(): void;
  589. constructor(props: IGraphEditorProps);
  590. build(): void;
  591. addNodeFromClass(ObjectClass: typeof BABYLON.NodeMaterialBlock): DefaultNodeModel;
  592. addValueNode(type: string, column?: number, connection?: BABYLON.NodeMaterialConnectionPoint): DefaultNodeModel;
  593. render(): JSX.Element;
  594. }
  595. }
  596. declare module NODEEDITOR {
  597. /**
  598. * Generic node model which stores information about a node editor block
  599. */
  600. export class DefaultNodeModel extends NodeModel {
  601. /**
  602. * The babylon block this node represents
  603. */
  604. block: BABYLON.Nullable<BABYLON.NodeMaterialBlock>;
  605. ports: {
  606. [s: string]: DefaultPortModel;
  607. };
  608. /**
  609. * Constructs the node model
  610. */
  611. constructor(key: string);
  612. prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor, filterInputs: string[]): void;
  613. renderProperties(globalState: GlobalState): JSX.Element | null;
  614. }
  615. }
  616. declare module NODEEDITOR {
  617. export class GlobalState {
  618. nodeMaterial?: BABYLON.NodeMaterial;
  619. hostElement: HTMLElement;
  620. hostDocument: HTMLDocument;
  621. onSelectionChangedObservable: BABYLON.Observable<BABYLON.Nullable<DefaultNodeModel>>;
  622. onRebuildRequiredObservable: BABYLON.Observable<void>;
  623. onResetRequiredObservable: BABYLON.Observable<void>;
  624. onUpdateRequiredObservable: BABYLON.Observable<void>;
  625. }
  626. }
  627. declare module NODEEDITOR {
  628. export class Popup {
  629. static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;
  630. private static _CopyStyles;
  631. }
  632. }
  633. declare module NODEEDITOR {
  634. /**
  635. * Interface used to specify creation options for the node editor
  636. */
  637. export interface INodeEditorOptions {
  638. nodeMaterial: BABYLON.NodeMaterial;
  639. }
  640. /**
  641. * Class used to create a node editor
  642. */
  643. export class NodeEditor {
  644. /**
  645. * Show the node editor
  646. * @param options defines the options to use to configure the node editor
  647. */
  648. static Show(options: INodeEditorOptions): void;
  649. }
  650. }