ENH: Spells

src/lang/en.json

@@ -109,7 +109,11 @@
     "OSE.items.Melee": "Melee",
     "OSE.items.Missile": "Missile",
     "OSE.items.Slow": "Slow",
+    
+    "OSE.spells.Memorized": "Memorized",
+    "OSE.spells.Cast": "Cast",
     "OSE.spells.Range": "Range",
+    "OSE.spells.Slots": "Slots",
     "OSE.spells.Class": "Class",
     "OSE.spells.Duration": "Duration",
     "OSE.spells.Level": "Level",

src/module/actor/actor-sheet.js

@@ -39,11 +39,18 @@ export class OseActorSheet extends ActorSheet {
       [[], [], [], [], []]
     );
 
+    // Sort spells by level
+    var sortedSpells = {};
+    for (var i = 0; i < spells.length; i++) {
+      let lvl = spells[i].data.lvl
+      if (!sortedSpells[lvl]) sortedSpells[lvl] = [];
+      sortedSpells[lvl].push(spells[i]);
+    }
     // Assign and return
     data.inventory = inventory;
     data.weapons = weapons;
     data.armors = armors;
-    data.spells = spells;
+    data.spells = sortedSpells;
     data.abilities = abilities;
   }
 
@@ -55,6 +62,29 @@ export class OseActorSheet extends ActorSheet {
       actorObject.rollSave(save, { event: event });
     });
 
+    //Toggle Spells
+    html.find(".item-cast").click(async (ev) => {
+      const li = $(ev.currentTarget).parents(".item");
+      const item = this.actor.getOwnedItem(li.data("itemId"));
+      await this.actor.updateOwnedItem({
+        _id: li.data("itemId"),
+        data: {
+          cast: !item.data.data.cast,
+        },
+      });
+    });
+    //Toggle Equipment
+    html.find(".item-memorize").click(async (ev) => {
+      const li = $(ev.currentTarget).parents(".item");
+      const item = this.actor.getOwnedItem(li.data("itemId"));
+      await this.actor.updateOwnedItem({
+        _id: li.data("itemId"),
+        data: {
+          memorized: !item.data.data.memorized,
+        },
+      });
+    });
+
     super.activateListeners(html);
   }
 

src/scss/actor-base.scss

