diff --git a/NeuralNetwork/NeuralNetwork.UI.Web/Scripts/Site/Pages/ReactAppPage.jsx b/NeuralNetwork/NeuralNetwork.UI.Web/Scripts/Site/Pages/ReactAppPage.jsx
index 20070f6..4625abc 100644
--- a/NeuralNetwork/NeuralNetwork.UI.Web/Scripts/Site/Pages/ReactAppPage.jsx
+++ b/NeuralNetwork/NeuralNetwork.UI.Web/Scripts/Site/Pages/ReactAppPage.jsx
@@ -6,10 +6,11 @@ class ReactAppPage extends React.Component {
super(props);
this.api = new API_TextRecognising();
this.state =
- {
- TextRecognising_Result: "",
- TextRecognising_Learn: ""
- };
+ {
+ TextRecognising_Result: "",
+ TextRecognising_Learn: "",
+ sliderValue: 1
+ };
this.api = new API_TextRecognising();
@@ -18,6 +19,7 @@ class ReactAppPage extends React.Component {
this._OnClick_Button_Recognized = this._OnClick_Button_Recognized.bind(this);
this._OnClick_Button_Learn = this._OnClick_Button_Learn.bind(this);
this.handleInputChange = this.handleInputChange.bind(this);
+ this.handleSliderChange = this.handleSliderChange.bind(this);
}
componentDidMount() {
@@ -30,6 +32,11 @@ class ReactAppPage extends React.Component {
this.setState({ TextRecognising_Learn: event.target.value });
}
+ handleSliderChange(event) {
+ this.setState({ sliderValue: event.target.value });
+ this.canvas.ChangeThickness(event.target.value);
+ }
+
_OnClick_Button_Clear() {
this.canvas.ClearCanvas();
this.setState({ TextRecognising_Result: "", TextRecognising_Learn: "" });
@@ -57,7 +64,7 @@ class ReactAppPage extends React.Component {
return (
<div>
<div className="CanvasContainer">
- <canvas ref={"CanvasElem"} width="500" height="300"/>
+ <canvas ref={"CanvasElem"} width="500" height="300" />
</div>
<button
@@ -77,7 +84,7 @@ class ReactAppPage extends React.Component {
<div className="input-group-prepend">
<span className="input-group-text" id="basic-addon1">Result:</span>
</div>
- <input type="text" readOnly="readonly" value={this.state.TextRecognising_Result} className="form-control" aria-describedby="basic-addon1"/>
+ <input type="text" readOnly="readonly" value={this.state.TextRecognising_Result} className="form-control" aria-describedby="basic-addon1" />
</div>
<div className="input-group mb-3">
@@ -89,7 +96,11 @@ class ReactAppPage extends React.Component {
Обучить
</button>
</div>
- <input type="text" value={this.state.TextRecognising_Learn} className="form-control" onChange={this.handleInputChange}/>
+ <input type="text" value={this.state.TextRecognising_Learn} className="form-control" onChange={this.handleInputChange} />
+ </div>
+
+ <div className="slidecontainer">
+ <input type="range" min="1" max="10" step="0.5" value={this.state.sliderValue} className="slider" onChange={this.handleSliderChange} />
</div>
</div>
);