removing UI files

guiEditor/src/diagram/properties/TextGuiPropertyComponent.tsx

@@ -1,39 +0,0 @@
-
-import * as React from "react";
-import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { IPropertyComponentProps } from './propertyComponentProps';
-import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { FloatLineComponent } from '../../sharedComponents/floatLineComponent';
-import { Vector2LineComponent } from '../../sharedComponents/vector2LineComponent';
-
-export class TextPropertyTabComponent extends React.Component<IPropertyComponentProps> {
-    constructor(props: IPropertyComponentProps) {
-        super(props);
-        this.line = this.props.guiBlock as BABYLON.GUI.Line;
-        this.point1 = new BABYLON.Vector2(parseInt(this.line.x1.toString()), parseInt(this.line.y1.toString()));
-        this.point2 = new BABYLON.Vector2(parseInt(this.line.x2.toString()), parseInt(this.line.y2.toString()));
-    }
-
-    private line : BABYLON.GUI.Line;
-    public point1: BABYLON.Vector2;
-    public point2: BABYLON.Vector2;
-
-    render() {
-
-        //need to add array for dash.
-        return (
-            <>                
-                <GeneralPropertyTabComponent globalState={this.props.globalState} guiBlock={this.props.guiBlock}/>
-                <LineContainerComponent title="PROPERTIES">
-                <FloatLineComponent isInteger={true} globalState={this.props.globalState} label="Line Width" target={this.line} propertyName="lineWidth"/>
-                <Vector2LineComponent label="Point1 (x,y)" target={this} propertyName="point1" globalState={this.props.globalState} onChange={evt => {
-                    this.line.x1 = evt.x;
-                    this.line.y1 = evt.y; }}/>
-                <Vector2LineComponent label="Point2 (x,y)" target={this} propertyName="point2" globalState={this.props.globalState} onChange={evt => {
-                    this.line.x2 = evt.x;
-                    this.line.y2 = evt.y; }}/>
-                </LineContainerComponent>            
-            </>
-        );
-    }
-}

guiEditor/src/diagram/properties/buttonGuiPropertyComponent copy.tsx

@@ -1,50 +0,0 @@
-
-import * as React from "react";
-import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { IPropertyComponentProps } from './propertyComponentProps';
-import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { TextLineComponent } from '../../sharedComponents/textLineComponent';
-import { TextInputLineComponent } from '../../sharedComponents/textInputLineComponent';
-import { NumericInputComponent } from '../../sharedComponents/numericInputComponent';
-import { Color4 } from 'babylonjs';
-
-export class ButtonPropertyTabComponent extends React.Component<IPropertyComponentProps> {
-    constructor(props: IPropertyComponentProps) {
-        super(props);
-        this.button = this.props.guiBlock as BABYLON.GUI.Button;
-    }
-
-    private button : BABYLON.GUI.Button;
-    
-    getColorString()
-    {
-        return Color4.FromHexString(this.button.background);
-    }
-
-    render() {
-        return (
-            <>                
-                <GeneralPropertyTabComponent globalState={this.props.globalState} guiBlock={this.props.guiBlock}/>
-                <LineContainerComponent title="PROPERTIES"> 
-                <TextInputLineComponent globalState={this.props.globalState} label="Button Text" value={this.button.textBlock?.text}
-                onChange={evt =>{
-                    if(this.button.textBlock) this.button.textBlock.text = evt;
-                }}>
-                </TextInputLineComponent>
-                <NumericInputComponent globalState={this.props.globalState} label="Width" value={this.button.widthInPixels} 
-                onChange={evt =>{
-                   this.button.widthInPixels = evt;
-                }}>
-
-                </NumericInputComponent>
-                <NumericInputComponent globalState={this.props.globalState} label="Height" value={this.button.heightInPixels} 
-                onChange={evt =>{
-                   this.button.heightInPixels = evt;
-                }}>
-                </NumericInputComponent>  
-                <TextLineComponent label="Background Color" value={this.button.background} />
-                </LineContainerComponent>            
-            </>
-        );
-    }
-}

guiEditor/src/diagram/properties/checkboxGuiPropertyComponent.tsx

