babylon.inspector.d.ts 43 KB

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