<!DOCTYPE HTML>
<html lang="en">

<head>
    <title> T-NER </title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="{{url_for('static', path='css/bootstrap.min.css')}}" rel=" stylesheet">
    <link href="{{url_for('static', path='css/app.css')}}" rel=" stylesheet">
    <script src="{{url_for('static', path='js/jquery-3.4.1.min.js')}}"></script>
    <script src="{{url_for('static', path='js/bootstrap.min.js')}}" />
    </script>
    <script src="{{url_for('static', path='js/app.js')}}" />
    </script>
</head>


<body>
    <div class="overlay">
        <div class="spinner-border text-primary" role="status"><span class="sr-only">Loading...</span></div>
    </div>
    <h2> T-NER </h2>
    <div class="row">
        <div class="col-sm-1"></div>

        <div class="col-sm-10">
            <center>
                <h3> model checkpoint: {{ model_ckpt }} </h3>
            </center>
            <br>
            <h5> Insert a text to get prediction </h5>
            <div class="form-row">
                <div class="form-group col-md-12">
                    <textarea class="form-control input-text" id="input_text"></textarea>
                </div>
            </div>

            <div class="form-row ">
                <div class="form-group col-md-3">
                    <label for="max_len" id="label_max_len"> Max sequence length: 128 </label>
                    <input type="range" class="custom-range" min="1" max="512" value="128" step="1" id="max_len">
                </div>
                <div class="form-group col-md-3">
                    <br>
                    <button class="btn btn-success btn-lg btn-block" id="btn_generate">Run</button>
                </div>
            </div>
            <hr>
            <div class="form-row">
                <div class="col-sm-12">
                    <h5 class="text-center">Result</h5>
                    <div class="result-container" id="result"></div>
                </div>
            </div>

        </div>
        <div class="col-sm-1"></div>
    </div>
</body>

</html>