Page 1 sur 2

Monitor - page météo - phases lunaire

Publié : 27 mars 2017, 16:17
par Doudy
Bonjour,

J'ai réinstallé mon Pi avec la dernière version de Domoticz/Monitor
Dans la version précédente, j'avais l'affichage suivant :
Image
Depuis la nouvelle version, je n'arrive plus à afficher la phase lunaire
J'ai procédé comme suit :
- j'ai ajouté le script suivant à la fin de meteo.html

Code : Tout sélectionner

<script type="text/javascript" language="javascript">
//============= phases lunaire ========================
//source https://forums.coronalabs.com/topic/54547-source-for-moon-cycles-phases/
   function julianDate(d, m, y) {
 
       var yy = y - Math.floor((12 - m) / 10);
        var mm = m + 9;
        if (mm >= 12) {
            mm = mm - 12
        }
       var k1 = Math.floor(365.25 * (yy + 4712));
       var k2 = Math.floor(30.6001 * mm + 0.5);
       var k3 = Math.floor(Math.floor((yy / 100) + 49) * 0.75) - 38;
       var j = k1 + k2 + d + 59;
        if (j > 2299160) {
            j = j - k3 
// console.log( " Julian Date : " + j )         
        }
        return j
   }


   function  moonAge(d, m, y){
        
        var j = julianDate(d, m, y);
        var ip = (j + 4.867) / 29.53059;
         ip = ip - Math.floor(ip);
        if (ip < 0.5) {
            var ag = ip * 29.53059 + 29.53059 / 2;
        } else {
           var ag = ip * 29.53059 - 29.53059 / 2;
        }
        console.log( " moonAge : " + ag  )  // +1
        //return Math.round(ag) +1
   

   return ag //+1
   
   }    


console.log( "  Day : " + day )
var theMoon = moonAge(day, mois, annee)
/*if  ( 1 < theMoon && theMoon >=  29)  { 
theMoon = 0
} else {
theMoon = theMoon -1
}*/
console.log( "Phase Lunaire : " + theMoon )
if  (theMoon >=  29)  { 
    moonText = "Nouvelle Lune";
      moonPNG = "moon0.png";
   } else if (theMoon < 29 && theMoon > 23) { 
    moonText = "Dernier croissant";
   moonPNG = "moon7.png";
   

   } else if (theMoon < 23 && theMoon > 22) { 
    moonText = "Dernier quartier";
   moonPNG = "moon6.png";   
   } else if (theMoon < 22 && theMoon > 15) { 
    moonText = "Gibbeuse décroissante";
   moonPNG = "moon5.png";   
   } else if (theMoon < 15 && theMoon > 13) { 
    moonText = "Pleine lune";
   moonPNG = "moon4.png";
   } else if (theMoon < 13 && theMoon > 8) { 
    moonText = "Gibbeuse croissante";
   moonPNG = "moon3.png";
   } else if (theMoon < 8 && theMoon > 6) { 
    moonText = "Premier Quartier";
   moonPNG = "moon2.png";
   

   } else if (theMoon < 6 && theMoon > 1) { 
    moonText = "Premier croissant";
   moonPNG = "moon1.png";
   } else {                     
    moonText = "Nouvelle Lune";
   moonPNG = "moon0.png";
   

   /*if  theMoon >=  29  then 
    moonText.text = "New Moon"
    elseif theMoon < 29 and theMoon > 23 then 
    moonText.text = "Waning Crescent"
    elseif theMoon < 23 and theMoon > 22 then 
    moonText.text = "Last Quarter"
    elseif theMoon < 22 and theMoon > 15 then 
    moonText.text = "Waning gibbous"
    elseif theMoon < 15 and theMoon > 13 then 
    moonText.text = "Full Moon"
    elseif theMoon < 13 and theMoon > 8 then 
    moonText.text = "Waxing gibbous"
    elseif theMoon < 8 and theMoon > 6 then 
    moonText.text = "First Moon"
    elseif theMoon < 6 and theMoon > 1 then 
    moonText.text = "Waxing crescent"
    else                     
    moonText.text = "New Moon"
end */
}

