#5 Languages/Subcultures management

module/actor-sheet.js

@@ -47,12 +47,14 @@ export class SoSActorSheet extends ActorSheet {
     data.data.currentWounds = this.actor.computeCurrentWounds();
     data.data.totalWounds = this.actor.data.data.scores.wound.value;
 
-    data.data.subculture = this.actor.data.items.find( item => item.type == 'subculture');
+    data.data.subcultureList = this.actor.data.items.filter( item => item.type == 'subculture');
+    if ( data.data.subculture != "" ) { // background.subculture contains the main subculture ID
+      data.data.mainSubculture = data.data.subcultureList.find( subc => subc._id == data.data.subculture);
+    }
+    data.data.languageList  = this.actor.data.items.filter( item => item.type == 'language');
     data.data.geneline      = this.actor.data.items.find( item => item.type == 'geneline');
     data.data.editStatSkill =  this.options.editStatSkill;
     console.log("stats", data);
-    //data.stats  = duplicate(this.actor.stats);
-    //data.scores = duplicate(this.actor.scores);
 
     return data;
   }

styles/simple.css

@@ -618,6 +618,7 @@ ul, li {
   flex-grow: 0;
   margin-right: 0.25rem;
 }
+.genelang-column,
 .skill-column {
   flex-direction: column;
   align-content: flex-start;
@@ -631,7 +632,7 @@ ul, li {
   font-weight: bold;
   flex-grow: 0;
 }
-
+.genelang-label,
 .skill-label,
 .conseq-label,
 .generic-label {

templates/actor-sheet.html

@@ -274,8 +274,14 @@
               <label class="description-label generic-label item-link"><a data-item-id="{{data.geneline._id}}">{{data.geneline.name}}</a></label>
             </li>
             <li class="item flexrow list-item">
-              <label class="description-label generic-label">Subculture : </label>
+              <label class="description-label generic-label">Main Subculture :</label>
-              <label class="description-label generic-label item-link"><a data-item-id="{{data.subculture._id}}">{{data.subculture.name}}</a></label>
+              <select class="stat-value flexrow" type="text" name="data.subculture" value="{{data.subculture}}" data-dtype="String">
+                {{#select data.subculture}}
+                {{#each data.subcultureList as |subculture key|}}
+                <option value="{{subculture.name}}">{{subculture.name}}</option>
+                {{/each}}
+                {{/select}}
+              </select>     
             </li>
             <li class="item flexrow list-item">
               <label class="description-label stat-label">Genre : </label>
@@ -305,6 +311,44 @@
             </li>
           </ul>
         </article>
+        <hr>
+        <article class="flexcol">
+          <div class="grid grid-2col">
+
+            <div class="flex-group-left flexcol genelang-column">  
+              <span class="description-label">Familiar Subcultures</span>
+              <ul class="item-list alternate-list">
+                {{#each data.subcultureList as |subculture key|}}
+                <li class="item flexrow list-item" data-item-id="{{subculture._id}}">
+                  <img class="sheet-skill-img" src="{{subculture.img}}"/>
+                  <span class="conseq-label genelang-label">{{subculture.name}}</span>
+                  <div class="item-controls">
+                    <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
+                    <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
+                  </div>
+                </li>                  
+                {{/each}}
+              </ul>
+            </div>
+            <div class="flex-group-left flexcol genelang-column">  
+              <span class="description-label">Known Languages</span>
+              <ul class="item-list alternate-list">
+                {{#each data.languageList as |language key|}}
+                <li class="item flexrow list-item" data-item-id="{{language._id}}">
+                  <img class="sheet-skill-img" src="{{language.img}}"/>
+                  <span class="conseq-label">{{language.name}}</span>
+                  <div class="item-controls">
+                    <a class="item-control item-edit" title="Edit Item"><i class="fas fa-edit"></i></a>
+                    <a class="item-control item-delete" title="Delete Item"><i class="fas fa-trash"></i></a>
+                  </div>
+                </li>                  
+                {{/each}}
+              </ul>
+            </div>
+          </div>          
+        </article>
+
+        <hr>
 
         <article class="flexcol">
           <hr>

templates/item-language-sheet.html

@@ -0,0 +1,22 @@
+<form class="{{cssClass}}" autocomplete="off">
+    <header class="sheet-header">
+        <img class="profile-img" src="{{item.img}}" data-edit="img" title="{{item.name}}"/>
+        <div class="header-fields">
+            <h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="Name"/></h1>
+        </div>
+    </header>
+
+    {{!-- Sheet Body --}}
+    <section class="sheet-body">
+
+        <div class="tab" data-group="primary">
+          <div class="flexcol">
+            <label class="generic-label">Description</label>
+            <div class="form-group medium-editor">
+              {{editor content=data.description target="data.description" button=true owner=owner editable=editable}}
+            </div>
+          </div>
+        </div>
+
+    </section>
+</form>