@extends('layouts.assistant-bot')
@section('content')
    <div class="row mt-4">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">
                    <div class="row">
                        <div class="col">
                            <h6>Create Assistant</h6>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <form method="POST" action="{{route('assistantbot.storeAssistant')}}" enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            <div class="col">
                                <label for="name" class="form-label">Name</label>
                                <input class="form-control" type="text" name="name" id="name" value="{{old('name')}}"/>
                            </div>
                            <div class="col">
                                <label for="instruction" class="form-label">Instructions</label>
                                <textarea class="form-control" id="instruction" name="instruction" rows="3" col="10">{{old('instruction')}}</textarea>
                            </div>
                        </div>
                        <div class="row mt-4">
                            <div class="col">
                                <label for="temperature" class="form-label">Temperature</label>
                                <input type="number" name="temperature" id="temperature_input" class="float-end" style="max-width:50px;" value="{{old('temperature',1)}}" min="0" max="2" step="0.01">
                            <input type="range" class="form-range" min="0" max="2" step="0.01" id="temperature" value="{{old('temperature',1)}}">
                            </div>
                            <div class="col">
                                <label for="top-p" class="form-label">Top P</label>
                                <input type="number" name="top_p" id="top-p_input" class="float-end" style="max-width:50px;" value="{{old('top_p',1)}}" min="0" max="1" step="0.01">
                                <input type="range" class="form-range" min="0" max="1" step="0.01" id="top-p" value="{{old('top_p',1)}}">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <label for="uploadFile" class="form-label">Uplod File</label>
                                <input type="file" name="uploadFile" class="form-control"/>
                            </div>
                            <div class="col"></div>
                        </div>
                        <div class="row mt-4">
                            <div class="col">
                                <a class="btn btn-danger mt-2" href="{{route('assistantbot.createAssistant')}}">Cancel</a>
                                <button class="btn btn-primary mt-2" type=submit>Submit</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('script')
<script>
    // Change when the slider change
    $('#temperature').on('input',function(){
        $('#temperature_input').val($(this).val());
    });
    $('#top-p').on('input',function(){
        $('#top-p_input').val($(this).val());
    });
    // Change if the slider input change
    $('#temperature_input').on('input',function(){
        $('#temperature').val($(this).val());
    });
    $('#top-p_input').on('input',function(){
        $('#top-p').val($(this).val());
    });
</script>
@endpush