70 lines
2.3 KiB
HTML
70 lines
2.3 KiB
HTML
<template name="spellLibraryDialog">
|
|
<div class="fit spell-library-dialog layout vertical">
|
|
<app-toolbar class="app-grey white-text">
|
|
<paper-icon-button id="backButton"
|
|
icon="arrow-back">
|
|
</paper-icon-button>
|
|
<div main-title>Spells</div>
|
|
<paper-input label="Search" class="search-input">
|
|
<iron-icon icon="search" prefix></iron-icon>
|
|
</paper-input>
|
|
</app-toolbar>
|
|
<div class="flex scroll-y">
|
|
<div class="spells" style="padding:8px">
|
|
{{#if searchTerm}}
|
|
{{#if searchSpells.count}}
|
|
<div>
|
|
{{#each spell in searchSpells}}
|
|
{{>librarySpell spell=spell selected=(isSelected spell)}}
|
|
{{/each}}
|
|
</div>
|
|
{{else}}{{#if searchReady}}
|
|
<p>
|
|
No spells match "{{searchTerm}}"
|
|
</p>
|
|
<p class="paper-font-caption">
|
|
DiceCloud only includes content provided by Wizards of the Coast in the official system reference document. If the spell you are looking for is not available in the system reference document, you will need to add it manually.
|
|
</p>
|
|
{{/if}}{{/if}}
|
|
{{#unless searchReady}}
|
|
<div class="layout vertical center" style="width: 100%; padding: 16px;">
|
|
<paper-spinner active></paper-spinner>
|
|
</div>
|
|
{{/unless}}
|
|
{{else}}
|
|
{{#each categories}}
|
|
<div class="paper-font-body2 category-header clickable">
|
|
<iron-icon icon="chevron-right" class="{{#if isOpen key}}open{{/if}}">
|
|
</iron-icon>
|
|
{{name}}
|
|
</div>
|
|
<iron-collapse opened={{isOpen key}}>
|
|
<div>
|
|
{{#each spell in (spellsInCategory key)}}
|
|
{{>librarySpell spell=spell selected=(isSelected spell)}}
|
|
{{/each}}
|
|
</div>
|
|
{{#unless ready key}}
|
|
<paper-spinner active></paper-spinner>
|
|
{{/unless}}
|
|
</iron-collapse>
|
|
{{/each}}
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
<div class="layout horizontal end-justified">
|
|
<paper-button class="cancelButton">Cancel</paper-button>
|
|
<paper-button class="okButton">OK</paper-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template name="librarySpell">
|
|
<div style="margin: ">
|
|
<paper-checkbox class="spell library-spell" checked={{selected}} style="padding: 2px 0 2px 16px; width: 100%;">
|
|
{{spell.name}}
|
|
<paper-ripple></paper-ripple>
|
|
</paper-checkbox>
|
|
</div>
|
|
</template>
|