Skip to content

Instantly share code, notes, and snippets.

@zacharytamas
Created December 6, 2016 17:34
Show Gist options
  • Save zacharytamas/68cd08c70d2e1d55729eadd2f69e4ba2 to your computer and use it in GitHub Desktop.
Save zacharytamas/68cd08c70d2e1d55729eadd2f69e4ba2 to your computer and use it in GitHub Desktop.
RedditFeedRow
const RedditFeedRowTemplate = `
<style>
:host {
display: block;
}
div {
display: flex;
}
div > * {
padding: 8px;
}
</style>
<img>
<h2 id="title"></h2>`;
class RedditFeedRowElement extends HTMLElement {
createdCallback() {
this.root = this.createShadowRoot();
this.template = document.createElement('div')
this.template.innerHTML = RedditFeedRowTemplate;
}
attachedCallback() {
const listing = this.data.data;
this.template.querySelector('#title').innerHTML = listing.title;
const thumbnail = this.template.querySelector('img');
if (listing.thumbnail !== 'self') {
thumbnail.src = listing.thumbnail;
} else {
thumbnail.style.display = 'none';
}
this.root.appendChild(this.template);
}
}
const RedditFeedRow = document.registerElement('reddit-feed-row', RedditFeedRowElement);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment