Merge branch '004_equipment_tracking' into 'master'

Item list in char sheet

See merge request dungeonslayers/ds4!6
This commit is contained in:
Johannes Loher 2020-12-29 23:08:33 +01:00
commit 33dba4c0d5
10 changed files with 341 additions and 31 deletions

View file

@ -1,5 +1,7 @@
{
"DS4.UserInteractionAddItem": "Add item",
"DS4.Description": "Description",
"DS4.DescriptionAbbr": "Desc",
"DS4.Details": "Details",
"DS4.Effects": "Effects",
"DS4.AttackType": "Attack Type",
@ -14,6 +16,7 @@
"DS4.Quantity": "Quantity",
"DS4.PriceGold": "Price (Gold)",
"DS4.StorageLocation": "Stored at",
"DS4.ItemEquipped": "Item equipped?",
"DS4.ItemAvailability": "Availability",
"DS4.ItemAvailabilityHamlet": "Hamlet",
"DS4.ItemAvailabilityVilage": "Village",
@ -22,14 +25,18 @@
"DS4.ItemAvailabilityDwarves": "Dwarves",
"DS4.ItemAvailabilityUnset": "Unset",
"DS4.ItemAvailabilityNowhere": "Nowhere",
"DS4.ItemName": "Name",
"DS4.ItemTypeWeapon": "Weapon",
"DS4.ItemTypeArmor": "Armor",
"DS4.ItemTypeShield": "Shield",
"DS4.ItemTypeTrinket": "Trinket",
"DS4.ItemTypeEquipment": "Equipment",
"DS4.ArmorType": "Armor Type",
"DS4.ArmorTypeAbbr": "AT",
"DS4.ArmorMaterialType": "Material Type",
"DS4.ArmorMaterialTypeAbbr": "Mat.",
"DS4.ArmorValue": "Armor Value",
"DS4.ArmorValueAbbr": "AV",
"DS4.ArmorTypeBody": "Body",
"DS4.ArmorTypeHelmet": "Helmet",
"DS4.ArmorTypeVambrace": "Vambrace",

View file

@ -7,11 +7,29 @@ import { DS4ActorDataType } from "./actor-data";
* @extends {ActorSheet}
*/
export class DS4ActorSheet extends ActorSheet<DS4ActorDataType, DS4Actor, DS4ItemDataType> {
/**
* This method returns the data for the template of the actor sheet.
* It explicitly adds the items of the object sorted by type in the
* object itemsByType.
* @returns the data fed to the template of the actor sheet
*/
getData(): ActorSheetData<DS4ActorDataType, DS4Actor> {
const data = {
...super.getData(),
// Add the localization config to the data:
config: CONFIG.DS4,
// Add the items explicitly sorted by type to the data:
itemsByType: this.actor.itemTypes,
};
console.log("Data:", data);
return data;
}
/** @override */
static get defaultOptions(): FormApplicationOptions {
return mergeObject(super.defaultOptions, {
classes: ["ds4", "sheet", "actor"],
template: "systems/ds4/templates/actor/actor-sheet.html",
template: "systems/ds4/templates/actor/actor-sheet.hbs",
width: 600,
height: 600,
tabs: [{ navSelector: ".sheet-tabs", contentSelector: ".sheet-body", initial: "description" }],

View file

@ -36,6 +36,7 @@ async function registerHandlebarsPartials() {
"systems/ds4/templates/item/partials/details.hbs",
"systems/ds4/templates/item/partials/effects.hbs",
"systems/ds4/templates/item/partials/body.hbs",
"systems/ds4/templates/actor/partials/items.hbs",
];
return loadTemplates(templatePaths);
}

View file

@ -26,8 +26,8 @@ export class DS4ItemSheet extends ItemSheet<DS4ItemDataType, DS4Item> {
/** @override */
getData(): ItemSheetData<DS4ItemDataType, DS4Item> {
console.log(this);
const data = { ...super.getData(), config: CONFIG.DS4 };
console.log(data);
return data;
}

View file

@ -7,9 +7,15 @@
overflow: hidden;
}
.sheet-body {
overflow-y: auto;
}
.tab {
height: 100%;
overflow-y: auto;
overflow-y: visible;
align-content: flex-start;
ol {
overflow-y: visible;
}
}
}

View file

@ -32,4 +32,32 @@
flex: 0 0 86px;
text-align: right;
}
.item-num-val {
text-align: center;
}
.item-description {
font-size: 75%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
p {
text-overflow: ellipsis;
overflow: hidden;
}
p:first-child {
margin-top: 0px;
padding-top: 0px;
}
}
}
.items-list-title {
margin-top: 2em;
margin-bottom: 0px;
padding-left: 1em;
border-bottom: 2px groove $c-border-groove;
font-weight: bold;
}

View file

@ -12,9 +12,15 @@
flex: 1;
}
.flex05 {
flex: 0.5;
}
.flex1 {
flex: 1;
}
.flex15 {
flex: 1.5;
}
.flex2 {
flex: 2;
}
@ -35,9 +41,15 @@
flex: 1;
}
.flex05 {
flex: 0.5;
}
.flex1 {
flex: 1;
}
.flex15 {
flex: 1.5;
}
.flex2 {
flex: 2;
}