@@ -1,28 +0,0 @@
-
-import * as React from "react";
-import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { IPropertyComponentProps } from './propertyComponentProps';
-import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { FloatLineComponent } from '../../sharedComponents/floatLineComponent';
-import { CheckBoxLineComponent } from '../../sharedComponents/checkBoxLineComponent';
-
-export class CheckboxPropertyTabComponent extends React.Component<IPropertyComponentProps> {
-    constructor(props: IPropertyComponentProps) {
-        super(props);
-        this.checkbox = this.props.guiBlock as BABYLON.GUI.Checkbox;
-    }
-
-    private checkbox : BABYLON.GUI.Checkbox;
-
-    render() {
-        return (
-            <>                
-                <GeneralPropertyTabComponent globalState={this.props.globalState} guiBlock={this.props.guiBlock}/>
-                <LineContainerComponent title="PROPERTIES">
-                <FloatLineComponent globalState={this.props.globalState} label="check size ratio" target={this.checkbox} propertyName="checkSizeRatio"/>
-                <CheckBoxLineComponent label="is checked" target={this.checkbox} propertyName="isChecked" disabled={this.checkbox.isChecked}/>
-                </LineContainerComponent>            
-            </>
-        );
-    }
-}

guiEditor/src/diagram/properties/gradientStepComponent.tsx

@@ -1,80 +0,0 @@
-import * as React from 'react';
-import { GlobalState } from '../../globalState';
-import { Color3 } from 'babylonjs/Maths/math.color';
-import { GradientBlockColorStep } from 'babylonjs/Materials/Node/Blocks/gradientBlock';
-import { FloatLineComponent } from '../../sharedComponents/floatLineComponent';
-
-const deleteButton = require('../../../imgs/delete.svg');
-const copyIcon: string = require('../../sharedComponents/copy.svg');
-
-interface IGradientStepComponentProps {
-    globalState: GlobalState;
-    step: GradientBlockColorStep;
-    lineIndex: number;
-    onDelete: () => void;
-    onUpdateStep: () => void;
-    onCheckForReOrder: () => void;
-    onCopy?: () => void;
-}
-
-export class GradientStepComponent extends React.Component<IGradientStepComponentProps, {gradient: number}> {
-
-    constructor(props: IGradientStepComponentProps) {
-        super(props);
-
-        this.state={gradient: props.step.step};
-    }
-
-    updateColor(color: string) {
-        this.props.step.color = Color3.FromHexString(color);
-
-        this.props.onUpdateStep();
-        this.forceUpdate();
-    }    
-    
-    updateStep(gradient: number) {
-        this.props.step.step = gradient;
-
-        this.setState({gradient: gradient});
-
-        this.props.onUpdateStep();
-    }
-
-    onPointerUp() {
-        this.props.onCheckForReOrder();
-    }
-
-    render() {
-        let step = this.props.step;
-        
-        return (
-            <div className="gradient-step">
-                <div className="step">
-                    {`#${this.props.lineIndex}`}
-                </div>
-                <div className="step-value">
-                    <FloatLineComponent globalState={this.props.globalState} smallUI={true} label="" target={step} propertyName="step"
-                    min={0} max={1}
-                    onEnter={ () => { 
-                            this.props.onUpdateStep();
-                            this.props.onCheckForReOrder();
-                            this.forceUpdate();
-                        }
-                    } 
-                    ></FloatLineComponent>
-                </div>
-                <div className="step-slider">
-                    <input className="range" type="range" step={0.01} min={0} max={1.0} value={step.step}
-                        onPointerUp={evt => this.onPointerUp()}
-                        onChange={evt => this.updateStep(parseFloat(evt.target.value))} />
-                </div>
-                <div className="gradient-copy" onClick={() => {if(this.props.onCopy) this.props.onCopy()}} title="Copy Step">
-                    <img className="img" src={copyIcon} />
-                </div>
-                <div className="gradient-delete" onClick={() => this.props.onDelete()} title={"Delete Step"}>
-                    <img className="img" src={deleteButton}/>
-                </div>
-            </div>
-        )
-    }
-}

guiEditor/src/diagram/properties/lineGuiPropertyComponent.tsx

