dungeonslayers/ds4
dungeonslayers/ds4
3
0
Fork 0
Code Issues 9 Pull requests 7 Projects Releases 10 Packages 1 Activity

Merge branch '014_track_talents' into 'master'

Browse source 
Add Talents to Char Sheet

See merge request dungeonslayers/ds4!25
This commit is contained in:
Johannes Loher 2021-01-07 00:05:14 +01:00
commit a9fa91b04e
25 changed files with 270 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/ds4.scss
View file

@ -16,6 +16,7 @@
@import "scss/components/basic_property";
@import "scss/components/tabs";
@import "scss/components/items";
@import "scss/components/talents";
@import "scss/components/description";
@import "scss/components/character_values";
@import "scss/components/attributes_traits";

18
src/lang/en.json
View file

@ -1,12 +1,12 @@
{
"DS4.UserInteractionAddItem": "Add item",
"DS4.NotOwned": "No owner",
"DS4.Description": "Description",
"DS4.DescriptionAbbr": "Desc",
"DS4.Details": "Details",
"DS4.Effects": "Effects",
"DS4.Profile": "Profile",
"DS4.Items": "Items",
"DS4.HeadingDescription": "Description",
"DS4.HeadingDetails": "Details",
"DS4.HeadingEffects": "Effects",
"DS4.HeadingItems": "Items",
"DS4.HeadingProfile": "Profile",
"DS4.HeadingTalents": "Talents & Abilities",
"DS4.AttackType": "Attack Type",
"DS4.AttackTypeAbbr": "AT",
"DS4.WeaponBonus": "Weapon Bonus",
@ -35,6 +35,7 @@
"DS4.ItemTypeShield": "Shield",
"DS4.ItemTypeTrinket": "Trinket",
"DS4.ItemTypeEquipment": "Equipment",
"DS4.ItemTypeTalent": "Talent",
"DS4.ArmorType": "Armor Type",
"DS4.ArmorTypeAbbr": "AT",
"DS4.ArmorMaterialType": "Material Type",
@ -85,6 +86,11 @@
"DS4.ProgressionExperiencePoints": "Experience Points",
"DS4.ProgressionTalentPoints": "Talent Points",
"DS4.ProgressionProgressPoints": "Progress Points",
"DS4.TalentRank": "Rank",
"DS4.TalentRankBase": "Acquired Ranks",
"DS4.TalentRankMax": "Maximum Ranks",
"DS4.TalentRankMod": "Additional Ranks",
"DS4.TalentRankTotal": "Total Ranks",
"DS4.LanguageLanguages": "Languages",
"DS4.LanguageAlphabets": "Alphabets",
"DS4.ProfileGender": "Gender",

1
src/module/config.ts
View file

@ -48,6 +48,7 @@ export const DS4 = {
shield: "DS4.ItemTypeShield",
trinket: "DS4.ItemTypeTrinket",
equipment: "DS4.ItemTypeEquipment",
talent: "DS4.ItemTypeTalent",
},
/**

3
src/module/ds4.ts
View file

@ -37,6 +37,9 @@ async function registerHandlebarsPartials() {
"systems/ds4/templates/item/partials/effects.hbs",
"systems/ds4/templates/item/partials/body.hbs",
"systems/ds4/templates/actor/partials/items-overview.hbs",
"systems/ds4/templates/actor/partials/talents-overview.hbs",
"systems/ds4/templates/actor/partials/overview-add-button.hbs",
"systems/ds4/templates/actor/partials/overview-control-buttons.hbs",
"systems/ds4/templates/actor/partials/attributes-traits.hbs",
"systems/ds4/templates/actor/partials/combat-values.hbs",
"systems/ds4/templates/actor/partials/profile.hbs",

17
src/module/item/item-data.ts
View file

@ -1,5 +1,6 @@
// TODO: Actually add a type for data
export type DS4ItemDataType = DS4Weapon | DS4Armor | DS4Shield | DS4Trinket | DS4Equipment;
import { ModifiableData } from "../actor/actor-data";
export type DS4ItemDataType = DS4Weapon | DS4Armor | DS4Shield | DS4Trinket | DS4Equipment | DS4Talent;
// types
@ -14,6 +15,14 @@ interface DS4Armor extends DS4ItemBase, DS4ItemPhysical, DS4ItemEquipable, DS4It
armorType: "body" | "helmet" | "vambrace" | "greaves" | "vambraceGreaves";
}
export interface DS4Talent extends DS4ItemBase {
rank: DS4TalentRank;
}
interface DS4TalentRank extends ModifiableData<number> {
max: number;
}
interface DS4Shield extends DS4ItemBase, DS4ItemPhysical, DS4ItemEquipable, DS4ItemProtective {}
interface DS4Trinket extends DS4ItemBase, DS4ItemPhysical, DS4ItemEquipable {}
interface DS4Equipment extends DS4ItemBase, DS4ItemPhysical {}
@ -30,6 +39,10 @@ interface DS4ItemPhysical {
storageLocation: string;
}
export function isDS4ItemDataTypePhysical(input: DS4ItemDataType): boolean {
return "quantity" in input && "price" in input && "availability" in input && "storageLocation" in input;
}
interface DS4ItemEquipable {
equipped: boolean;
}

10
src/module/item/item-sheet.ts
View file

@ -1,5 +1,5 @@
import { DS4Item } from "./item";
import { DS4ItemDataType } from "./item-data";
import { DS4ItemDataType, isDS4ItemDataTypePhysical } from "./item-data";
/**
* Extend the basic ItemSheet with some very simple modifications
@ -26,7 +26,13 @@ export class DS4ItemSheet extends ItemSheet<DS4ItemDataType, DS4Item> {
/** @override */
getData(): ItemSheetData<DS4ItemDataType, DS4Item> {
const data = { ...super.getData(), config: CONFIG.DS4, isOwned: this.item.isOwned, actor: this.item.actor };
const data = {
...super.getData(),
config: CONFIG.DS4,
isOwned: this.item.isOwned,
actor: this.item.actor,
isPhysical: isDS4ItemDataTypePhysical(this.item.data.data),
};
console.log(data);
return data;
}

10
src/module/item/item.ts
View file

@ -1,6 +1,6 @@
import { DS4Actor } from "../actor/actor";
import { DS4ActorDataType } from "../actor/actor-data";
import { DS4ItemDataType } from "./item-data";
import { DS4ItemDataType, DS4Talent } from "./item-data";
/**
* Extend the basic Item with some very simple modifications.
@ -12,10 +12,18 @@ export class DS4Item extends Item<DS4ItemDataType, DS4ActorDataType, DS4Actor> {
*/
prepareData(): void {
super.prepareData();
this.prepareDerivedData();
// Get the Item's data
// const itemData = this.data;
// const actorData = this.actor ? this.actor.data : {};
// const data = itemData.data;
}
prepareDerivedData(): void {
if (this.type === "talent") {
const data = this.data.data as DS4Talent;
data.rank.total = data.rank.base + data.rank.mod;
}
}
}