View file

@ -60,31 +60,7 @@
{{editor content=data.biography target="data.biography" button=true owner=owner editable=editable}}
</div>
{{!-- Owned Items Tab --}}
<div class="tab items" data-group="primary" data-tab="items">
<ol class="items-list">
<li class="item flexrow item-header">
<div class="item-image"></div>
<div class="item-name">Name</div>
<div class="item-controls">
<a class="item-control item-create" title="Create item" data-type="weapon"
><i class="fas fa-plus"></i> Add item</a
>
</div>
</li>
{{#each actor.items as |item id|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
<h4 class="item-name">{{item.name}}</h4>
<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}}
</ol>
</div>
{{!-- Items Tab --}}
{{> systems/ds4/templates/actor/partials/items.hbs}}
</section>
</form>

View file

@ -0,0 +1,262 @@
{{!-- TODO: Where possible use icons with complete names as hovers instead of long names --}}
{{!-- Tab with overview and quick-actions on owned items --}}
<div class="tab items" data-group="primary" data-tab="items">
{{!-- WEAPONS --}}
<h4 class="items-list-title">{{localize "DS4.ItemTypeWeapon"}}</h4> {{!-- SPECIFIC --}}
<ol class="items-list">
<li class="item flexrow item-header">
<div class="flexrow flex15">
<div title="{{localize "DS4.ItemEquipped"}}">E</div> {{!-- equipped --}} {{!-- SPECIFIC --}}
<div class="item-image"></div>
<div class="item-num-val" title="{{localize "DS4.Quantity"}}">#</div> {{!-- amount --}}
</div>
<div class="item-name flex3">{{localize "DS4.ItemName"}}</div>
<div title="{{localize "DS4.AttackType"}}">{{localize "DS4.AttackTypeAbbr"}}</div> {{!-- SPECIFIC --}}
<div class="flexrow flex15">
<div class="item-num-val" title="{{localize "DS4.WeaponBonus"}}">{{localize "DS4.WeaponBonusAbbr"}}</div> {{!-- SPECIFIC --}}
<div class="item-num-val" title="{{localize "DS4.OpponentDefense"}}">{{localize "DS4.OpponentDefenseAbbr"}}</div> {{!-- SPECIFIC --}}
</div>
<div class="flex4">{{localize "DS4.Description"}}</div>
{{!-- add button --}}
<div class="item-controls"> {{!-- SPECIFIC --}}
<a class="item-control item-create" title="Create item" data-type="weapon"{{!-- SPECIFIC --}}>
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}</a>
</div>
</li>
{{#each itemsByType.weapon as |item id|}} {{!-- SPECIFIC --}}
{{#with item.data.data as |itemData|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="flexrow flex15">
{{!-- equipped? --}}
{{#if itemData.equipped}}<i class="fas fa-check-square"></i>
{{else}}<i class="far fa-square"></i>
{{/if}} {{!--SPECIFIC --}}
{{!-- image --}}
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- amount --}}
<div class="item-num-val">{{itemData.quantity}}</div>
</div>
{{!-- name --}}
<h4 class="item-name flex3">{{item.name}}</h4>
{{!-- item specifics --}}
<div>{{lookup ../../config.attackTypes itemData.attackType}}</div> {{!-- SPECIFIC --}}
<div class="flexrow flex15">
<div class="item-num-val">{{itemData.weaponBonus}}</div> {{!-- SPECIFIC --}}
<div class="item-num-val">{{itemData.opponentDefense}}</div> {{!-- SPECIFIC --}}
</div>
{{!-- description --}}
<div class="flex4 item-description">{{{itemData.description}}}</div>
{{!-- edit & delete buttons --}}
<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>
{{/with}}
{{/each}}
</ol>
{{!-- ARMOR --}}
<h4 class="items-list-title">{{localize "DS4.ItemTypeArmor"}}</h4> {{!-- SPECIFIC --}}
<ol class="items-list">
<li class="item flexrow item-header">
<div class="flexrow flex15">
<div title="{{localize "DS4.ItemEquipped"}}">E</div> {{!-- equipped --}} {{!-- SPECIFIC --}}
<div class="item-image"></div>
<div class="item-num-val" title="{{localize "DS4.Quantity"}}">#</div> {{!-- amount --}}
</div>
<div class="item-name flex3">{{localize "DS4.ItemName"}}</div>
<div title="{{localize "DS4.ArmorMaterialType"}}">{{localize "DS4.ArmorMaterialTypeAbbr"}}</div> {{!-- SPECIFIC --}}
<div title="{{localize "DS4.ArmorType"}}">{{localize "DS4.ArmorTypeAbbr"}}</div> {{!-- SPECIFIC --}}
<div class="flex05 item-num-val" title="{{localize "DS4.ArmorValue"}}">{{localize "DS4.ArmorValueAbbr"}}</div> {{!-- SPECIFIC --}}
<div class="flex4">{{localize "DS4.Description"}}</div>
{{!-- add button --}}
<div class="item-controls"> {{!-- SPECIFIC --}}
<a class="item-control item-create" title="Create item" data-type="armor"{{!-- SPECIFIC --}}>
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}</a>
</div>
</li>
{{#each itemsByType.armor as |item id|}} {{!-- SPECIFIC --}}
{{#with item.data.data as |itemData|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="flexrow flex15">
{{!-- equipped? --}}
{{#if itemData.equipped}}<i class="fas fa-check-square"></i>
{{else}}<i class="far fa-square"></i>
{{/if}} {{!--SPECIFIC --}}
{{!-- image --}}
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- amount --}}
<div class="item-num-val">{{itemData.quantity}}</div>
</div>
{{!-- name --}}
<h4 class="item-name flex3">{{item.name}}</h4>
{{!-- item specifics --}}
<div>{{lookup ../../config.armorMaterialTypes itemData.armorMaterialType}}</div> {{!-- SPECIFIC --}}
<div>{{lookup ../../config.armorTypes itemData.armorType}}</div> {{!-- SPECIFIC --}}
<div class="flex05 item-num-val">{{itemData.armorValue}}</div> {{!-- SPECIFIC --}}
{{!-- description --}}
<div class="flex4 item-description">{{{itemData.description}}}</div>
{{!-- edit & delete buttons --}}
<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>
{{/with}}
{{/each}}
</ol>
{{!-- SHIELD --}}
<h4 class="items-list-title">{{localize "DS4.ItemTypeShield"}}</h4> {{!-- SPECIFIC --}}
<ol class="items-list">
<li class="item flexrow item-header">
<div class="flexrow flex15">
<div title="{{localize "DS4.ItemEquipped"}}">E</div> {{!-- equipped --}} {{!-- SPECIFIC --}}
<div class="item-image"></div>
<div class="item-num-val" title="{{localize "DS4.Quantity"}}">#</div> {{!-- amount --}}
</div>
<div class="item-name flex3">{{localize "DS4.ItemName"}}</div>
<div class="flex05 item-num-val" title="{{localize "DS4.ArmorValue"}}">{{localize "DS4.ArmorValueAbbr"}}</div> {{!-- SPECIFIC --}}
<div class="flex4">{{localize "DS4.Description"}}</div>
{{!-- add button --}}
<div class="item-controls"> {{!-- SPECIFIC --}}
<a class="item-control item-create" title="Create item" data-type="shield"{{!-- SPECIFIC --}}>
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}</a>
</div>
</li>
{{#each itemsByType.shield as |item id|}} {{!-- SPECIFIC --}}
{{#with item.data.data as |itemData|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="flexrow flex15">
{{!-- equipped? --}}
{{#if itemData.equipped}}<i class="fas fa-check-square"></i>
{{else}}<i class="far fa-square"></i>
{{/if}} {{!--SPECIFIC --}}
{{!-- image --}}
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- amount --}}
<div class="item-num-val">{{itemData.quantity}}</div>
</div>
{{!-- name --}}
<h4 class="item-name flex3">{{item.name}}</h4>
{{!-- item specifics --}}
<div class="flex05 item-num-val">{{itemData.armorValue}}</div> {{!-- SPECIFIC --}}
{{!-- description --}}
<div class="flex4 item-description">{{{itemData.description}}}</div>
{{!-- edit & delete buttons --}}
<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>
{{/with}}
{{/each}}
</ol>
{{!-- TRINKET --}}
<h4 class="items-list-title">{{localize "DS4.ItemTypeTrinket"}}</h4> {{!-- SPECIFIC --}}
<ol class="items-list">
<li class="item flexrow item-header">
<div class="flexrow flex15">
<div title="{{localize "DS4.ItemEquipped"}}">E</div> {{!-- equipped --}} {{!-- SPECIFIC --}}
<div class="item-image"></div>
<div class="item-num-val" title="{{localize "DS4.Quantity"}}">#</div> {{!-- amount --}}
</div>
<div class="item-name flex3">{{localize "DS4.ItemName"}}</div>
<div class="flex2">{{localize "DS4.StorageLocation"}}</div> {{!-- SPECIFIC --}}
<div class="flex4">{{localize "DS4.Description"}}</div>
{{!-- add button --}}
<div class="item-controls"> {{!-- SPECIFIC --}}
<a class="item-control item-create" title="Create item" data-type="trinket"{{!-- SPECIFIC --}}>
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}</a>
</div>
</li>
{{#each itemsByType.trinket as |item id|}} {{!-- SPECIFIC --}}
{{#with item.data.data as |itemData|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="flexrow flex15">
{{!-- equipped? --}}
{{#if itemData.equipped}}<i class="fas fa-check-square"></i>
{{else}}<i class="far fa-square"></i>
{{/if}} {{!--SPECIFIC --}}
{{!-- image --}}
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- amount --}}
<div class="item-num-val">{{itemData.quantity}}</div>
</div>
{{!-- name --}}
<h4 class="item-name flex3">{{item.name}}</h4>
{{!-- storage location --}}
<div class="flex2">{{{itemData.storageLocation}}}</div> {{!-- SPECIFIC --}}
{{!-- description --}}
<div class="flex4 item-description">{{{itemData.description}}}</div>
{{!-- edit & delete buttons --}}
<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>
{{/with}}
{{/each}}
</ol>
{{!-- EQUIPMENT --}}
<h4 class="items-list-title">{{localize "DS4.ItemTypeEquipment"}}</h4> {{!-- SPECIFIC --}}
<ol class="items-list">
<li class="item flexrow item-header">
<div class="flexrow flex15">
<div class="item-image"></div>
<div class="item-num-val" title="{{localize "DS4.Quantity"}}">#</div> {{!-- amount --}}
</div>
<div class="item-name flex3">{{localize "DS4.ItemName"}}</div>
<div class="flex2">{{localize "DS4.StorageLocation"}}</div> {{!-- SPECIFIC --}}
<div class="flex4">{{localize "DS4.Description"}}</div>
{{!-- add button --}}
<div class="item-controls"> {{!-- SPECIFIC --}}
<a class="item-control item-create" title="Create item" data-type="equipment" {{!-- SPECIFIC --}}>
<i class="fas fa-plus"></i>
{{localize "DS4.UserInteractionAddItem"}}</a>
</div>
</li>
{{#each itemsByType.equipment as |item id|}} {{!-- SPECIFIC --}}
{{#with item.data.data as |itemData|}}
<li class="item flexrow" data-item-id="{{item._id}}">
<div class="flexrow flex15">
{{!-- image --}}
<div class="item-image">
<img src="{{item.img}}" title="{{item.name}}" width="24" height="24" />
</div>
{{!-- amount --}}
<div class="item-num-val">{{itemData.quantity}}</div>
</div>
{{!-- name --}}
<h4 class="item-name flex3">{{item.name}}</h4>
{{!-- storage location --}}
<div class="flex2">{{{itemData.storageLocation}}}</div> {{!-- SPECIFIC --}}
{{!-- description --}}
<div class="flex4 item-description">{{{itemData.description}}}</div>
{{!-- edit & delete buttons --}}
<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>
{{/with}}
{{/each}}
</ol>
</div>

View file

@ -17,12 +17,12 @@
</div>
<div class="basic-property">
<label class="basic-property-label">{{localize "DS4.WeaponBonus"}}</label>
<input class="basic-property-input" type="text" name="data.weaponBonus" value="{{data.weaponBonus}}"
<input class="basic-property-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="text" name="data.opponentDefense"
<input class="basic-property-input" type="number" name="data.opponentDefense"
value="{{data.opponentDefense}}" placeholder="0" data-dtype="Number" />
</div>
</div>