Fréquences par milieu pour l'environnement

Les herbes et les ingrédients peuvent être cherchées/tirées

templates/chat-compendium-table-roll-rencontre.html

@@ -1,11 +1,11 @@
 <img class="chat-icon" src="{{rencontre.img}}" alt="{{rencontre.name}}" />
 <h4>{{#if mauvaise}}Mauvaise rencontre{{else}}Rencontre{{/if}} en {{typeTmr-name tmr.type}}</h4>
-<div>{{sourceCompendium}}</div>
+<div>{{rencontre.pack}}</div>
 <div>Jet: {{roll.formula}} : {{roll.total}}{{percentages}}</div>
 <hr>
 <div>
   <p>{{rencontre.name}} {{rencontre.system.force}} ({{rencontre.system.formule}})</p>
-  <p>{{linkCompendium sourceCompendium rencontre.id rencontre.name}}</p>
+  <p>{{linkCompendium rencontre.pack rencontre.id rencontre.name}}</p>
   {{#if rencontre.system.description}}
   <div class="poesie-extrait">
     {{{rencontre.system.description}}}

templates/chat-compendium-table-roll.html

@@ -1,10 +1,10 @@
 <h4>Tirage aléatoire: {{typeName}}</h4>
-<div>{{sourceCompendium}}</div>
+<div>{{document.pack}}</div>
 <div>Jet {{roll.formula}} : {{roll.total}}{{percentages}}</div>
 <hr>
 <div>
   <img class="chat-icon" src="{{document.img}}" alt="{{document.name}}" />
-  <p>{{linkCompendium @root.sourceCompendium document.id document.name}}</p>
+  <p>{{linkCompendium document.pack document.id document.name}}</p>
   {{#if document.system.description}}
   <div class="poesie-extrait">
     {{{document.system.description}}}

templates/chat-compendium-table.html

@@ -1,7 +1,11 @@
 <div>
   <img class="chat-icon" src="{{img}}" alt="{{typeName}}" />
   <h4>Table aléatoire: {{typeName}}</h4>
-  <div>{{sourceCompendium}}</div>
+  {{#with (lookup table 0) as |row|}}
+  <div>
+    {{row.document.pack}}
+  </div>
+  {{/with}}
   <br>
 </div>
 <div>
@@ -9,7 +13,7 @@
     {{#each table as |row|}}
     <li class="select-target item list-item" >
       <span>{{row.min}}{{#unless (eq row.min row.max)}}-{{row.max}}{{/unless}} : &nbsp;</span>
-      <span>{{linkCompendium @root.sourceCompendium row.document.id row.document.name}}</span>
+      <span>{{linkCompendium row.document.pack row.document.id row.document.name}}</span>
     </li>
     {{/each}}
   </ul>

templates/enum-rarete.html

@@ -1,4 +1,3 @@
-<option value=""></option>
 <option value="Commune">Commune</option>
 <option value="Frequente">Fréquente</option>
 <option value="Rare">Rare</option>

templates/item-herbe-sheet.html

@@ -11,38 +11,31 @@
     </div>
   </header>
 
-  {{!-- Sheet Body --}}
+  <nav class="sheet-tabs tabs" data-group="primary">
+    <a class="item" data-tab="informations">Informations</a>
+    {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-tab-environnement.html"}}
+  </nav>
+
   <section class="sheet-body">
-    <div class="flexcol">
-      <div class="form-group">
-        <label>Niveau (si applicable)</label>
-        <input class="attribute-value" type="text" name="system.niveau" value="{{system.niveau}}" data-dtype="Number" />
+    <div class="tab items" data-group="primary" data-tab="informations">
+      <div class="flexcol">
+        <div class="form-group">
+          <label>Niveau (si applicable)</label>
+          <input class="attribute-value" type="text" name="system.niveau" value="{{system.niveau}}" data-dtype="Number" />
+        </div>
+        <div class="form-group">
+          <label>Catégorie</label>
+          <select name="system.categorie" class="categorie" data-dtype="String">
+            {{#select system.categorie}}
+            {{>"systems/foundryvtt-reve-de-dragon/templates/enum-categorie-ingredient.html"}}
+            {{/select}}
+          </select>
+        </div>
+        
+        {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-inventaire.html"}}
+        {{>"systems/foundryvtt-reve-de-dragon/templates/partial-item-description.html"}}
       </div>
-      <div class="form-group">
-        <label>Milieu</label>
-        <input class="attribute-value" type="text" name="system.milieu" value="{{system.milieu}}" data-dtype="String" />
-      </div>
-      <div class="form-group">
-        <label>Fréquence</label>
-        <select name="system.rarete" class="rarete" data-dtype="String">
-          {{#select system.rarete}}
-          {{>"systems/foundryvtt-reve-de-dragon/templates/enum-rarete.html"}}
-          {{/select}}
-        </select>
-      </div>
-      <div class="form-group">
-        <label>Catégorie</label>
-        <select name="system.categorie" class="categorie" data-dtype="String">
-          {{#select system.categorie}}
-          {{>"systems/foundryvtt-reve-de-dragon/templates/enum-categorie-ingredient.html"}}
-          {{/select}}
-        </select>
-      </div>
-
-      {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-inventaire.html"}}
-      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-item-description.html"}}
-    
     </div>
+    {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-environnement.html"}}
   </section>
-
 </form>

templates/item-ingredient-sheet.html

@@ -1,34 +1,28 @@
 <form class="{{cssClass}}" autocomplete="off">
   {{>"systems/foundryvtt-reve-de-dragon/templates/header-item.html"}}
 
-  {{!-- Sheet Body --}}
-  <section class="sheet-body">
-    <div class="form-group">
-      <label>Niveau (si applicable) </label>
-      <input class="attribute-value" type="text" name="system.niveau" value="{{system.niveau}}" data-dtype="Number" />
-    </div>
-    <div class="form-group">
-      <label>Milieu</label>
-      <input class="attribute-value" type="text" name="system.milieu" value="{{system.milieu}}" data-dtype="String" />
-    </div>
-    <div class="form-group">
-      <label>Fréquence</label>
-      <select name="system.rarete" class="rarete" data-dtype="String">
-        {{#select system.rarete}}
-        {{>"systems/foundryvtt-reve-de-dragon/templates/enum-rarete.html"}}
-        {{/select}}
-      </select>
-    </div>
-    <div class="form-group">
-      <label>Catégorie</label>
-      <select name="system.categorie" class="categorie" data-dtype="String">
-        {{#select system.categorie}}
-        {{>"systems/foundryvtt-reve-de-dragon/templates/enum-categorie-ingredient.html"}}
-        {{/select}}
-      </select>
-    </div>
+  <nav class="sheet-tabs tabs" data-group="primary">
+    <a class="item" data-tab="informations">Informations</a>
+    {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-tab-environnement.html"}}
+  </nav>
 
-    {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-inventaire.html"}}
-    {{>"systems/foundryvtt-reve-de-dragon/templates/partial-item-description.html"}}
+  <section class="sheet-body">
+    <div class="tab items" data-group="primary" data-tab="informations">
+      <div class="form-group">
+        <label>Niveau (si applicable) </label>
+        <input class="attribute-value" type="text" name="system.niveau" value="{{system.niveau}}" data-dtype="Number" />
+      </div>
+      <div class="form-group">
+        <label>Catégorie</label>
+        <select name="system.categorie" class="categorie" data-dtype="String">
+          {{#select system.categorie}}
+          {{>"systems/foundryvtt-reve-de-dragon/templates/enum-categorie-ingredient.html"}}
+          {{/select}}
+        </select>
+      </div>
+      {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-inventaire.html"}}
+      {{>"systems/foundryvtt-reve-de-dragon/templates/partial-item-description.html"}}
+    </div>
+    {{>"systems/foundryvtt-reve-de-dragon/templates/item/partial-environnement.html"}}
   </section>
 </form>

templates/item-potion-sheet.html

@@ -17,6 +17,7 @@
       <label>Fréquence</label>
       <select name="system.rarete" class="rarete" data-dtype="String">
         {{#select system.rarete}}
+        <option value=""></option>
         {{>"systems/foundryvtt-reve-de-dragon/templates/enum-rarete.html"}}
         {{/select}}
       </select>

templates/item/partial-environnement.html

@@ -0,0 +1,36 @@
+{{>'systems/foundryvtt-reve-de-dragon/templates/scripts/autocomplete-script.hbs'}}
+
+<div class="tab items" data-group="primary" data-tab="environnement">
+  <div class="form-group">
+    <label>Description du milieu</label>
+    <input class="attribute-value" type="text" name="system.milieu" value="{{system.milieu}}" data-dtype="String" />
+  </div>
+  <hr>
+  <div class="form-group">
+    <label>Ajouter un fréquence</label>
+    <div class="flexrow">
+      <div class="autocomplete">
+        <input type="text" class="input-selection-milieu" placeholder="Milieu" data-dtype="String"/>
+      </div>
+      {{>'systems/foundryvtt-reve-de-dragon/templates/scripts/autocomplete.hbs' proposals=milieux className='input-selection-milieu'}}
+      <a class="milieu-add"><i class="fas fa-plus-circle"></i></a>
+    </div>
+  </div>
+  {{#each system.environnement as |env|}}
+  <div class="form-group environnement-milieu" data-milieu="{{env.milieu}}">
+    <label>
+      {{env.milieu}}
+      <a class="milieu-delete" title="Supprimer {{env.milieu}}"><i class="fas fa-trash"></i></a>
+    </label>
+    <div class="flexrow">
+      <select class="environnement-rarete" class="flex-shrink" data-dtype="String">
+        {{#select env.rarete}}
+        {{>"systems/foundryvtt-reve-de-dragon/templates/enum-rarete.html"}}
+        {{/select}}
+      </select>
+      {{rangePicker name="environnement-frequence" value=env.frequence min=(getFrequenceRarete env.rarete 'min') max=(getFrequenceRarete env.rarete 'max') step=1}}
+      <label>[{{getFrequenceRarete env.rarete 'min'}}-{{getFrequenceRarete env.rarete 'max'}}]</label>
+    </div>
+  </div>
+  {{/each}}
+</div>

templates/item/partial-tab-environnement.html

@@ -0,0 +1 @@
+<a class="item" data-tab="environnement">Environnement</a>

templates/scripts/autocomplete-script.hbs

@@ -0,0 +1,96 @@
+<script>
+function autocomplete(input, proposals) {
+  var currentFocus;
+
+  function createCompletionContainer(id) {
+    let div = document.createElement("DIV");
+    div.setAttribute("id", id + "autocomplete-list");
+    div.setAttribute("class", "autocomplete-items");
+    return div;
+  }
+
+  function createCompletionProposal(inputElement, incomplete, complete) {
+    let div = document.createElement("DIV");
+    /*make the matching letters bold:*/
+    const start = complete.toUpperCase().indexOf(incomplete.toUpperCase());
+    div.innerHTML = complete.substr(0, start)
+      + "<strong>" + complete.substr(start, incomplete.length) + "</strong>"
+      + complete.substr(start+incomplete.length)
+    /*insert a input field that will hold the current array item's value:*/
+      + "<input type='hidden' value='" + complete + "'>";
+    /*execute a function when someone clicks on the item value (DIV element):*/
+    div.addEventListener("click", function(e) {
+        /*insert the value for the autocomplete text field:*/
+        inputElement.value = this.getElementsByTagName("input")[0].value;
+        /*close the list of autocompleted values, or any other open lists of autocompleted values:*/
+        closeAllOpenedLists();
+    });
+    return div;
+  }
+
+  function addActive(x) {
+    if (!x) return false;
+    removeActive(x);
+    if (currentFocus >= x.length) currentFocus = 0;
+    if (currentFocus < 0) currentFocus = (x.length - 1);
+    x[currentFocus].classList.add("autocomplete-active");
+  }
+
+  function removeActive(x) {
+    for (var i = 0; i < x.length; i++) {
+      x[i].classList.remove("autocomplete-active");
+    }
+  }
+
+  function closeAllOpenedLists(elmnt) {
+    /*close all autocomplete lists in the document, except the one passed as an argument:*/
+    var x = document.getElementsByClassName("autocomplete-items");
+    for (var i = 0; i < x.length; i++) {
+      if (elmnt != x[i] && elmnt != input) {
+        x[i].parentNode.removeChild(x[i]);
+      }
+    }
+  }
+
+  /*execute a function when someone writes in the text field:*/
+  input.addEventListener("input", function(e) {
+    const incomplete = this.value;
+    closeAllOpenedLists();
+    if (!incomplete) { return false; }
+
+    currentFocus = -1;
+    const container = createCompletionContainer(this.id)
+    this.parentNode.appendChild(container);
+    /*for each item in the array...*/
+    for (let i = 0; i < proposals.length; i++) {
+      /*check if the item starts with the same letters as the text field value:*/
+      if (proposals[i].toUpperCase().includes(incomplete.toUpperCase())) {
+        /*create a DIV element for each matching element:*/
+        container.appendChild(createCompletionProposal(input, incomplete, proposals[i]));
+      }
+    }
+  });
+
+  /*execute a function presses a key on the keyboard:*/
+  input.addEventListener("keydown", function(e) {
+      var container = document.getElementById(this.id + "autocomplete-list")?.getElementsByTagName("div");
+      if (e.keyCode == 40) {
+        currentFocus++;
+        addActive(container);
+      } else if (e.keyCode == 38) { //up
+        currentFocus--;
+        addActive(container);
+      } else if (e.keyCode == 13) {
+        e.preventDefault();
+        if (currentFocus > -1 && container) {
+          container[currentFocus].click();
+        }
+      }
+  });
+
+  /*execute a function when someone clicks in the document:*/
+  document.addEventListener("click", function (e) {
+      closeAllOpenedLists(e.target);
+  });
+}
+</script>

templates/scripts/autocomplete.hbs

@@ -0,0 +1,5 @@
+<script>
+var proposals = [ {{#each proposals as |val|}}"{{val}}",{{/each}} ];
+Array.from(document.getElementsByClassName('{{className}}'))
+  .forEach(element => autocomplete(element, proposals))
+</script>