Skip to content
Closed
25 changes: 25 additions & 0 deletions gulp/common/http.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
// From https://www.tomas-dvorak.cz/posts/nodejs-request-without-dependencies/
const http = require('http');
const https = require('https');

module.exports.getContent = function getContent(url) {
// return new pending promise
return new Promise((resolve, reject) => {
// select http or https module, depending on reqested url
const lib = url.startsWith('https') ? https : http;
const request = lib.get(url, (response) => {
// handle http errors
if (response.statusCode < 200 || response.statusCode > 299) {
reject(new Error('Failed to load page, status code: ' + response.statusCode));
}
// temporary data holder
const body = [];
// on every content chunk, push it to the data array
response.on('data', chunk => body.push(chunk));
// we are done, resolve promise with those joined chunks
response.on('end', () => resolve(body.join('')));
});
// handle connection errors of the request
request.on('error', err => reject(err));
});
};
4 changes: 2 additions & 2 deletions gulp/tasks/gen-index-html.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,8 @@ function generateIndex(es6) {
const toReplace = [
// Needs to look like a color during CSS minifiaction
['{{ theme_color }}', '#THEME'],
['/home-assistant-polymer/hass_frontend/mdi.html',
`/static/mdi-${md5(path.resolve(config.output, 'mdi.html'))}.html`],
['/home-assistant-polymer/hass_frontend/hass_icons.html',
`/static/hass_icons-${md5(path.resolve(config.output, 'hass_icons.html'))}.html`],
];

if (!es6) {
Expand Down
3 changes: 2 additions & 1 deletion gulp/tasks/gen-service-worker.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const DEV = !!JSON.parse(process.env.BUILD_DEV || 'true');
const dynamicUrlToDependencies = {};

const staticFingerprinted = [
'mdi.html',
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we still have to fingerprint mdi

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No. It's only going to be loaded from inside ha-icon and that will reference to it without fingerprint.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When a new service worker is installed, it will check the fingerprint and download a new version if it has changed.

'hass_icons.html',
'translations/en.json',
];

Expand Down Expand Up @@ -80,6 +80,7 @@ function generateServiceWorker(es6) {
directoryIndex: '',
dynamicUrlToDependencies: dynamicUrlToDependencies,
staticFileGlobs: [
baseRootDir + '/mdi.html',
baseRootDir + '/icons/favicon.ico',
baseRootDir + '/icons/favicon-192x192.png',
baseRootDir + '/webcomponents-lite.min.js',
Expand Down
103 changes: 103 additions & 0 deletions gulp/tasks/hass-icons.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
const gulp = require('gulp');
const path = require('path');
const fs = require('fs');
const parse5 = require('parse5');
const getContent = require('../common/http').getContent;

const outputDir = 'hass_frontend';

This comment was marked as resolved.

const iconRegEx = /hass:[\w-]+/g;

const BUILT_IN_PANEL_ICONS = [
'settings', // Config
'home-assistant', // Hass.io
'poll-box', // History panel
'format-list-bulleted-type', // Logbook
'mailbox', // Mailbox
'account-location', // Map
'cart', // Shopping List
];

function mapFiles(startPath, filter, mapFunc) {
const files = fs.readdirSync(startPath);
for (let i = 0; i < files.length; i++) {
const filename = path.join(startPath, files[i]);
const stat = fs.lstatSync(filename);
if (stat.isDirectory()) {
mapFiles(filename, filter, mapFunc);
} else if (filename.indexOf(filter) >= 0) {
mapFunc(filename);
}
}
}


function findIcons() {
const icons = new Set(BUILT_IN_PANEL_ICONS);
function processFile(filename) {
const content = fs.readFileSync(filename);
let match;
// eslint-disable-next-line
while (match = iconRegEx.exec(content)) {
// strip off "hass:" and add to set
icons.add(match[0].substr(5));
}
}
mapFiles('src', '.html', processFile);
mapFiles('panels', '.html', processFile);
mapFiles('hassio', '.html', processFile);
mapFiles('js', '.js', processFile);
return icons;
}

function generateHassIcons() {
const icons = findIcons();

const iconDoc = parse5.parseFragment(fs.readFileSync(`${outputDir}/mdi.html`, { encoding: 'utf-8' }));

const ironIconset = iconDoc.childNodes[0];
ironIconset.attrs.forEach((attr) => {
if (attr.name === 'name') {
attr.value = 'hass';
}
});

const defs = ironIconset.childNodes[0].childNodes[0];
defs.childNodes = defs.childNodes.filter(icon => icons.has(icon.attrs[0].value));

fs.writeFileSync(`${outputDir}/hass_icons.html`, parse5.serialize(iconDoc));
// eslint-disable-next-line
console.log(`Home Assistant has ${icons.size} icons.`);
}

async function downloadMDIIcons() {
// Fetch website of MaterialDesignIcons.com
const content = await getContent('https://raw.githubusercontent.com/Templarian/MaterialDesign/master/site/getting-started.savvy');
// Find link to Polymer v1 download
const downloadMatch = content.match('(/api/download/polymer/v1/([A-Z0-9-]{36}))');

if (!downloadMatch) {
// eslint-disable-next-line
console.error('Unable to find Polymer v1 download link');
return null;
}

// Download iconset
let iconSet = await getContent(`https://materialdesignicons.com${downloadMatch[0]}`);

// Strip out the import statement
iconSet = iconSet.substr(iconSet.indexOf('<iron-iconset-svg'));

return iconSet;
}

async function main() {
const iconSet = await downloadMDIIcons();

if (iconSet === null) throw new Error('Download MDI failed!');

fs.writeFileSync(`${outputDir}/mdi.html`, iconSet);
generateHassIcons();
}

// gulp.task('gen-hass-icons', generateHassIcons);
gulp.task('gen-icons', main);
2 changes: 1 addition & 1 deletion hassio/addon-store/hassio-addon-repository.html
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@
}

computeIcon(addon) {
return addon.installed && addon.installed !== addon.version ? 'mdi:arrow-up-bold-circle' : 'mdi:puzzle';
return addon.installed && addon.installed !== addon.version ? 'hass:arrow-up-bold-circle' : 'hass:puzzle';
}

computeIconTitle(addon) {
Expand Down
4 changes: 2 additions & 2 deletions hassio/addon-store/hassio-repositories-editor.html
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@
<hassio-card-content
title='[[repo.name]]'
description='[[repo.url]]'
icon='mdi:github-circle'
icon='hass:github-circle'
></hassio-card-content>
</div>
<div class='card-actions'>
Expand All @@ -52,7 +52,7 @@
</template>
<paper-card>
<div class='card-content add'>
<iron-icon icon='mdi:github-circle'></iron-icon>
<iron-icon icon='hass:github-circle'></iron-icon>
<paper-input label='Add new repository by URL' value='{{repoUrl}}'></paper-input>
</div>
<div class='card-actions'>
Expand Down
10 changes: 5 additions & 5 deletions hassio/addon-view/hassio-addon-info.html
Original file line number Diff line number Diff line change
Expand Up @@ -52,11 +52,11 @@
}
iron-icon.stopped {
color: var(--google-red-300);
}
}
ha-call-api-button {
font-weight: 500;
color: var(--primary-color);
}
}
.right {
float: right;
}
Expand All @@ -67,7 +67,7 @@
<hassio-card-content
title='[[addon.name]] [[addon.last_version]] is available'
description='You are currently running version [[addon.version]]'
icon='mdi:arrow-up-bold-circle'
icon='hass:arrow-up-bold-circle'
icon-class='update'
></hassio-card-content>
</div>
Expand All @@ -93,14 +93,14 @@
<iron-icon
title='Add-on is running'
class='running'
icon='mdi:circle'
icon='hass:circle'
></iron-icon>
</template>
<template is='dom-if' if='[[!isRunning]]'>
<iron-icon
title='Add-on is stopped'
class='stopped'
icon='mdi:circle'
icon='hass:circle'
></iron-icon>
</template>
</template>
Expand Down
6 changes: 3 additions & 3 deletions hassio/addon-view/hassio-addon-view.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
:host {
color: var(--primary-text-color);
--paper-card-header-color: var(--primary-text-color);
}
}
.content {
padding: 24px 0 32px;
max-width: 600px;
Expand All @@ -42,10 +42,10 @@
></app-route>
<app-header-layout has-scrolling-region>
<app-header fixed slot='header'>
<app-toolbar>
<app-toolbar>
<ha-menu-button narrow='[[narrow]]' show-menu='[[showMenu]]'></ha-menu-button>
<paper-icon-button
icon='mdi:arrow-left'
icon='hass:arrow-left'
on-click='backTapped'
></paper-icon-button>
<div main-title>Hass.io: add-on details</div>
Expand Down
2 changes: 1 addition & 1 deletion hassio/dashboard/hassio-addons.html
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
}

