Add message if no event to display

 - Add message if no event to display
 - message is configurable via config no_event

README.md

@@ -29,14 +29,15 @@ resources:
 
 #### Card options
 
-| Name | Type | Default | Since | Default | Description |
+| Name | Type | Required | Since | Default | Description |
 |------|------|---------|-------|---------|-------------|
 | type | string | **required** | v0.1 | | `custom:logbook-card`|
 | entity | string | **required** | v0.1 | | An entity_id.|
 | title | string | optional | v0.1 | *friendly_name* History | Card title|
 | history | integer | optional | v0.1 | 5 | Numbers of days of history of the logbook |
 | hiddenState | string[] | optional | v0.1 | [] | States to hide|
 | desc | bool | optional | v0.1 | True | is logbook ordered descending|
+| no_event | string | optional | v0.1 | No event on the period | message displayed if no event to display |
 
 ### Example usage
 

logbook-card.js

@@ -27,13 +27,17 @@ class LogbookCard extends Polymer.Element {
             </template>
             <div class="card-content grid" style="[[contentStyle]]">
               <div>
-                <template is="dom-repeat" items="{{history}}">
+                <template is="dom-repeat" rendered-item-count="{{itemsCount}}" items="{{history}}">
                   <div class="item">
                     <span>[[item.state]]</span> 
                     <span class="duration">[[getDuration(item.duration)]]</span>
                     <div class="date"> [[_displayDate(item.start)]] - [[_displayDate(item.end)]]</div>
                   </div>
                 </template>
+
+                <template is="dom-if" if="{{!itemsCount}}">
+                  [[_config.no_event]]
+                </template>
               </div>
             </div>
             </ha-card>
@@ -77,7 +81,8 @@ class LogbookCard extends Polymer.Element {
         const defaultConfig = {
             history: 5,
             hiddenState: [],
-            desc: true
+            desc: true,
+            no_event: 'No event on the period'
         };
 
         this._config = Object.assign(defaultConfig, config);