10
src/scss/components/_basic_property.scss
View file

@ -2,18 +2,24 @@
flex: 0 0 100%;
gap: 2px;
.basic-property {
display: grid;
align-content: end;
padding-left: 1px;
padding-right: 1px;
.basic-property-label {
& > label {
font-weight: bold;
}
.basic-property-select {
& > select {
display: block;
width: 100%;
}
.input-divider {
text-align: center;
}
@include mark-invalid-or-disabled-input;
}
}

4
src/scss/components/_description.scss
View file

@ -9,7 +9,7 @@
.side-property {
margin: 2px 0;
display: grid;
grid-template-columns: 40% auto;
grid-template-columns: minmax(30%, auto) auto;
justify-content: left;
label {
@ -23,6 +23,8 @@
width: calc(100% - 2px);
}
@include mark-invalid-or-disabled-input;
input[type="checkbox"] {
width: auto;
height: 100%;

6
src/scss/components/_items.scss
View file

@ -31,6 +31,7 @@
input {
border: 0;
padding: 0;
background-color: transparent;
}
input[type="checkbox"] {
@ -38,6 +39,8 @@
height: 100%;
margin: 0px;
}
@include mark-invalid-or-disabled-input;
}
.item-name {
@ -54,9 +57,6 @@
width: 2.5em;
padding: 0;
}
.item-num-val:invalid {
background-color: color.mix(lightcoral, $c-light-grey, 25%);
}
.item-description {
font-size: 75%;

3
src/scss/components/_talents.scss Normal file
View file

@ -0,0 +1,3 @@
.talent-ranks-equation {
text-align: center;
}

1
src/scss/utils/_colors.scss
View file

@ -2,3 +2,4 @@ $c-white: #fff;
$c-black: #000;
$c-light-grey: #777;
$c-border-groove: #eeede0;
$c-invalid-input: rgba(lightcoral, 50%);

9
src/scss/utils/_mixins.scss
View file

@ -19,3 +19,12 @@
display: grid;
place-items: center;
}
@mixin mark-invalid-or-disabled-input {
input:invalid {
background-color: $c-invalid-input;
}
input:disabled {
background-color: transparent;
}
}

10
src/template.json
View file

@ -116,7 +116,7 @@
}
},
"Item": {
"types": ["weapon", "armor", "shield", "trinket", "equipment"],
"types": ["weapon", "armor", "shield", "trinket", "equipment", "talent"],
"templates": {
"base": {
"description": ""
@ -153,6 +153,14 @@
},
"equipment": {
"templates": ["base", "physical"]
},
"talent": {
"templates": ["base"],
"rank": {
"base": 0,
"max": 0,
"mod": 0
}
}
}
}

