babylon.inspector.d.ts 43 KB

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