Ajout Aiguille Horloge

module/rdd-calendrier.js

@@ -49,6 +49,7 @@ export class RdDCalendrier extends Application {
     if (setting.key == SYSTEM_RDD + '.' + WORLD_TIMESTAMP_SETTING) {
       this.timestamp = RdDTimestamp.getWorldTime();
       this.updateDisplay();
+      Hooks.callAll(APP_ASTROLOGIE_REFRESH);
     }
   }
 
@@ -286,6 +287,7 @@ export class RdDCalendrier extends Application {
       this.positionnerHeure(Number(calendarSet.value));
     }
     this.updateDisplay();
+    Hooks.callAll(APP_ASTROLOGIE_REFRESH);
   }
 
   /* -------------------------------------------- */

module/rdd-timestamp.js

@@ -252,6 +252,7 @@ export class RdDTimestamp {
   get heure() { return Math.floor(this.indexMinute / RDD_MINUTES_PAR_HEURES) }
   get minute() { return this.indexMinute % RDD_MINUTES_PAR_HEURES }
   get round() { return ROUNDS_PAR_MINUTE * (this.indexMinute - Math.floor(this.indexMinute)) }
+  get pourcentageDuJour() { return this.indexMinute / RDD_MINUTES_PAR_JOUR }
 
   formatDate() {
     const jour = this.jour + 1;

module/sommeil/app-astrologie.js

@@ -161,16 +161,24 @@ export class AppAstrologie extends Application {
     this.html.find(`select[name="signe-astral"]`).val(this.appData.theme.signeAstral.key)
     this.html.find(`select[name="signe-naissance"]`).val(this.appData.theme.signeNaissance.key)
 
-    const angle = ((chiffreAstral + heureNaissance) * 30) % 360;
+    const angleAstrologie = ((chiffreAstral + heureNaissance) * 30) % 360;
-    const rotation = `rotate(${angle}deg)`;
+    this.html.find(`div.astro-roue div.astro-disque img`).css(this.cssRotation(angleAstrologie));
-    this.html.find(`div.astro-roue div.astro-disque img`).css({
+
+    const timestamp = game.system.rdd.calendrier.getTimestamp();
+    const angleHeure = timestamp.pourcentageDuJour * 360 
+    this.html.find(`div.astro-roue div.astro-horloge img`).css(this.cssRotation(angleHeure));
+  }
+
+  cssRotation(angleAstrologie) {
+    const rotation = `rotate(${angleAstrologie}deg)`;
+    const cssRotation = {
       'transform': rotation,
       '-ms-transform': rotation,
       '-moz-transform': rotation,
       '-webkit-transform': rotation,
       '-o-transform': rotation
-    });
+    };
-
+    return cssRotation;
   }
 
   requestJetAstrologie() {
@@ -199,6 +207,7 @@ export class AppAstrologie extends Application {
   refreshAstrologie() {
     this.render(true)
   }
+
   async close(options) {
     Hooks.off(APP_ASTROLOGIE_REFRESH, this.hookReference);
     this.hookReference = undefined

styles/simple.css

@@ -907,7 +907,15 @@ div.astro-roue div.astro-disque {
   width: calc(100% - 5rem);
   height: calc(100% - 5rem);
 }
-div.astro-roue div.astro-disque img { border: none; }
+div.astro-roue div.astro-horloge {
+  position: absolute;
+  border: none;
+  top: calc(50% - 3.5rem);
+  left: calc(50% - 3.5rem);
+  width: calc(100% - 6rem);
+  height: calc(100% - 6rem);
+}
+div.astro-roue div:is(.astro-disque,.astro-horloge) img { border: none; }
 div.astro-roue div.astro-heure img.astro-heure-img {
   width: 2rem;
   height: 2rem;

templates/sommeil/astrologie-theme.hbs

@@ -28,5 +28,8 @@
     <div class="astro-heure heure-{{heure.hh}}"><img class="astro-heure-img" src="{{heure.webp}}" title="{{heure.label}}"></div>
     <div class="astro-ajustement ajustement-{{heure.hh}}"></div>
     {{/each}}
+    <div class="astro-horloge">
+      <img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/rdd-aiguille-horloge.svg" alt="">
+    </div>
   </div>
 </div>