$( "#moontxt").append(  moonText  );
$( "#moon").append("<img src=\"./icons/meteo/" + moonPNG + "\" alt=\"\" />");

</script>
-dans météo.css j'ai ajouté #moon à #meteo3, #meteo25

Code : Tout sélectionner

#meteo3, #meteo25, #moon
- dans météo.css j'ai également ajouté

Code : Tout sélectionner

#moontxt
{
	font-family: arimo;
	font-weight: normal;
	color: #F2DDB3;
	font-size: 14px;
	margin-top: -20px;
	height: 25px;
	line-height: 15px;
	text-shadow: 1px 1px 4px black;
}
- dans météo.html j'ai modifié la ligne suivante :

Code : Tout sélectionner

<!--<div id="ls_meteo25"></div><div id="meteo25">--</div><div id="desc_meteo25">meteo25</div> -->
	  <div id="ls_meteo25"></div><div id="moon"></div><div id="moontxt"></div>

Mais rien ne s'affiche...
Un petit coup de pouce ?
Merci.
;)

Re: Monitor - page météo - phases lunaire

Publié : 27 mars 2017, 23:04
par papoo
tu as bien mis les images au bon endroit?
pour le code ça me semble bon
je te remets le mien au cas ou (meteo.html) avec les liens vers les images dans monitor\icons\meteo\moon

Code : Tout sélectionner

//============= phases lunaire ========================
//source https://forums.coronalabs.com/topic/54547-source-for-moon-cycles-phases/
	function julianDate(d, m, y) {
 
       var yy = y - Math.floor((12 - m) / 10);
        var mm = m + 9;
        if (mm >= 12) {
            mm = mm - 12
        }
       var k1 = Math.floor(365.25 * (yy + 4712));
       var k2 = Math.floor(30.6001 * mm + 0.5);
       var k3 = Math.floor(Math.floor((yy / 100) + 49) * 0.75) - 38;
       var j = k1 + k2 + d + 59;
        if (j > 2299160) {
            j = j - k3 
//console.log( " Julian Date : " + j )			
        }
        return j
	}

	function  moonAge(d, m, y){
        
        var j = julianDate(d, m, y);
        var ip = (j + 4.867) / 29.53059;
         ip = ip - Math.floor(ip);
        if (ip < 0.5) {
            var ag = ip * 29.53059 + 29.53059 / 2;
        } else {
           var ag = ip * 29.53059 - 29.53059 / 2;
        }
     	console.log( " moonAge : " + ag  )  // +1
        //return Math.round(ag) +1
	
	return ag //+1
	
	}    
console.log( "  Day : " + day )
var theMoon = moonAge(day, mois, annee)
/*if  ( 1 < theMoon && theMoon >=  29)  { 
theMoon = 0
} else {
theMoon = theMoon -1
}*/
console.log( "Phase Lunaire : " + theMoon )
if  (theMoon >=  29)  { 
    moonText = "Nouvelle Lune";
		moonPNG = "moon/moon0.png";
   } else if (theMoon < 29 && theMoon > 23) { 
    moonText = "Dernier croissant";
	moonPNG = "moon/moon7.png";
	
   } else if (theMoon < 23 && theMoon > 22) { 
    moonText = "Dernier quartier";
	moonPNG = "moon/moon6.png";	
   } else if (theMoon < 22 && theMoon > 15) { 
    moonText = "Gibbeuse décroissante";
	moonPNG = "moon/moon5.png";	
   } else if (theMoon < 15 && theMoon > 13) { 
    moonText = "Pleine lune";
	moonPNG = "moon/moon4.png";
   } else if (theMoon < 13 && theMoon > 8) { 
    moonText = "Gibbeuse croissante";
	moonPNG = "moon/moon3.png";
   } else if (theMoon < 8 && theMoon > 6) { 
    moonText = "Premier Quartier";
	moonPNG = "moon/moon2.png";
	
   } else if (theMoon < 6 && theMoon > 1) { 
    moonText = "Premier croissant";
	moonPNG = "moon/moon1.png";
   } else {                     
    moonText = "Nouvelle Lune";
	moonPNG = "moon/moon0.png";
	
	
}

