mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-10 02:46:38 +00:00
Convert configurator to markdown (#644)
* Convert configurator to markdown * Lint * Change order
This commit is contained in:
parent
8d790e9601
commit
cb5c9b3f3f
@ -1,7 +1,9 @@
|
||||
<link rel='import' href='../../bower_components/polymer/polymer-element.html'>
|
||||
|
||||
<link rel='import' href='../util/hass-mixins.html'>
|
||||
|
||||
<script>
|
||||
class HaMarkdown extends Polymer.Element {
|
||||
class HaMarkdown extends window.hassMixins.EventsMixin(Polymer.Element) {
|
||||
static get is() { return 'ha-markdown'; }
|
||||
|
||||
static get properties() {
|
||||
@ -28,6 +30,22 @@ class HaMarkdown extends Polymer.Element {
|
||||
if (scriptLoaded === 1) {
|
||||
const converter = window.Markdown.getSanitizingConverter();
|
||||
this.innerHTML = converter.makeHtml(content);
|
||||
|
||||
const walker = document.createTreeWalker(this, 1 /* SHOW_ELEMENT */, null, false);
|
||||
|
||||
while (walker.nextNode()) {
|
||||
const node = walker.currentNode;
|
||||
|
||||
// Open external links in a new window
|
||||
if (node.tagName === 'A' &&
|
||||
node.host !== document.location.host) {
|
||||
node.target = '_blank';
|
||||
|
||||
// Fire a resize event when images loaded to notify content resized
|
||||
} else if (node.tagName === 'IMG') {
|
||||
node.addEventListener('load', this.resize);
|
||||
}
|
||||
}
|
||||
} else if (scriptLoaded === 2) {
|
||||
this.innerText = content;
|
||||
}
|
||||
@ -35,6 +53,7 @@ class HaMarkdown extends Polymer.Element {
|
||||
|
||||
ready() {
|
||||
super.ready();
|
||||
this.resize = () => this.fire('iron-resize');
|
||||
|
||||
Polymer.importHref(
|
||||
'/static/pagedown-js.html',
|
||||
|
@ -5,6 +5,8 @@
|
||||
<link rel='import' href='../../bower_components/paper-button/paper-button.html'>
|
||||
<link rel='import' href='../../bower_components/paper-input/paper-input.html'>
|
||||
|
||||
<link rel='import' href='../components/ha-markdown.html'>
|
||||
|
||||
<dom-module id='more-info-configurator'>
|
||||
<template>
|
||||
<style is="custom-style" include="iron-flex"></style>
|
||||
@ -13,6 +15,10 @@
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
p > img {
|
||||
max-width: 100%;
|
||||
}
|
||||
@ -43,27 +49,12 @@
|
||||
|
||||
<div class='layout vertical'>
|
||||
<template is='dom-if' if='[[isConfigurable]]'>
|
||||
|
||||
<p hidden$='[[!stateObj.attributes.description]]'>
|
||||
[[stateObj.attributes.description]]
|
||||
<p hidden$='[[!stateObj.attributes.link_url]]'>
|
||||
<a
|
||||
href='[[stateObj.attributes.link_url]]'
|
||||
target='_blank'
|
||||
>
|
||||
[[stateObj.attributes.link_name]]
|
||||
</a>
|
||||
</p>
|
||||
</p>
|
||||
<ha-markdown content='[[stateObj.attributes.description]]'></ha-markdown>
|
||||
|
||||
<p class='error' hidden$='[[!stateObj.attributes.errors]]'>
|
||||
[[stateObj.attributes.errors]]
|
||||
</p>
|
||||
|
||||
<p class='center' hidden$='[[!stateObj.attributes.description_image]]'>
|
||||
<img src='[[stateObj.attributes.description_image]]' />
|
||||
</p>
|
||||
|
||||
<template is='dom-repeat' items='[[stateObj.attributes.fields]]'>
|
||||
<paper-input
|
||||
label='[[item.name]]'
|
||||
|
@ -30,8 +30,12 @@
|
||||
|
||||
if (newHass.moreInfoEntityId) {
|
||||
if (DEBUG) console.log('pushing state');
|
||||
// We keep track of where we opened moreInfo from so that we don't
|
||||
// pop the state when we close the modal if the modal has navigated
|
||||
// us away.
|
||||
this.moreInfoOpenedFromPath = window.location.pathname;
|
||||
history.pushState(null, null, window.location.pathname);
|
||||
} else {
|
||||
} else if (window.location.pathname === this.moreInfoOpenedFromPath) {
|
||||
if (DEBUG) console.log('history back');
|
||||
this.ignoreNextPopstate = true;
|
||||
history.back();
|
||||
|
Loading…
x
Reference in New Issue
Block a user