begins implementing sidebar elements for pinned Items

src/module/setup/partials.mjs

@@ -16,7 +16,12 @@ function loadPartials(hbs) {
             'systems/DSA_4-1/templates/ui/partial-equipment-button.hbs',
             'systems/DSA_4-1/templates/ui/partial-array-editor.hbs',
             'systems/DSA_4-1/templates/actor/character/tab-set.hbs',
-            'systems/DSA_4-1/templates/dialog/liturgy-dialog.hbs'
+            'systems/DSA_4-1/templates/dialog/liturgy-dialog.hbs',
+            'systems/DSA_4-1/templates/ui/partial-mini-rollable-button.hbs',
+            'systems/DSA_4-1/templates/ui/partial-mini-rollable-liturgy-button.hbs',
+            'systems/DSA_4-1/templates/ui/partial-mini-rollable-weaponskill-button.hbs',
+            'systems/DSA_4-1/templates/ui/partial-mini-rollable-language-button.hbs',
+            'systems/DSA_4-1/templates/ui/partial-mini-rollable-spell-button.hbs',
         ]).then(resolve);
     })
 

src/module/sheets/character/advsf.mjs

@@ -21,7 +21,8 @@ export default {
                     description: item.system.description,
                     isAdvantage: !item.system.nachteil,
                     isDisadvantage: item.system.nachteil,
-                    isBadAttribute: item.system.schlechteEigenschaft
+                    isBadAttribute: item.system.schlechteEigenschaft,
+                    fav: item.getFlag("DSA_4-1", "favourite")
                 })
             } else {
                 context.flaws.push({
@@ -32,7 +33,8 @@ export default {
                     description: item.system.description,
                     isAdvantage: !item.system.nachteil,
                     isDisadvantage: item.system.nachteil,
-                    isBadAttribute: item.system.schlechteEigenschaft
+                    isBadAttribute: item.system.schlechteEigenschaft,
+                    fav: item.getFlag("DSA_4-1", "favourite")
                 })
             }
             }
@@ -43,6 +45,7 @@ export default {
             context.specialAbilities.push({
                 id: item._id,
                 name: item.system.value ? item.system.value : item.name,
+                fav: item.getFlag("DSA_4-1", "favourite")
             });
             }
         );

src/module/sheets/character/liturgies.mjs

@@ -68,6 +68,7 @@ export default {
                             lkpReq: lkp,
                             lkpMod: mod,
                             costKaP,
+                            fav: item.getFlag("DSA_4-1", "favourite"),
                             rank: index,  // get effective liturgy rank based on deity
                             liturgiekenntnis: deity,
                         })

src/module/sheets/character/skills.mjs

@@ -51,7 +51,8 @@ export default {
                         id: item._id,
                         at: item.system.at,
                         pa: item.system.pa,
-                        komplexität: item.system.komplexität
+                        komplexität: item.system.komplexität,
+                        fav: item.getFlag("DSA_4-1", "favourite")
                     };
 
                     if (talentGruppe === "Kampf") {

src/module/sheets/character/spells.mjs

@@ -42,6 +42,7 @@ export default {
                     eigenschaft1: werte[0].name,
                     eigenschaft2: werte[1].name,
                     eigenschaft3: werte[2].name,
+                    fav: item.getFlag("DSA_4-1", "favourite")
                 })
 
         })

src/module/sheets/characterSheet.mjs

@@ -47,6 +47,7 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
             openSpeciesDocument: CharacterSheet.#openSpeciesDocument,
             openCombatAction: CharacterSheet.#openCombatAction,
             openLiturgyDialog: CharacterSheet.#openLiturgyDialog,
+            openSpellDialog: CharacterSheet.#openSpellDialog,
             progressCooldown: CharacterSheet.#progressCooldown,
             cancelCooldown: CharacterSheet.#cancelCooldown,
             activateCooldown: CharacterSheet.#activateCooldown,
@@ -54,7 +55,8 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
             removeEffect: CharacterSheet.#removeEffect,
             rollDamage: CharacterSheet.#rollDamage,
             openItemBrowser: CharacterSheet.#openItemBrowser,
-            newItem: CharacterSheet.#addNewItem
+            newItem: CharacterSheet.#addNewItem,
+            toggleFav: CharacterSheet.#toggleFav,
 
         }
     }
@@ -233,6 +235,12 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
         new LiturgyDialog(this.document, lkp, id, deity).render(true)
     }
 
+    static #openSpellDialog(event, target) {
+        const {itemId} = target.dataset
+        console.log(itemId)
+        this.document.itemTypes["Spell"]?.find(p => p.id === itemId)?.sheet.render(true)
+    }
+
     static #startResting(event, target) {
         const dialog = new RestingDialog(this.document)
 
@@ -267,6 +275,16 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
         items[0].sheet.render(true)
     }
 
