babylon.inspector.d.ts 41 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257
  1. declare module INSPECTOR {
  2. class Inspector {
  3. private _c2diwrapper;
  4. /** The panel displayed at the top of the inspector */
  5. private _topPanel;
  6. /** The div containing the content of the active tab */
  7. private _tabPanel;
  8. /** The panel containing the list if items */
  9. /** The list if tree items displayed in the tree panel. */
  10. private _items;
  11. private _tabbar;
  12. private _scene;
  13. /** The HTML document relative to this inspector (the window or the popup depending on its mode) */
  14. static DOCUMENT: HTMLDocument;
  15. /** The HTML window. In popup mode, it's the popup itself. Otherwise, it's the current tab */
  16. static WINDOW: Window;
  17. /** True if the inspector is built as a popup tab */
  18. private _popupMode;
  19. /** The original canvas style, before applying the inspector*/
  20. private _canvasStyle;
  21. private _initialTab;
  22. private _parentElement;
  23. /** The inspector is created with the given engine.
  24. * If the parameter 'popup' is false, the inspector is created as a right panel on the main window.
  25. * If the parameter 'popup' is true, the inspector is created in another popup.
  26. */
  27. constructor(scene: BABYLON.Scene, popup?: boolean, initialTab?: number, parentElement?: HTMLElement, newColors?: {
  28. backgroundColor?: string;
  29. backgroundColorLighter?: string;
  30. backgroundColorLighter2?: string;
  31. backgroundColorLighter3?: string;
  32. color?: string;
  33. colorTop?: string;
  34. colorBot?: string;
  35. });
  36. /**
  37. * If the given element has a position 'asbolute' or 'relative',
  38. * returns the first parent of the given element that has a position 'relative' or 'absolute'.
  39. * If the given element has no position, returns the first parent
  40. *
  41. */
  42. private _getRelativeParent(elem, lookForAbsoluteOrRelative?);
  43. /** Build the inspector panel in the given HTML element */
  44. private _buildInspector(parent);
  45. readonly scene: BABYLON.Scene;
  46. readonly popupMode: boolean;
  47. /**
  48. * Filter the list of item present in the tree.
  49. * All item returned should have the given filter contained in the item id.
  50. */
  51. filterItem(filter: string): void;
  52. /** Display the mesh tab on the given object */
  53. displayObjectDetails(mesh: BABYLON.AbstractMesh): void;
  54. /** Clean the whole tree of item and rebuilds it */
  55. refresh(): void;
  56. /** Remove the inspector panel when it's built as a right panel:
  57. * remove the right panel and remove the wrapper
  58. */
  59. dispose(): void;
  60. /** Open the inspector in a new popup
  61. * Set 'firstTime' to true if there is no inspector created beforehands
  62. */
  63. openPopup(firstTime?: boolean): void;
  64. }
  65. }
  66. declare module INSPECTOR {
  67. const PROPERTIES: {
  68. format: (obj: any) => any;
  69. 'type_not_defined': {
  70. properties: any[];
  71. format: () => string;
  72. };
  73. 'Vector2': {
  74. type: typeof BABYLON.Vector2;
  75. properties: string[];
  76. format: (vec: BABYLON.Vector2) => string;
  77. };
  78. 'Vector3': {
  79. type: typeof BABYLON.Vector3;
  80. properties: string[];
  81. format: (vec: BABYLON.Vector3) => string;
  82. };
  83. 'Color3': {
  84. type: typeof BABYLON.Color3;
  85. properties: string[];
  86. format: (color: BABYLON.Color3) => string;
  87. };
  88. 'Quaternion': {
  89. type: typeof BABYLON.Quaternion;
  90. properties: string[];
  91. };
  92. 'Size': {
  93. type: typeof BABYLON.Size;
  94. properties: string[];
  95. format: (size: BABYLON.Size) => string;
  96. };
  97. 'Texture': {
  98. type: typeof BABYLON.Texture;
  99. properties: string[];
  100. format: (tex: BABYLON.Texture) => string;
  101. };
  102. 'MapTexture': {
  103. type: typeof BABYLON.MapTexture;
  104. };
  105. 'RenderTargetTexture': {
  106. type: typeof BABYLON.RenderTargetTexture;
  107. };
  108. 'DynamicTexture': {
  109. type: typeof BABYLON.DynamicTexture;
  110. };
  111. 'BaseTexture': {
  112. type: typeof BABYLON.BaseTexture;
  113. };
  114. 'FontTexture': {
  115. type: typeof BABYLON.FontTexture;
  116. };
  117. 'Sound': {
  118. type: typeof BABYLON.Sound;
  119. properties: string[];
  120. };
  121. 'ArcRotateCamera': {
  122. type: typeof BABYLON.ArcRotateCamera;
  123. properties: string[];
  124. };
  125. 'FreeCamera': {
  126. type: typeof BABYLON.FreeCamera;
  127. properties: string[];
  128. };
  129. 'Scene': {
  130. type: typeof BABYLON.Scene;
  131. properties: string[];
  132. };
  133. 'Mesh': {
  134. type: typeof BABYLON.Mesh;
  135. properties: string[];
  136. format: (m: BABYLON.Mesh) => string;
  137. };
  138. 'StandardMaterial': {
  139. type: typeof BABYLON.StandardMaterial;
  140. properties: string[];
  141. format: (mat: BABYLON.StandardMaterial) => string;
  142. };
  143. 'PrimitiveAlignment': {
  144. type: typeof BABYLON.PrimitiveAlignment;
  145. properties: string[];
  146. };
  147. 'PrimitiveThickness': {
  148. type: typeof BABYLON.PrimitiveThickness;
  149. properties: string[];
  150. };
  151. 'BoundingInfo2D': {
  152. type: typeof BABYLON.BoundingInfo2D;
  153. properties: string[];
  154. };
  155. 'SolidColorBrush2D': {
  156. type: typeof BABYLON.SolidColorBrush2D;
  157. properties: string[];
  158. };
  159. 'GradientColorBrush2D': {
  160. type: typeof BABYLON.GradientColorBrush2D;
  161. properties: string[];
  162. };
  163. 'PBRMaterial': {
  164. type: typeof BABYLON.PBRMaterial;
  165. properties: string[];
  166. };
  167. 'Canvas2D': {
  168. type: typeof BABYLON.Canvas2D;
  169. };
  170. 'Canvas2DEngineBoundData': {
  171. type: typeof BABYLON.Canvas2DEngineBoundData;
  172. };
  173. 'Ellipse2D': {
  174. type: typeof BABYLON.Ellipse2D;
  175. };
  176. 'Ellipse2DInstanceData': {
  177. type: typeof BABYLON.Ellipse2DInstanceData;
  178. };
  179. 'Ellipse2DRenderCache': {
  180. type: typeof BABYLON.Ellipse2DRenderCache;
  181. };
  182. 'Group2D': {
  183. type: typeof BABYLON.Group2D;
  184. };
  185. 'IntersectInfo2D': {
  186. type: typeof BABYLON.IntersectInfo2D;
  187. };
  188. 'Lines2D': {
  189. type: typeof BABYLON.Lines2D;
  190. };
  191. 'Lines2DInstanceData': {
  192. type: typeof BABYLON.Lines2DInstanceData;
  193. };
  194. 'Lines2DRenderCache': {
  195. type: typeof BABYLON.Lines2DRenderCache;
  196. };
  197. 'PrepareRender2DContext': {
  198. type: typeof BABYLON.PrepareRender2DContext;
  199. };
  200. 'Prim2DBase': {
  201. type: typeof BABYLON.Prim2DBase;
  202. };
  203. 'Prim2DClassInfo': {
  204. type: typeof BABYLON.Prim2DClassInfo;
  205. };
  206. 'Prim2DPropInfo': {
  207. type: typeof BABYLON.Prim2DPropInfo;
  208. };
  209. 'Rectangle2D': {
  210. type: typeof BABYLON.Rectangle2D;
  211. };
  212. 'Rectangle2DInstanceData': {
  213. type: typeof BABYLON.Rectangle2DInstanceData;
  214. };
  215. 'Rectangle2DRenderCache': {
  216. type: typeof BABYLON.Rectangle2DRenderCache;
  217. };
  218. 'Render2DContext': {
  219. type: typeof BABYLON.Render2DContext;
  220. };
  221. 'RenderablePrim2D': {
  222. type: typeof BABYLON.RenderablePrim2D;
  223. };
  224. 'ScreenSpaceCanvas2D': {
  225. type: typeof BABYLON.ScreenSpaceCanvas2D;
  226. };
  227. 'Shape2D': {
  228. type: typeof BABYLON.Shape2D;
  229. };
  230. 'Shape2DInstanceData': {
  231. type: typeof BABYLON.Shape2DInstanceData;
  232. };
  233. 'Sprite2D': {
  234. type: typeof BABYLON.Sprite2D;
  235. };
  236. 'Sprite2DInstanceData': {
  237. type: typeof BABYLON.Sprite2DInstanceData;
  238. };
  239. 'Sprite2DRenderCache': {
  240. type: typeof BABYLON.Sprite2DRenderCache;
  241. };
  242. 'Text2D': {
  243. type: typeof BABYLON.Text2D;
  244. };
  245. 'Text2DInstanceData': {
  246. type: typeof BABYLON.Text2DInstanceData;
  247. };
  248. 'Text2DRenderCache': {
  249. type: typeof BABYLON.Text2DRenderCache;
  250. };
  251. 'WorldSpaceCanvas2D': {
  252. type: typeof BABYLON.WorldSpaceCanvas2D;
  253. };
  254. 'WorldSpaceCanvas2DNode': {
  255. type: typeof BABYLON.WorldSpaceCanvas2DNode;
  256. };
  257. };
  258. }
  259. declare module INSPECTOR {
  260. /**
  261. * Represents a html div element.
  262. * The div is built when an instance of BasicElement is created.
  263. */
  264. abstract class BasicElement {
  265. protected _div: HTMLElement;
  266. constructor();
  267. /**
  268. * Returns the div element
  269. */
  270. toHtml(): HTMLElement;
  271. /**
  272. * Build the html element
  273. */
  274. protected _build(): void;
  275. abstract update(data?: any): any;
  276. /** Default dispose method if needed */
  277. dispose(): void;
  278. }
  279. }
  280. declare module INSPECTOR {
  281. interface IHighlight {
  282. highlight: (b: boolean) => void;
  283. }
  284. abstract class Adapter implements IHighlight {
  285. protected _obj: any;
  286. private static _name;
  287. constructor(obj: any);
  288. /** Returns the name displayed in the tree */
  289. abstract id(): string;
  290. /** Returns the type of this object - displayed in the tree */
  291. abstract type(): string;
  292. /** Returns the list of properties to be displayed for this adapter */
  293. abstract getProperties(): Array<PropertyLine>;
  294. /** Returns the actual object behind this adapter */
  295. readonly actualObject: any;
  296. /** Returns true if the given object correspond to this */
  297. correspondsTo(obj: any): boolean;
  298. /** Returns the adapter unique name */
  299. readonly name: string;
  300. /**
  301. * Returns the actual object used for this adapter
  302. */
  303. readonly object: any;
  304. /** Returns the list of tools available for this adapter */
  305. abstract getTools(): Array<AbstractTreeTool>;
  306. /** Should be overriden in subclasses */
  307. highlight(b: boolean): void;
  308. }
  309. }
  310. declare module INSPECTOR {
  311. class CameraAdapter extends Adapter implements ICameraPOV {
  312. constructor(obj: BABYLON.Camera);
  313. /** Returns the name displayed in the tree */
  314. id(): string;
  315. /** Returns the type of this object - displayed in the tree */
  316. type(): string;
  317. /** Returns the list of properties to be displayed for this adapter */
  318. getProperties(): Array<PropertyLine>;
  319. getTools(): Array<AbstractTreeTool>;
  320. setPOV(): void;
  321. }
  322. }
  323. declare module INSPECTOR {
  324. class SoundAdapter extends Adapter implements ISoundInteractions {
  325. constructor(obj: BABYLON.Sound);
  326. /** Returns the name displayed in the tree */
  327. id(): string;
  328. /** Returns the type of this object - displayed in the tree */
  329. type(): string;
  330. /** Returns the list of properties to be displayed for this adapter */
  331. getProperties(): Array<PropertyLine>;
  332. getTools(): Array<AbstractTreeTool>;
  333. setPlaying(callback: Function): void;
  334. }
  335. }
  336. declare module INSPECTOR {
  337. class TextureAdapter extends Adapter {
  338. constructor(obj: BABYLON.BaseTexture);
  339. /** Returns the name displayed in the tree */
  340. id(): string;
  341. /** Returns the type of this object - displayed in the tree */
  342. type(): string;
  343. /** Returns the list of properties to be displayed for this adapter */
  344. getProperties(): Array<PropertyLine>;
  345. getTools(): Array<AbstractTreeTool>;
  346. }
  347. }
  348. declare module INSPECTOR {
  349. class LightAdapter extends Adapter implements IToolVisible {
  350. private static _PROPERTIES;
  351. constructor(obj: BABYLON.Light);
  352. /** Returns the name displayed in the tree */
  353. id(): string;
  354. /** Returns the type of this object - displayed in the tree */
  355. type(): string;
  356. /** Returns the list of properties to be displayed for this adapter */
  357. getProperties(): Array<PropertyLine>;
  358. getTools(): Array<AbstractTreeTool>;
  359. setVisible(b: boolean): void;
  360. isVisible(): boolean;
  361. /** Returns some information about this mesh */
  362. /** Overrides super.highlight */
  363. highlight(b: boolean): void;
  364. }
  365. }
  366. declare module INSPECTOR {
  367. class MaterialAdapter extends Adapter {
  368. constructor(obj: BABYLON.Material);
  369. /** Returns the name displayed in the tree */
  370. id(): string;
  371. /** Returns the type of this object - displayed in the tree */
  372. type(): string;
  373. /** Returns the list of properties to be displayed for this adapter */
  374. getProperties(): Array<PropertyLine>;
  375. /** No tools for a material adapter */
  376. getTools(): Array<AbstractTreeTool>;
  377. /** Overrides super.highlight.
  378. * Highlighting a material outlines all meshes linked to this material
  379. */
  380. highlight(b: boolean): void;
  381. }
  382. }
  383. declare module INSPECTOR {
  384. class MeshAdapter extends Adapter implements IToolVisible, IToolDebug, IToolBoundingBox, IToolInfo {
  385. /** Keep track of the axis of the actual object */
  386. private _axis;
  387. constructor(obj: BABYLON.AbstractMesh);
  388. /** Returns the name displayed in the tree */
  389. id(): string;
  390. /** Returns the type of this object - displayed in the tree */
  391. type(): string;
  392. /** Returns the list of properties to be displayed for this adapter */
  393. getProperties(): Array<PropertyLine>;
  394. getTools(): Array<AbstractTreeTool>;
  395. setVisible(b: boolean): void;
  396. isVisible(): boolean;
  397. isBoxVisible(): boolean;
  398. setBoxVisible(b: boolean): boolean;
  399. debug(b: boolean): void;
  400. /** Returns some information about this mesh */
  401. getInfo(): string;
  402. /** Overrides super.highlight */
  403. highlight(b: boolean): void;
  404. /** Draw X, Y and Z axis for the actual object if this adapter.
  405. * Should be called only one time as it will fill this._axis
  406. */
  407. private _drawAxis();
  408. }
  409. }
  410. declare module INSPECTOR {
  411. interface SortDirection {
  412. [property: string]: number;
  413. }
  414. class DetailPanel extends BasicElement {
  415. private _headerRow;
  416. private _detailRows;
  417. private _sortDirection;
  418. constructor(dr?: Array<PropertyLine>);
  419. details: Array<PropertyLine>;
  420. protected _build(): void;
  421. /** Updates the HTML of the detail panel */
  422. update(): void;
  423. /** Add all lines in the html div. Does not sort them! */
  424. private _addDetails();
  425. /**
  426. * Sort the details row by comparing the given property of each row
  427. */
  428. private _sortDetails(property, _direction?);
  429. /**
  430. * Removes all data in the detail panel but keep the header row
  431. */
  432. clean(): void;
  433. /** Overrides basicelement.dispose */
  434. dispose(): void;
  435. /**
  436. * Creates the header row : name, value, id
  437. */
  438. private _createHeaderRow();
  439. }
  440. }
  441. declare module INSPECTOR {
  442. /**
  443. * A property is a link between a data (string) and an object.
  444. */
  445. class Property {
  446. /** The property name */
  447. private _property;
  448. /** The obj this property refers to */
  449. private _obj;
  450. constructor(prop: string, obj: any);
  451. readonly name: string;
  452. value: any;
  453. readonly type: string;
  454. obj: any;
  455. }
  456. }
  457. declare module INSPECTOR {
  458. class PropertyFormatter {
  459. /**
  460. * Format the value of the given property of the given object.
  461. */
  462. static format(obj: any, prop: string): string;
  463. }
  464. /**
  465. * A property line represents a line in the detail panel. This line is composed of :
  466. * - a name (the property name)
  467. * - a value if this property is of a type 'simple' : string, number, boolean, color, texture
  468. * - the type of the value if this property is of a complex type (Vector2, Size, ...)
  469. * - a ID if defined (otherwise an empty string is displayed)
  470. * The original object is sent to the value object who will update it at will.
  471. *
  472. * A property line can contain OTHER property line objects in the case of a complex type.
  473. * If this instance has no link to other instances, its type is ALWAYS a simple one (see above).
  474. *
  475. */
  476. class PropertyLine {
  477. private _property;
  478. private _div;
  479. private _valueDiv;
  480. private _children;
  481. private static _SIMPLE_TYPE;
  482. private static _MARGIN_LEFT;
  483. private _level;
  484. /** The list of viewer element displayed at the end of the line (color, texture...) */
  485. private _elements;
  486. /** The property parent of this one. Used to update the value of this property and to retrieve the correct object */
  487. private _parent;
  488. /** The input element to display if this property is 'simple' in order to update it */
  489. private _input;
  490. /** Display input handler (stored to be removed afterwards) */
  491. private _displayInputHandler;
  492. /** Handler used to validate the input by pressing 'enter' */
  493. private _validateInputHandler;
  494. /** Handler used to validate the input by pressing 'esc' */
  495. private _escapeInputHandler;
  496. constructor(prop: Property, parent?: PropertyLine, level?: number);
  497. /**
  498. * Init the input element and al its handler :
  499. * - a click in the window remove the input and restore the old property value
  500. * - enters updates the property
  501. */
  502. private _initInput();
  503. /**
  504. * On enter : validates the new value and removes the input
  505. * On escape : removes the input
  506. */
  507. private _validateInput(e);
  508. /**
  509. * On escape : removes the input
  510. */
  511. private _escapeInput(e);
  512. /** Removes the input without validating the new value */
  513. private _removeInputWithoutValidating();
  514. /** Replaces the default display with an input */
  515. private _displayInput(e);
  516. /** Retrieve the correct object from its parent.
  517. * If no parent exists, returns the property value.
  518. * This method is used at each update in case the property object is removed from the original object
  519. * (example : mesh.position = new BABYLON.Vector3 ; the original vector3 object is deleted from the mesh).
  520. */
  521. updateObject(): any;
  522. readonly name: string;
  523. readonly value: any;
  524. readonly type: string;
  525. /**
  526. * Creates elements that wil be displayed on a property line, depending on the
  527. * type of the property.
  528. */
  529. private _createElements();
  530. private _displayValueContent();
  531. /** Delete properly this property line.
  532. * Removes itself from the scheduler.
  533. * Dispose all viewer element (color, texture...)
  534. */
  535. dispose(): void;
  536. /** Updates the content of _valueDiv with the value of the property,
  537. * and all HTML element correpsonding to this type.
  538. * Elements are updated as well
  539. */
  540. private _updateValue();
  541. /**
  542. * Update the property division with the new property value.
  543. * If this property is complex, update its child, otherwise update its text content
  544. */
  545. update(): void;
  546. /**
  547. * Returns true if the given instance is a simple type
  548. */
  549. private static _IS_TYPE_SIMPLE(inst);
  550. /**
  551. * Returns true if the type of this property is simple, false otherwise.
  552. * Returns true if the value is null
  553. */
  554. private _isSimple();
  555. toHtml(): HTMLElement;
  556. /**
  557. * Add sub properties in case of a complex type
  558. */
  559. private _addDetails();
  560. }
  561. }
  562. declare module INSPECTOR {
  563. /**
  564. * Display a very small div corresponding to the given color
  565. */
  566. class ColorElement extends BasicElement {
  567. constructor(color: BABYLON.Color4 | BABYLON.Color3);
  568. update(color?: BABYLON.Color4 | BABYLON.Color3): void;
  569. private _toRgba(color);
  570. }
  571. }
  572. declare module INSPECTOR {
  573. /**
  574. * Display a very small div. A new canvas is created, with a new Babylon.js scene, containing only the
  575. * cube texture in a cube
  576. */
  577. class CubeTextureElement extends BasicElement {
  578. /** The big div displaying the full image */
  579. private _textureDiv;
  580. private _engine;
  581. protected _scene: BABYLON.Scene;
  582. protected _cube: BABYLON.Mesh;
  583. private _canvas;
  584. protected _textureUrl: string;
  585. private _pause;
  586. /** The texture given as a parameter should be cube. */
  587. constructor(tex: BABYLON.Texture);
  588. update(tex?: BABYLON.Texture): void;
  589. /** Creates the box */
  590. protected _populateScene(): void;
  591. /** Init the babylon engine */
  592. private _initEngine();
  593. private _showViewer(mode);
  594. /** Removes properly the babylon engine */
  595. dispose(): void;
  596. }
  597. }
  598. declare module INSPECTOR {
  599. /**
  600. * Display a very small div. A new canvas is created, with a new Babylon.js scene, containing only the
  601. * cube texture in a cube
  602. */
  603. class HDRCubeTextureElement extends CubeTextureElement {
  604. /** The texture given as a parameter should be cube. */
  605. constructor(tex: BABYLON.Texture);
  606. /** Creates the box */
  607. protected _populateScene(): void;
  608. }
  609. }
  610. declare module INSPECTOR {
  611. /**
  612. * A search bar can be used to filter elements in the tree panel.
  613. * At each keypress on the input, the treepanel will be filtered.
  614. */
  615. class SearchBar extends BasicElement {
  616. private _tab;
  617. private _inputElement;
  618. constructor(tab: PropertyTab);
  619. /** Delete all characters typped in the input element */
  620. reset(): void;
  621. update(): void;
  622. }
  623. }
  624. declare module INSPECTOR {
  625. /**
  626. * Display a very small div corresponding to the given texture. On mouse over, display the full image
  627. */
  628. class TextureElement extends BasicElement {
  629. /** The big div displaying the full image */
  630. private _textureDiv;
  631. constructor(tex: BABYLON.Texture);
  632. update(tex?: BABYLON.Texture): void;
  633. private _showViewer(mode);
  634. }
  635. }
  636. declare module INSPECTOR {
  637. /**
  638. * Creates a tooltip for the parent of the given html element
  639. */
  640. class Tooltip {
  641. /** The tooltip is displayed for this element */
  642. private _elem;
  643. /** The tooltip div */
  644. private _infoDiv;
  645. constructor(elem: HTMLElement, tip: string, attachTo?: HTMLElement);
  646. }
  647. }
  648. declare module INSPECTOR {
  649. class Helpers {
  650. /**
  651. * Returns the type of the given object. First
  652. * uses getClassName. If nothing is returned, used the type of the constructor
  653. */
  654. static GET_TYPE(obj: any): string;
  655. /**
  656. * Check if some properties are defined for the given type.
  657. */
  658. private static _CheckIfTypeExists(type);
  659. /**
  660. * Returns true if the user browser is edge.
  661. */
  662. static IsBrowserEdge(): boolean;
  663. /**
  664. * Returns the name of the type of the given object, where the name
  665. * is in PROPERTIES constant.
  666. * Returns 'Undefined' if no type exists for this object
  667. */
  668. private static _GetTypeFor(obj);
  669. /**
  670. * Returns the name of a function (workaround to get object type for IE11)
  671. */
  672. private static _GetFnName(fn);
  673. /** Send the event which name is given in parameter to the window */
  674. static SEND_EVENT(eventName: string): void;
  675. /** Returns the given number with 2 decimal number max if a decimal part exists */
  676. static Trunc(nb: any): number;
  677. /**
  678. * Useful function used to create a div
  679. */
  680. static CreateDiv(className?: string, parent?: HTMLElement): HTMLElement;
  681. static CreateElement(element: string, className?: string, parent?: HTMLElement): HTMLElement;
  682. /**
  683. * Removes all children of the given div.
  684. */
  685. static CleanDiv(div: HTMLElement): void;
  686. /**
  687. * Returns the true value of the given CSS Attribute from the given element (in percentage or in pixel, as it was specified in the css)
  688. */
  689. static Css(elem: HTMLElement, cssAttribute: string): string;
  690. static LoadScript(): void;
  691. static IsSystemName(name: string): boolean;
  692. }
  693. }
  694. declare module INSPECTOR {
  695. class Scheduler {
  696. private static _instance;
  697. /** The number of the set interval */
  698. private _timer;
  699. /** Is this scheduler in pause ? */
  700. pause: boolean;
  701. /** All properties are refreshed every 250ms */
  702. static REFRESH_TIME: number;
  703. /** The list of data to update */
  704. private _updatableProperties;
  705. constructor();
  706. static getInstance(): Scheduler;
  707. /** Add a property line to be updated every X ms */
  708. add(prop: PropertyLine): void;
  709. /** Removes the given property from the list of properties to update */
  710. remove(prop: PropertyLine): void;
  711. private _update();
  712. }
  713. }
  714. declare module INSPECTOR {
  715. abstract class Tab extends BasicElement {
  716. protected _tabbar: TabBar;
  717. name: string;
  718. protected _isActive: boolean;
  719. protected _panel: HTMLDivElement;
  720. constructor(tabbar: TabBar, name: string);
  721. /** True if the tab is active, false otherwise */
  722. isActive(): boolean;
  723. protected _build(): void;
  724. /** Set this tab as active or not, depending on the current state */
  725. active(b: boolean): void;
  726. update(): void;
  727. /** Creates the tab panel for this tab. */
  728. getPanel(): HTMLElement;
  729. /** Add this in the propertytab with the searchbar */
  730. filter(str: string): void;
  731. /** Dispose properly this tab */
  732. abstract dispose(): any;
  733. /** Select an item in the tree */
  734. select(item: TreeItem): void;
  735. /** Highlight the given node, and downplay all others */
  736. highlightNode(item?: TreeItem): void;
  737. /**
  738. * Returns the total width in pixel of this tab, 0 by default
  739. */
  740. getPixelWidth(): number;
  741. }
  742. }
  743. declare module INSPECTOR {
  744. /**
  745. * A Property tab can creates two panels:
  746. * a tree panel and a detail panel,
  747. * in which properties will be displayed.
  748. * Both panels are separated by a resize bar
  749. */
  750. abstract class PropertyTab extends Tab {
  751. protected _inspector: Inspector;
  752. /** The panel containing a list of items */
  753. protected _treePanel: HTMLElement;
  754. /** The panel containing a list if properties corresponding to an item */
  755. protected _detailsPanel: DetailPanel;
  756. protected _treeItems: Array<TreeItem>;
  757. protected _searchBar: SearchBar;
  758. constructor(tabbar: TabBar, name: string, insp: Inspector);
  759. /** Overrides dispose */
  760. dispose(): void;
  761. update(_items?: Array<TreeItem>): void;
  762. /** Display the details of the given item */
  763. displayDetails(item: TreeItem): void;
  764. /** Select an item in the tree */
  765. select(item: TreeItem): void;
  766. /** Highlight the given node, and downplay all others */
  767. highlightNode(item?: TreeItem): void;
  768. /** Set the given item as active in the tree */
  769. activateNode(item: TreeItem): void;
  770. /** Returns the treeitem corersponding to the given obj, null if not found */
  771. getItemFor(_obj: any): TreeItem;
  772. filter(filter: string): void;
  773. /** Builds the tree panel */
  774. protected abstract _getTree(): Array<TreeItem>;
  775. }
  776. }
  777. declare module INSPECTOR {
  778. class CameraTab extends PropertyTab {
  779. constructor(tabbar: TabBar, inspector: Inspector);
  780. protected _getTree(): Array<TreeItem>;
  781. }
  782. }
  783. declare module INSPECTOR {
  784. class SoundTab extends PropertyTab {
  785. constructor(tabbar: TabBar, inspector: Inspector);
  786. protected _getTree(): Array<TreeItem>;
  787. }
  788. }
  789. declare module INSPECTOR {
  790. class TextureTab extends Tab {
  791. private _inspector;
  792. /** The panel containing a list of items */
  793. protected _treePanel: HTMLElement;
  794. protected _treeItems: Array<TreeItem>;
  795. private _imagePanel;
  796. constructor(tabbar: TabBar, inspector: Inspector);
  797. dispose(): void;
  798. update(_items?: Array<TreeItem>): void;
  799. private _getTree();
  800. /** Display the details of the given item */
  801. displayDetails(item: TreeItem): void;
  802. /** Select an item in the tree */
  803. select(item: TreeItem): void;
  804. /** Set the given item as active in the tree */
  805. activateNode(item: TreeItem): void;
  806. /** Highlight the given node, and downplay all others */
  807. highlightNode(item?: TreeItem): void;
  808. }
  809. }
  810. declare module INSPECTOR {
  811. class LightTab extends PropertyTab {
  812. constructor(tabbar: TabBar, inspector: Inspector);
  813. protected _getTree(): Array<TreeItem>;
  814. }
  815. }
  816. declare module INSPECTOR {
  817. class MaterialTab extends PropertyTab {
  818. constructor(tabbar: TabBar, inspector: Inspector);
  819. protected _getTree(): Array<TreeItem>;
  820. }
  821. }
  822. declare module INSPECTOR {
  823. class MeshTab extends PropertyTab {
  824. constructor(tabbar: TabBar, inspector: Inspector);
  825. protected _getTree(): Array<TreeItem>;
  826. }
  827. }
  828. declare module INSPECTOR {
  829. class SceneTab extends Tab {
  830. private _inspector;
  831. /** The list of channels/options that can be activated/deactivated */
  832. private _actions;
  833. /** The list of skeleton viewer */
  834. private _skeletonViewers;
  835. /** The detail of the scene */
  836. private _detailsPanel;
  837. constructor(tabbar: TabBar, insp: Inspector);
  838. /** Overrides super.dispose */
  839. dispose(): void;
  840. /** generates a div which correspond to an option that can be activated/deactivated */
  841. private _generateActionLine(name, initValue, action);
  842. /**
  843. * Add a click action for all given elements :
  844. * the clicked element is set as active, all others elements are deactivated
  845. */
  846. private _generateRadioAction(arr);
  847. }
  848. }
  849. declare module INSPECTOR {
  850. class ShaderTab extends Tab {
  851. private _inspector;
  852. private _vertexPanel;
  853. private _fragmentPanel;
  854. constructor(tabbar: TabBar, insp: Inspector);
  855. private _selectShader(event);
  856. /** Overrides super.dispose */
  857. dispose(): void;
  858. /** Returns the position of the first { and the corresponding } */
  859. private _getBracket(str);
  860. /**
  861. * Beautify the given string : correct indentation
  862. */
  863. private _beautify(glsl, level?);
  864. }
  865. }
  866. declare module INSPECTOR {
  867. /**
  868. * The console tab will have two features :
  869. * - hook all console.log call and display them in this panel (and in the browser console as well)
  870. * - display all Babylon logs (called with Tools.Log...)
  871. */
  872. class ConsoleTab extends Tab {
  873. private _inspector;
  874. private _consolePanelContent;
  875. private _bjsPanelContent;
  876. private _oldConsoleLog;
  877. private _oldConsoleWarn;
  878. private _oldConsoleError;
  879. constructor(tabbar: TabBar, insp: Inspector);
  880. /** Overrides super.dispose */
  881. dispose(): void;
  882. private _message(type, message, caller);
  883. private _addConsoleLog(...params);
  884. private _addConsoleWarn(...params);
  885. private _addConsoleError(...params);
  886. }
  887. }
  888. declare module INSPECTOR {
  889. class StatsTab extends Tab {
  890. private _inspector;
  891. /**
  892. * Properties in this array will be updated
  893. * in a render loop - Mostly stats properties
  894. */
  895. private _updatableProperties;
  896. private _scene;
  897. private _engine;
  898. private _glInfo;
  899. private _updateLoopHandler;
  900. constructor(tabbar: TabBar, insp: Inspector);
  901. private _createStatLabel(content, parent);
  902. /** Update each properties of the stats panel */
  903. private _update();
  904. dispose(): void;
  905. }
  906. }
  907. declare module INSPECTOR {
  908. /**
  909. * A tab bar will contains each view the inspector can have : Canvas2D, Meshes...
  910. * The default active tab is the first one of the list.
  911. */
  912. class TabBar extends BasicElement {
  913. private _tabs;
  914. private _inspector;
  915. /** The tab displaying all meshes */
  916. private _meshTab;
  917. /** The toolbar */
  918. private _toolBar;
  919. /** The icon displayed at the end of the toolbar displaying a combo box of tabs not displayed */
  920. private _moreTabsIcon;
  921. /** The panel displayed when the 'more-tab' icon is selected */
  922. private _moreTabsPanel;
  923. /** The list of tab displayed by clicking on the remainingIcon */
  924. private _invisibleTabs;
  925. /** The list of tabs visible, displayed in the tab bar */
  926. private _visibleTabs;
  927. constructor(inspector: Inspector, initialTab?: number);
  928. update(): void;
  929. protected _build(): void;
  930. /**
  931. * Add a tab to the 'more-tabs' panel, displayed by clicking on the
  932. * 'more-tabs' icon
  933. */
  934. private _addInvisibleTabToPanel(tab);
  935. /** Dispose the current tab, set the given tab as active, and refresh the treeview */
  936. switchTab(tab: Tab): void;
  937. /** Display the mesh tab.
  938. * If a parameter is given, the given mesh details are displayed
  939. */
  940. switchMeshTab(mesh?: BABYLON.AbstractMesh): void;
  941. /** Returns the active tab */
  942. getActiveTab(): Tab;
  943. readonly inspector: Inspector;
  944. /**
  945. * Returns the total width in pixel of the tabbar,
  946. * that corresponds to the sum of the width of each visible tab + toolbar width
  947. */
  948. getPixelWidth(): number;
  949. /** Display the remaining icon or not depending on the tabbar width.
  950. * This function should be called each time the inspector width is updated
  951. */
  952. updateWidth(): void;
  953. }
  954. }
  955. declare module INSPECTOR {
  956. abstract class AbstractTool {
  957. private _elem;
  958. protected _inspector: Inspector;
  959. constructor(icon: string, parent: HTMLElement, inspector: Inspector, tooltip: string);
  960. toHtml(): HTMLElement;
  961. /**
  962. * Returns the total width in pixel of this tool, 0 by default
  963. */
  964. getPixelWidth(): number;
  965. /**
  966. * Updates the icon of this tool with the given string
  967. */
  968. protected _updateIcon(icon: string): void;
  969. abstract action(): any;
  970. }
  971. }
  972. declare module INSPECTOR {
  973. class PauseScheduleTool extends AbstractTool {
  974. private _isPause;
  975. constructor(parent: HTMLElement, inspector: Inspector);
  976. action(): void;
  977. }
  978. }
  979. declare module INSPECTOR {
  980. class PickTool extends AbstractTool {
  981. private _isActive;
  982. private _pickHandler;
  983. constructor(parent: HTMLElement, inspector: Inspector);
  984. action(): void;
  985. /** Deactivate this tool */
  986. private _deactivate();
  987. /** Pick a mesh in the scene */
  988. private _pickMesh(evt);
  989. private _updatePointerPosition(evt);
  990. }
  991. }
  992. declare module INSPECTOR {
  993. class PopupTool extends AbstractTool {
  994. constructor(parent: HTMLElement, inspector: Inspector);
  995. action(): void;
  996. }
  997. }
  998. declare module INSPECTOR {
  999. class RefreshTool extends AbstractTool {
  1000. constructor(parent: HTMLElement, inspector: Inspector);
  1001. action(): void;
  1002. }
  1003. }
  1004. declare module INSPECTOR {
  1005. class LabelTool extends AbstractTool {
  1006. /** True if label are displayed, false otherwise */
  1007. private _isDisplayed;
  1008. private _canvas;
  1009. private _labelInitialized;
  1010. private _scene;
  1011. private _canvas2DLoaded;
  1012. private _newMeshObserver;
  1013. private _removedMeshObserver;
  1014. private _newLightObserver;
  1015. private _removedLightObserver;
  1016. private _newCameraObserver;
  1017. private _removedCameraObserver;
  1018. constructor(parent: HTMLElement, inspector: Inspector);
  1019. dispose(): void;
  1020. private _checkC2DLoaded();
  1021. private _initializeLabels();
  1022. private _createLabel(node);
  1023. private _removeLabel(node);
  1024. action(): void;
  1025. }
  1026. }
  1027. declare module INSPECTOR {
  1028. class Toolbar extends BasicElement {
  1029. private _inspector;
  1030. private _tools;
  1031. constructor(inspector: Inspector);
  1032. update(): void;
  1033. protected _build(): void;
  1034. private _addTools();
  1035. /**
  1036. * Returns the total width in pixel of the tabbar,
  1037. * that corresponds to the sum of the width of each tab + toolbar width
  1038. */
  1039. getPixelWidth(): number;
  1040. }
  1041. }
  1042. declare module INSPECTOR {
  1043. /**
  1044. * Removes the inspector panel
  1045. */
  1046. class DisposeTool extends AbstractTool {
  1047. constructor(parent: HTMLElement, inspector: Inspector);
  1048. action(): void;
  1049. }
  1050. }
  1051. declare module INSPECTOR {
  1052. class TreeItem extends BasicElement {
  1053. private _tab;
  1054. private _adapter;
  1055. private _tools;
  1056. children: Array<TreeItem>;
  1057. private _lineContent;
  1058. constructor(tab: Tab, obj: Adapter);
  1059. /** Returns the item ID == its adapter ID */
  1060. readonly id: string;
  1061. /** Add the given item as a child of this one */
  1062. add(child: TreeItem): void;
  1063. /**
  1064. * Returns the original adapter
  1065. */
  1066. readonly adapter: Adapter;
  1067. /**
  1068. * Function used to compare this item to another tree item.
  1069. * Returns the alphabetical sort of the adapter ID
  1070. */
  1071. compareTo(item: TreeItem): number;
  1072. /** Returns true if the given obj correspond to the adapter linked to this tree item */
  1073. correspondsTo(obj: any): boolean;
  1074. /** hide all children of this item */
  1075. fold(): void;
  1076. /** Show all children of this item */
  1077. unfold(): void;
  1078. /** Build the HTML of this item */
  1079. protected _build(): void;
  1080. /**
  1081. * Returns one HTML element (.details) containing all details of this primitive
  1082. */
  1083. getDetails(): Array<PropertyLine>;
  1084. update(): void;
  1085. /**
  1086. * Add an event listener on the item :
  1087. * - one click display details
  1088. * - on mouse hover the item is highlighted
  1089. */
  1090. protected _addEvent(): void;
  1091. /** Highlight or downplay this node */
  1092. highlight(b: boolean): void;
  1093. /** Returns true if the node is folded, false otherwise */
  1094. private _isFolded();
  1095. /** Set this item as active (background lighter) in the tree panel */
  1096. active(b: boolean): void;
  1097. }
  1098. }
  1099. declare module INSPECTOR {
  1100. abstract class AbstractTreeTool {
  1101. protected _elem: HTMLElement;
  1102. /** Is the tool enabled ? */
  1103. protected _on: boolean;
  1104. constructor();
  1105. toHtml(): HTMLElement;
  1106. protected _addEvents(): void;
  1107. /**
  1108. * Action launched when clicked on this element
  1109. * Should be overrided
  1110. */
  1111. protected action(): void;
  1112. }
  1113. }
  1114. declare module INSPECTOR {
  1115. /** Any object implementing this interface should
  1116. * provide methods to toggle its bounding box
  1117. */
  1118. interface IToolBoundingBox {
  1119. isBoxVisible: () => boolean;
  1120. setBoxVisible: (b: boolean) => void;
  1121. }
  1122. /**
  1123. * Checkbox to display/hide the primitive
  1124. */
  1125. class BoundingBox extends AbstractTreeTool {
  1126. private _obj;
  1127. constructor(obj: IToolBoundingBox);
  1128. protected action(): void;
  1129. private _check();
  1130. }
  1131. }
  1132. declare module INSPECTOR {
  1133. interface ICameraPOV {
  1134. setPOV: () => void;
  1135. }
  1136. /**
  1137. *
  1138. */
  1139. class CameraPOV extends AbstractTreeTool {
  1140. private cameraPOV;
  1141. constructor(camera: ICameraPOV);
  1142. protected action(): void;
  1143. private _gotoPOV();
  1144. }
  1145. }
  1146. declare module INSPECTOR {
  1147. interface ISoundInteractions {
  1148. setPlaying: (callback: Function) => void;
  1149. }
  1150. /**
  1151. *
  1152. */
  1153. class SoundInteractions extends AbstractTreeTool {
  1154. private playSound;
  1155. private b;
  1156. constructor(playSound: ISoundInteractions);
  1157. protected action(): void;
  1158. private _playSound();
  1159. }
  1160. }
  1161. declare module INSPECTOR {
  1162. /** Any object implementing this interface should
  1163. * provide methods to toggle its visibility
  1164. */
  1165. interface IToolVisible {
  1166. isVisible: () => boolean;
  1167. setVisible: (b: boolean) => void;
  1168. }
  1169. /**
  1170. * Checkbox to display/hide the primitive
  1171. */
  1172. class Checkbox extends AbstractTreeTool {
  1173. private _obj;
  1174. constructor(obj: IToolVisible);
  1175. protected action(): void;
  1176. private _check(dontEnable?);
  1177. }
  1178. }
  1179. declare module INSPECTOR {
  1180. /** Any object implementing this interface should
  1181. * provide methods to toggle a debug area
  1182. */
  1183. interface IToolDebug {
  1184. debug: (b: boolean) => void;
  1185. }
  1186. class DebugArea extends AbstractTreeTool {
  1187. private _obj;
  1188. constructor(obj: IToolDebug);
  1189. protected action(): void;
  1190. }
  1191. }
  1192. declare module INSPECTOR {
  1193. /** Any object implementing this interface should
  1194. * provide methods to retrieve its info
  1195. */
  1196. interface IToolInfo {
  1197. getInfo: () => string;
  1198. }
  1199. /**
  1200. * Checkbox to display/hide the primitive
  1201. */
  1202. class Info extends AbstractTreeTool {
  1203. private _obj;
  1204. private _tooltip;
  1205. constructor(obj: IToolInfo);
  1206. protected action(): void;
  1207. }
  1208. }