import * as React from "react" ; import { LineContainerComponent } from "../../sharedComponents/lineContainerComponent" ; import { OptionsLineComponent } from "../../sharedComponents/optionsLineComponent" ; import { TrigonometryBlockOperations , TrigonometryBlock } from "babylonjs/Materials/Node/Blocks/trigonometryBlock" ; import { IPropertyComponentProps } from "./propertyComponentProps" ; import { GeneralPropertyTabComponent } from "./genericNodePropertyComponent" ; export class TrigonometryPropertyTabComponent extends React . Component < IPropertyComponentProps > { constructor ( props ) { super ( props ) ; } render ( ) { let trigonometryBlock = this . props . block as TrigonometryBlock ; var operationOptions = [ { label : "Cos" , value : TrigonometryBlockOperations . Cos } , { label : "Sin" , value : TrigonometryBlockOperations . Sin } , { label : "Abs" , value : TrigonometryBlockOperations . Abs } , { label : "Exp" , value : TrigonometryBlockOperations . Exp } , { label : "Exp2" , value : TrigonometryBlockOperations . Exp2 } , { label : "Round" , value : TrigonometryBlockOperations . Round } , { label : "Ceiling" , value : TrigonometryBlockOperations . Ceiling } , { label : "Floor" , value : TrigonometryBlockOperations . Floor } , { label : "Sqrt" , value : TrigonometryBlockOperations . Sqrt } , { label : "ArcCos" , value : TrigonometryBlockOperations . ArcCos } , { label : "ArcSin" , value : TrigonometryBlockOperations . ArcSin } , { label : "ArcTan" , value : TrigonometryBlockOperations . ArcTan } , { label : "Tan" , value : TrigonometryBlockOperations . Tan } , { label : "Log" , value : TrigonometryBlockOperations . Log } , { label : "Fract" , value : TrigonometryBlockOperations . Fract } , { label : "Sign" , value : TrigonometryBlockOperations . Sign } , { label : "Radians to degrees" , value : TrigonometryBlockOperations . Degrees } , { label : "Degrees to radians" , value : TrigonometryBlockOperations . Radians } , ] ; operationOptions . sort ( ( a , b ) => { return a . label . localeCompare ( b . label ) ; } ) ; return ( < div > < GeneralPropertyTabComponent globalState = { this . props . globalState } block = { this . props . block } / > < LineContainerComponent title = "PROPERTIES" > < OptionsLineComponent label = "Operation" options = { operationOptions } target = { trigonometryBlock } propertyName = "operation" onSelect = { ( value ) => { this . props . globalState . onUpdateRequiredObservable . notifyObservers ( this . props . block ) ; this . props . globalState . onRebuildRequiredObservable . notifyObservers ( true ) ; this . forceUpdate ( ) ; } } /> < /LineContainerComponent> < /div>); } }