ha-frontend-cdce8p/panels/dev-info/ha-panel-dev-info.html
2018-02-11 09:44:28 -08:00

307 lines
8.5 KiB
HTML

<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="../../bower_components/paper-dialog-scrollable/paper-dialog-scrollable.html">
<link rel="import" href="../../bower_components/paper-item/paper-item.html">
<link rel="import" href="../../bower_components/paper-item/paper-item-body.html">
<link rel="import" href="../../bower_components/paper-card/paper-card.html">
<link rel="import" href="../../bower_components/app-layout/app-header-layout/app-header-layout.html">
<link rel="import" href="../../bower_components/app-layout/app-header/app-header.html">
<link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
<link rel="import" href="../../src/components/buttons/ha-call-service-button.html">
<link rel="import" href="../../src/components/ha-menu-button.html">
<link rel="import" href="../../src/resources/ha-style.html">
<dom-module id="ha-panel-dev-info">
<template>
<style include="iron-positioning ha-style">
:host {
-ms-user-select: initial;
-webkit-user-select: initial;
-moz-user-select: initial;
}
.content {
padding: 16px 0px 16px 0;
}
.about {
text-align: center;
line-height: 2em;
}
.version {
@apply --paper-font-headline;
}
.develop {
@apply --paper-font-subhead;
}
.about a {
color: var(--dark-primary-color);
}
.error-log-intro {
margin: 16px;
}
paper-icon-button {
float: right;
}
.error-log {
@apply --paper-font-code)
clear: both;
white-space: pre-wrap;
}
.system-log-intro {
margin: 16px;
border-top: 1px solid var(--light-primary-color);
padding-top: 16px;
}
paper-card {
display: block;
padding-top: 16px;
}
paper-item {
cursor: pointer;
}
.header {
@apply --paper-font-title;
}
paper-dialog {
border-radius: 2px;
}
@media all and (max-width: 450px), all and (max-height: 500px) {
paper-dialog {
margin: 0;
width: 100%;
max-height: calc(100% - 64px);
position: fixed !important;
bottom: 0px;
left: 0px;
right: 0px;
overflow: scroll;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
}
}
.loading-container {
@apply --layout-vertical;
@apply --layout-center-center;
height: 100px;
}
</style>
<app-header-layout has-scrolling-region>
<app-header slot="header" fixed>
<app-toolbar>
<ha-menu-button narrow='[[narrow]]' show-menu='[[showMenu]]'></ha-menu-button>
<div main-title>About</div>
</app-toolbar>
</app-header>
<div class='content'>
<div class='about'>
<p class='version'>
<a href='https://home-assistant.io'><img src="/static/icons/favicon-192x192.png" height="192" /></a><br />
Home Assistant<br />
[[hass.config.core.version]]
</p>
<p>
Path to configuration.yaml: [[hass.config.core.config_dir]]
</p>
<p class='develop'>
<a href='https://home-assistant.io/developers/credits/' target='_blank'>
Developed by a bunch of awesome people.
</a>
</p>
<p>
Published under the Apache 2.0 license<br />
Source:
<a href='https://github.com/home-assistant/home-assistant' target='_blank'>server</a> &mdash;
<a href='https://github.com/home-assistant/home-assistant-polymer' target='_blank'>frontend-ui</a>
</p>
<p>
Built using
<a href='https://www.python.org'>Python 3</a>,
<a href='https://www.polymer-project.org' target='_blank'>Polymer [[polymerVersion]]</a>,
Icons by <a href='https://www.google.com/design/icons/' target='_blank'>Google</a> and <a href='https://MaterialDesignIcons.com' target='_blank'>MaterialDesignIcons.com</a>.
</p>
</div>
<div class="system-log-intro">
<paper-card>
<template is='dom-if' if='[[updating]]'>
<div class='loading-container'>
<paper-spinner active></paper-spinner>
</div>
</template>
<template is='dom-if' if='[[!updating]]'>
<template is='dom-if' if='[[!items.length]]'>
<div class='card-content'>There are no new issues!</div>
</template>
<template is='dom-repeat' items='[[items]]'>
<paper-item on-tap='openLog'>
<paper-item-body two-line>
<div class="row">
[[item.message]]
</div>
<div secondary>
[[formatTime(item.timestamp)]] [[item.source]] ([[item.level]])
</div>
</paper-item-body>
</paper-item>
</template>
<div class='card-actions'>
<ha-call-service-button
hass='[[hass]]'
domain='system_log'
service='clear'
>Clear</ha-call-service-button>
<ha-progress-button
on-tap='_fetchData'
>Refresh</ha-progress-button>
</div>
</template>
</paper-card>
</div>
<p class='error-log-intro'>
Press the button to load the full Home Assistant log.
<paper-icon-button icon='mdi:refresh' on-tap='refreshErrorLog'></paper-icon-button>
</p>
<div class='error-log'>[[errorLog]]</div>
</div>
</app-header-layout>
<paper-dialog with-backdrop id="showlog">
<h2>Log Details ([[selectedItem.level]])</h2>
<paper-dialog-scrollable id="scrollable">
<p>[[fullTimeStamp(selectedItem.timestamp)]]</p>
<template is='dom-if' if='[[selectedItem.message]]'>
<pre>[[selectedItem.message]]</pre>
</template>
<template is='dom-if' if='[[selectedItem.exception]]'>
<pre>[[selectedItem.exception]]</pre>
</template>
</paper-dialog-scrollable>
</paper-dialog>
</template>
</dom-module>
<script>
class HaPanelDevInfo extends Polymer.Element {
static get is() { return 'ha-panel-dev-info'; }
static get properties() {
return {
hass: {
type: Object,
},
narrow: {
type: Boolean,
value: false,
},
showMenu: {
type: Boolean,
value: false,
},
polymerVersion: {
type: String,
value: Polymer.version,
},
errorLog: {
type: String,
value: '',
},
updating: {
type: Boolean,
value: true,
},
items: {
type: Array,
value: [],
},
selectedItem: {
type: Object,
},
};
}
ready() {
super.ready();
this.addEventListener('hass-service-called', ev => this.serviceCalled(ev));
}
serviceCalled(ev) {
// Check if this is for us
if (ev.detail.success && ev.detail.domain === 'system_log') {
// Do the right thing depending on service
if (ev.detail.service === 'clear') {
this.items = [];
}
}
}
connectedCallback() {
super.connectedCallback();
this.$.scrollable.dialogElement = this.$.showlog;
this._fetchData();
}
refreshErrorLog(ev) {
if (ev) ev.preventDefault();
this.errorLog = 'Loading error log…';
this.hass.callApi('GET', 'error_log').then(function (log) {
this.errorLog = log || 'No errors have been reported.';
}.bind(this));
}
fullTimeStamp(date) {
return new Date(date * 1000);
}
formatTime(date) {
return window.hassUtil.formatTime(new Date(date * 1000));
}
openLog(event) {
this.selectedItem = event.model.item;
this.$.showlog.open();
}
_fetchData() {
this.updating = true;
this.hass.callApi('get', 'error/all')
.then(function (items) {
this.items = items;
this.updating = false;
}.bind(this));
}
}
customElements.define(HaPanelDevInfo.is, HaPanelDevInfo);
</script>