Use BEM for item-list styling and add support for drag & drop of items (between sheets and for sorting)
This commit is contained in:
parent
226156f960
commit
aac4b014b0
6 changed files with 116 additions and 107 deletions
|
@ -17,7 +17,7 @@
|
|||
@include meta.load-css("scss/components/combat_values");
|
||||
@include meta.load-css("scss/components/description");
|
||||
@include meta.load-css("scss/components/forms");
|
||||
@include meta.load-css("scss/components/items_list");
|
||||
@include meta.load-css("scss/components/item_list");
|
||||
@include meta.load-css("scss/components/tabs");
|
||||
@include meta.load-css("scss/components/talents");
|
||||
}
|
||||
|
|
|
@ -58,12 +58,17 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Data<DS4Actor>> {
|
|||
* @returns The data fed to the template of the actor sheet
|
||||
*/
|
||||
async getData(): Promise<ActorSheet.Data<DS4Actor>> {
|
||||
const itemsByType = Object.fromEntries(
|
||||
Object.entries(this.actor.itemTypes).map(([itemType, items]) => {
|
||||
return [itemType, items.map((item) => item.data).sort((a, b) => (a.sort || 0) - (b.sort || 0))];
|
||||
}),
|
||||
);
|
||||
const data = {
|
||||
...this._addTooltipsToData(await super.getData()),
|
||||
// Add the localization config to the data:
|
||||
config: DS4,
|
||||
// Add the items explicitly sorted by type to the data:
|
||||
itemsByType: this.actor.itemTypes,
|
||||
itemsByType,
|
||||
};
|
||||
return data;
|
||||
}
|
||||
|
@ -98,7 +103,7 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Data<DS4Actor>> {
|
|||
|
||||
// Update Inventory Item
|
||||
html.find(".item-edit").on("click", (ev) => {
|
||||
const li = $(ev.currentTarget).parents(".item-row");
|
||||
const li = $(ev.currentTarget).parents(".item");
|
||||
const id = li.data("itemId");
|
||||
const item = this.actor.getOwnedItem(id);
|
||||
if (!item) {
|
||||
|
@ -112,7 +117,7 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Data<DS4Actor>> {
|
|||
|
||||
// Delete Inventory Item
|
||||
html.find(".item-delete").on("click", (ev) => {
|
||||
const li = $(ev.currentTarget).parents(".item-row");
|
||||
const li = $(ev.currentTarget).parents(".item");
|
||||
this.actor.deleteOwnedItem(li.data("itemId"));
|
||||
li.slideUp(200, () => this.render(false));
|
||||
});
|
||||
|
@ -155,7 +160,7 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Data<DS4Actor>> {
|
|||
protected _onItemChange(ev: JQuery.ChangeEvent): void {
|
||||
ev.preventDefault();
|
||||
const el: HTMLFormElement = $(ev.currentTarget).get(0);
|
||||
const id = $(ev.currentTarget).parents(".item-row").data("itemId");
|
||||
const id = $(ev.currentTarget).parents(".item").data("itemId");
|
||||
const item = duplicate<DS4Item, "lenient">(this.actor.getOwnedItem(id));
|
||||
const property: string | undefined = $(ev.currentTarget).data("property");
|
||||
|
||||
|
@ -224,7 +229,7 @@ export class DS4ActorSheet extends ActorSheet<ActorSheet.Data<DS4Actor>> {
|
|||
|
||||
// unsupported:
|
||||
else {
|
||||
throw TypeError("Binding of item property to this type of HTML element not supported; given: " + el);
|
||||
throw new TypeError("Binding of item property to this type of HTML element not supported; given: " + el);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,41 +1,48 @@
|
|||
@use "../utils/mixins";
|
||||
@use "../utils/variables";
|
||||
|
||||
.items-list {
|
||||
.ds4-item-list {
|
||||
$row-height: 1.75em;
|
||||
|
||||
display: grid;
|
||||
grid-column-gap: 0.5em;
|
||||
grid-row-gap: 0.2em;
|
||||
align-items: center;
|
||||
&.weapon {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr $row-height 1fr 3ch 5fr 4ch;
|
||||
}
|
||||
&.armor {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 1fr 1fr 3ch 5fr 4ch;
|
||||
}
|
||||
&.shield {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 3ch 5fr 4ch;
|
||||
}
|
||||
&.equipment {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 10ch 5fr 4ch;
|
||||
}
|
||||
&.loot {
|
||||
grid-template-columns: $row-height 3ch 3fr 10ch 5fr 4ch;
|
||||
}
|
||||
&.spell {
|
||||
grid-template-columns: $row-height $row-height 2fr $row-height 1fr 1fr 1fr 1fr 4ch;
|
||||
}
|
||||
|
||||
margin: 7px 0;
|
||||
padding: 0;
|
||||
overflow-y: auto;
|
||||
|
||||
.item-row {
|
||||
display: contents;
|
||||
transition: all 0.5s;
|
||||
|
||||
&.item-header {
|
||||
@include mixins.mark-invalid-or-disabled-input;
|
||||
|
||||
&--weapon {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr $row-height 1fr 3ch 5fr 4ch;
|
||||
}
|
||||
&--armor {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 1fr 1fr 3ch 5fr 4ch;
|
||||
}
|
||||
&--shield {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 3ch 5fr 4ch;
|
||||
}
|
||||
&--equipment {
|
||||
grid-template-columns: $row-height $row-height 3ch 3fr 10ch 5fr 4ch;
|
||||
}
|
||||
&--loot {
|
||||
grid-template-columns: $row-height 3ch 3fr 10ch 5fr 4ch;
|
||||
}
|
||||
&--spell {
|
||||
grid-template-columns: $row-height $row-height 2fr $row-height 1fr 1fr 1fr 1fr 4ch;
|
||||
}
|
||||
|
||||
&__row {
|
||||
grid-column: 1/-1;
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
|
||||
&--header {
|
||||
font-weight: bold;
|
||||
display: contents;
|
||||
}
|
||||
|
||||
> * {
|
||||
|
@ -43,29 +50,26 @@
|
|||
line-height: $row-height;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.item-image {
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
&__editable {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
&--checkbox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
@include mixins.mark-invalid-or-disabled-input;
|
||||
}
|
||||
|
||||
.item-description {
|
||||
&__image {
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
&__description {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
:not(:first-child) {
|
||||
|
@ -80,7 +84,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
.items-list-title {
|
||||
.ds4-item-list-title {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 0;
|
||||
padding-left: 1em;
|
|
@ -31,17 +31,17 @@
|
|||
!-- @param partial-block: hand over custom children in the partial block.
|
||||
--}}
|
||||
{{#*inline "itemListHeader" }}
|
||||
<li class="item-row item-header">
|
||||
<li class="ds4-item-list__row ds4-item-list__row--header">
|
||||
{{!-- equipped --}}
|
||||
{{#if (ne dataType 'loot')}}
|
||||
<div title="{{localize 'DS4.ItemEquipped'}}">{{localize 'DS4.ItemEquippedAbbr'}}</div>
|
||||
{{/if}}
|
||||
{{!-- image --}}
|
||||
<div class="item-image"></div>
|
||||
<div></div>
|
||||
{{!-- amount --}}
|
||||
<div class="item-num-val" title="{{localize 'DS4.Quantity'}}">#</div>
|
||||
<div title="{{localize 'DS4.Quantity'}}">#</div>
|
||||
{{!-- name --}}
|
||||
<div class="item-name">{{localize 'DS4.ItemName'}}</div>
|
||||
<div>{{localize 'DS4.ItemName'}}</div>
|
||||
{{!-- item type specifics --}}
|
||||
{{> @partial-block }}
|
||||
{{!-- description --}}
|
||||
|
@ -62,25 +62,25 @@
|
|||
!-- @param partial-block: hand over custom children in the partial block.
|
||||
--}}
|
||||
{{#*inline "itemListEntry"}}
|
||||
<li class="item-row" data-item-id="{{item._id}}">
|
||||
<li class="ds4-item-list__row item" data-item-id="{{item._id}}">
|
||||
{{!-- equipped --}}
|
||||
{{#if (ne item.data.type 'loot')}}
|
||||
<input class="item-change" type="checkbox" {{checked item.data.data.equipped}} data-dtype="Boolean"
|
||||
data-property="data.equipped" title="{{localize 'DS4.ItemEquipped'}}">
|
||||
{{#if (ne item.type 'loot')}}
|
||||
<input class="ds4-item-list__editable ds4-item-list__editable--checkbox" type="checkbox" {{checked
|
||||
item.data.equipped}} data-dtype="Boolean" data-property="data.equipped" title="{{localize 'DS4.ItemEquipped'}}">
|
||||
{{/if}}
|
||||
{{!-- image --}}
|
||||
<div class="item-image" style="background-image: url('{{item.img}}')" title="{{item.name}}"></div>
|
||||
<div class="ds4-item-list__image" style="background-image: url('{{item.img}}')" title="{{item.name}}"></div>
|
||||
{{!-- amount --}}
|
||||
<input class="item-num-val item-change" type="number" min="0" step="1" value="{{item.data.data.quantity}}"
|
||||
<input class="ds4-item-list__editable" type="number" min="0" step="1" value="{{item.data.quantity}}"
|
||||
data-dtype="Number" data-property="data.quantity" title="{{localize 'DS4.Quantity'}}" />
|
||||
{{!-- name --}}
|
||||
<input class="item-name item-change" type="text" value="{{item.name}}" data-dtype="String" data-property="name"
|
||||
title="{{htmlToPlainText item.data.data.description}}" />
|
||||
<input class="ds4-item-list__editable" type="text" value="{{item.name}}" data-dtype="String" data-property="name"
|
||||
title="{{htmlToPlainText item.data.description}}" />
|
||||
{{!-- item type specifics --}}
|
||||
{{> @partial-block}}
|
||||
{{!-- description --}}
|
||||
<div class="item-description" title="{{htmlToPlainText item.data.data.description}}">
|
||||
{{{item.data.data.description}}}</div>
|
||||
<div class="ds4-item-list__description" title="{{htmlToPlainText item.data.description}}">
|
||||
{{{item.data.description}}}</div>
|
||||
{{!-- control buttons --}}
|
||||
{{> systems/ds4/templates/actor/partials/overview-control-buttons.hbs }}
|
||||
</li>
|
||||
|
@ -90,51 +90,51 @@
|
|||
{{!-- ======================================================================== --}}
|
||||
|
||||
{{!-- WEAPONS --}}
|
||||
<h4 class="items-list-title">{{localize 'DS4.ItemTypeWeaponPlural'}}</h4>
|
||||
<h4 class="ds4-item-list-title">{{localize 'DS4.ItemTypeWeaponPlural'}}</h4>
|
||||
{{#> ifHasItemOfType itemsArray=itemsByType.weapon dataType='weapon' }}
|
||||
<ol class="items-list weapon">
|
||||
<ol class="ds4-item-list ds4-item-list--weapon item-list">
|
||||
{{#> itemListHeader dataType='weapon'}}
|
||||
<div class="item-image" title="{{localize 'DS4.AttackType'}}">{{localize 'DS4.AttackTypeAbbr'}}</div>
|
||||
<div class="item-num-val" title="{{localize 'DS4.WeaponBonus'}}">
|
||||
<div class="ds4-item-list__image" title="{{localize 'DS4.AttackType'}}">{{localize 'DS4.AttackTypeAbbr'}}</div>
|
||||
<div title="{{localize 'DS4.WeaponBonus'}}">
|
||||
{{localize 'DS4.WeaponBonusAbbr'}}
|
||||
</div>
|
||||
<div class="item-num-val" title="{{localize 'DS4.OpponentDefense'}}">
|
||||
<div title="{{localize 'DS4.OpponentDefense'}}">
|
||||
{{localize 'DS4.OpponentDefenseAbbr'}}
|
||||
</div>
|
||||
{{/itemListHeader}}
|
||||
{{#each itemsByType.weapon as |item id|}}
|
||||
{{#> itemListEntry item=item}}
|
||||
<div class="item-image"
|
||||
style="background-image: url('{{lookup ../../config.icons.attackTypes item.data.data.attackType}}')"
|
||||
title="{{lookup ../../config.i18n.attackTypes item.data.data.attackType}}">
|
||||
<div class="ds4-item-list__image"
|
||||
style="background-image: url('{{lookup ../../config.icons.attackTypes item.data.attackType}}')"
|
||||
title="{{lookup ../../config.i18n.attackTypes item.data.attackType}}">
|
||||
</div>
|
||||
<div class="item-num-val">{{ item.data.data.weaponBonus}}</div>
|
||||
<div class="item-num-val">{{ item.data.data.opponentDefense}}</div>
|
||||
<div>{{ item.data.weaponBonus}}</div>
|
||||
<div>{{ item.data.opponentDefense}}</div>
|
||||
{{/itemListEntry}}
|
||||
{{/each}}
|
||||
</ol>
|
||||
{{/ifHasItemOfType}}
|
||||
|
||||
{{!-- ARMOR --}}
|
||||
<h4 class="items-list-title">{{localize 'DS4.ItemTypeArmorPlural'}}</h4>
|
||||
<h4 class="ds4-item-list-title">{{localize 'DS4.ItemTypeArmorPlural'}}</h4>
|
||||
{{#> ifHasItemOfType itemsArray=itemsByType.armor dataType='armor' }}
|
||||
<ol class="items-list armor">
|
||||
<ol class="ds4-item-list ds4-item-list--armor item-list">
|
||||
{{#> itemListHeader dataType='armor'}}
|
||||
<div title="{{localize 'DS4.ArmorMaterialType'}}">{{localize 'DS4.ArmorMaterialTypeAbbr'}}</div>
|
||||
<div title="{{localize 'DS4.ArmorType'}}">{{localize 'DS4.ArmorTypeAbbr'}}</div>
|
||||
<div class="item-num-val" title="{{localize 'DS4.ArmorValue'}}">
|
||||
<div title="{{localize 'DS4.ArmorValue'}}">
|
||||
{{localize 'DS4.ArmorValueAbbr'}}
|
||||
</div>
|
||||
{{/itemListHeader}}
|
||||
{{#each itemsByType.armor as |item id|}}
|
||||
{{#> itemListEntry item=item }}
|
||||
<div title="{{lookup ../../config.i18n.armorMaterialTypes item.data.data.armorMaterialType}}">
|
||||
{{lookup ../../config.i18n.armorMaterialTypesAbbr item.data.data.armorMaterialType}}
|
||||
<div title="{{lookup ../../config.i18n.armorMaterialTypes item.data.armorMaterialType}}">
|
||||
{{lookup ../../config.i18n.armorMaterialTypesAbbr item.data.armorMaterialType}}
|
||||
</div>
|
||||
<div title="{{lookup ../../config.i18n.armorTypes item.data.data.armorType}}">
|
||||
{{lookup ../../config.i18n.armorTypesAbbr item.data.data.armorType}}
|
||||
<div title="{{lookup ../../config.i18n.armorTypes item.data.armorType}}">
|
||||
{{lookup ../../config.i18n.armorTypesAbbr item.data.armorType}}
|
||||
</div>
|
||||
<div class="item-num-val">{{ item.data.data.armorValue}}</div>
|
||||
<div>{{ item.data.armorValue}}</div>
|
||||
{{/itemListEntry}}
|
||||
{{/each}}
|
||||
</ol>
|
||||
|
@ -142,17 +142,17 @@
|
|||
|
||||
|
||||
{{!-- SHIELD --}}
|
||||
<h4 class="items-list-title">{{localize 'DS4.ItemTypeShieldPlural'}}</h4>
|
||||
<h4 class="ds4-item-list-title">{{localize 'DS4.ItemTypeShieldPlural'}}</h4>
|
||||
{{#> ifHasItemOfType itemsArray=itemsByType.shield dataType='shield' }}
|
||||
<ol class="items-list shield">
|
||||
<ol class="ds4-item-list ds4-item-list--shield item-list">
|
||||
{{#> itemListHeader dataType='shield' }}
|
||||
<div class="item-num-val" title="{{localize 'DS4.ArmorValue'}}">
|
||||
<div title="{{localize 'DS4.ArmorValue'}}">
|
||||
{{localize 'DS4.ArmorValueAbbr'}}
|
||||
</div>
|
||||
{{/itemListHeader}}
|
||||
{{#each itemsByType.shield as |item id|}}
|
||||
{{#> itemListEntry item=item }}
|
||||
<div class="item-num-val">{{item.data.data.armorValue}}</div>
|
||||
<div>{{item.data.armorValue}}</div>
|
||||
{{/itemListEntry}}
|
||||
{{/each}}
|
||||
</ol>
|
||||
|
@ -160,15 +160,15 @@
|
|||
|
||||
{{!-- EQUIPMENT --}}
|
||||
|
||||
<h4 class="items-list-title">{{localize 'DS4.ItemTypeEquipmentPlural'}}</h4>
|
||||
<h4 class="ds4-item-list-title">{{localize 'DS4.ItemTypeEquipmentPlural'}}</h4>
|
||||
{{#> ifHasItemOfType itemsArray=itemsByType.equipment dataType='equipment' }}
|
||||
<ol class="items-list equipment">
|
||||
<ol class="ds4-item-list ds4-item-list--equipment item-list">
|
||||
{{#> itemListHeader dataType='equipment'}}
|
||||
<div>{{localize 'DS4.StorageLocation'}}</div>
|
||||
{{/itemListHeader}}
|
||||
{{#each itemsByType.equipment as |item id|}}
|
||||
{{#> itemListEntry item=item }}
|
||||
<input class="item-change" type="text" value="{{item.data.data.storageLocation}}" data-dtype="String"
|
||||
<input class="ds4-item-list__editable" type="text" value="{{item.data.storageLocation}}" data-dtype="String"
|
||||
data-property="data.storageLocation" title="{{localize 'DS4.StorageLocation'}}">
|
||||
{{/itemListEntry}}
|
||||
{{/each}}
|
||||
|
@ -176,15 +176,15 @@
|
|||
{{/ifHasItemOfType}}
|
||||
|
||||
{{!-- LOOT --}}
|
||||
<h4 class="items-list-title">{{localize 'DS4.ItemTypeLootPlural'}}</h4>
|
||||
<h4 class="ds4-item-list-title">{{localize 'DS4.ItemTypeLootPlural'}}</h4>
|
||||
{{#> ifHasItemOfType itemsArray=itemsByType.loot dataType='loot' }}
|
||||
<ol class="items-list loot">
|
||||
<ol class="ds4-item-list ds4-item-list--loot item-list">
|
||||
{{#> itemListHeader dataType='loot'}}
|
||||
<div>{{localize 'DS4.StorageLocation'}}</div>
|
||||
{{/itemListHeader}}
|
||||
{{#each itemsByType.loot as |item id|}}
|
||||
{{#> itemListEntry item=item }}
|
||||
<input class="item-change" type="text" value="{{item.data.data.storageLocation}}" data-dtype="String"
|
||||
<input class="ds4-item-list__editable" type="text" value="{{item.data.storageLocation}}" data-dtype="String"
|
||||
data-property="data.storageLocation" title="{{localize 'DS4.StorageLocation'}}">
|
||||
{{/itemListEntry}}
|
||||
{{/each}}
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
!-- @param unitAbbrs: mapping of allowed unitDatum.unit values to unit abbreviation
|
||||
--}}
|
||||
{{#*inline "unit"}}
|
||||
<div class="unit-data-pair item-num-val" title="{{localize localizationString}} [{{lookup unitNames unitDatum.unit}}]">
|
||||
<div title="{{localize localizationString}} [{{lookup unitNames unitDatum.unit}}]">
|
||||
{{#if unitDatum.value }}
|
||||
{{unitDatum.value}} {{lookup unitAbbrs unitDatum.unit}}
|
||||
{{else}}-{{/if}}
|
||||
|
@ -36,44 +36,44 @@ localizationString=localizationString}}
|
|||
|
||||
|
||||
<div class="tab spells" data-group="primary" data-tab="spells">
|
||||
<ol class="items-list spell">
|
||||
<li class="item-row item-header">
|
||||
<ol class="ds4-item-list ds4-item-list--spell item-list">
|
||||
<li class="ds4-item-list__row ds4-item-list__row--header">
|
||||
{{!-- equipped --}}
|
||||
<div title="{{localize 'DS4.ItemEquipped'}}">{{localize 'DS4.ItemEquippedAbbr'}}</div>
|
||||
{{!-- image --}}
|
||||
<div class="item-image"></div>
|
||||
<div></div>
|
||||
{{!-- name --}}
|
||||
<div class="item-name">{{localize 'DS4.ItemName'}}</div>
|
||||
<div>{{localize 'DS4.ItemName'}}</div>
|
||||
{{!-- spell type --}}
|
||||
<div class="item-image" title="{{localize 'DS4.SpellType'}}">{{localize 'DS4.SpellTypeAbbr'}}</div>
|
||||
<div title="{{localize 'DS4.SpellType'}}">{{localize 'DS4.SpellTypeAbbr'}}</div>
|
||||
{{!-- spell bonus --}}
|
||||
<div class="item-num-val" title="{{localize 'DS4.SpellBonus'}}">{{localize 'DS4.SpellBonusAbbr'}}</div>
|
||||
<div title="{{localize 'DS4.SpellBonus'}}">{{localize 'DS4.SpellBonusAbbr'}}</div>
|
||||
{{!-- max. distance --}}
|
||||
<div class="item-num-val" title="{{localize 'DS4.SpellMaxDistance'}}"><i class="fas fa-ruler"></i></div>
|
||||
<div title="{{localize 'DS4.SpellMaxDistance'}}"><i class="fas fa-ruler"></i></div>
|
||||
{{!-- duration --}}
|
||||
<div class="item-num-val" title="{{localize 'DS4.SpellDuration'}}"><i class="far fa-clock"></i></div>
|
||||
<div title="{{localize 'DS4.SpellDuration'}}"><i class="far fa-clock"></i></div>
|
||||
{{!-- cooldown duration --}}
|
||||
<div class="item-num-val" title="{{localize 'DS4.SpellCooldownDuration'}}"><i
|
||||
class="fas fa-hourglass-half"></i></div>
|
||||
<div title="{{localize 'DS4.SpellCooldownDuration'}}"><i class="fas fa-hourglass-half"></i></div>
|
||||
{{!-- control buttons placeholder --}}
|
||||
<div></div>
|
||||
</li>
|
||||
{{#each itemsByType.spell as |item id|}}
|
||||
<li class="item-row" data-item-id="{{item._id}}">
|
||||
<input class="item-change" type="checkbox" {{checked item.data.data.equipped}} data-dtype="Boolean"
|
||||
data-property="data.equipped" title="{{localize 'DS4.ItemEquipped'}}">
|
||||
<li class="ds4-item-list__row item" data-item-id="{{item._id}}">
|
||||
<input class="ds4-item-list__editable ds4-item-list__editable--checkbox" type="checkbox" {{checked
|
||||
item.data.data.equipped}} data-dtype="Boolean" data-property="data.equipped"
|
||||
title="{{localize 'DS4.ItemEquipped'}}">
|
||||
{{!-- image --}}
|
||||
<div class="item-image" style="background-image: url('{{item.img}}')" title="{{item.name}}"></div>
|
||||
<div class="ds4-item-list__image" style="background-image: url('{{item.img}}')" title="{{item.name}}"></div>
|
||||
{{!-- name --}}
|
||||
<input class="item-name item-change" type="text" value="{{item.name}}" data-dtype="String"
|
||||
<input class="ds4-item-list__editable" type="text" value="{{item.name}}" data-dtype="String"
|
||||
data-property="name" title="{{htmlToPlainText item.data.data.description}}" />
|
||||
{{!-- spell type --}}
|
||||
<div class="item-image"
|
||||
<div class="ds4-item-list__image"
|
||||
style="background-image: url('{{lookup ../config.icons.spellTypes item.data.data.spellType}}')"
|
||||
title="{{lookup ../config.i18n.spellTypes item.data.data.spellType}}">
|
||||
</div>
|
||||
{{!-- spell bonus --}}
|
||||
<input class="item-num-val item-change" type="text" data-dtype="String" data-property="data.bonus"
|
||||
<input class="ds4-item-list__editable" type="text" data-dtype="String" data-property="data.bonus"
|
||||
value="{{item.data.data.bonus}}" title="{{localize 'DS4.SpellBonus'}}" />
|
||||
{{!-- max. distance --}}
|
||||
{{> distanceUnit localizationString='DS4.SpellMaxDistance' unitDatum=item.data.data.maxDistance
|
||||
|
|
Loading…
Reference in a new issue