Ajout d'une horloge analogique

Amélioration de la fenêtre calendrier:
* plus compacte
* horloge analogique
* normalement compatible pop-out
* minimisable (juste la barre de titre)
This commit is contained in:
2023-03-29 22:53:40 +02:00
parent 23af30a538
commit c1d02d9fda
23 changed files with 429 additions and 539 deletions

View File

@ -1,47 +0,0 @@
<div id="calendar-time-container">
<div class="calendar">
<div class="calendar-title" title="Deplacer">{{jourDuMois}} {{mois.label}} ({{mois.saison}})</div>
<div class="calendar-options">
{{#if isGM}}
<i class="calendar-set-datetime fa-solid fa-calendar-pen" title="Editer"></i>
<i class="calendar-astrologie fa-solid fa-moon-over-sun" title="Astrologie"></i>
{{/if}}
</div>
<div class="calendar-avance-heure">
<div class="calendar-avance-heure-grid">
{{#if isGM}}
<i class="calendar-btn calendar-1min" data-calendar-avance="1" title="Avancer de 1 minute">+1</i>
<i class="calendar-btn calendar-5min" data-calendar-avance="5" title="Avancer de 5 minutes">+5</i>
<i class="calendar-btn calendar-15min" data-calendar-avance="15" title="Avancer de 15 minutes">+15</i>
<i class="calendar-btn calendar-30min" data-calendar-avance="30" title="Avancer de 30 minutes">+30</i>
<i class="calendar-btn calendar-60min" data-calendar-avance="60" title="Avancer de 60 minutes" >+60</i>
<i class="calendar-btn calendar-1heure" data-calendar-avance="120" title="Avancer d'1 heure" >+1h</i>
{{else}}
{{/if}}
</div>
</div>
<div class="calendar-affiche-heure">
<div class="calendar-horloge">
<a class="ajout-chronologie">
<img class="calendar-heure-img" src="{{heure.icon}}" alt="{{nomHeure}}"/>
<span class="calendar-heure-texte">{{heure.label}}</span>
</a>
{{#if isGM}}
<p class="calendar-minute-texte">{{minute}} minutes</p>
{{/if}}
</div>
</div>
<div class="calendar-change-heure">
<div class="calendar-change-heure-grid">
{{#if isGM}}
<i class="calendar-btn calendar-lyre fas fa-forward" data-calendar-set="6" title="Avancer à Lyre">
<img src="systems/foundryvtt-reve-de-dragon/icons/heures/hd07.svg" alt="Avancer à Lyre"/>
</i>
<i class="calendar-btn calendar-vaisseau fas fa-forward" data-calendar-set="0" title="Avancer au Vaisseau">
<img src="systems/foundryvtt-reve-de-dragon/icons/heures/hd01.svg" alt="Avancer au Vaisseau"/>
</i>
{{/if}}
</div>
</div>
</div>
</div>

View File

@ -19,21 +19,5 @@
</div>
<hr>
<div><label>Heures de chance et malchance</label></div>
<div class="astro-roue">
<div class="astro-cercle1"></div>
{{#each heures as |heure|}}
<div class="astro-ajustement heure-{{heure.hh}}"></div>
<div class="astro-heure heure-{{heure.hh}}"><img class="astro-heure-img" src="{{heure.webp}}" title="{{heure.label}}"></div>
{{/each}}
<div class="astro-cercle2"></div>
<div class="astro-disque">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/astro-disque.svg" alt="">
</div>
<div class="astro-horloge-heure">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/rdd-aiguille-horloge.svg" alt="">
</div>
<div class="astro-horloge-minute">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/rdd-aiguille-minute.svg" alt="">
</div>
</div>
{{> 'systems/foundryvtt-reve-de-dragon/templates/time/horloge.hbs'}}
</div>

View File

@ -0,0 +1,42 @@
<div>
{{#if isGM}}
<div class="calendar-boutons-heure">
<i class="calendar-btn calendar-1min" data-calendar-avance="1" title="Avancer de 1 minute">+1</i>
<i class="calendar-btn calendar-5min" data-calendar-avance="5" title="Avancer de 5 minutes">+5</i>
<i class="calendar-btn calendar-15min" data-calendar-avance="15" title="Avancer de 15 minutes">+15</i>
<i class="calendar-btn calendar-30min" data-calendar-avance="30" title="Avancer de 30 minutes">+30</i>
<i class="calendar-btn calendar-60min" data-calendar-avance="60" title="Avancer de 60 minutes" >+60</i>
<i class="calendar-btn calendar-1heure" data-calendar-avance="120" title="Avancer d'1 heure" >+1h</i>
<i class="calendar-btn calendar-lyre fas fa-forward" data-calendar-set="6" title="Avancer à Lyre">
<img src="systems/foundryvtt-reve-de-dragon/icons/heures/hd07.svg" alt="Avancer à Lyre"/>
</i>
<i class="calendar-btn calendar-vaisseau fas fa-forward" data-calendar-set="0" title="Avancer au Vaisseau">
<img src="systems/foundryvtt-reve-de-dragon/icons/heures/hd01.svg" alt="Avancer au Vaisseau"/>
</i>
</div>
{{/if}}
<div class="horloge-digitale">
<span>
<a class="toggle-horloge-analogique">
{{#if horlogeAnalogique}}
<i class="fa-solid fa-chevrons-up"></i>
{{else}}
<i class="fa-solid fa-chevrons-down"></i>
{{/if}}
</a>
</span>
<span class="calendar-heure-texte">
<a class="ajout-chronologie">
{{heure.label}}
</a>
</span>
{{#if isGM}}
<span class="calendar-minute-texte">{{minute}} minutes</p>
{{/if}}
</div>
</div>
<div class="horloge-analogique">
{{#if horlogeAnalogique}}
{{> 'systems/foundryvtt-reve-de-dragon/templates/time/horloge.hbs' }}
{{/if}}
</div>

View File

@ -0,0 +1,22 @@
<div class="horloge-roue">
<div class="horloge-cercle"></div>
<div class="horloge-cercle1"></div>
{{#if theme}}
{{#each heures as |heure|}}
<div class="horloge-ajustement heure-{{heure.hh}}"></div>
{{/each}}
<div class="disque-astro">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/astro-disque.svg" alt="">
</div>
{{/if}}
{{#each heures as |heure|}}
<div class="horloge-heure heure-{{heure.hh}}" data-heure="{{heure.heure}}"><img class="horloge-heure-img" src="{{heure.webp}}" title="{{heure.label}}"></div>
{{/each}}
<div class="horloge-cercle2"></div>
<div class="horloge-aiguille-heure">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/rdd-aiguille-horloge.svg" alt="">
</div>
<div class="horloge-aiguille-minute">
<img src="systems/foundryvtt-reve-de-dragon/styles/img/ui/rdd-aiguille-minute.svg" alt="">
</div>
</div>