Script condiciones nubosas en páginas Saratoga con Cumulus MX

[jmviper]

Prueba la primera parte así:

Código: [Seleccionar]

<?php

$filegetmetar = ("/var/www/html/script/condicionesmx/getmetar.txt");
$filemetar = ("/var/www/html/script/condicionesmx/metar.txt");
$metar0 = file_get_contents("https://tgftp.nws.noaa.gov/data/observations/metar/stations/LEZL.TXT");
$metar1 = file_get_contents("https://tgftp.nws.noaa.gov/data/observations/metar/stations/LEMO.TXT");
$nometarfile = file_get_contents($filemetar);
$nometarfileok = substr($nometarfile,0,27);
$fecha0utc = substr($metar0,0,16).' UTC';
$fecha1utc = substr($metar1,0,16).' UTC';
$fechaactualutc=  gmdate('d-m-Y H:i').' UTC'; 
echo $fecha0utc."<br>";
echo $fecha1utc."<br>";

function diferencia($fecha_1,$fecha_2)
{
$minutos = (strtotime($fecha_1)-strtotime($fecha_2))/60;
$minutos = floor(abs($minutos));
return $minutos;
}
$metarti0 = diferencia($fecha0utc,$fechaactualutc);
$metarti1 = diferencia($fecha1utc,$fechaactualutc);

echo $metarti0;
echo "<br>";
echo $metarti1;

//continúa...


?>
Todo estará en UTC tanto las horas de los metars como la hora actual que usas para comparar por lo que obtendrás las diferencias siempre igual, haya horario de verano o no.

[CarlosLSev]

Hola, una pequeña consulta, lo he intentado pero no he sido capaz. Al acceder a la web la imagen y descripción de las condiciones actuales siempre muestra la configurada del metar primero. Sé que solo es 1 segundo, luego ya si muestra la correcta ¿Pero habría forma de desactivarlo?.
He estado mirando el ajaxCUwx.js pero no me cuadra
Veamos esta es la parte del codigo que muestra el icono y las condiciones.

Código: [Seleccionar]

<span class="ajax" id="ajaxconditionicon2">
  <img src="<?php echo $condIconDir . newIcon($iconnumber) ?>" 
alt="<?php $t1 = fixupCondition($Currentsolardescription);
  echo $t1; ?>"
title="<?php echo $t1; ?>" height="58" width="55" />
</span>
</td>
<td class="data1" style="text-align: center;border: 0px solid lightblue"><div align="center"><div class="contenedor"><div style="text-align:center;"><span class="ajax" id="ajaxcurrentcond">
  <div class="contenedor"><a><?php echo $t1;  ?>

<span class="ajax" id="ajaxcurrentcond2"></span>
</td>
</tr></table>


La ids ajaxconditionicon2 y ajaxcurrentcond2 se suponen que son las que actualizar con ajax el icono y descripción.
Pero lo raro es que si voy a ajaxCUwx.js (el original) y digo comento las líneas que hagan esa función y listo luego al estar solo la modificación del script añadiendo eso mismo  debería de funcionar. Pero no hay nada que haga mención a eso así que ya me quedo a cuadros 😭
Alguna sugerencia?


Te adjunto un .gif Al principio muestra Despejado (lo que obtiene del metar) y luego Parcialmente nuboso(modificación del script)



https://gifyu.com/image/SMaKV

[jmviper]

El problema es que las condiciones de ajaxCUwx se ponen un poco después de ser cargadas por PHP en el servidor, el desfase es mínimo pero crea ese pequeño indeseable efecto.

Prueba a dejarlo así, quitando la imagen junto al código PHP:

Código: [Seleccionar]

<span class="ajax" id="ajaxconditionicon2"></span>
</td>
<td class="data1" style="text-align: center;border: 0px solid lightblue"><div align="center"><div class="contenedor"><div style="text-align:center;"><span class="ajax" id="ajaxcurrentcond">
  <div class="contenedor"><a>

<span class="ajax" id="ajaxcurrentcond2"></span>
</td>
</tr></table>

No saldrá ninguna imagen, se pondrá cuando cargue el ajaxCUwx

En ese código tienes 3 divs sin cerrar cada uno con una cosa diferente que podrían ser uno solo. También veo una etiqueta a sin cerrar. No sé cómo tendrás de organizado el código pero cuidado con las etiquetas sin cerrar o se te puede descuadrar la web o tener algún comportamiento indeseable según el navegador.

[CarlosLSev]

Si soy un manazas, ya está corregido
Como siempre das en el clavo
Solo había un nuevo problema al no existir ni imagen ni texto al cargar todo el bloque que hay debajo de el icono y descripción ese segundo se iba arriba y luego se desplazaba abajo. Así que cree una imagen en blanco y un espacio en blanco y aparentemente funciona. Al cargar a veces tarda 1 seg en salir , pero mucho mejor que antes
Lo deje así:

Código: [Seleccionar]


<span class="ajax" id="ajaxconditionicon2">
    <img src="ajax-images/none.jpg" width="55px">
</span>
</td>
<td class="data1" style="text-align: center;border: 0px solid lightblue"><div align="center" class="contenedor" style="text-align:center;"><span class="ajax" id="ajaxcurrentcond">
  <div class="contenedor"><?php echo "&nbsp;";  ?></span>


<span class="ajax" id="ajaxcurrentcond2"></span>
</td>
  </tr></table>

Gracias jmviper

[jmviper]

Sí, la modificación evitaba que saliera el icono metido con PHP al cargar la página pero al no haber imagen ocupando ese espacio descuadra la carga.

Aparte de la ingeniosa solución que has hecho la clave es poner una altura al elemento padre para que al cargar la página el navegador le reserve el espacio en la estructura de la página al cargarse y así ya no hace ese efecto.

Como los spans en los que van lo que se mete con ajax no se puede poner la altura (es un elemento en línea, inline)  se le puede poner un estilo con inline-block en el que sí se le puede meter altura y no ocupa todo el ancho del elemento padre como un elemento en bloque (block).

Por ejemplo, en la página de estilos o en una sección <style> en la cabecera de la página:

Código: [Seleccionar]

#ajaxconditionicon2 {
display: inline-block;
height: 58px;
width: 55px;
}

Con eso le guardamos ese espacio en la carga de la página al span padre de la imagen que posteriormente pondrá el script con ajax.

Saludos

[CarlosLSev]

Hola, como siempre consigues hacerlo más sencillo. Funciona perfecto. Saludos