computeIcon(addon) {
return addon.installed !== addon.version ? 'mdi:arrow-up-bold-circle' : 'mdi:puzzle';
return addon.installed !== addon.version ? 'hass:arrow-up-bold-circle' : 'hass:puzzle';
}

computeIconTitle(addon) {
Expand Down
6 changes: 3 additions & 3 deletions hassio/dashboard/hassio-hass-update.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,15 +20,15 @@
}
</style>
<template is='dom-if' if='[[computeUpdateAvailable(hassInfo)]]'>
<div class='content'>
<div class='content'>
<div class='card-group'>
<div class='title'>Update available! 🎉</div>
<div class='title'>Update available! 🎉</div>
<paper-card>
<div class='card-content'>
<hassio-card-content
title='Home Assistant [[hassInfo.last_version]] is available'
description='You are currently running version [[hassInfo.version]]'
icon='mdi:home-assistant'
icon='hass:home-assistant'
icon-class='hassupdate'
></hassio-card-content>
<template is='dom-if' if='[[error]]'>
Expand Down
2 changes: 1 addition & 1 deletion hassio/hassio-markdown-dialog.html
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@
>
<app-toolbar>
<paper-icon-button
icon='mdi:close'
icon='hass:close'
dialog-dismiss
></paper-icon-button>
<div main-title>[[title]]</div>
Expand Down
6 changes: 3 additions & 3 deletions hassio/hassio-pages-with-tabs.html
Original file line number Diff line number Diff line change
Expand Up @@ -32,12 +32,12 @@
</style>
<app-header-layout has-scrolling-region>
<app-header fixed slot='header'>
<app-toolbar>
<app-toolbar>
<ha-menu-button narrow='[[narrow]]' show-menu='[[showMenu]]'></ha-menu-button>
<div main-title>Hass.io</div>
<template is='dom-if' if='[[showRefreshButton(page)]]'>
<paper-icon-button
icon='mdi:refresh'
icon='hass:refresh'
on-click='refreshClicked'
></paper-icon-button>
</template>
Expand Down Expand Up @@ -89,7 +89,7 @@
></hassio-markdown-dialog>

<template is='dom-if' if='[[equals(page, "snapshots")]]'>
<hassio-snapshot
<hassio-snapshot
hass='[[hass]]'
snapshot-slug='{{snapshotSlug}}'
snapshot-deleted='{{snapshotDeleted}}'
Expand Down
2 changes: 1 addition & 1 deletion hassio/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,6 @@
}
</script>
<link rel='import' href='./hassio-app.html'>
<link rel='import' href='/static/mdi.html' async>
<link rel='import' href='/static/hass_icons.html' async>
</body>
</html>
6 changes: 3 additions & 3 deletions hassio/snapshots/hassio-snapshot.html
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
<paper-dialog id='dialog' with-backdrop on-iron-overlay-closed='_dialogClosed'>
<app-toolbar>
<paper-icon-button
icon='mdi:close'
icon='hass:close'
dialog-dismiss
></paper-icon-button>
<div main-title>[[_computeName(snapshot)]]</div>
Expand Down Expand Up @@ -97,14 +97,14 @@
</template>
<div class='buttons'>
<paper-icon-button
icon='mdi:delete'
icon='hass:delete'
on-click='_deleteClicked'
class='warning'
title='Delete snapshot'
></paper-icon-button>
<a href='[[_computeDownloadUrl(snapshotSlug)]]' download='[[_computeDownloadName(snapshot)]]'>
<paper-icon-button
icon='mdi:download'
icon='hass:download'
class='download'
title='Download snapshot'
></paper-icon-button>
Expand Down
2 changes: 1 addition & 1 deletion hassio/snapshots/hassio-snapshots.html
Original file line number Diff line number Diff line change
Expand Up @@ -242,7 +242,7 @@
}

_computeIcon(type) {
return type === 'full' ? 'mdi:package-variant-closed' : 'mdi:package-variant';
return type === 'full' ? 'hass:package-variant-closed' : 'hass:package-variant';
}

_snapshotClicked(ev) {
Expand Down
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@
{% if panel_url -%}
<link rel='import' href='{{ panel_url }}' async>
{% endif -%}
<link rel='import' href='/home-assistant-polymer/hass_frontend/mdi.html' async>
<link rel='import' href='/home-assistant-polymer/hass_frontend/hass_icons.html' async>
{% for extra_url in extra_urls -%}
<link rel='import' href='{{ extra_url }}' async>
{% endfor -%}
Expand Down
2 changes: 1 addition & 1 deletion js/panel-config/condition/condition_row.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default class ConditionRow extends Component {
vertical-offset="-5"
>
<paper-icon-button
icon="mdi:dots-vertical"
icon="hass:dots-vertical"
slot="dropdown-trigger"
/>
<paper-listbox slot="dropdown-content">
Expand Down
2 changes: 1 addition & 1 deletion js/panel-config/script/action_row.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default class Action extends Component {
vertical-offset="-5"
>
<paper-icon-button
icon="mdi:dots-vertical"
icon="hass:dots-vertical"
slot="dropdown-trigger"
/>
<paper-listbox slot="dropdown-content">
Expand Down
2 changes: 1 addition & 1 deletion js/panel-config/trigger/trigger_row.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export default class TriggerRow extends Component {
vertical-offset="-5"
>
<paper-icon-button
icon="mdi:dots-vertical"
icon="hass:dots-vertical"
slot="dropdown-trigger"
/>
<paper-listbox slot="dropdown-content">
Expand Down
Loading