@extends('cultural.examen3rdYear.plantilla3rdYear')
@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;">READING COMPREHENSION (10 MARKS)</h2>
    <audio src="/cultural/audio/3rdYear-Pregunta1.mp3" autoplay controls></audio>
    <p style="text-align: justify; font-size: 15px; line-height: 30px;">
        Charlie McDonnell and Alex Day met each other on YouTube. They are friends. They got to know each other on
        You Tube and they soon realized that they had a few things in common. They both love making videos, and they
        both write and sing their own songs. They are both huge fans of the science-fiction TV series Doctor Who and
        they have a similar sense of humour. In fact, they have so many things in common and get on so well with each
        other that they even live and work together. They do occasionally argue and fall out with each other over
        something really silly, but they always make up soon afterwards. In many ways, Charlie and Alex are just like
        most young flat mates, but their shared hobbies have turned into a career for both of them.<br>
        Charlie had been making video blogs on YouTube for just a couple of months when he became an online
        celebrity almost overnight. YouTube decided to put his video called “How to get featured on YouTube” on their
        homepage and the number of views increased from 150 to 4000! Now he has had
        more than 40 million views. He has already appeared on numerous TV shows and
        he has given presentations at Google conferences.<be>
            Alex, known online as Nerimon, is a successful musician and since he started
            making videos in YouTube he has become an online celebrity. His latest project is
            a band called Sons of Admirals, which is made up of Charlie, Edplant and Tom
            Milsom, all fellow bloggers.<br>
            Watching their videos, it's clear that Charlie and Alex share a mutual respect. They
            often help each other out by promoting their friend's content on their own sites. Charlie was recently asked to
            present an award at the BAFTAs, which is the British Academy of Film and Television Arts. Who did he invite as a
            guest? Yes, you've guessed it, not his mum or girlfriend, but Alex, who blogged about it the next day! Unless
            something strange happens, Charlie and Alex will continue to enjoy their success, and their friendship. Will they
            still be the best of friends when one of them becomes really famous? Only time will tell.
    </p>
</div>
<div class="col-12 pt-3">
    <h3 class="pb-3" style="color: #8B0000;">Read the text and choose C (Charlie), A (Alex) or B (Both Charlie and Alex).</h3>
    <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><strong>1. </strong>One of his first videos got onto the YouTube homepage.</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="9_1" name="9_1" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_1" name="9_1" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_1" name="9_1" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div>

    <p class="pt-3"><strong>2. </strong>He's been on television programmes.</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="9_2" name="9_2" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_2" name="9_2" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_2" name="9_2" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div>

    <p  class="pt-3"><strong>3. </strong>His online name is Nerimon.</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="9_3" name="9_3" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_3" name="9_3" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_3" name="9_3" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div>

    <p class="pt-3"><strong>4. </strong>He's given presentations at conferences.</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="9_4" name="9_4" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_4" name="9_4" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_4" name="9_4" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div>

    <p  class="pt-3"><strong>5. </strong>He respects his best friend.</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="9_5" name="9_5" value="A" onchange="guardarRespuesta();"><strong> A </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_5" name="9_5" value="B" onchange="guardarRespuesta();"><strong> B </strong></label>
            <label class="pr-3" style="font-size: 22px;"><input type="radio" id="9_5" name="9_5" value="C" onchange="guardarRespuesta();"><strong> C</strong></label>

        </div>
    </form>
</div>
<div class="container pt-5">
@if(isset($docente) && $docente->fk_idusuario == Session::get('usuario_id'))
    <div class="row">
      
        <div class="col-12 text-right pl-2">
            <a href="/examen3rdYear/pregunta2/{{$examen->idexamen}}/{{$cliente->id}}" class="btn btn-cultural"> SIGUIENTE</a>
        </div>
    </div>
    @else
    <div class="row">
      
      <div class="col-12 text-right pl-2">
          <a href="/examen3rdYear/pregunta2/{{$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) {
            
            }
        });
    }