Merge branch 'master' of https://github.com/kylereddoch/kylereddoch.github.io

Author: kylereddoch

assets/kylestechkorner/js/mastodon-post.js

@@ -1,6 +1,4 @@
-const mastodonPostTemplate = document.createElement("template");
-
-mastodonPostTemplate.innerHTML = `
+const mastodonPostTemplate=document.createElement("template");mastodonPostTemplate.innerHTML=`
 <figure>
   <blockquote data-key="content"></blockquote>
   <figcaption>
@@ -14,102 +12,4 @@ mastodonPostTemplate.innerHTML = `
     </dl>
   </figcaption>
 </figure>
-`;
-
-mastodonPostTemplate.id = "mastodon-post-template";
-
-if (!document.getElementById(mastodonPostTemplate.id)) {
-  document.body.appendChild(mastodonPostTemplate);
-}
-
-class MastodonPost extends HTMLElement {
-  static register(tagName) {
-    if ("customElements" in window) {
-      customElements.define(tagName || "mastodon-post", MastodonPost);
-    }
-  }
-
-  async connectedCallback() {
-    this.append(this.template);
-
-    const data = { ...(await this.data), ...this.linkData };
-
-    this.slots.forEach((slot) => {
-      slot.dataset.key.split(",").forEach((keyItem) => {
-        const value = this.getValue(keyItem, data);
-        if (keyItem === "content") {
-          slot.innerHTML = value;
-        } else {
-          this.populateSlot(slot, value);
-        }
-      });
-    });
-  }
-
-  populateSlot(slot, value) {
-    if (typeof value == "string" && value.startsWith("http")) {
-      if (slot.localName === "img") slot.src = value;
-      if (slot.localName === "a") slot.href = value;
-    } else {
-      slot.textContent = value;
-    }
-  }
-
-  handleKey(object, key) {
-    const parsedKeyInt = parseFloat(key);
-
-    if (Number.isNaN(parsedKeyInt)) {
-      return object[key];
-    }
-
-    return object[parsedKeyInt];
-  }
-
-  getValue(string, data) {
-    let keys = string.trim().split(/\.|\[|\]/g);
-    keys = keys.filter((string) => string.length);
-
-    const value = keys.reduce(
-      (object, key) => this.handleKey(object, key),
-      data
-    );
-    return value;
-  }
-
-  get template() {
-    return document
-      .getElementById(
-        this.getAttribute("template") || `${this.localName}-template`
-      )
-      .content.cloneNode(true);
-  }
-
-  get slots() {
-    return this.querySelectorAll("[data-key]");
-  }
-
-  get link() {
-    return this.querySelector("a").href;
-  }
-
-  get linkData() {
-    const url = new URL(this.link);
-    const paths = url.pathname.split("/").filter((string) => string.length);
-    return {
-      url: this.link,
-      hostname: url.hostname,
-      username: paths.find((path) => path.startsWith("@")),
-      postId: paths.find((path) => !path.startsWith("@"))
-    };
-  }
-
-  get endpoint() {
-    return `https://${this.linkData.hostname}/api/v1/statuses/${this.linkData.postId}`;
-  }
-
-  get data() {
-    return fetch(this.endpoint).then((response) => response.json());
-  }
-}
-
-MastodonPost.register();
+`,mastodonPostTemplate.id="mastodon-post-template",document.getElementById(mastodonPostTemplate.id)||document.body.appendChild(mastodonPostTemplate);class MastodonPost extends HTMLElement{static register(e){"customElements"in window&&customElements.define(e||"mastodon-post",MastodonPost)}async connectedCallback(){this.append(this.template);const e={...await this.data,...this.linkData};this.querySelectorAll("[data-key]").forEach(async t=>{const{key:s}=t.dataset,n=e[s];s==="content"?t.innerHTML=n:typeof n=="string"&&n.startsWith("http")?(t.localName==="a"&&(t.href=n),t.localName==="img"&&(t.src=n)):t.textContent=n})}get template(){return document.getElementById(mastodonPostTemplate.id).content.cloneNode(!0)}get link(){return this.querySelector("a").href}get linkData(){const e=new URL(this.link),t=e.pathname.split("/").filter(e=>e.length);return{url:this.link,hostname:e.hostname,username:t.find(e=>e.startsWith("@")),postId:t.find(e=>!e.startsWith("@"))}}get endpoint(){return`https://${this.linkData.hostname}/api/v1/statuses/${this.linkData.postId}`}get data(){return fetch(this.endpoint).then(e=>e.json())}}MastodonPost.register()