@extends('layouts.app')

@section('content')
<section class="content-header" style="margin-bottom:20px">
    <h1>Update User</h1>
</section>
<!-- /.box -->

<div class="box">
    <div class="box-header">
        <h3 class="box-title">Update Form</h3>
        <div class="pull-right">
            <button class="btn btn-success btn-sm pull-right" onclick="window.history.back();">Back</button>
        </div>
    </div>
    <!-- /.box-header -->
    <div class="box-body">
        <form id="editUserForm" class="form-horizontal editUserForm" method="POST" action="{{ route('stream.update', $result->id) }}">
            <input type="hidden" name="_token" value="{{ csrf_token() }}">
            <input type="hidden" name="id" value="{{ $result->id }}">  

            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="form-group">
                        <label class="col-md-2">Name:</label>
                        <input type="text" name="name" class="col-md-4" placeholder="Name" value="{{ $result->name }}" required="required" />
                        <div class="col-md-3"></div>
                    </div>
                </div>
                
                <div class="col-xs-12 col-sm-12 col-md-12">
                    <div class="form-group">
                        <label class="col-md-2">Stream Url:</label>
                        <input type="text" name="stream" class="col-md-4" placeholder="Enter Stream url" value="{{ $result->stream }}" required="required" />
                        <div class="col-md-3"></div>
                    </div>
                </div>

                <div class="col-xs-12 col-sm-12 col-md-12 text-center">
                    <button type="submit" class="btn btn-primary btn-sm">Update</button>
                </div>
            </div>

        </form>
    </div>
</div>

<script>
    $(document).ready(function () {
        $("#editUserForm").validate({
            rules: {
                name: {required: true},
                email: {required: true},
                confirm_password: {
                    equalTo: "#password"
                }
            },
            messages: {
                name: {required: "Please enter admin name."},
                email: {required: "Please enter email.", remote: "Email already exist."},
                confirm_password: {equalTo: "Enter Confirm Password Same as Password."}
            }
        });

        $(".datepicker").datepicker({
            maxDate: '0',
            dateFormat: "yy-mm-dd",
            changeYear: true,
            changeMonth: true,
            yearRange: '-100:+0'
        });
        
        $(document).ready(function () {
            var max_fields_limit = 4; //set limit for maximum input fields
            var x = 0; //initialize counter for text box
            $('.add_country').click(function (e) { //click event on add more fields button
                e.preventDefault();
                if (x < max_fields_limit) { //check conditions
                    x++; //counter increment
                    $('.country_fields_container').append('<div class="addCoun col-xs-12 col-sm-12 col-md-12"><div class="form-group"><div class="col-md-2"></div><input type="text" class="col-md-4 country" id="country_' + x + '" name="location[]"><div class="col-md-2"><button class="btn btn-sm btn-danger remove_field">Remove</button></div></div></div>');

                    $('#country_' + x).rules('add', {required: true, notEqualToGroup: ['.country'], messages: {required: "Please enter country."}});
                }
            });
            $('.country_fields_container').on("click", ".remove_field", function (e) {
                //user click on remove text links
                e.preventDefault();
                $(this).parents('div[class^="addCoun"]').remove();
                x--;
            })
        });

//For country
        $(document).on("focus", ".country", function () {
            var that = $(this);
            $(this).autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: '/videos/autoComplete',
                        type: "POST",
                        data: {"_token": "{{ csrf_token() }}", "name": that.val(), "tablename": "countries"},
                        success: function (data) {
                            response(data);
                        }
                    });
                },
                minLength: 1,
            });
        });
    });
</script>

@endsection