$( "#moontxt").append(  moonText  );
$( "#moon").append("<img src=\"./icons/meteo/" + moonPNG + "\" alt=\"\" />");

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 09:48
par Doudy
Bonjour,

Les images sont dans :

Code : Tout sélectionner

Y:\home\pi\domoticz\www\monitor\icons\meteo\moon
et les fichiers suivants :
  • moon0.png
    moon1.png
    ...
    moon7.png

Est-ce qu'il faut modifier quelque chose au niveau de frontpage_settings.js ?

Code : Tout sélectionner

['0' ,' ',       	    'meteo25',                	     	'','','','',''],
J'ai également recopié ton code.
Par contre pas d'affichage !
Une autre idée ?
;)

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 11:14
par Nemesis24
Bonjour,

Code : Tout sélectionner

['0' ,' ',              'meteo25',                           '','','','',''],
je penses que su tu n'a rien entre le '0' +++++++ et le 'meteo25', tu n'aura rien à l'écran.

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 11:39
par Doudy
Nemesis24 a écrit :je penses que su tu n'a rien entre le '0' +++++++ et le 'meteo25', tu n'aura rien à l'écran.
C'est simplement de la tabulation
Je ne comprends pas bien ta remarque. Désolé. :oops:

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 14:15
par Nemesis24

Code : Tout sélectionner

