@extends('cultural.examen1stYear.plantilla1styear')
@section('breadcrumb')

@endsection
@section('titulo', "$examen->nombre")
@section('contenido')
@section('scripts')
<script>
    globalId = '0';
    </script>
@endsection
<div class="col-12">
    <h2 style="font-size: 25px;">CHOOSE THE CORRECT WORD (5 MARKS)</h2>
    <audio src="/cultural/audio/1stYear-Pregunta2.mp3" autoplay controls></audio>
    <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>

        <p class="pt-3" style="text-align: justify; font-size: 15px; line-height: 40px;">
            I'm <strong>6. </strong><select name="5_6" id="5_6" onchange="guardarRespuesta();">
                <option value selected></option>
                <option value="1">of</option>
                <option value="2">from</option>
            </select> Manchester, but I live on Sark, an island in the British Isles. Manchester is a fantastic
            city; it's really big, with amazing buildings and luxury shops, <strong><br> 7. </strong><select name="5_7" id="5_7" onchange="guardarRespuesta();">
                <option value selected></option>
                <option value="1">because</option>
                <option value="2">but</option>
            </select> it's noisy. I'm not into
            cities – I prefer quieter places. Sark is tiny, 5.45km2, and its population is small too. There <strong>8. </strong><select name="5_8" id="5_8" onchange="guardarRespuesta();">
                <option value selected></option>
                <option value="1">is</option>
                <option value="2">are</option>
            </select>
            only about 600 people on the island. There are some small shops and restaurants, one or two offices
            and one school. But the incredible thing is there aren't <strong>9. </strong><select name="5_9" id="5_9" onchange="guardarRespuesta();">
                <option value selected></option>
                <option value="1">any</option>
                <option value="2">no</option>
            </select> cars! Sark is ideal for cycling,
            and it's a popular place for tourists. It's really pretty and there are a lot of animals. I'm interested in
            cycling and photography, not shopping or fast cars. That's why my home is here in Sark, not
            Manchester. It's the perfect place for <strong>10. </strong><select name="5_10" id="5_10" onchange="guardarRespuesta();"> </strong>
                <option value selected></option>
                <option value="1">me</option>
                <option value="2">my</option>
            </select>

        </p>
    </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="/examen1stYear/pregunta1/{{$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="/examen1stYear/pregunta3/{{$examen->idexamen}}/{{$cliente->id}}" class="btn btn-cultural"> SIGUIENTE</a>
        </div>
    </div>
    @else
    <div class="row">
        <div class="col-6 text-left">
            <a href="/examen1stYear/pregunta1/{{$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="/examen1stYear/pregunta3/{{$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) {
            
            }
        });
    }