@@ -1,39 +0,0 @@
-
-import * as React from "react";
-import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { IPropertyComponentProps } from './propertyComponentProps';
-import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { FloatLineComponent } from '../../sharedComponents/floatLineComponent';
-import { Vector2LineComponent } from '../../sharedComponents/vector2LineComponent';
-
-export class LinePropertyTabComponent extends React.Component<IPropertyComponentProps> {
-    constructor(props: IPropertyComponentProps) {
-        super(props);
-        this.line = this.props.guiBlock as BABYLON.GUI.Line;
-        this.point1 = new BABYLON.Vector2(parseInt(this.line.x1.toString()), parseInt(this.line.y1.toString()));
-        this.point2 = new BABYLON.Vector2(parseInt(this.line.x2.toString()), parseInt(this.line.y2.toString()));
-    }
-
-    private line : BABYLON.GUI.Line;
-    public point1: BABYLON.Vector2;
-    public point2: BABYLON.Vector2;
-
-    render() {
-
-        //need to add array for dash.
-        return (
-            <>                
-                <GeneralPropertyTabComponent globalState={this.props.globalState} guiBlock={this.props.guiBlock}/>
-                <LineContainerComponent title="PROPERTIES">
-                <FloatLineComponent isInteger={true} globalState={this.props.globalState} label="Line Width" target={this.line} propertyName="lineWidth"/>
-                <Vector2LineComponent label="Point1 (x,y)" target={this} propertyName="point1" globalState={this.props.globalState} onChange={evt => {
-                    this.line.x1 = evt.x;
-                    this.line.y1 = evt.y; }}/>
-                <Vector2LineComponent label="Point2 (x,y)" target={this} propertyName="point2" globalState={this.props.globalState} onChange={evt => {
-                    this.line.x2 = evt.x;
-                    this.line.y2 = evt.y; }}/>
-                </LineContainerComponent>            
-            </>
-        );
-    }
-}

guiEditor/src/diagram/properties/shapeGuiPropertyComponent.tsx

@@ -1,41 +0,0 @@
-
-import * as React from "react";
-import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { IPropertyComponentProps } from './propertyComponentProps';
-import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { FloatLineComponent } from '../../sharedComponents/floatLineComponent';
-
-export class ShapePropertyTabComponent extends React.Component<IPropertyComponentProps> {
-    constructor(props: IPropertyComponentProps) {
-        super(props);
-        
-        this.mode = this.props.guiBlock.getClassName();
-    }
-
-    getAsType()
-    {
-        switch (this.mode) {
-            case "Rectangle":
-                return this.props.guiBlock as BABYLON.GUI.Rectangle;
-            case "Ellipse":
-                return this.props.guiBlock as BABYLON.GUI.Ellipse;       
-            default:
-                return null;
-        }
-    }
-
-    private mode : string;
-
-    render() {
-        return (
-            <>                
-                <GeneralPropertyTabComponent globalState={this.props.globalState} guiBlock={this.props.guiBlock}/>
-                <LineContainerComponent title="PROPERTIES">
-                <FloatLineComponent globalState={this.props.globalState} label="Thinkness" target={this.getAsType()} propertyName="thickness"/>
-                {this.mode === "Rectangle" &&
-                 <FloatLineComponent globalState={this.props.globalState} label="Corner Radius" target={this.getAsType()} propertyName="cornerRadius"/>}
-                </LineContainerComponent>            
-            </>
-        );
-    }
-}

guiEditor/src/diagram/propertyLedger.ts

@@ -1,19 +1,10 @@
 import { ComponentClass } from 'react';
 
 import { IPropertyComponentProps } from './properties/propertyComponentProps';
-import { ButtonPropertyTabComponent } from './properties/buttonGuiPropertyComponent copy';
 import { SliderPropertyTabComponent } from './properties/sliderGuiPropertyComponent';
-import { CheckboxPropertyTabComponent } from './properties/checkboxGuiPropertyComponent';
-import { ShapePropertyTabComponent } from './properties/shapeGuiPropertyComponent';
-import { LinePropertyTabComponent } from './properties/lineGuiPropertyComponent';
 
 export class PropertyGuiLedger {
     public static RegisteredControls: {[key: string] : ComponentClass<IPropertyComponentProps>} = {};
 }
 
-PropertyGuiLedger.RegisteredControls["Button"] = ButtonPropertyTabComponent;
 PropertyGuiLedger.RegisteredControls["Slider"] = SliderPropertyTabComponent;
-PropertyGuiLedger.RegisteredControls["Checkbox"] = CheckboxPropertyTabComponent;
-PropertyGuiLedger.RegisteredControls["Rectangle"] = ShapePropertyTabComponent;
-PropertyGuiLedger.RegisteredControls["Ellipse"] = ShapePropertyTabComponent;
-PropertyGuiLedger.RegisteredControls["Line"] = LinePropertyTabComponent;