linking shared UI

.gitignore

@@ -212,3 +212,4 @@ ktx2Decoder/dist/
 # Symlinks
 inspector/src/sharedUiComponents/**/*
 nodeEditor/src/sharedUiComponents/**/*
+guiEditor/src/sharedUiComponents/**/*

guiEditor/src/components/propertyTab/propertyTabComponent.tsx

@@ -4,17 +4,17 @@ import { GlobalState } from '../../globalState';
 import { Nullable } from 'babylonjs/types';
 import { ButtonLineComponent } from '../../sharedUiComponents/lines/buttonLineComponent';
 import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
-import { FileButtonLineComponent } from '../../sharedComponents/fileButtonLineComponent';
+import { FileButtonLineComponent } from '../../sharedUiComponents/lines/fileButtonLineComponent';
 import { Tools } from 'babylonjs/Misc/tools';
 import { SerializationTools } from '../../serializationTools';
 import { CheckBoxLineComponent } from '../../sharedComponents/checkBoxLineComponent';
 import { DataStorage } from 'babylonjs/Misc/dataStorage';
 import { GUINode } from '../../diagram/guiNode';
 import { SliderLineComponent } from '../../sharedComponents/sliderLineComponent';
-import { TextLineComponent } from '../../sharedComponents/textLineComponent';
 import { Engine } from 'babylonjs/Engines/engine';
 import { InputBlock } from 'babylonjs/Materials/Node/Blocks/Input/inputBlock';
 import { Observer } from 'babylonjs/Misc/observable';
+import { TextLineComponent } from "../../sharedUiComponents/lines/textLineComponent";
 
 require("./propertyTab.scss");
 
@@ -248,7 +248,7 @@ export class PropertyTabComponent extends React.Component<IPropertyTabComponentP
                                 this.customSave();
                             }} />
                         }
-                        <FileButtonLineComponent label="Load Frame" uploadName={'frame-upload'} onClick={(file) => this.loadFrame(file)} accept=".json" />
+                        <FileButtonLineComponent label="Load Frame" onClick={(file) => this.loadFrame(file)} accept=".json" />
                     </LineContainerComponent>
                     {
                         !this.props.globalState.customSave &&

guiEditor/src/diagram/properties/sliderGuiPropertyComponent.tsx

@@ -3,9 +3,9 @@ import * as React from "react";
 import { LineContainerComponent } from '../../sharedComponents/lineContainerComponent';
 import { IPropertyComponentProps } from './propertyComponentProps';
 import { GeneralPropertyTabComponent } from './genericNodePropertyComponent';
-import { TextLineComponent } from '../../sharedComponents/textLineComponent';
 import { NumericInputComponent } from '../../sharedComponents/numericInputComponent';
 import { Slider } from "babylonjs-gui/2D/controls/sliders/slider";
+import { TextLineComponent } from "../../sharedUiComponents/lines/textLineComponent";
 
 
 export class SliderPropertyTabComponent extends React.Component<IPropertyComponentProps> {

guiEditor/src/sharedComponents/fileButtonLineComponent.tsx

@@ -1,38 +0,0 @@
-import * as React from "react";
-
-interface IFileButtonLineComponentProps {
-    label: string;
-    onClick: (file: File) => void;
-    accept: string;
-    uploadName?: string;
-}
-
-export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
-    private uploadRef: React.RefObject<HTMLInputElement>;
-
-    constructor(props: IFileButtonLineComponentProps) {
-        super(props);
-
-        this.uploadRef = React.createRef();
-    }
-
-    onChange(evt: any) {
-        var files: File[] = evt.target.files;
-        if (files && files.length) {
-            this.props.onClick(files[0]);
-        }
-
-        evt.target.value = "";
-    }
-
-    render() {
-        return (
-            <div className="buttonLine">
-                <label htmlFor={this.props.uploadName ? this.props.uploadName : "file-upload"} className="file-upload">
-                    {this.props.label}
-                </label>
-                <input ref={this.uploadRef} id={this.props.uploadName ? this.props.uploadName : "file-upload"} type="file" accept={this.props.accept} onChange={evt => this.onChange(evt)} />
-            </div>
-        );
-    }
-}

guiEditor/src/sharedComponents/textLineComponent.tsx

@@ -1,49 +0,0 @@
-import * as React from "react";
-
-interface ITextLineComponentProps {
-    label: string;
-    value: string;
-    color?: string;
-    underline?: boolean;
-    onLink?: () => void;
-}
-
-export class TextLineComponent extends React.Component<ITextLineComponentProps> {
-    constructor(props: ITextLineComponentProps) {
-        super(props);
-    }
-
-    onLink() {
-        if (!this.props.onLink) {
-            return;
-        }
-
-        this.props.onLink();
-    }
-
-    renderContent() {
-        if (this.props.onLink) {
-            return (
-                <div className="link-value" title={this.props.value} onClick={() => this.onLink()}>
-                    {this.props.value || "no name"}
-                </div>
-            )
-        }
-        return (
-            <div className="value" title={this.props.value} style={{ color: this.props.color ? this.props.color : "" }}>
-                {this.props.value || "no name"}
-            </div>
-        )
-    }
-
-    render() {
-        return (
-            <div className={this.props.underline ? "textLine underline" : "textLine"}>
-                <div className="label">
-                    {this.props.label}
-                </div>
-                {this.renderContent()}
-            </div>
-        );
-    }
-}