@extends('app')
@section('title-page', "Borne")
@section('content')

{{-- <div class="borneGround">
        <div>Atelier1 </div>

         <div>Les droits de la société en afrique francophone </div>


          <div>Nombre de place </div>

           <div>180 </div>

            <div>20 </div>

             <div>200 </div>

</div> --}}

<input type="hidden" value="{{session()->has('IDACTIVITE_ENCOURS_BORNE') ? session('IDACTIVITE_ENCOURS_BORNE') : 0}}" id="idSessionActivite">

 <div class="borneGround">
   
        
        <!-- Atelier 1 -->
        <div class="atelier"></div>
        
        <!-- Titre principal -->
        <div class="titre-principal"></div>
        
       <div class="place-restantante">
            <div class="titre-section">Capacité de la salle : </div>
             <div class="place-number-restant capacite_salle ">0</div> 
             <div  class="titre-section">places</div>
       </div>

        <div class="place-number green-text  place_restante places-container">0</div>
                <div class="place-number orange-text place_occupe places-container1">0</div>
    </div>




@endsection
@section('script')

    <script>
        $(document).ready(function() {
           infoAtelier()

           setInterval(() => {
            infoAtelier()
           }, 2000);
        });

        function infoAtelier(){
               $.ajax({
                    type: "get",
                    url: "{{ route('getAtelierInfo') }}",
                    data:{
                       idactivite_borne : $('#idSessionActivite').val()
                    },
                    dataType:'JSON',
                    success: function(resp) {

                        $('.atelier').text(resp.data[0].intitule)

                         $('.place_restante').text(parseInt(resp.data[0].capacite_salle) - parseInt(resp.countactivite_participant))

                          $('.place_occupe').text(resp.countactivite_participant)

                           $('.capacite_salle').text(resp.data[0].capacite_salle)

                            $('.titre-principal').html('')

                          $('.titre-principal').append(`
                              <div class="titre-principal-element">${resp.data[0].theme}</div>
                        `)
                    }
                });
        }

    </script>



@endsection