@extends('contents.forms.modal')
@section('more')
    @component("contents.components.form-engine", [ 'data' => $dataFormExercises, "mode" => 'table' ]) @endcomponent
@endsection

<script>

    $('#form-training').attr('novalidate',true)
    $('#contract_training__step_id').val("{{$step}}");
    $('#contract_training__contract_id').val("{{$contract}}");
    $('#contract_training__weekday').val("{{$week}}");

    $('#form-training table thead tr').append($("<th width='5%'>"));
    $('#form-training table tbody tr:first-child').append($("<td>"));

    function apply(){

        $("[name='training_exercise__number[]']")
            .last()
            .val( $('#form-training table tbody tr').length )
            .focus()

        $('#form-training')
            .unbind('keypress')
            .keypress(function( e ){

            let element = $(":focus")

            let td = element.parents('td:eq(0)');

            if(e.which == 13) {

                if( element.attr('name') == "training_exercise__pause[]" ){
                    createNewLine();
                } else {

                    if( element.is(':required') &&
                        element.val() == ''){
                            //element.popover('dispose')
                            element.popover({
                                content : 'Campo Obrigatório',
                                container : 'body',
                                placement : 'top'
                            }).popover('show')
                    } else {
                        td.next().find('input,select').focus()
                    }
                }
                //
                return false;
            } else {
                element.popover('hide')
            }

            return true;

        })

        $('#form-training .delete')
            .unbind('click')
            .click(function(){
                $(this).parents('tr:eq(0)').remove()
                return false;
            })

        /*$('[name=training_exercise__pause]')
            .unbind('blur')
            .blur( function(){
            //createNewLine();
        })*/

        init()
    }

    apply()

    function createNewLine(){

        let last = $('#form-training table tbody tr:last-child')

        let newtr = last.clone();

        $('#form-training table tbody').append( newtr );
        newtr.find('select,input').val('').removeClass('done')
        newtr.find('.ui-autocomplete-input').remove();
        newtr.find('td:last-child').html("<button class='btn btn-icon btn-sm waves-effect waves-light btn-danger m-b-5 delete'> <i class='fa fa-remove'></i> </button>");
        //newtr.find('[name=training_exercise__number]').val($('#form-training table tbody tr').length)
        apply()
    }

    function cbTraining( response ){
        if(  response.message ){
            swal({
                    title: 'Sucesso!',
                    text: response.message,
                    type: 'success',
                    confirmButtonClass: 'btn btn-confirm mt-2 bg-success',
                    closeOnClickOutside : false,
                    onClose : function(){
                        $(".modal-footer .exit").click()
                    }
                }
            )
        }
    }


</script>