10
src/templates/actor/actor-sheet.hbs
View file

@ -58,9 +58,10 @@
{{!-- Sheet Tab Navigation --}}
<nav class="sheet-tabs tabs" data-group="primary">
<a class="item" data-tab="description">{{localize "DS4.Description"}}</a>
<a class="item" data-tab="profile">{{localize "DS4.Profile"}}</a>
<a class="item" data-tab="items">{{localize "DS4.Items"}}</a>
<a class="item" data-tab="description">{{localize 'DS4.HeadingDescription'}}</a>
<a class="item" data-tab="talents">{{localize 'DS4.HeadingTalents'}}</a>
<a class="item" data-tab="profile">{{localize "DS4.HeadingProfile"}}</a>
<a class="item" data-tab="items">{{localize 'DS4.HeadingItems'}}</a>
</nav>
{{!-- Sheet Body --}}
@ -73,6 +74,9 @@
{{! Profile Tab --}}
{{> systems/ds4/templates/actor/partials/profile.hbs}}
{{!-- Talents Tab --}}
{{> systems/ds4/templates/actor/partials/talents-overview.hbs}}
{{!-- Items Tab --}}
{{> systems/ds4/templates/actor/partials/items-overview.hbs}}
</section>

29
src/templates/actor/partials/items-overview.hbs
View file

