babylon.nodeEditor.d.ts 18 KB

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