Capturar tiempo restante (Parser web)

[neodani]

Buenas,

Más de una vez he intentado parsear webs que tienen algún tipo de javascript y no lo consigo. Por ejemplo quiero obtener el tiempo restante de la siguiente oferta

http://www.groupon.es/deals/barcelona

11 horas | 2 minutos | 10 segundos

Sin embargo si capturo del código fuente no me muestra el tiempo. Es un elemento javascript...

<div class="counter"><ul><li id="hoursLeft">-</li><li id="minutesLeft">-</li><li id="secondsLeft">-</li></ul></div>

No se como obtener este tipo de información que se genera con javascript a través de un parser web.

Alguna vez os habéis encontrado con este tipo de "elementos webs" que no son parseables? Cómo lo solucionáis?

Muchas gracias de antemano!

[GatorV]

El problema como bien dices es que eso se crea vía Javascript, por lo que no lo puedes capturar así de simple con una expresión regular, ya que tendrías que crear un motor Javascript en PHP para capturar el script y ejecutarlo y ver cual es la salida.

No conozco a la fecha motores de Javascript escritos en PHP por lo que va a ser una tarea algo complicada.

Saludos.

[neodani]

Iniciado por GatorV

El problema como bien dices es que eso se crea vía Javascript, por lo que no lo puedes capturar así de simple con una expresión regular, ya que tendrías que crear un motor Javascript en PHP para capturar el script y ejecutarlo y ver cual es la salida.

No conozco a la fecha motores de Javascript escritos en PHP por lo que va a ser una tarea algo complicada.

Saludos.

Gracias GatorV, sabes como crear ese motor Javascript que comentas aunque no sea con PHP? hiciste algo parecido alguna vez? :D

Muchas gracias

[WeSoRz]

No creo que sea necesario enrevesar tanto el tema como para crear un intérprete propio de JS.
Partamos de la base sabiendo que si es algo que el propio JS muestra, será porque lo procesa desde un valor público que vaya oculto en el propio código que nos envía el servidor.
Partiendo de esa premisa, he tirado el hilo y en concreto con la página que indicas, tienen oculto un valor que es el tiempo que queda de la oferta:

Código HTML:

<input type="hidden" id="currentTimeLeft" value="40641159"/>
 

Por lo que he visto observando el JS, parece que se trata de milisegundos.

Teniendo eso, creo que no es necesario mucho más para poder parsear el tiempo restante de la oferta :)

[neodani]

Iniciado por WeSoRz

No creo que sea necesario enrevesar tanto el tema como para crear un intérprete propio de JS.
Partamos de la base sabiendo que si es algo que el propio JS muestra, será porque lo procesa desde un valor público que vaya oculto en el propio código que nos envía el servidor.
Partiendo de esa premisa, he tirado el hilo y en concreto con la página que indicas, tienen oculto un valor que es el tiempo que queda de la oferta:

Código HTML:

<input type="hidden" id="currentTimeLeft" value="40641159"/>
 

Por lo que he visto observando el JS, parece que se trata de milisegundos.

Teniendo eso, creo que no es necesario mucho más para poder parsear el tiempo restante de la oferta :)

Gracias WeSoRz es una solución perfecta.

Ahora solo queda coger ese valor y mediante jquery por ejemplo crear el correspondiente contador de tiempo.

Saludos!

[WeSoRz]

Código Javascript:

setTimer: function(){
  currentTimeLeft=parseInt(currentTimeLeft-secondsForTimer);
  if(currentTimeLeft<=0){
    $('#hoursLeft').empty().append("00");
    $('#minutesLeft').empty().append("00");
    $('#secondsLeft').empty().append("00");
    $('#timerBlock').hide();
    Index.getCurrentParticipants(url_prefix_var,true);
    clearInterval(timerTimeLeft);
  } else {
    var wholeSeconds=parseInt(currentTimeLeft/1000);
    var wholeMinutes=parseInt(currentTimeLeft/60000);
    var wholeHours=parseInt(wholeMinutes/60);
    var seconds=parseInt(wholeSeconds&#37;60);
    var minutes=parseInt(wholeMinutes%60);
    var days=parseInt(wholeHours/24);
    var hours=parseInt(wholeHours%24);
    if(wholeHours<10){
      $('#hoursLeft').empty().append("0"+wholeHours);
    }else{
      $('#hoursLeft').empty().append(wholeHours);
    }
    if(minutes<10){
      $('#minutesLeft').empty().append("0"+minutes);
    }else{
      $('#minutesLeft').empty().append(minutes);
    }
    if(seconds<10){
      $('#secondsLeft').empty().append("0"+seconds);
    }else{
      $('#secondsLeft').empty().append(seconds);
    }
  }
}
setInitialTimer: function(){
  if(currentTimeLeft<=0){
    $('#timerBlock').hide();
    Index.getCurrentParticipants(url_prefix_var,true);
    clearInterval(timerTimeLeft);
  }else{
    var wholeSeconds=parseInt(currentTimeLeft/1000);
    var wholeMinutes=parseInt(currentTimeLeft/60000);
    var wholeHours=parseInt(wholeMinutes/60);
    var seconds=parseInt(wholeSeconds%60);
    var minutes=parseInt(wholeMinutes%60);
    var days=parseInt(wholeHours/24);
    var hours=parseInt(wholeHours%24);
    if(wholeHours<10){
      $('#hoursLeft').empty().append("0"+wholeHours);
    }else{
      $('#hoursLeft').empty().append(wholeHours);
    }
    if(minutes<10){
      $('#minutesLeft').empty().append("0"+minutes);
    }else{
      $('#minutesLeft').empty().append(minutes);
    }
    if(seconds<10){
      $('#secondsLeft').empty().append("0"+seconds);
    }else{
      $('#secondsLeft').empty().append(seconds);
    }
  }
}
 

Ese es el jQuery que utilizan. De todos modos, si estás haciendo el parse en php, obtener las horas, minutos y segundos, es una operación muy sencilla.

EDIT: Cuidado que en la línea 14 me cambia el símbolo del porcentaje por su entidad HTML.

[GatorV]

Buena solución WeSoRz

y no es tan sencillo hacer un motor Javascript, preguntale a Google/Mozilla/Microsoft

[abimaelrc]

Iniciado por WeSoRz

EDIT: Cuidado que en la línea 14 me cambia el símbolo del porcentaje por su entidad HTML.

Te recomiendo que coloques un simbolo de % arriba del código y con eso se resuelve, yo siempre hago algo como

Código PHP:

// % -> Puedes borrar esta línea es para evitar un error con el highlight
setTimer: function(){
  currentTimeLeft=parseInt(currentTimeLeft-secondsForTimer);
  if(currentTimeLeft<=0){
    $('#hoursLeft').empty().append("00");
    .........
 

PD: Me gusto tu ejemplo