Hass.io card design for dashboard updateinfo (#877)

* Hass.io card design for dashboard updateinfo

* Remove test stuff
This commit is contained in:
c727 2018-02-09 22:49:17 +01:00 committed by GitHub
parent ac628787ac
commit 81c49628e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 22 deletions

View File

@ -73,7 +73,7 @@
<div class='content'> <div class='content'>
<hassio-hass-update <hassio-hass-update
hass='[[hass]]' hass='[[hass]]'
data='[[hassInfo]]' hass-info='[[hassInfo]]'
></hassio-hass-update> ></hassio-hass-update>
<hassio-addons <hassio-addons
hass='[[hass]]' hass='[[hass]]'

View File

@ -2,11 +2,12 @@
<link rel="import" href="../../bower_components/paper-card/paper-card.html"> <link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../src/components/buttons/ha-call-api-button.html"> <link rel="import" href="../../src/components/buttons/ha-call-api-button.html">
<link rel="import" href="../../src/components/buttons/ha-call-service-button.html"> <link rel='import' href='../../src/components/hassio-card-content.html'>
<link rel='import' href='../../src/resources/hassio-style.html'>
<dom-module id="hassio-hass-update"> <dom-module id="hassio-hass-update">
<template> <template>
<style include="iron-flex ha-style"> <style include="ha-style hassio-style">
paper-card { paper-card {
display: block; display: block;
height: 100%; height: 100%;
@ -17,22 +18,31 @@
margin-top: 16px; margin-top: 16px;
} }
</style> </style>
<template is='dom-if' if='[[computeUpdateAvailable(hassInfo)]]'>
<template is='dom-if' if='[[_computeUpdateAvailable(data)]]'> <div class='content'>
<paper-card heading='Update Available! 🎉'> <div class='card-group'>
<div class="card-content"> <div class='title'>Update available! 🎉</div>
You are currently running Home Assistant version [[data.version]] and [[data.last_version]] is available. <paper-card>
<template is='dom-if' if='[[errors]]'> <div class='card-content'>
<div class='errors'>Error: [[errors]]</div> <hassio-card-content
</template> title='Home Assistant [[hassInfo.last_version]] is available'
description='You are currently running version [[hassInfo.version]]'
icon='mdi:home-assistant'
icon-class='hassupdate'
></hassio-card-content>
<template is='dom-if' if='[[error]]'>
<div class='error'>Error: [[error]]</div>
</template>
</div>
<div class='card-actions'>
<ha-call-api-button
hass='[[hass]]'
path='hassio/homeassistant/update'
>Update</ha-call-api-button>
</div>
</paper-card>
</div> </div>
<div class='card-actions'> </div>
<ha-call-api-button
hass='[[hass]]'
path="hassio/homeassistant/update"
>Update</ha-call-api-button>
</div>
</paper-card>
</template> </template>
</template> </template>
</dom-module> </dom-module>
@ -44,7 +54,8 @@ class HassioHassUpdate extends Polymer.Element {
static get properties() { static get properties() {
return { return {
hass: Object, hass: Object,
data: Object, hassInfo: Object,
error: String,
}; };
} }
@ -59,7 +70,7 @@ class HassioHassUpdate extends Polymer.Element {
return; return;
} }
var response = ev.detail.response; const response = ev.detail.response;
if (typeof response.body === 'object') { if (typeof response.body === 'object') {
this.errors = response.body.message || 'Unknown error'; this.errors = response.body.message || 'Unknown error';
@ -68,8 +79,8 @@ class HassioHassUpdate extends Polymer.Element {
} }
} }
_computeUpdateAvailable(data) { computeUpdateAvailable(hassInfo) {
return data.version !== data.last_version; return hassInfo.version !== hassInfo.last_version;
} }
} }