@ -5,29 +5,6 @@
{{!-- INLINE PARTIAL DEFINITIONS --}}
{{!-- ======================================================================== --}}
{{!--
!-- Render an "add" button for a given data type.
!--
!-- @param datType: hand over the dataType to the partial as hash parameter
--}}
{{#*inline "addItemButton"}}
<div class="item-controls">
<a class="item-control item-create" title="Create item" data-type="{{dataType}}">
<i class="fas fa-plus"></i>
{{localize 'DS4.UserInteractionAddItem'}}</a>
</div>
{{/inline}}
{{!--
!-- Render a group of an "edit" and a "delete" button for the current item.
!-- The current item is defined by the data-item-id HTML property of the parent li element.
--}}
{{#*inline "itemControlButtons"}}
<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>
{{/inline}}
{{!--
!-- Render a header row for a given data type.
@ -55,9 +32,9 @@
{{!-- item type specifics --}}
{{> @partial-block }}
{{!-- description --}}
<div class="flex4">{{localize 'DS4.Description'}}</div>
<div class="flex4">{{localize 'DS4.HeadingDescription'}}</div>
{{!-- add button --}}
{{> addItemButton dataType=dataType }}
{{> systems/ds4/templates/actor/partials/overview-add-button.hbs dataType=dataType }}
</li>
{{/inline}}
@ -94,7 +71,7 @@
{{!-- description --}}
<div class="flex4 item-description">{{{item.data.data.description}}}</div>
{{!-- control buttons --}}
{{> itemControlButtons}}
{{> systems/ds4/templates/actor/partials/overview-control-buttons.hbs }}
</li>
{{/inline}}

11
src/templates/actor/partials/overview-add-button.hbs Normal file
View file

@ -0,0 +1,11 @@
{{!
!-- Render an "add" button for adding an item of given data type.
!--
!-- @param datType: hand over the dataType to the partial as hash parameter
}}
<div class="item-controls">
<a class="item-control item-create" title="Create item" data-type="{{dataType}}">
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}
</a>
</div>

8
src/templates/actor/partials/overview-control-buttons.hbs Normal file
View file

@ -0,0 +1,8 @@
{{!--
!-- Render a group of an "edit" and a "delete" button for the current item.
!-- The current item is defined by the data-item-id HTML property of the parent li element.
--}}
<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>

83
src/templates/actor/partials/talents-overview.hbs Normal file
View file

@ -0,0 +1,83 @@
{{!-- ======================================================================== --}}
{{!-- INLINE PARTIAL DEFINITIONS --}}
{{!-- ======================================================================== --}}
{{!-- TODO: remove duplicate add and delete button definition --}}
{{!--
!-- Render an input element for a rank value property of an item.
!--
!-- @param item: the item
!-- @param property: the key of the property in item.data.data (if 'base', the max value is set automatically)
!-- @param disabled: if given, is placed plainly into the input as HTML property;
!-- meant to be set to "disabled" to disable the input element
--}}
{{#*inline "talentRankValue"}}
<input class="item-num-val item-change" data-dtype="Number" type="number" min="0" step="1"
{{#if (eq property 'base') }}max="{{item.data.data.rank.max}}"{{/if}}
{{disabled}}
data-property="data.rank.{{property}}" value="{{lookup item.data.data.rank property}}"
title="{{localize localizeString}}" />
{{/inline}}
{{!--
!-- Render a talent list row from a given item.
!-- It is a flexbox with a child for each item value of interest.
!-- The partial assumes a variable item to be given in the context.
!--
!-- @param item: hand over the item to the partial as hash parameter
!-- @param partial-block: hand over custom children of the flexbox in the partial block.
--}}
{{#*inline "talentListEntry"}}
<li class="item flexrow" data-item-id="{{item._id}}">
{{!-- image --}}
<div class="flex05 item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- name --}}
<input class="flex2 item-name item-change" type="text" value="{{item.name}}" data-dtype="String"
data-property="name" title="{{localize 'DS4.ItemName'}}">
<div class="flex3 flexrow talent-ranks-equation">
{{!-- acquired rank --}}
{{> talentRankValue item=item property='base' localizeString='DS4.TalentRankBase'}}
<span> ( of </span>
{{!-- maximum acquirable rank --}}
{{> talentRankValue item=item property='max' localizeString='DS4.TalentRankMax'}}
<span>) + </span>
{{!-- additional ranks --}}
{{> talentRankValue item=item property='mod' localizeString='DS4.TalentRankMod'}}
<span> = </span>
{{!-- derived total rank --}}
{{> talentRankValue item=item property='total' localizeString='DS4.TalentRankTotal' disabled='disabled'}}
</div>
{{!-- description --}}
<div class="flex4 item-description">{{{item.data.data.description}}}</div>
{{!-- control buttons --}}
{{> systems/ds4/templates/actor/partials/overview-control-buttons.hbs }}
</li>
{{/inline}}
{{!-- ======================================================================== --}}
<div class="tab items" data-group="primary" data-tab="talents">
<ol class="items-list">
<li class="item flexrow item-header">
{{!-- image --}}
<div class="flex05 item-image"></div>
{{!-- name --}}
<div class="flex2 item-name">{{localize 'DS4.ItemName'}}</div>
{{!-- rank info --}}
<div class="flex3">{{localize 'DS4.TalentRank'}}</div>
{{!-- description --}}
<div class="flex4">{{localize 'DS4.HeadingDescription'}}</div>
{{!-- add button --}}
{{> systems/ds4/templates/actor/partials/overview-add-button.hbs dataType='talent' }}
</li>
{{#each itemsByType.talent as |item id|}}
{{> talentListEntry item=item}}
{{/each}}
</ol>
</div>

12
src/templates/item/armor-sheet.hbs
View file

@ -6,8 +6,8 @@
<h2 class="item-type">{{localize (lookup config.itemTypes item.type)}}</h2>
<div class="grid grid-3col basic-properties">
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.ArmorType"}}</label>
<select class="basic-property-select" name="data.armorType" data-type="String">
<label>{{localize "DS4.ArmorType"}}</label>
<select name="data.armorType" data-type="String">
{{#select data.armorType}}
{{#each config.armorTypes as |value key|}}
<option value="{{key}}">{{value}}</option>
@ -16,8 +16,8 @@
</select>
</div>
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.ArmorMaterialType"}}</label>
<select class="basic-property-select" name="data.armorMaterialType" data-type="String">
<label>{{localize "DS4.ArmorMaterialType"}}</label>
<select name="data.armorMaterialType" data-type="String">
{{#select data.armorMaterialType}}
{{#each config.armorMaterialTypes as |value key|}}
<option value="{{key}}">{{value}}</option>
@ -26,8 +26,8 @@
</select>
</div>
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.ArmorValue"}}</label>
<input class="basic-property-input" type="text" name="data.armorValue" value="{{data.armorValue}}"
<label>{{localize "DS4.ArmorValue"}}</label>
<input type="text" name="data.armorValue" value="{{data.armorValue}}"
placeholder="0" data-dtype="Number" />
</div>
</div>

16
src/templates/item/partials/body.hbs
View file

@ -2,9 +2,11 @@
{{!-- Sheet Tab Navigation --}}
<nav class="sheet-tabs tabs" data-group="primary">
<a class="item" data-tab="description">{{localize "DS4.Description"}}</a>
<a class="item" data-tab="effects">{{localize "DS4.Effects"}}</a>
<a class="item" data-tab="details">{{localize "DS4.Details"}}</a>
<a class="item" data-tab="description">{{localize "DS4.HeadingDescription"}}</a>
<a class="item" data-tab="effects">{{localize "DS4.HeadingEffects"}}</a>
{{#if isPhysical}}
<a class="item" data-tab="details">{{localize "DS4.HeadingDetails"}}</a>
{{/if}}
</nav>
{{!-- Sheet Body --}}
@ -13,10 +15,12 @@
{{!-- Description Tab --}}
{{> systems/ds4/templates/item/partials/description.hbs}}
{{!-- Details Tab --}}
{{> systems/ds4/templates/item/partials/details.hbs}}
{{!-- Effects Tab --}}
{{> systems/ds4/templates/item/partials/effects.hbs}}
{{#if isPhysical}}
{{!-- Details Tab --}}
{{> systems/ds4/templates/item/partials/details.hbs}}
{{/if}}
</section>

6
src/templates/item/partials/description.hbs
View file

@ -11,6 +11,7 @@
<a class="entity-link" draggable="true" data-entity="Actor" data-id="{{actor._id}}"><i
class="fas fa-user"></i>{{actor.name}}</a>
</div>
{{#if isPhysical}}
<div class="side-property">
<label for="data.quantity">{{localize 'DS4.Quantity'}}</label>
<input type="number" min="0" step="1" data-dtype="Number" name="data.quantity" value="{{data.quantity}}" />
@ -19,11 +20,12 @@
<label for="data.storageLocation">{{localize 'DS4.StorageLocation'}}</label>
<input type="text" data-dtype="String" name="data.storageLocation" value="{{data.storageLocation}}" />
</div>
{{/if}}
{{else}}
{{localize "DS4.NotOwned"}}
<span>{{localize "DS4.NotOwned"}}</span>
{{/if}}
</div>
<div class="description">
<div class="description" title="{{localize 'DS4.HeadingDescription'}}">
{{editor content=data.description target="data.description" button=true owner=owner editable=editable}}
</div>
</div>

4
src/templates/item/shield-sheet.hbs
View file

@ -6,8 +6,8 @@
<h2 class="item-type">{{localize (lookup config.itemTypes item.type)}}</h2>
<div class="grid grid-1col basic-properties">
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.ArmorValue"}}</label>
<input class="basic-property-input" type="text" name="data.armorValue" value="{{data.armorValue}}"
<label>{{localize "DS4.ArmorValue"}}</label>
<input type="text" name="data.armorValue" value="{{data.armorValue}}"
placeholder="0" data-dtype="Number" />
</div>
</div>

37
src/templates/item/talent-sheet.hbs Normal file
View file

@ -0,0 +1,37 @@
{{!-- ======================================================================== --}}
{{!-- INLINE PARTIAL DEFINITIONS --}}
{{!-- ======================================================================== --}}
{{#*inline "talentRankBasicProperty" }}
<div class="basic-property">
<label for="data.rank.{{property}}">{{localize localizeString}}</label>
<input type="number" min="0" step="1" data-dtype="Number" {{disabled}}
{{#if (eq property 'base') }}max="{{data.rank.max}}"{{/if}}
name="data.rank.{{property}}" value="{{lookup data.rank property}}" />
</div>
{{/inline}}
{{!-- ======================================================================== --}}
<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 flexrow">
<h1 class="charname"><input name="name" type="text" value="{{item.name}}" placeholder="Name" /></h1>
<h2 class="item-type">{{localize (lookup config.itemTypes item.type)}}</h2>
<div class="grid grid-4col basic-properties">
{{> talentRankBasicProperty data=data property='base' localizeString='DS4.TalentRankBase' }}
{{> talentRankBasicProperty data=data property='max' localizeString='DS4.TalentRankMax'}}
{{> talentRankBasicProperty data=data property='mod' localizeString='DS4.TalentRankMod'}}
{{> talentRankBasicProperty data=data property='total' localizeString='DS4.TalentRankTotal' disabled='disabled'}}
</div>
</div>
</header>
{{!-- Common Item body --}}
{{> systems/ds4/templates/item/partials/body.hbs}}
</form>

12
src/templates/item/weapon-sheet.hbs
View file

@ -6,8 +6,8 @@
<h2 class="item-type">{{localize (lookup config.itemTypes item.type)}}</h2>
<div class="grid grid-3col basic-properties">
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.AttackType"}}</label>
<select class="basic-property-select" name="data.attackType" data-type="String">
<label>{{localize "DS4.AttackType"}}</label>
<select name="data.attackType" data-type="String">
{{#select data.attackType}}
{{#each config.attackTypes as |value key|}}
<option value="{{key}}">{{value}}</option>
@ -16,13 +16,13 @@
</select>
</div>
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.WeaponBonus"}}</label>
<input class="basic-property-input" type="number" name="data.weaponBonus" value="{{data.weaponBonus}}"
<label>{{localize "DS4.WeaponBonus"}}</label>
<input type="number" name="data.weaponBonus" value="{{data.weaponBonus}}"
placeholder="0" data-dtype="Number" />
</div>
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.OpponentDefense"}}</label>
<input class="basic-property-input" type="number" name="data.opponentDefense"
<label>{{localize "DS4.OpponentDefense"}}</label>
<input type="number" name="data.opponentDefense"
value="{{data.opponentDefense}}" placeholder="0" data-dtype="Number" />
</div>
</div>