@extends('cultural.examen6thAYear.plantilla6thAYear')
@section('breadcrumb')

@endsection
@section('titulo', "$examen->nombre")
@section('contenido')
@section('scripts')
<script>
globalId = '0';
    </script>
@endsection
<div class="col-12"> 
<form action="" method="POST" id="form">
    <input type="hidden" name="_token" value="{{ csrf_token() }}"></input>
    <input type="hidden" id="id" name="id" class="form-control" value="{{$globalId}}" required>
    <div class="row">
        <div class="col-sm-6 col-12 pt-3">
    <h2 style="font-size: 25px;">LISTENING COMPREHENSION (10 MARKS)  </h2>
        </div>
        <div class="col-sm-6 col-12">
        <audio src="/cultural/audio/6th Year - Pregunta 6.mp3" autoplay controls></audio>
        </div>
    </div>
     <br>
    <audio src="/cultural/audio/Audio6thYearNelson.mp3" controls></audio><br><br>
    <div class="row">
        <div class="col-sm-6 col-12">
    <p>
    <strong>41. </strong>You hear a boy and his mother talking. What do they disagree about? <br> <br>
    <strong>A- </strong>the amount of time he spends online<br>
                            <strong>B- </strong>how much fun social networks are<br>
                            <strong>C- </strong>whether he should see his friends more <br> 
    </p>
    <div style="display: inline; text-align:rigth;" class="pl-5 ml-5">
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_41" name="18_41" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_41" name="18_41" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_41" name="18_41" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div> <br>
    <p class="pt-3">
    <strong>43. </strong> You hear a man and a woman talking. What do they agree to buy?<br> <br>
    <strong>A- </strong>a new games console<br>
                            <strong>B- </strong>a new television<br>
                            <strong>C- </strong>a new computer<br> 
    </p>
    <div style="display: inline; text-align:rigth;" class="pl-5 ml-5">
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_43" name="18_43" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_43" name="18_43" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_43" name="18_43" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div> <br>
        <p class="pt-3">
    <strong>45. </strong> You hear two friends talking about a new product. What do they agree about?<br> <br>
    <strong>A- </strong>how popular it'll be<br>
                            <strong>B- </strong>how useful it’ll be<br>
                            <strong>C- </strong>how expensive it’ll be<br> 
    </p>
    <div style="display: inline; text-align:rigth;" class="pl-5 ml-5">
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_45" name="18_45" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_45" name="18_45" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_45" name="18_45" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div> <br>

   

    </div>
        <div class="col-sm-6 col-12">
    <p>
    <strong>42. </strong> You hear two friends talking about an app they are creating. What do they disagree about?<br> <br>
    <strong>A- </strong>how popular the app will be<br>
                            <strong>B- </strong>how much the app should cost<br>
                            <strong>C- </strong>what the app should be called<br> 
    </p>
    <div style="display: inline; text-align:rigth;" class="pl-5 ml-5">
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_42" name="18_42" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_42" name="18_42" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_42" name="18_42" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div> <br>
    <p class="pt-3">
    <strong>44. </strong> You hear two people on the radio reviewing a smartphone. What do they disagree about?<br> <br>
    <strong>A- </strong>how hard the phone is to use<br>
                            <strong>B- </strong>how hard the phone is to use<br>
                            <strong>C- </strong>how fashionable the phone is<br> 
    </p>
    <div style="display: inline; text-align:rigth;" class="pl-5 ml-5">
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_44" name="18_44" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_44" name="18_44" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="18_44" name="18_44" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div> <br>

   

    </div>

</div>
</form>
</div>
<div class="container pt-5">
@if(isset($docente) && $docente->fk_idusuario == Session::get('usuario_id'))
<div class="row">
        <div class="col-6 text-left">
            <a href="/examen6thAYear/pregunta5/{{$examen->idexamen}}/{{$cliente->id}}" class="actividad"><i class="fas fa-arrow-left"></i>  Actividad anterior</a>
        </div>
        <div class="col-6 pl-2 text-right">
            <a href="/examen6thAYear/pregunta7/{{$examen->idexamen}}/{{$cliente->id}}" class="btn btn-cultural"> SIGUIENTE</a>
        </div>
    </div>
@else
    <div class="row">
        <div class="col-6 text-left">
            <a href="/examen6thAYear/pregunta5/{{$examen->idexamen}}" class="actividad"><i class="fas fa-arrow-left"></i>  Actividad anterior</a>
        </div>
        <div class="col-6 pl-2 text-right">
            <a href="/examen6thAYear/pregunta7/{{$examen->idexamen}}" class="btn btn-cultural"> SIGUIENTE</a>
        </div>
    </div>
    @endif
</div>
<script>
      function guardarRespuesta(){
	 formulario = $("form").serializeArray();
	  $.ajax({
	      type: "GET",
	      dataType: 'json',
	      url: "/examen/guardarRespuesta",
          data: {
               formulario:formulario,
               idexamen:globalId,
               _token:"{{ csrf_token() }}"
                },
	    }).done(function (data){
	       
	    });
  }
  
  function fAbrirModalTiempo(){
      $('#modalTiempo').modal({backdrop: 'static', keyboard: false});
      $.ajax({
            type: "GET",
            url: "/examen/finalizado",
            data: {
                idexamen: globalId
            },
            async: true,
            dataType: "json",
            success: function(data) {
            
            }
        });
    }