Bonjour,
j'ai besoin de récupérer la météo d'une dizaine de villes et ceci sans script serveur.
Je dois absolument afficher cela dans une page html.
J'ai donc pris un compte sur weather.com
Je ne peux pas utiliser l'url xoap (http://xoap.weather.com/weather/local/FRXX0099?cc=*&dayf=1&prod=xoap&par=1047139272&key=ff364da6dc3f2222)
car httpRequest n'accepte pas les appels distants. dommage...
Et biensur je n'ai pas la possibilité d'utiliser un mini proxy sur mon serveur.
Donc je me suis rabattu sur du bricolage.
weather.com propose ce code :
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<div id="wx_module_253">
<a href="http://www.weather.com/weather/local/FRXX0099">Toulouse Weather Forecast, France</a>
</div>
<script type="text/javascript">
/* Locations can be edited manually by updating 'wx_locID' below. Please also update */
/* the location name and link in the above div (wx_module) to reflect any changes made. */
var wx_locID = 'FRXX0099';
/* If you are editing locations manually and are adding multiple modules to one page, each */
/* module must have a unique div id. Please append a unique # to the div above, as well */
/* as the one referenced just below. If you use the builder to create individual modules */
/* you will not need to edit these parameters. */
var wx_targetDiv = 'wx_module_253';
/* Please do not change the configuration value [wx_config] manually - your module */
/* will no longer function if you do. If at any time you wish to modify this */
/* configuration please use the graphical configuration tool found at */
/* https://registration.weather.com/ursa/wow/step2 */
var wx_config='SZ=300x250*WX=FHW*LNK=SSNL*UNT=C*BGI=boat*MAP=null|null*DN=saturnino-freelance.com*TIER=0*PID=1047139272*MD5=1b16ff1a6104a33e2a9da32b58ec6c64';
document.write('<scr'+'ipt src="'+document.location.protocol+'//wow.weather.com/weather/wow/module/'+wx_locID+'?config='+wx_config+'&proto='+document.location.protocol+'&target='+wx_targetDiv+'"></scr'+'ipt>');
</script>
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
ce code affiche la météo parfaitement, mais en fait je n'ai pas besoin de toutes les infos affichées, en fait, seule le numéro de l'icône du temps qu'il fait m'interresse.
J'ai donc bricolé un code qui me permet switcher à volonter d'une ville à l'autre avec dans l'idée de masquer le conteneur de la météo affichée et de parcourir le HTML et de récupérer le numéro d'icône.
Ok çà marche mais pas dans IE7 (IE6 pas testé, MAC non plus).
En fait sous IE l'affichage reste bloqué sur "loading", mais si je selectionne l'url dans la barre de navigation et que je fait entrer, miracle, la météo s'affiche!
Voilà, donc c'est bancale et je ne suis pas très loin du but...
voici le code:
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Toulouse Weather Forecast, France</title>
<script src="mootools.v1.11.js" type="text/javascript"></script>
<script type="text/javascript">
function addLoadEvent(func)
{
var oldonload = window.onload;
if (typeof window.onload != 'function') window.onload = func;
else window.onload = function() {
oldonload();
func();
}
}
function updateSchedule(id){
alert(id);
getIconNumber();
}
function showTown(id){
//alert(id);
if(id=='undefined'){
id='FRXX0016';
}
//alert($('weather'));
$('weather').remove();
if(id=='FRXX0016'){//BX
var module = 'module';
var label = '<a href="http://www.weather.com/weather/local/'+id+'">Bordeaux Weather Forecast, France</a>';
var wx_config='SZ=300x250*WX=FH*LNK=SSNL*UNT=C*BGC=000000*MAP=eur|null*DN=saturnino-freelance.com*TIER=0*PID=1047139272*MD5=34bdb1a45b7738575ac1b08e828b9dc2';
}else if(id=='FRXX0099'){//toulouse
var module = 'module';
var wx_config='SZ=300x250*WX=FHW*LNK=SSNL*UNT=C*BGI=boat*MAP=null|null*DN=saturnino-freelance.com*TIER=0*PID=1047139272*MD5=1b16ff1a6104a33e2a9da32b58ec6c64';
var label = '<a href="http://www.weather.com/weather/local/'+id+'">Toulouse Weather Forecast, France</a>';
}
new Element('div').setProperty('id', 'weather').injectInside(document.body);
new Element('div').setProperty('id', module).injectInside($('weather'));
$(module).setHTML(label);
/*
/* Locations can be edited manually by updating 'wx_locID' below. Please also update */
/* the location name and link in the above div (wx_module) to reflect any changes made. */
var wx_locID = id;
/* If you are editing locations manually and are adding multiple modules to one page, each */
/* module must have a unique div id. Please append a unique # to the div above, as well */
/* as the one referenced just below. If you use the builder to create individual modules */
/* you will not need to edit these parameters. */
var wx_targetDiv = module;
/* Please do not change the configuration value [wx_config] manually - your module */
/* will no longer function if you do. If at any time you wish to modify this */
/* configuration please use the graphical configuration tool found at */
/* https://registration.weather.com/ursa/wow/step2 */
//var wx_config='SZ=300x250*WX=FHW*LNK=SSNL*UNT=C*BGI=boat*MAP=null|null*DN=saturnino-freelance.com*TIER=0*PID=1047139272*MD5=1b16ff1a6104a33e2a9da32b58ec6c64';
var wx_script_url = document.location.protocol+'//wow.weather.com/weather/wow/module/'+wx_locID+'?config='+wx_config+'&proto='+document.location.protocol+'&target='+wx_targetDiv;
var wx_script_balise = '<scr'+'ipt src="'+wx_script_url+'"></scr'+'ipt>';
new Asset.javascript(wx_script_url, {id: 'myScript', type:'text/javascript',onload: updateSchedule});
}
function getIconNumber(){
//$('wx_module_4089').setStyle('display', 'none');
var i = $$('img');
i.each(function(item, index){
var url = item.src;
if( url.test("wxicons")){
var tab = url.split('/');
var l = tab.length;
var gif = tab[l-1];
gif = gif.split('.');
gif = gif[0];
alert('icon n°'+gif);
}
}); //optional second arg for binding, not used here
}
function test(){
showTown('FRXX0099');
}
addLoadEvent(test);
//addLoadEvent(getIconNumber);
</script>
<link href="wx_wow_css.css" rel="stylesheet" type="text/css" id="wx_wow_css"/>
</head>
<body>
<div id="weather">
<div id="module"></div>
</div>
<select name="towns" onchange="showTown(this.options[this.selectedIndex].value);" id="townSelector">
<option value="FRXX0099">Toulouse</option>
<option value="FRXX0016">Bordeaux</option>
</select>
<div id="script_new"></div>
</body>
</html>
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
le lien pour tester:
http://www.saturnino-freelance.com/TESTS/meteo/
Apparemment, l'instruction new Asset.javascript(wx_script_url, {id: 'myScript', type:'text/javascript',onload: updateSchedule});
ne fonctionne pas très bien sous IE...
merci pour votre aide.
biensur je suis ouvert à toute autre solution en mode HTML+javascript.
cordialement,
saturnino