['0' ,' ',
devrait être

Code : Tout sélectionner

['0' ,'Html',
et au vu du script la ligne devrait être genre

Code : Tout sélectionner

['0' ,'Html',              'meteo25',                           '<span id="moon"></span></br><span id="moontext"></span>','','','',''],
ou alors dans le script tout à la fin, il faut changer le (.selector) #moon et #moontext en #meteo24 et #meteo25 par exemple

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 15:26
par vil1driver
day mois et annee ne sont pas définis !
ceci génère donc une erreur et plante toute la suite (visible par une simple pression sur F12...)

Code : Tout sélectionner

var theMoon = moonAge(day, mois, annee)
il faut ajouter ceci au début du script

Code : Tout sélectionner

maintenant = new Date();
day = maintenant.getDate();
mois = maintenant.getMonth()+1;
annee = maintenant.getFullYear();
+1 pour némésis, pas besoin d'ajouter des div, autant utiliser l'existant
pas de modif css
pas de modif html autre que l'ajout du script à la toute fin
rien à mettre du tout dans settings

voici le script à ajouter à la toute fin du fichier meteo25.html

Code : Tout sélectionner

<script>
//============= phases lunaire ========================
//source https://forums.coronalabs.com/topic/54547-source-for-moon-cycles-phases/
maintenant = new Date();
//console.log( " maintenant : " + maintenant )
day = maintenant.getDate();
//console.log( " jour : " + jour )
mois = maintenant.getMonth()+1;
//console.log( " mois : " + mois ) 
annee = maintenant.getFullYear();
//console.log( " annee : " + annee )

   function julianDate(d, m, y) {
 
       var yy = y - Math.floor((12 - m) / 10);
        var mm = m + 9;
        if (mm >= 12) {
            mm = mm - 12
        }
       var k1 = Math.floor(365.25 * (yy + 4712));
       var k2 = Math.floor(30.6001 * mm + 0.5);
       var k3 = Math.floor(Math.floor((yy / 100) + 49) * 0.75) - 38;
       var j = k1 + k2 + d + 59;
        if (j > 2299160) {
            j = j - k3 
//console.log( " Julian Date : " + j )         
        }
        return j
   }

   function  moonAge(d, m, y){
        
        var j = julianDate(d, m, y);
        var ip = (j + 4.867) / 29.53059;
         ip = ip - Math.floor(ip);
        if (ip < 0.5) {
            var ag = ip * 29.53059 + 29.53059 / 2;
        } else {
           var ag = ip * 29.53059 - 29.53059 / 2;
        }
        console.log( " moonAge : " + ag  )  // +1
        //return Math.round(ag) +1
   
   return ag //+1
   
   }    
console.log( "  Day : " + day )
var theMoon = moonAge(day, mois, annee)
/*if  ( 1 < theMoon && theMoon >=  29)  { 
theMoon = 0
} else {
theMoon = theMoon -1
}*/
console.log( "Phase Lunaire : " + theMoon )
if  (theMoon >=  29)  { 
    moonText = "Nouvelle Lune";
      moonPNG = "moon0.png";
   } else if (theMoon < 29 && theMoon > 23) { 
    moonText = "Dernier croissant";
   moonPNG = "moon7.png";
   
   } else if (theMoon < 23 && theMoon > 22) { 
    moonText = "Dernier quartier";
   moonPNG = "moon6.png";   
   } else if (theMoon < 22 && theMoon > 15) { 
    moonText = "Gibbeuse décroissante";
   moonPNG = "moon5.png";   
   } else if (theMoon < 15 && theMoon > 13) { 
    moonText = "Pleine lune";
   moonPNG = "moon4.png";
   } else if (theMoon < 13 && theMoon > 8) { 
    moonText = "Gibbeuse croissante";
   moonPNG = "moon3.png";
   } else if (theMoon < 8 && theMoon > 6) { 
    moonText = "Premier Quartier";
   moonPNG = "moon2.png";
   
   } else if (theMoon < 6 && theMoon > 1) { 
    moonText = "Premier croissant";
   moonPNG = "moon1.png";
   } else {                     
    moonText = "Nouvelle Lune";
   moonPNG = "moon0.png";
   
   
}

$('#desc_meteo25').html(moonText);
$('#meteo25').html('<img src="./icons/meteo/moon/'+moonPNG+'" width=130 height=130>');
</script>
je peux aussi directement ajouter la fonction au code de base de monitor et permetre ainsi de directement choisir où l'on va vouloir voir la phase lunaire...avec un simple ajout au setting
par exemple

Code : Tout sélectionner

['','Moon','meteo25',''],
ou

Code : Tout sélectionner

['','Moon','cell25',''],
ça vous dirait ? :D

le mieux serait encore de modifier les icons météo de la nuit pour avoir autant de variantes que de phases lunaires..
ainsi on aurait le temps et la phase dans un seul icon :D
avis aux photoshopeurs :idea: .. juste 80 icons en tout :mrgreen:

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 18:44
par papoo
J'avais pas mis tout mon script pour rester concis étant donné qu'il avait déjà été installé
@vil1driv3r : C'est toujours mieux quand c'est intégré au script ça évite les modifs à chaque mise à jour
Après d'avoir que la lune c'est pas mal aussi ça permet de ne le mettre que si on le souhaite sans toucher au reste
Et connaître l'état de la lune la journée cest bien pour les jardiniers ( ce qui n'est pas mon cas)

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 19:59
par Jeff
je peux aussi directement ajouter la fonction au code de base de monitor et permetre ainsi de directement choisir où l'on va vouloir voir la phase lunaire...avec un simple ajout au setting
par exemple
CODE : TOUT SÉLECTIONNER
['','Moon','meteo25',''],
Oui oui une fonction de base @Vil1driver :D

Re: Monitor - page météo - phases lunaire

Publié : 28 mars 2017, 20:53
par Nemesis24
C'est integré dans mon code :ugeek:

lever de lune
coucher de lune
phase de la lune