Recherche par nom

Dans la fenêtre de recherche, possibilité de chercher sur le nom
des objets en plus des autres critères

module/rdd-utility.js

@@ -202,7 +202,7 @@ export class RdDUtility {
       'systems/foundryvtt-reve-de-dragon/templates/enum-periode.html',
       'systems/foundryvtt-reve-de-dragon/templates/enum-tmr-effet.html',
       // Partials
-      'systems/foundryvtt-reve-de-dragon/templates/tirage/liste-resultats.hbs',
+      'systems/foundryvtt-reve-de-dragon/templates/tirage/liste-resultats-recherche.hbs',
       'systems/foundryvtt-reve-de-dragon/templates/common/timestamp.hbs',
       'systems/foundryvtt-reve-de-dragon/templates/common/periodicite.hbs',
       'systems/foundryvtt-reve-de-dragon/templates/common/enum-duree.hbs',

module/tirage/fenetre-recherche-tirage.js

@@ -3,6 +3,7 @@ import { HtmlUtility } from '../html-utility.js';
 import { Misc } from "../misc.js";
 import { CompendiumTableHelpers } from '../settings/system-compendiums.js';
 import { RdDRaretes } from '../item/raretes.js';
+import { Grammar } from '../grammar.js';
 
 const FILTER_GROUPS = [
   { group: 'type', label: "Type d'objet" },
@@ -188,6 +189,30 @@ export class FenetreRechercheTirage extends Application {
       const row = await CompendiumTableHelpers.getRandom(table, 'Item')
       await CompendiumTableHelpers.tableRowToChatMessage(row, 'Item');
     })
+    
+    // this.html.find('.recherche')
+    //   .each((index, field) => {
+    //     if (this.options.recherche) {
+    //       field.focus();
+    //       field.setSelectionRange(this.options.recherche.start, this.options.recherche.end);
+    //     }
+    //   })
+    //   .keyup(async event => {
+    //     const nouvelleRecherche = this._optionRecherche(event.currentTarget);
+    //     if (this.options.recherche?.text != nouvelleRecherche?.text) {
+    //       this.options.recherche = nouvelleRecherche;
+    //       if (this.timerRecherche) {
+    //         clearTimeout(this.timerRecherche);
+    //       }
+    //       this.timerRecherche = setTimeout(() => {
+    //         this.timerRecherche = undefined;
+    //         this.render(true);
+    //       }, 500);
+    //     }
+    //   })
+    //   .change(async event =>
+    //     this.options.recherche = this._optionRecherche(event.currentTarget)
+    //   );
   }
 
   showFilterGroup(groupDiv, show) {
@@ -200,14 +225,14 @@ export class FenetreRechercheTirage extends Application {
 
   supprimerFiltres() {
     this.html.find('input:is(.activate-filter-group,.activate-filter-milieu)').prop("checked", false);
-    this.html.find('div.liste-resultats').html('');
+    this.html.find('div.liste-resultats-recherche').html('');
-    this.changeListeFiltresActifs();
+    this.html.find('.section-filters-text input.recherche').val('');
   }
 
   async recherche() {
     const table = await this.buildTable();
-    const htmlResultats = await renderTemplate(`systems/foundryvtt-reve-de-dragon/templates/tirage/liste-resultats.hbs`, { resultats: table });
+    const htmlResultats = await renderTemplate(`systems/foundryvtt-reve-de-dragon/templates/tirage/liste-resultats-recherche.hbs`, { resultats: table });
-    this.html.find('div.liste-resultats').html(htmlResultats);
+    this.html.find('div.liste-resultats-recherche').html(htmlResultats);
     this._dragDrop.forEach(dragDropHandler => dragDropHandler.bind(this.element[0]))
   }
 
@@ -225,13 +250,19 @@ export class FenetreRechercheTirage extends Application {
     }
     return (it, mi) => true;
   }
+  buildFilterRechercheName() {
+    const recherche = this.html.find('.section-filters-text input.recherche').val();
+    if (recherche) {
+      return  (it, mi) => Grammar.includesLowerCaseNoAccent(it.name, recherche);
+    }
+    return (it, mi) => true;
+  }
 
   buildCheckedGroupFilter(milieux) {
     const filtersList = this.getGroupCheckedFilters()
       .map(gf => this.buildOrFilter(gf.filters.map(f => f.check)));
-    if (milieux) {
     filtersList.push(this.buildMilieuxFilter(milieux));
-    }
+    filtersList.push(this.buildFilterRechercheName());
     return this.buildAndFilter(filtersList)
   }
 

styles/simple.css

@@ -988,7 +988,7 @@ ul, li {
   margin: 0;
   padding: 0;
 }
-.sheet input.recherche {
+:is(.sheet, div.fenetre-recherche div.section-filters-text) input.recherche {
   background-image: url("img/ui/icon-search.svg");
   background-position: 0.1rem 0.1rem;
   background-size: 1rem;
@@ -1962,26 +1962,26 @@ div.vl {
   width: 1px;
   flex-grow: 0;
 }
-div.fenetre-recherche div.recherche {
+div.fenetre-recherche div.zone-recherche {
   display: flex;
 }
-div.fenetre-recherche div.recherche div.filtres {
+div.fenetre-recherche div.zone-recherche div.filtres {
   width: fit-content;
   min-width: 200px;
   float: left;
 }
-div.fenetre-recherche div.titre-fenetre-recherche {
+div.fenetre-recherche div.titre-resultats-recherche {
   flex-basis: 0;
   max-height: fit-content;
 }
-div.fenetre-recherche div.liste-resultats {
+div.fenetre-recherche div.liste-resultats-recherche {
   display: flex;
   flex: auto;
   flex-flow: row wrap;
   flex-direction: row;
   align-content: flex-start  ;
 }
-div.fenetre-recherche div.liste-resultats div.resultat {
+div.fenetre-recherche div.liste-resultats-recherche div.resultat {
   width: fit-content;
   margin: 0.2rem 0.5rem;
 }

templates/tirage/fenetre-recherche-tirage.hbs

@@ -7,12 +7,16 @@
     <span class="liste-filtres-actifs"></span>
   </div>
   <hr>
-  <div class="recherche">
+  <div class="zone-recherche">
     <div class="filtres">
-      <div class="titre-fenetre-recherche">
+      <div class="titre-resultats-recherche">
         <h3>Filtres</h3>
       </div>
-
+      <div class="section-filters-text">
+        <h4>
+          <input class="recherche flex-grow" type="text" value="{{options.recherche.text}}" name="recherche" size="8" data-dtype="String" placeholder=""/>
+        </h4>
+      </div>
       <div class="section-filters-root">
         <h4>
           <a class="section-filters-toggle">Milieux
@@ -56,10 +60,10 @@
     </div>
     <div class="vl"></div>
     <div class="resultats">
-      <div class="titre-fenetre-recherche">
+      <div class="titre-resultats-recherche">
         <h3>Résultat de recherche</h3>
       </div>
-      <div class="liste-resultats">
+      <div class="liste-resultats-recherche">
 
       </div>
     </div>