public/foundryvtt-reve-de-dragon
1
1
Fork 1
Code Issues 4 Pull Requests Actions Projects Releases 163 Wiki Activity

#17 Gestion heure et calendrier

Browse Source
This commit is contained in:
sladecraven 2020-12-08 21:41:00 +01:00
parent b20a6d729a
commit a263350b56
6 changed files with 177 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
fonts/heures.ttf → fonts/heures_draconiques.ttf
View File

139
styles/simple.css
View File

@ -19,6 +19,10 @@
font-family: "CaslonAntique"; font-family: "CaslonAntique";
src: url('../fonts/CaslonAntique.ttf') format("truetype"); src: url('../fonts/CaslonAntique.ttf') format("truetype");
} }
@font-face {
font-family: "heures Draconiques";
src: url('../fonts/heures_draconiques.ttf') format("truetype");
}
:root { :root {
/* =================== 1. ACTOR SHEET FONT STYLES =========== */ /* =================== 1. ACTOR SHEET FONT STYLES =========== */
@ -878,23 +882,42 @@ ul, li {
grid-row: 1; grid-row: 1;
grid-column: 1; grid-column: 1;
width: fit-content; width: fit-content;
height: 75px; height: 84px;
margin: 0; margin: 0;
padding: 0; padding: 0;
border: 1px solid #000; border: 1px solid #000;
border-radius: 3%; border-radius: 3%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
font-family: "GoudyAcc";
} }
#calendar-hdr{ #calendar-hdr{
display: grid; display: grid;
font-size: 1rem; font-size: 1rem;
margin: 3px; margin: 3px;
padding: 4px; padding: 4px;
text-align: center;
height: 25px; height: 25px;
width: fit-content; width: fit-content;
min-width: 200px; min-width: 200px;
border-bottom: 1px solid #111; border-bottom: 1px solid #111;
color: #CCC;
float: left;
}
.calendar-date-rdd {
font-family: "GoudyAcc";
color: #CCC;
font-weight: bold;
font-size: 1.10rem;
opacity: 90;
}
#calendar--move-handle {
font-family: "GoudyAcc";
font-size: 13px;
line-height: 1;
text-align: center;
padding: 0;
margin: 0;
border: none;
flex: 1;
} }
#calendar-date{ #calendar-date{
grid-row: 1; grid-row: 1;
@ -924,41 +947,18 @@ ul, li {
opacity: 0; opacity: 0;
cursor: pointer; cursor: pointer;
} }
#calendar-icone-heure {
font-family: "heures Draconiques";
opacity: 90;
font-size: 1.25rem;
color: #CCC;
}
#calendar-hdr:hover #calendar-date { #calendar-hdr:hover #calendar-date {
opacity: 0; opacity: 0;
} }
#calendar-hdr:hover #calendar-date-num{ #calendar-hdr:hover #calendar-date-num{
opacity: 1; opacity: 1;
} }
#calendar-events{
grid-row: 1;
grid-column: 1;
float: left;
margin-right: 5px;
width: 10%;
text-align: center;
}
#calendar-events:hover {
color: #FFF;
border: 0px solid #000;
cursor: pointer;
}
#calendar-weather{
grid-row: 1;
grid-column: 3;
float: inline-end;
margin-left: 5px;
width: 10%;
text-align: center;
}
#calendar-weather:hover {
color: #FFF;
border: 0px solid #000;
cursor: pointer;
}
.calendar-container{ .calendar-container{
padding-top: 3px; padding-top: 3px;
padding-bottom: 20px; padding-bottom: 20px;
@ -969,6 +969,7 @@ ul, li {
float: left; float: left;
margin: 2px; margin: 2px;
grid-row-gap: 3px; grid-row-gap: 3px;
color: rgba(0, 0, 0, 0.5);
} }
.calendar-btn-container-right{ .calendar-btn-container-right{
width: 20%; width: 20%;
@ -977,106 +978,125 @@ ul, li {
margin: 2px; margin: 2px;
grid-row-gap: 3px; grid-row-gap: 3px;
} }
#calendar-btn-sec{ #calendar-btn-edit{
grid-row: 1; grid-row: 1;
grid-column: 1; grid-column: 1;
margin: auto; margin: auto;
color: rgba(0, 0, 0, 0.5); color: rgba(0, 0, 0, 0.5);
cursor: not-allowed;
} }
#calendar-btn-edit:hover {
#calendar-btn-halfMin{ color: #FFF;
border: 0px solid #000;
cursor: pointer;
}
#calendar-btn-1min{
grid-row: 1;
grid-column: 1;
margin: auto;
color: rgba(0, 0, 0, 0.7);
}
#calendar-btn-5min{
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 2;
margin: auto; margin: auto;
color: rgba(0, 0, 0, 0.5); color: rgba(0, 0, 0, 0.7);
cursor: not-allowed;
} }
#calendar-btn-min{ #calendar-btn-10min{
grid-row: 2; grid-row: 2;
grid-column: 1; grid-column: 1;
margin-left: 10px; margin-left: 10px;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-fiveMin{ #calendar-btn-20min{
grid-row: 2; grid-row: 2;
grid-column: 2; grid-column: 2;
margin-left: 10px; margin-left: 10px;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-night{ #calendar-btn-lyre{
grid-row: 1; grid-row: 1;
grid-column: 1; grid-column: 1;
height: fit-content; height: fit-content;
text-align: center; text-align: center;
vertical-align: center; vertical-align: center;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-day{ #calendar-btn-vaisseau{
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 2;
height: fit-content; height: fit-content;
text-align: center; text-align: center;
vertical-align: center; vertical-align: center;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-quick{ #calendar-btn-30min{
grid-row: 2; grid-row: 2;
grid-column: 1; grid-column: 1;
height: fit-content; height: fit-content;
text-align: center; text-align: center;
vertical-align: center; vertical-align: center;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-1heure{
#calendar-btn-long{
grid-row: 2; grid-row: 2;
grid-column: 2; grid-column: 2;
height: fit-content; height: fit-content;
text-align: center; text-align: center;
vertical-align: center; vertical-align: center;
color: rgba(0, 0, 0, 0.7);
} }
#calendar-btn-container-left:hover{
#calendar-btn-sec:hover { color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: not-allowed; cursor: pointer;
} }
#calendar-btn-1min:hover {
#calendar-btn-halfMin:hover {
border: 0px solid #000;
cursor: not-allowed;
}
#calendar-btn-min:hover {
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
} }
#calendar-btn-fiveMin:hover { #calendar-btn-5min:hover {
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
} }
#calendar-btn-quick:hover { #calendar-btn-10min:hover {
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
} }
#calendar-btn-long:hover { #calendar-btn-20min:hover {
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
} }
#calendar-btn-day:hover { #calendar-btn-30min:hover {
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
} }
#calendar-btn-night:hover{ #calendar-btn-1heure:hover {
color: #FFF;
border: 0px solid #000;
cursor: pointer;
}
#calendar-btn-vaisseau:hover {
color: #FFF;
border: 0px solid #000;
cursor: pointer;
}
#calendar-btn-lyre:hover{
color: #FFF; color: #FFF;
border: 0px solid #000; border: 0px solid #000;
cursor: pointer; cursor: pointer;
@ -1101,6 +1121,7 @@ ul, li {
.calendar-time{ .calendar-time{
grid-column: 1; grid-column: 1;
grid-row: 2; grid-row: 2;
font-size: 1.10rem;
text-align: center; text-align: center;
margin: auto; margin: auto;
cursor: pointer; cursor: pointer;

4
system.json
View File

@ -2,9 +2,9 @@
"name": "foundryvtt-reve-de-dragon", "name": "foundryvtt-reve-de-dragon",
"title": "Rêve de Dragon", "title": "Rêve de Dragon",
"description": "Rêve de Dragon RPG for FoundryVTT", "description": "Rêve de Dragon RPG for FoundryVTT",
"version": "1.1.1", "version": "1.1.2",
"minimumCoreVersion": "0.7.5", "minimumCoreVersion": "0.7.5",
"compatibleCoreVersion": "0.7.7", "compatibleCoreVersion": "0.7.8",
"templateVersion": 58, "templateVersion": 58,
"author": "LeRatierBretonnien", "author": "LeRatierBretonnien",
"esmodules": [ "module/rdd-main.js", "module/hook-renderChatLog.js" ], "esmodules": [ "module/rdd-main.js", "module/hook-renderChatLog.js" ],

58
templates/calendar-editor-template.html Normal file
View File

@ -0,0 +1,58 @@
<form class="{{cssClass}}" autocomplete="off">
<header class="sheet-header">
<div class="header-fields">
<h1 class="charname">Edition du Calendrier</h1>
</div>
</header>
{{!-- Sheet Body --}}
<section class="sheet-body">
<div class="form-group">
<label for="mois">Mois</label>
<select name="nomMois" id="nomMois" data-dtype="String">
{{#select nomMois}}
{{>"systems/foundryvtt-reve-de-dragon/templates/heures-select-option.html"}}
{{/select}}
</select>
</div>
<div class="form-group">
<label for="jour">Jour du mois </label>
<select name="jourMois" id="jourMois" data-dtype="String">
{{#select jourMois}}
{{#each jourMoisOptions as |key|}}
<option value={{key}}>{{numberFormat key decimals=0}}</option>
{{/each}}
{{/select}}
</select>
</div>
<div class="form-group">
<label for="heure">Heure Draconique</label>
<select name="nomHeure" id="nomHeure" data-dtype="String">
{{#select nomHeure}}
{{>"systems/foundryvtt-reve-de-dragon/templates/heures-select-option.html"}}
{{/select}}
</select>
</div>
<div class="form-group">
<label for="xp">Heures</label>
<select name="heuresRelative" id="heuresRelative" data-dtype="String">
{{#select heuresRelative}}
{{#each heuresOptions as |key|}}
<option value={{key}}>{{numberFormat key decimals=0}}</option>
{{/each}}
{{/select}}
</select>
</div>
<div class="form-group">
<label for="xp">Minutes</label>
<select name="minutesRelative" id="minutesRelative" data-dtype="String">
{{#select minutesRelative}}
{{#each minutesOptions as |key|}}
<option value={{key}}>{{numberFormat key decimals=0}}</option>
{{/each}}
{{/select}}
</select>
</div>
</section>
</form>

35
templates/calendar-template.html
View File

@ -1,26 +1,33 @@
<div id="calendar-time-container"> <div id="calendar-time-container">
<div id="calendar"> <div id="calendar">
<h3 id="calendar-hdr"> <i id="calendar-btn-edit" class="fas fa-cog" title="Editer"></i>
<span id="calendar-date" title="{{localize 'EditCalendar'}}">Date</span><span title="{{localize 'EditCalendar'}}" id="calendar-date-num">DateNum</span> <div id="calendar-hdr">
<i id=calendar-weather class="fas fa-cloud-sun" title="{{localize 'Weather'}}"></i> <p id="calendar--move-handle" class="calendar-date-rdd" title="Deplacer">Jour {{jourMois}} de {{nomMois}} ({{nomSaison}})</p>
</h3> </div>
<div class="calendar-container"> <div class="calendar-container">
{{#if isGM}}
<div class="calendar-btn-container-left"> <div class="calendar-btn-container-left">
<i id="calendar-btn-sec" class="fas fa-angle-right" title="{{localize 'Advance1second'}}" disabled></i> <i id="calendar-btn-1min" class="fas fa-angle-right" title="Avancer de 1 minute"></i>
<i id="calendar-btn-halfMin" class="fas fa-angle-double-right" title="{{localize 'Advance30seconds'}}" disabled></i> <i id="calendar-btn-5min" class="fas fa-angle-double-right" title="Avancer de 5 minutes"></i>
<i id="calendar-btn-min" class="fas fa-play" title="{{localize 'Advance1minute'}}"></i> <i id="calendar-btn-10min" class="fas fa-play" title="Avancer de 10 minutes"></i>
<i id="calendar-btn-fiveMin" class="fas fa-step-forward" title="{{localize 'Advance5minutes'}}"></i> <i id="calendar-btn-20min" class="fas fa-step-forward" title="Avancer de 20 minutes"></i>
</div> </div>
{{else}}
<div class="calendar-btn-container-left">
</div>
{{/if}}
<div class="calendar-weekday-time"> <div class="calendar-weekday-time">
<p id="calendar-weekday">Day of the Week</p> <p id="calendar-weekday"><span id="calendar-icone-heure">H</span>&nbsp;<span id="calendar-heure-texte">{{nomHeure}}</span></p>
<span class="calendar-time"><p class="calendar-time-disp" id="calendar-time" title="{{localize 'StartStopPseudo'}}">Time</p><span id='calender-time-running'>•</span></span> <span class="calendar-time"><p class="calendar-time-disp" id="calendar-time" title="Start/Stop">{{heuresRelative}}:{{minutesRelative}}</p><span id='calender-time-running'>•</span></span>
</div> </div>
{{#if isGM}}
<div class="calendar-btn-container-right"> <div class="calendar-btn-container-right">
<i id="calendar-btn-quick" class="fas fa-forward" title="{{localize 'Advance15minutes'}}" ></i> <i id="calendar-btn-30min" class="fas fa-forward" title="Avancer de 30 minutes" ></i>
<i id="calendar-btn-long" class="fas fa-fast-forward" title="{{localize 'Advance1hour'}}" ></i> <i id="calendar-btn-1heure" class="fas fa-fast-forward" title="Avancer d'1 heure" ></i>
<i id="calendar-btn-day" class="fas fa-sun" title="{{localize 'Advance7amNextDay'}}"></i> <i id="calendar-btn-vaisseau" class="fas fa-sun" title="Avancer au Vaisseau"></i>
<i id="calendar-btn-night" class="fas fa-moon" title="{{localize 'AdvanceToMidnight'}}"></i> <i id="calendar-btn-lyre" class="fas fa-moon" title="Avancer à Lyre"></i>
</div> </div>
{{/if}}
</div> </div>
</div> </div>
</div> </div>

12
templates/heures-select-option.html Normal file
View File

@ -0,0 +1,12 @@
<option value="vaisseau">Vaisseau</option>
<option value="sirene">Sirène</option>
<option value="faucon">Faucon</option>
<option value="couronne">Couronne</option>
<option value="dragon">Dragon</option>
<option value="epees">Epées</option>
<option value="lyre">Lyre</option>
<option value="serpent">Serpent</option>
<option value="poissonacrobate">Poisson Acrobate</option>
<option value="araignee">Araignée</option>
<option value="roseau">Roseau</option>
<option value="chateaudormant">Chateau Dormant</option>