working weapons section in char sheet
Additions: - re-added getData() method of actor sheet for sorted items - added an item-description CSS class for handling of overflow - added a 1.5 CSS flex box Changes: - restricted previous sample items section to only weapons (to be re-used for other item types) Fixes: - fixed input types in weapon sheet
This commit is contained in:
parent
2fc7fb13c8
commit
2ac6d3a919
5 changed files with 80 additions and 13 deletions
|
@ -6,6 +6,21 @@ import { DS4ActorDataType } from "./actor-data";
|
|||
* @extends {ActorSheet}
|
||||
*/
|
||||
export class DS4ActorSheet extends ActorSheet<DS4ActorDataType, DS4Actor> {
|
||||
/**
|
||||
* 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 items explicitly sorted by type to the data:
|
||||
const itemsByType = this.actor.itemTypes;
|
||||
data["itemsByType"] = itemsByType;
|
||||
console.log("Shields:", data);
|
||||
return data;
|
||||
}
|
||||
|
||||
/** @override */
|
||||
static get defaultOptions(): FormApplicationOptions {
|
||||
return mergeObject(super.defaultOptions, {
|
||||
|
|
|
@ -32,4 +32,15 @@
|
|||
flex: 0 0 86px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.item-description {
|
||||
font-size: 75%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
p {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -15,6 +15,9 @@
|
|||
.flex1 {
|
||||
flex: 1;
|
||||
}
|
||||
.flex15 {
|
||||
flex: 1.5;
|
||||
}
|
||||
.flex2 {
|
||||
flex: 2;
|
||||
}
|
||||
|
@ -38,6 +41,9 @@
|
|||
.flex1 {
|
||||
flex: 1;
|
||||
}
|
||||
.flex15 {
|
||||
flex: 1.5;
|
||||
}
|
||||
.flex2 {
|
||||
flex: 2;
|
||||
}
|
||||
|
|
|
@ -1,26 +1,61 @@
|
|||
{{!-- TODO: add localization! --}}
|
||||
{{!-- Tab with overview and quick-actions on owned items --}}
|
||||
<div class="tab items" data-group="primary" data-tab="items">
|
||||
|
||||
{{!-- WEAPONS --}}
|
||||
<h3>Weapons</h3>
|
||||
<ol class="items-list">
|
||||
<li class="item flexrow item-header">
|
||||
<div class="flexrow flex15">
|
||||
<div></div> {{!-- equipped --}}
|
||||
<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>#</div> {{!-- amount --}}
|
||||
</div>
|
||||
<div class="item-name flex2">Name</div>
|
||||
<div>AT</div> {{!-- attack type --}} {{!-- SPECIFIC --}}
|
||||
<div class="flexrow flex15">
|
||||
<div>WB</div> {{!-- weapon bonus --}} {{!-- SPECIFIC --}}
|
||||
<div>OD</div> {{!-- opponent defence --}} {{!-- SPECIFIC --}}
|
||||
</div>
|
||||
<div class="flex4">Desc</div> {{!-- description --}}
|
||||
{{!-- add button --}}
|
||||
<div class="item-controls"> {{!-- SPECIFIC --}}
|
||||
<a class="item-control item-create" title="Create item" data-type="weapon"><i class="fas fa-plus"></i>
|
||||
Add item</a> {{!-- SPECIFIC --}}
|
||||
</div>
|
||||
</li>
|
||||
{{#each actor.items as |item id|}}
|
||||
{{#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>
|
||||
<h4 class="item-name">{{item.name}}</h4>
|
||||
{{!-- amount --}}
|
||||
<div>{{itemData.quantity}}</div>
|
||||
</div>
|
||||
{{!-- name --}}
|
||||
<h4 class="item-name flex2">{{item.name}}</h4>
|
||||
{{!-- item specifics --}}
|
||||
<div>{{itemData.attackType}}</div> {{!-- SPECIFIC --}}
|
||||
<div class="flexrow flex15">
|
||||
<div>{{itemData.weaponBonus}}</div> {{!-- SPECIFIC --}}
|
||||
<div>{{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>
|
||||
</div>
|
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue