141 lines
3.4 KiB
HTML
141 lines
3.4 KiB
HTML
<link rel="import" href="../../bower_components/polymer/polymer-element.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="../../bower_components/paper-icon-button/paper-icon-button.html">
|
|
|
|
<link rel='import' href='../../src/util/hass-mixins.html'>
|
|
|
|
<link rel="import" href="./hassio-repositories-editor.html">
|
|
<link rel="import" href="./hassio-addon-repository.html">
|
|
|
|
<dom-module id="hassio-addon-store">
|
|
<template>
|
|
<style include="iron-flex ha-style">
|
|
paper-card {
|
|
display: block;
|
|
}
|
|
.content {
|
|
padding: 24px 0 32px;
|
|
max-width: 600px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
hassio-addon-repository {
|
|
margin-top: 24px;
|
|
}
|
|
</style>
|
|
<app-header-layout has-scrolling-region>
|
|
<app-header slot="header" fixed>
|
|
<app-toolbar>
|
|
<paper-icon-button
|
|
icon='mdi:arrow-left'
|
|
on-tap='backTapped'
|
|
></paper-icon-button>
|
|
<div main-title>Add-on store</div>
|
|
<paper-icon-button
|
|
icon="mdi:refresh"
|
|
on-tap="refreshTapped"
|
|
></paper-icon-button>
|
|
</app-toolbar>
|
|
</app-header>
|
|
|
|
<hassio-repositories-editor
|
|
hass='[[hass]]'
|
|
repos='[[repos]]'
|
|
></hassio-repositories-editor>
|
|
|
|
<template is='dom-repeat' items='[[repos]]' as='repo' sort='sortRepos'>
|
|
<hassio-addon-repository
|
|
repo='[[repo]]'
|
|
addons='[[computeAddons(repo.slug)]]'
|
|
></hassio-addon-repository>
|
|
</template>
|
|
</app-header-layout>
|
|
</template>
|
|
</dom-module>
|
|
|
|
<script>
|
|
class HassioAddonStore extends Polymer.Element {
|
|
static get is() { return 'hassio-addon-store'; }
|
|
|
|
static get properties() {
|
|
return {
|
|
hass: Object,
|
|
addons: Array,
|
|
repos: Array,
|
|
visible: {
|
|
type: Boolean,
|
|
observer: 'visibleChanged',
|
|
},
|
|
};
|
|
}
|
|
|
|
ready() {
|
|
super.ready();
|
|
this.addEventListener('hass-api-called', ev => this.apiCalled(ev));
|
|
this.addEventListener('hassio-store-refresh', ev => this.refreshData(ev));
|
|
}
|
|
|
|
apiCalled(ev) {
|
|
if (ev.detail.success) {
|
|
this.loadData();
|
|
}
|
|
}
|
|
|
|
sortRepos(a, b) {
|
|
if (a.slug === 'local') {
|
|
return -1;
|
|
} else if (b.slug === 'local') {
|
|
return 1;
|
|
} else if (a.slug === 'core') {
|
|
return -1;
|
|
} else if (b.slug === 'core') {
|
|
return 1;
|
|
}
|
|
return a.name < b.name ? -1 : 1;
|
|
}
|
|
|
|
computeAddons(repo) {
|
|
return this.addons.filter(function (addon) {
|
|
return addon.repository === repo;
|
|
});
|
|
}
|
|
|
|
visibleChanged(visible) {
|
|
if (visible) {
|
|
this.loadData();
|
|
}
|
|
}
|
|
|
|
loadData() {
|
|
this.hass.callApi('get', 'hassio/addons')
|
|
.then((info) => {
|
|
this.addons = info.data.addons;
|
|
this.repos = info.data.repositories;
|
|
}, () => {
|
|
this.addons = [];
|
|
this.repos = [];
|
|
});
|
|
}
|
|
|
|
|
|
refreshData() {
|
|
this.hass.callApi('post', 'hassio/addons/reload')
|
|
.then(() => {
|
|
this.loadData();
|
|
});
|
|
}
|
|
|
|
refreshTapped() {
|
|
this.fire('hassio-store-refresh');
|
|
}
|
|
|
|
backTapped() {
|
|
history.back();
|
|
}
|
|
}
|
|
|
|
customElements.define(HassioAddonStore.is, HassioAddonStore);
|
|
</script>
|