Added library UI for selecting a library item

This commit is contained in:
Stefan Zermatten
2017-04-21 15:10:33 +02:00
parent 7b6c59fa6c
commit a459610c09
7 changed files with 143 additions and 1 deletions

View File

@@ -0,0 +1,54 @@
<template name="itemLibraryDialog">
<div class="fit item-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>Items</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="items" style="padding:8px">
{{#if searchTerm}}
{{#if searchItems.count}}
{{#each item in searchItems}}
{{>libraryItem item=item selected=(isSelected item)}}
{{/each}}
{{else}}
No items match "{{searchTerm}}"
{{/if}}
{{else}}
{{#each category in categories}}
<div class="paper-font-subhead">
{{category.name}}
</div>
{{#each item in itemsInCategory category.value}}
{{>libraryItem item=item selected=(isSelected item)}}
{{/each}}
{{/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="libraryItem">
<div class="item library-item layout horizontal center {{#if selected}}selected{{/if}}">
<paper-ripple></paper-ripple>
<div class="itemName flex">
{{item.name}}
</div>
<div style="margin: 0 8px">
{{item.weight}}
</div>
<div style="margin: 0 8px">
{{item.value}}
</div>
</div>
</template>