@@ -10,9 +10,6 @@
 
   .panel {
     border: 1px solid $colorDark;
-    &.spells {
-      border: 0;
-    }
     .panel-title {
       color: whitesmoke;
       background: $colorDark;

src/scss/character.scss

@@ -21,10 +21,8 @@
     .inventory {
       overflow: auto;
       height: 520px;
-      .items-section {
+      .header-spells {
-        .header-field {
+        line-height: 30px;
-          margin: 0;
-        }
       }
       .item-titles {
         text-align: center;
@@ -38,13 +36,22 @@
         font-size: 12px;
         background: $colorDark;
         color: white;
+        input {
+          color: white;
+          margin: auto;
+        }
       }
       .item-list {
         list-style: none;
         margin: 0;
         padding: 0;
-        li {
+        &>* {
-          padding: 0 2px;
+          line-height: 30px;
+        }
+        .item-summary {
+          font-size: 13px;
+          padding: 0 4px;
+          line-height: 20px;
         }
         .item-header {
           @extend %header-field !optional;
@@ -55,12 +62,6 @@
           &:nth-child(even) {
             background: rgba(0, 0, 0, 0.1);
           }
-          &:hover {
-            .item-image {
-              background-image: url("/icons/svg/d20-grey.svg") !important;
-              cursor: pointer;
-            }
-          }
         }
         .item {
           line-height: 30px;
@@ -78,11 +79,18 @@
           height: 30px;
           margin: 0;
           line-height: 30px;
+          &:hover .item-image {
+            background-image: url("/icons/svg/d20-grey.svg") !important;
+            cursor: pointer;
+          }
           .item-image {
             flex-basis: 30px;
             flex-grow: 0;
             background-size: contain;
             background-repeat: no-repeat;
+            &:hover {
+              background-image: url("/icons/svg/d20-black.svg") !important;
+            }
           }
           h4 {
             margin: 0;
@@ -125,6 +133,11 @@
           color: rgba(0, 0, 0, 0.2);
         }
       }
+      &.spells {
+        .item-controls {
+          flex-basis: 30px;
+        }
+      }
     }
   }
 

src/template.json

@@ -42,27 +42,27 @@
         "spells": {
           "enabled": false,
           "dc": 0,
-          "lvl1": {
+          "1": {
             "value": 0,
             "max": 0
           },
-          "lvl2": {
+          "2": {
             "value": 0,
             "max": 0
           },
-          "lvl3": {
+          "3": {
             "value": 0,
             "max": 0
           },
-          "lvl4": {
+          "4": {
             "value": 0,
             "max": 0
           },
-          "lvl5": {
+          "5": {
             "value": 0,
             "max": 0
           },
-          "lvl6": {
+          "6": {
             "value": 0,
             "max": 0
           }
@@ -170,7 +170,9 @@
       "duration": "",
       "range": "",
       "roll": "",
-      "description": ""
+      "description": "",
+      "memorized": false,
+      "cast": false
     },
     "ability": {
       "requirements": "",

src/templates/actors/partials/character-inventory-tab.html

@@ -8,7 +8,7 @@
       <div class="field-longer">{{localize "OSE.items.Qualities"}}</div>
       <div class="field-short">{{localize "OSE.items.Weight"}}</div>
       <div class="item-controls">
-        <a class="item-control item-create" data-type="weapon"><i class="fa fa-plus"></i> {{localize "OSE.Add"}}</a>
+        <a class="item-control item-create" data-type="weapon" title="{{localize 'OSE.Add'}}"><i class="fa fa-plus"></i></a>
       </div>
     </li>
     <ol class="item-list">
@@ -59,7 +59,7 @@
       {{/if}}
       <div class="field-short">{{localize "OSE.items.Weight"}}</div>
       <div class="item-controls">
-        <a class="item-control item-create" data-type="armor"><i class="fa fa-plus"></i> {{localize "OSE.Add"}}</a>
+        <a class="item-control item-create" data-type="armor" title="{{localize 'OSE.Add'}}"><i class="fa fa-plus"></i></a>
       </div>
     </li>
     <ol class="item-list">
@@ -105,7 +105,7 @@
       <div class="field-short">{{localize "OSE.items.Quantity"}}</div>
       <div class="field-short">{{localize "OSE.items.Weight"}}</div>
       <div class="item-controls">
-        <a class="item-control item-create" data-type="item"><i class="fa fa-plus"></i> {{localize "OSE.Add"}}</a>
+        <a class="item-control item-create" data-type="item" title="{{localize 'OSE.Add'}}"><i class="fa fa-plus"></i></a>
       </div>
     </li>
     <ol class="item-list">

src/templates/actors/partials/character-spells-tab.html

@@ -1,41 +1,50 @@
-<section class="flexrow">
+<section class="inventory spells resizable" data-base-size="320">
-  <ul class="attributes flexrow">
+  <div>
-    <li class="attribute">
+    <li class="flexrow header-spells">
-      <h4 class="attribute-name box-title">{{localize 'OSE.SpellDCShort'}}</h4>
+      <div class="item-name"></div>
-      <div class="attribute-value">
+      <div class="field-short">{{localize 'OSE.SpellDC'}}</div>
-        <input name="data.spells.dc" type="text" value="{{data.spells.dc}}" data-dtype="Number" placeholder="0" />
+      <div class="field-short"><input type="text" value="{{data.spells.dc}}" name="data.spells.dc" data-dtype="Number"
+          placeholder="0"></div>
+    </li>
+  </div>
+  {{#each spells as |spellGroup id|}}
+  <ol class="item-list">
+    <li class="item-titles flexrow">
+      <div class="item-name">{{localize "OSE.spells.Level"}} {{id}}</div>
+      <div class="field-short">{{localize 'OSE.spells.Slots'}}</div>
+      <div class="field-long flexrow"><input type="text" value="{{lookup (lookup ../actor.data.spells @key) 'value'}}" name="data.spells.{{id}}.value" data-dtype="Number"
+          placeholder="0">/<input type="text" value="{{lookup (lookup ../actor.data.spells @key) 'max'}}" name="data.spells.{{id}}.max" data-dtype="Number"
+          placeholder="0"></div>
+      <div class="item-controls">
+        <a class="item-control item-create" data-type="spell" data-lvl="{{id}}" title="{{localize 'OSE.Add'}}"><i
+            class="fa fa-plus"></i></a>
       </div>
     </li>
-  </ul>
+    {{#each spellGroup as |item|}}
-</section>
-<section class="panel inventory spells">
-  <div class="panel-title">
-    <h4>{{localize 'OSE.category.spells'}}</h4>
-    <div class="item-controls">
-      {{#if owner}}
-      <a class="item-control item-create" title='{{localize "OSE.Add"}}' data-type="spell"><i
-          class="fas fa-plus"></i></a>
-      {{/if}}
-    </div>
-  </div>
-  <div class="panel-content resizable" data-base-size="230">
-    {{#each spells as |item|}}
     <li class="item-entry">
       <div class="item flexrow" data-item-id="{{item._id}}">
+        <div class="item-controls">
+          <a class="item-control item-cast {{#unless item.data.cast}}item-unequipped{{/unless}}" title="{{localize 'OSE.spells.Cast'}}"><i class="{{#if item.data.cast}}fas{{else}}far{{/if}} fa-sun"></i></a>
+          <a class="item-control item-memorize {{#unless item.data.memorized}}item-unequipped{{/unless}}" title="{{localize 'OSE.spells.Memorized'}}"><i
+              class="fas fa-book-open"></i></a>
+        </div>
         <div class="item-name flexrow">
           <div class="item-image" style="background-image: url({{item.img}})"></div>
-          <h4 title="{{item.name}}">
+          <a>
-            {{item.name~}}
+            <h4 title="{{item.name}}">
-          </h4>
+              {{item.name~}}
+            </h4>
+          </a>
         </div>
         <div class="item-controls">
-          {{#if ../owner}}
+          {{#if ../../owner}}
-          <a class="item-control item-edit" title='{{localize "Ose.Edit"}}'><i class="fas fa-edit"></i></a>
+          <a class="item-control item-edit" title='{{localize "OSE.Edit"}}'><i class="fas fa-edit"></i></a>
-          <a class="item-control item-delete" title='{{localize "Ose.Delete"}}'><i class="fas fa-trash"></i></a>
+          <a class="item-control item-delete" title='{{localize "OSE.Delete"}}'><i class="fas fa-trash"></i></a>
           {{/if}}
         </div>
       </div>
     </li>
     {{/each}}
-  </div>
+  </ol>
+  {{/each}}
 </section>

src/templates/items/spell-sheet.html

@@ -13,7 +13,7 @@
         <div class="form-group">
           <label>{{localize 'OSE.spells.Level'}}</label>
           <div class="form-fields">
-            <input type="text" name="data.level" value="{{data.level}}" data-dtype="Number" />
+            <input type="text" name="data.lvl" value="{{data.lvl}}" data-dtype="Number" />
           </div>
         </div>
         <div class="form-group block-input">