Make ha-markdown use no polymer (#662)

This commit is contained in:
Paulus Schoutsen 2017-11-21 21:15:04 -08:00 committed by GitHub
parent ea4fd25330
commit 3a100bff23
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,35 +1,39 @@
<link rel='import' href='../../bower_components/polymer/polymer-element.html'>
<link rel='import' href='../util/hass-mixins.html'>
<script>
class HaMarkdown extends window.hassMixins.EventsMixin(Polymer.Element) {
class HaMarkdown extends window.hassMixins.EventsMixin(HTMLElement) {
static get is() { return 'ha-markdown'; }
static get properties() {
return {
content: {
type: String,
},
scriptLoaded: {
type: Number,
connectedCallback() {
// 0 = not loaded, 1 = success, 2 = error
value: 0,
},
};
this._scriptLoaded = 0;
this._renderScheduled = false;
this._resize = () => this.fire('iron-resize');
Polymer.importHref(
'/static/pagedown-js.html',
() => { this._scriptLoaded = 1; this._render(); },
() => { this._scriptLoaded = 2; this._render(); },
);
}
static get observers() {
return [
'updateContent(content, scriptLoaded)',
];
set content(value) {
this._content = value;
this._render();
}
updateContent(content, scriptLoaded) {
if (scriptLoaded === 1) {
_render() {
if (this._scriptLoaded === 0 || this._renderScheduled) return;
this._renderScheduled = true;
// debounce it to next microtask.
Promise.resolve().then(() => {
this._renderScheduled = false;
if (this._scriptLoaded === 1) {
const converter = window.Markdown.getSanitizingConverter();
this.innerHTML = converter.makeHtml(content);
this.innerHTML = converter.makeHtml(this._content);
const walker = document.createTreeWalker(this, 1 /* SHOW_ELEMENT */, null, false);
@ -43,23 +47,13 @@ class HaMarkdown extends window.hassMixins.EventsMixin(Polymer.Element) {
// Fire a resize event when images loaded to notify content resized
} else if (node.tagName === 'IMG') {
node.addEventListener('load', this.resize);
node.addEventListener('load', this._resize);
}
}
} else if (scriptLoaded === 2) {
this.innerText = content;
} else if (this._scriptLoaded === 2) {
this.innerText = this._content;
}
}
ready() {
super.ready();
this.resize = () => this.fire('iron-resize');
Polymer.importHref(
'/static/pagedown-js.html',
() => { this.scriptLoaded = 1; },
() => { this.scriptLoaded = 2; },
);
});
}
}