+    static async #toggleFav(event, target) {
+        const {itemId} = target.dataset
+        const doc = this.document.items.find(p => p.id === itemId)
+
+        if (doc) {
+            const previous = doc.getFlag("DSA_4-1", "favourite") ?? false
+            doc.setFlag("DSA_4-1", "favourite", !previous)
+        }
+    }
+
     _configureRenderOptions(options) {
         super._configureRenderOptions(options)
 
@@ -277,6 +295,7 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
         return options
     }
 
+
     /**
      * Handle form submission
      * @this {AdvantageSheet}
@@ -485,6 +504,44 @@ class CharacterSheet extends HandlebarsApplicationMixin(ActorSheetV2) {
                     })
                 }
 
+                context.favourites = actorData.items.filter(item => item.getFlag("DSA_4-1", "favourite") === true).map(item => {
+                    let id = item.id
+                    let t = null
+                    switch (item.type) {
+                        case "Spell":
+                            t = "systems/DSA_4-1/templates/ui/partial-mini-rollable-spell-button.hbs"
+                            break;
+                        case "Skill":
+                            switch (item.system.gruppe) {
+                                case "Kampf":
+                                    t = "systems/DSA_4-1/templates/ui/partial-mini-rollable-weaponskill-button.hbs"
+                                    break;
+                                case "Sprachen":
+                                    t = "systems/DSA_4-1/templates/ui/partial-mini-rollable-language-button.hbs"
+                                    break;
+                                default:
+                                    t = "systems/DSA_4-1/templates/ui/partial-mini-rollable-button.hbs"
+                            }
+                            break;
+                        case "Liturgy":
+                            t = "systems/DSA_4-1/templates/ui/partial-mini-rollable-liturgy-button.hbs"
+                            break;
+                        default:
+                            t = null
+                    }
+
+                    let obj = Object.assign({}, item)
+
+                    obj.fav = item.getFlag("DSA_4-1", "favourite")
+                    obj.id = id
+
+                    if (t) {
+                        obj.template = t
+                    }
+
+                    return obj
+                })
+
                 context.cooldowns = actorData.system.cooldowns ?? []
                 context.cooldowns.forEach(cooldown => {
                     let weapon = null

src/style/molecules/_rollable.scss

@@ -36,7 +36,7 @@ $rollable_colours_font: (
     display: block;
     height: 32px;
     position: relative;
-    margin: 4px;
+    margin: 4px 32px 4px 4px;
 
     .die {
       width: 32px;
@@ -69,6 +69,24 @@ $rollable_colours_font: (
           top: 6px;
         }
       }
+
+      &:active {
+
+
+        scale: 0.8;
+
+        .value {
+
+          img {
+            position: absolute;
+            width: 20px;
+            height: 20px;
+            left: 4px;
+            top: 7px;
+          }
+        }
+
+      }
     }
 
     .container {
@@ -122,6 +140,18 @@ $rollable_colours_font: (
         }
       }
     }
+
+    .outside {
+      position: absolute;
+      right: -24px;
+      top: 8px;
+      bottom: 8px;
+      z-index: 3;
+
+      &:hover {
+        text-shadow: 0 0 10px rgb(255 0 0);
+      }
+    }
   }
 
   // interactivity
@@ -135,23 +165,7 @@ $rollable_colours_font: (
 
     }
 
-    &:active {
 
-      .die {
-        scale: 0.8;
-
-        .value {
-
-          img {
-            position: absolute;
-            width: 20px;
-            height: 20px;
-            left: 4px;
-            top: 7px;
-          }
-        }
-      }
-    }
   }
 }
 

src/templates/actor/character/main-sheet.hbs

@@ -99,6 +99,13 @@
             </div>
         {{/each}}
 
+        <section class="favourites">
+            <h3>Angepinnt</h3>
+            {{#each this.favourites}}
+                {{> (lookup this "template") this}}
+            {{/each}}
+        </section>
+
         <section class="cooldowns">
             <h3>Abklingzeiten</h3>
             {{#each this.cooldowns}}

src/templates/actor/character/tab-spells.hbs

@@ -33,7 +33,7 @@
                 <td class="spell rollable">
                     {{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
                 </td>
-                <td class="clickable" data-id="{{this.id}}" data-action="openActorSheet">
+                <td class="clickable" data-item-id="{{this.id}}" data-action="openSpellDialog">
                     <span>{{this.name}}</span></td>
                 <td>{{this.eigenschaft1}}</td>
                 <td>{{this.eigenschaft2}}</td>
@@ -43,6 +43,15 @@
                     <ul class="merkmal-list">{{#each this.merkmal}}
                         <li>{{this}}</li>{{/each}}</ul>
                 </td>
+                <td>
+                    <div data-action="toggleFav" data-item-id="{{this.id}}">
+                        {{#if this.fav}}
+                            <i class="fa-solid fa-star"></i>
+                        {{else}}
+                            <i class="fa-regular fa-star"></i>
+                        {{/if}}
+                    </div>
+                </td>
             </tr>
         {{/each}}
         </tbody>

src/templates/item/spell/tab-commonality.hbs

@@ -1,7 +1,7 @@
 <section class="tab {{tabs.commonality.id}} {{tabs.commonality.cssClass}}"
          data-tab="{{tabs.commonality.id}}"
          data-group="{{tabs.commonality.group}}">
-
+    <div>
     <div>
         <label>Komplexität
             <input type="text" name="system.komplexität" value="{{system.komplexität}}"/>
@@ -17,5 +17,5 @@
             <input type="text" name="system.info" value="{{system.info}}"/>
         </label>
     </div>
-
+    </div>
 </section>

src/templates/item/spell/tab-meta.hbs

@@ -1,11 +1,11 @@
 <section class="tab {{tabs.meta.id}} {{tabs.meta.cssClass}}"
          data-tab="{{tabs.meta.id}}"
          data-group="{{tabs.meta.group}}">
-
+    <div>
     <div>
         <label>Name
-            <input type="text" name="system.name.value"
+            <input type="text" name="name"
-                   value="{{system.attributeReference1.value}}"/>
+                   value="{{name}}"/>
         </label>
     </div>
     <div>
@@ -14,7 +14,7 @@
                    value="{{system.probe.[0]}}"/>
             <input type="text" name="system.probe.1"
                    value="{{system.probe.[1]}}"/>
-            <input type="text" name="system.probe[2].value"
+            <input type="text" name="system.probe.2"
                    value="{{system.probe.[2]}}"/>
         </label>
     </div>
@@ -44,5 +44,5 @@
         </label>
     </div>
 
-
+    </div>
 </section>

src/templates/item/spell/tab-variants.hbs

@@ -1,7 +1,7 @@
 <section class="tab {{tabs.variants.id}} {{tabs.variants.cssClass}}"
          data-tab="{{tabs.variants.id}}"
          data-group="{{tabs.variants.group}}">
-
+    <div>
     <div>
         <label>Modifikationen
             <input type="text" name="system.modifikationen" value="{{system.modifikationen}}"/>
@@ -22,5 +22,5 @@
             <input type="text" name="system.antimagie" value="{{system.antimagie}}"/>
         </label>
     </div>
-
+    </div>
 </section>

src/templates/ui/partial-mini-rollable-button.hbs

@@ -0,0 +1,3 @@
+<div class="mini-skill" data-action="rollSkill" data-id="{{this.id}}">
+    {{this.name}}
+</div>

src/templates/ui/partial-mini-rollable-language-button.hbs

@@ -0,0 +1,3 @@
+<div class="mini-language-skill" data-action="rollSkill" data-id="{{this.id}}">
+    {{this.name}}
+</div>

src/templates/ui/partial-mini-rollable-liturgy-button.hbs

@@ -0,0 +1,3 @@
+<div class="mini-liturgy">
+    {{this.name}}
+</div>

src/templates/ui/partial-mini-rollable-spell-button.hbs

@@ -0,0 +1,3 @@
+<div class="mini-spell" data-action="openSpellDialog" data-item-id="{{this.id}}">
+    {{this.name}}
+</div>

src/templates/ui/partial-mini-rollable-weaponskill-button.hbs

@@ -0,0 +1,7 @@
+<div class="mini-weaponskill" data-action="rollCombatSkill" data-id="{{this._id}}"
+     data-tooltip="{{this.name}}<br/>{{#if this.system.at}}AT: {{this.system.at}} {{/if}}{{#if
+             this.system.pa}}PA: {{this.system.pa}}{{/if}}<hr/><i class='fa-solid fa-computer-mouse'></i>: Attacke<br/><kbd>Shift</kbd>+<i class='fa-solid fa-computer-mouse'></i>: Parrieren">
+    <div class="container">
+        <span class="name" data-id="{{this.id}}">{{this.name}}</span>
+    </div>
+</div>

src/templates/ui/partial-rollable-button.hbs

@@ -21,4 +21,11 @@
             {{/each}}
         </div>
     </div>
+    <div class="outside" data-action="toggleFav" data-item-id="{{this.id}}">
+        {{#if this.fav}}
+            <i class="fa-solid fa-star"></i>
+        {{else}}
+            <i class="fa-regular fa-star"></i>
+        {{/if}}
+    </div>
 </div>

src/templates/ui/partial-rollable-language-button.hbs

@@ -23,4 +23,11 @@
             {{/each}}
         </div>
     </div>
+    <div class="outside" data-action="toggleFav" data-item-id="{{this.id}}">
+        {{#if this.fav}}
+            <i class="fa-solid fa-star"></i>
+        {{else}}
+            <i class="fa-regular fa-star"></i>
+        {{/if}}
+    </div>
 </div>

src/templates/ui/partial-rollable-weaponskill-button.hbs

@@ -24,4 +24,11 @@
             {{/if}}
         </div>
     </div>
+    <div class="outside" data-action="toggleFav" data-item-id="{{this.id}}">
+        {{#if this.fav}}
+            <i class="fa-solid fa-star"></i>
+        {{else}}
+            <i class="fa-regular fa-star"></i>
+        {{/if}}
+    </div>
 </div>