babylon.inspector.d.ts 45 KB

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