babylon.nodeEditor.d.ts 16 KB

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