{{!--
SPDX-FileCopyrightText: 2021 Johannes Loher

SPDX-License-Identifier: MIT
--}}

<div class="ds4-item-properties ds4-item-properties--spell">
    <h4 class="ds4-item-properties__title">{{localize 'DS4.ItemPropertiesSpell'}}</h4>
    <div class="form-group">
        <label for="data.bonus-{{data._id}}" title="{{localize 'DS4.SpellModifierDescription'}}">{{localize
            "DS4.SpellModifier"}}</label>
        <div class="form-fields">
            <input id="data.bonus-{{data._id}}" data-dtype="String" type="text" name="data.bonus" placeholder="0"
                value="{{data.data.bonus}}" />
        </div>
    </div>
    <div class="form-group">
        <label for="data.spellType-{{data._id}}" title="{{localize 'DS4.SpellTypeDescription'}}">{{localize
            "DS4.SpellType"}}</label>
        <div class="form-fields">
            <select id="data.spellType-{{data._id}}" name="data.spellType" data-dtype="String">
                {{#select data.data.spellType}}
                {{#each config.i18n.spellTypes as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    <div class="form-group">
        <label for="data.spellCategory-{{data._id}}" title="{{localize 'DS4.SpellCategoryDescription'}}">{{localize
            "DS4.SpellCategory"}}</label>
        <div class="form-fields">
            <select id="data.spellCategory-{{data._id}}" name="data.spellCategory" data-dtype="String">
                {{#select data.data.spellCategory}}
                {{#each config.i18n.spellCategories as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    <div class="form-group slim">
        <label title="{{localize 'DS4.SpellDistanceDescription'}}">{{localize "DS4.SpellDistance"}}</label>
        <div class="form-fields">
            <input data-dtype="String" type="text" name="data.maxDistance.value"
                value="{{data.data.maxDistance.value}}" />
            <select name="data.maxDistance.unit" data-dtype="String">
                {{#select data.data.maxDistance.unit}}
                {{#each config.i18n.distanceUnits as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    <div class="form-group slim">
        <label title="{{localize 'DS4.SpellEffectRadiusDescription'}}">{{localize "DS4.SpellEffectRadius"}}</label>
        <div class="form-fields">
            <input data-dtype="String" type="text" name="data.effectRadius.value"
                value="{{data.data.effectRadius.value}}" />
            <select name="data.effectRadius.unit" data-dtype="String">
                {{#select data.data.effectRadius.unit}}
                {{#each config.i18n.distanceUnits as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    <div class="form-group slim">
        <label title="{{localize 'DS4.SpellDurationDescription'}}">{{localize "DS4.SpellDuration"}}</label>
        <div class="form-fields">
            <input data-dtype="String" type="text" name="data.duration.value" value="{{data.data.duration.value}}" />
            <select name="data.duration.unit" data-dtype="String">
                {{#select data.data.duration.unit}}
                {{#each config.i18n.temporalUnits as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    <div class="form-group">
        <label for="data.cooldownDuration-{{data._id}}"
            title="{{localize 'DS4.CooldownDurationDescription'}}">{{localize "DS4.CooldownDuration"}}</label>
        <div class="form-fields">
            <select id="data.cooldownDuration-{{data._id}}" name="data.cooldownDuration" data-dtype="String">
                {{#select data.data.cooldownDuration}}
                {{#each config.i18n.cooldownDurations as |value key|}}
                <option value="{{key}}">{{value}}</option>
                {{/each}}
                {{/select}}
            </select>
        </div>
    </div>
    {{#if settings.useManaSystem}}
    <div class="form-group slim">
        <label title="{{localize 'DS4.ManaCostDescription'}}">{{localize "DS4.ManaCost"}}</label>
        <div class="form-fields">
            {{> systems/ds4/templates/sheets/shared/components/form-field-icon-button.hbs
            class="ds4-calculate-mana-cost" title="DS4.CalculateManaCost" faClasses="fas fa-magic"}}
            <label for="data.manaCost.healer-{{data._id}}">{{localize "DS4.SpellCasterClassHealer"}}</label>
            <input id="data.manaCost.healer-{{data._id}}" class="ds4-form-field-input-extra-slim" data-dtype="Number"
                type="number" min="0" step="1" name="data.manaCost.healer" placeholder="–"
                value="{{data.data.manaCost.healer}}" />
            <label for="data.manaCost.sorcerer-{{data._id}}">{{localize "DS4.SpellCasterClassSorcerer"}}</label>
            <input id="data.manaCost.sorcerer-{{data._id}}" class="ds4-form-field-input-extra-slim" data-dtype="Number"
                type="number" min="0" step="1" name="data.manaCost.sorcerer" placeholder="–"
                value="{{data.data.manaCost.sorcerer}}" />
            <label for="data.manaCost.wizard-{{data._id}}">{{localize "DS4.SpellCasterClassWizard"}}</label>
            <input id="data.manaCost.wizard-{{data._id}}" class="ds4-form-field-input-extra-slim" data-dtype="Number"
                type="number" min="0" step="1" name="data.manaCost.wizard" placeholder="–"
                value="{{data.data.manaCost.wizard}}" />
        </div>
    </div>
    {{/if}}
    <div class="form-group slim">
        <label title="{{localize 'DS4.SpellMinimumLevelDescription'}}">{{localize "DS4.SpellMinimumLevel"}}</label>
        <div class="form-fields">
            <label for="data.minimumLevels.healer-{{data._id}}">{{localize "DS4.SpellCasterClassHealer"}}</label>
            <input id="data.minimumLevels.healer-{{data._id}}" class="ds4-form-field-input-extra-slim"
                data-dtype="Number" type="number" min="0" step="1" name="data.minimumLevels.healer" placeholder="–"
                value="{{data.data.minimumLevels.healer}}" />
            <label for="data.minimumLevels.sorcerer-{{data._id}}">{{localize "DS4.SpellCasterClassSorcerer"}}</label>
            <input id="data.minimumLevels.sorcerer-{{data._id}}" class="ds4-form-field-input-extra-slim"
                data-dtype="Number" type="number" min="0" step="1" name="data.minimumLevels.sorcerer" placeholder="–"
                value="{{data.data.minimumLevels.sorcerer}}" />
            <label for="data.minimumLevels.wizard-{{data._id}}">{{localize "DS4.SpellCasterClassWizard"}}</label>
            <input id="data.minimumLevels.wizard-{{data._id}}" class="ds4-form-field-input-extra-slim"
                data-dtype="Number" type="number" min="0" step="1" name="data.minimumLevels.wizard" placeholder="–"
                value="{{data.data.minimumLevels.wizard}}" />
        </div>
    </div>
    <div class="form-group">
        <label for="data.price-{{data._id}}" title="{{localize 'DS4.SpellPriceDescription'}}">{{localize
            "DS4.SpellPrice"}}</label>
        <div class="form-fields">
            <span id="data.price-{{data._id}}">{{data.data.price}}</span>
        </div>
    </div>
</div>