From bf98e4eae21ce2155234520ed0bc948d0091683e Mon Sep 17 00:00:00 2001 From: Vincent Vandemeulebrouck Date: Fri, 31 Mar 2023 01:31:09 +0200 Subject: [PATCH] Fix toggle horloge Affiche/masque correctement l'horloge pour le MJ et les joueurs --- module/time/rdd-calendrier.js | 45 +++++++++++++---------------------- styles/simple.css | 44 ++++++++++++++++++---------------- templates/time/calendar.hbs | 14 +++++------ 3 files changed, 46 insertions(+), 57 deletions(-) diff --git a/module/time/rdd-calendrier.js b/module/time/rdd-calendrier.js index 8b6d653b..b2a5e161 100644 --- a/module/time/rdd-calendrier.js +++ b/module/time/rdd-calendrier.js @@ -85,7 +85,7 @@ export class RdDCalendrier extends Application { display() { const pos = this.getSavePosition() - this.render(true, { left: pos.left, top: pos.top}); + this.render(true, { left: pos.left, top: pos.top }); return this; } @@ -115,7 +115,7 @@ export class RdDCalendrier extends Application { async onUpdateSetting(setting, update, options, id) { if (setting.key == SYSTEM_RDD + '.' + WORLD_TIMESTAMP_SETTING) { this.timestamp = RdDTimestamp.getWorldTime(); - this.updateDisplay(); + this.positionAiguilles() Hooks.callAll(APP_ASTROLOGIE_REFRESH); } } @@ -140,8 +140,6 @@ export class RdDCalendrier extends Application { async activateListeners(html) { super.activateListeners(html); this.html = html; - this.updateDisplay(); - this.html.find('.ajout-chronologie').click(ev => DialogChronologie.create()); this.html.find('.toggle-horloge-analogique').click(ev => this.onToggleHorlogeAnalogique()) this.html.find('.calendar-btn').click(ev => this.onCalendarButton(ev)); @@ -158,12 +156,19 @@ export class RdDCalendrier extends Application { ev.preventDefault(); this.showAstrologieEditor(); }); + this.positionAiguilles() + } + + positionAiguilles() { + const timestamp = this.getTimestamp(); + this.html.find(`div.horloge-roue div.horloge-aiguille-heure img`).css(Misc.cssRotation(timestamp.angleHeure)); + this.html.find(`div.horloge-roue div.horloge-aiguille-minute img`).css(Misc.cssRotation(timestamp.angleMinute)); } onToggleHorlogeAnalogique() { this.horlogeAnalogique = !this.horlogeAnalogique; this.savePosition() - this.render(true) + this.display() } /* -------------------------------------------- */ @@ -292,7 +297,7 @@ export class RdDCalendrier extends Application { } this.timestamp = newTimestamp; await this.rebuildNombresAstraux(); - this.updateDisplay(); + this.positionAiguilles() this.display(); } @@ -307,9 +312,9 @@ export class RdDCalendrier extends Application { else if (calendarSet) { this.positionnerHeure(Number(calendarSet.value)); } - this.updateDisplay(); + this.positionAiguilles() } - + /* -------------------------------------------- */ async incrementTime(minutes = 0) { if (game.user.isGM) { @@ -317,12 +322,12 @@ export class RdDCalendrier extends Application { Hooks.callAll(APP_ASTROLOGIE_REFRESH); } } - + /* -------------------------------------------- */ async incrementerJour() { await this.setNewTimestamp(this.timestamp.nouveauJour()); } - + /* -------------------------------------------- */ async positionnerHeure(heure) { if (game.user.isGM) { @@ -333,7 +338,7 @@ export class RdDCalendrier extends Application { Hooks.callAll(APP_ASTROLOGIE_REFRESH); } } - + /* -------------------------------------------- */ getLectureAstrologieDifficulte(dateIndex) { let indexNow = this.timestamp.indexDate; @@ -407,24 +412,6 @@ export class RdDCalendrier extends Application { return 0; } - /* -------------------------------------------- */ - updateDisplay() { - const calendrier = this.fillCalendrierData(); - for (const heure of document.getElementsByClassName("calendar-heure-texte")) { - heure.innerHTML = calendrier.heure.label; - } - for (const minute of document.getElementsByClassName("calendar-minute-texte")) { - minute.innerHTML = `${calendrier.minute} minutes`; - } - this.postionnerAiguilles() - } - - postionnerAiguilles() { - const timestamp = this.getTimestamp(); - this.html.find(`div.horloge-roue div.horloge-aiguille-heure img`).css(Misc.cssRotation(timestamp.angleHeure)); - this.html.find(`div.horloge-roue div.horloge-aiguille-minute img`).css(Misc.cssRotation(timestamp.angleMinute)); - } - /* -------------------------------------------- */ async saveEditeur(calendrierData) { const newTimestamp = RdDTimestamp.timestamp( diff --git a/styles/simple.css b/styles/simple.css index fa65600d..3beaed42 100644 --- a/styles/simple.css +++ b/styles/simple.css @@ -1631,6 +1631,7 @@ table.table-nombres-astraux tr:hover { font-family: "GoudyAcc"; pointer-events: none; } + .window-app.calendar .window-content > div { pointer-events: all; } @@ -1644,12 +1645,12 @@ table.table-nombres-astraux tr:hover { } .window-app.calendar div.horloge-roue div.horloge-heure { - width: 1rem; - height: 1rem; + width: 1.4rem; + height: 1.4rem; } .window-app.calendar div.horloge-roue div.horloge-heure img.horloge-heure-img { - width: 1.6rem; - height: 1.6rem; + width: 1.4rem; + height: 1.4rem; } div.horloge-roue div { @@ -1692,23 +1693,24 @@ div.horloge-roue div.horloge-ajustement { vertical-align: middle; border-radius: 0.3rem; } + div.horloge-roue div img { border: none; } -.window-app.calendar div.horloge-heure.heure-01 { top: calc(50% - 0.8rem + sin(-180deg) *41%); left: calc(50% - 0.5rem + cos(-180deg) *41%); } -.window-app.calendar div.horloge-heure.heure-02 { top: calc(50% - 0.8rem + sin(-150deg) *41%); left: calc(50% - 0.5rem + cos(-150deg) *41%); } -.window-app.calendar div.horloge-heure.heure-03 { top: calc(50% - 0.8rem + sin(-120deg) *41%); left: calc(50% - 0.5rem + cos(-120deg) *41%); } -.window-app.calendar div.horloge-heure.heure-04 { top: calc(50% - 0.8rem + sin(-90deg) *41%); left: calc(50% - 0.5rem + cos(-90deg) *41%); } -.window-app.calendar div.horloge-heure.heure-05 { top: calc(50% - 0.8rem + sin(-60deg) *41%); left: calc(50% - 0.5rem + cos(-60deg) *41%); } -.window-app.calendar div.horloge-heure.heure-06 { top: calc(50% - 0.8rem + sin(-30deg) *41%); left: calc(50% - 0.5rem + cos(-30deg) *41%); } -.window-app.calendar div.horloge-heure.heure-07 { top: calc(50% - 0.8rem + sin(-0deg) *41%); left: calc(50% - 0.5rem + cos(-0deg) *41%); } -.window-app.calendar div.horloge-heure.heure-08 { top: calc(50% - 0.8rem + sin(30deg) *41%); left: calc(50% - 0.5rem + cos(30deg) *41%); } -.window-app.calendar div.horloge-heure.heure-09 { top: calc(50% - 0.8rem + sin(60deg) *41%); left: calc(50% - 0.5rem + cos(60deg) *41%); } -.window-app.calendar div.horloge-heure.heure-10 { top: calc(50% - 0.8rem + sin(90deg) *41%); left: calc(50% - 0.5rem + cos(90deg) *41%); } -.window-app.calendar div.horloge-heure.heure-11 { top: calc(50% - 0.8rem + sin(120deg) *41%); left: calc(50% - 0.5rem + cos(120deg) *41%); } -.window-app.calendar div.horloge-heure.heure-12 { top: calc(50% - 0.8rem + sin(150deg) *41%); left: calc(50% - 0.5rem + cos(150deg) *41%); } +.window-app.calendar div.horloge-heure.heure-01 { top: calc(50% - 0.7rem + sin(-180deg) *38%); left: calc(50% - 0.7rem + cos(-180deg) *38%); } +.window-app.calendar div.horloge-heure.heure-02 { top: calc(50% - 0.7rem + sin(-150deg) *38%); left: calc(50% - 0.7rem + cos(-150deg) *38%); } +.window-app.calendar div.horloge-heure.heure-03 { top: calc(50% - 0.7rem + sin(-120deg) *38%); left: calc(50% - 0.7rem + cos(-120deg) *38%); } +.window-app.calendar div.horloge-heure.heure-04 { top: calc(50% - 0.7rem + sin(-90deg) *38%); left: calc(50% - 0.7rem + cos(-90deg) *38%); } +.window-app.calendar div.horloge-heure.heure-05 { top: calc(50% - 0.7rem + sin(-60deg) *38%); left: calc(50% - 0.7rem + cos(-60deg) *38%); } +.window-app.calendar div.horloge-heure.heure-06 { top: calc(50% - 0.7rem + sin(-30deg) *38%); left: calc(50% - 0.7rem + cos(-30deg) *38%); } +.window-app.calendar div.horloge-heure.heure-07 { top: calc(50% - 0.7rem + sin(-0deg) *38%); left: calc(50% - 0.7rem + cos(-0deg) *38%); } +.window-app.calendar div.horloge-heure.heure-08 { top: calc(50% - 0.7rem + sin(30deg) *38%); left: calc(50% - 0.7rem + cos(30deg) *38%); } +.window-app.calendar div.horloge-heure.heure-09 { top: calc(50% - 0.7rem + sin(60deg) *38%); left: calc(50% - 0.7rem + cos(60deg) *38%); } +.window-app.calendar div.horloge-heure.heure-10 { top: calc(50% - 0.7rem + sin(90deg) *38%); left: calc(50% - 0.7rem + cos(90deg) *38%); } +.window-app.calendar div.horloge-heure.heure-11 { top: calc(50% - 0.7rem + sin(120deg) *38%); left: calc(50% - 0.7rem + cos(120deg) *38%); } +.window-app.calendar div.horloge-heure.heure-12 { top: calc(50% - 0.7rem + sin(150deg) *38%); left: calc(50% - 0.7rem + cos(150deg) *41%); } .window-app.calendar-astrologie div.horloge-heure.heure-01 { top: calc(50% - 1rem + sin(-180deg) *41%); left: calc(50% - 1rem + cos(-180deg) *41%); } .window-app.calendar-astrologie div.horloge-heure.heure-02 { top: calc(50% - 1rem + sin(-150deg) *41%); left: calc(50% - 1rem + cos(-150deg) *41%); } @@ -1786,6 +1788,9 @@ div.horloge-analogique { vertical-align: middle; pointer-events: none; } +div.horloge-analogique.horloge-analogique-hidden { + visibility: hidden; +} div.horloge-digitale { color: #CCC; background: hsla(0, 0%, 20%, 1); @@ -1793,10 +1798,9 @@ div.horloge-digitale { width: 100%; } -div.horloge-digitale .calendar-heure-texte { - font-size: 1.1rem; -} -div.horloge-digitale .calendar-minute-texte { +div.horloge-digitale :is(.calendar-heure-texte,.calendar-minute-texte) { + font-size: 1rem; + pointer-events: all; margin: 0; } diff --git a/templates/time/calendar.hbs b/templates/time/calendar.hbs index b587e924..36c07dc8 100644 --- a/templates/time/calendar.hbs +++ b/templates/time/calendar.hbs @@ -1,4 +1,4 @@ -
+
{{#if isGM}}
+1 @@ -8,7 +8,7 @@ +60 +1h - Avancer à Lyre + Avancer à Lyre Avancer au Vaisseau @@ -31,12 +31,10 @@ {{#if isGM}} - {{minute}} minutes

+ {{minute}} minutes {{/if}}
-
-
-{{#if horlogeAnalogique}} - {{> 'systems/foundryvtt-reve-de-dragon/templates/time/horloge.hbs' }} -{{/if}} +
+ {{> 'systems/foundryvtt-reve-de-dragon/templates/time/horloge.hbs' }} +
\ No newline at end of file