babylon.inspector.d.ts 43 KB

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