feat(WIP): tweemoji

NUXT/components/UtilRenderers/slimVideoDescriptionRenderer.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="description" v-if="render.descriptionBodyText">
+  <div class="description" v-if="render.descriptionBodyText" ref="description">
     <template v-for="(text, index) in render.descriptionBodyText.runs">
       <template v-if="$rendererUtils.checkInternal(text)">
         <a
@@ -32,6 +32,7 @@
 
 <script>
 import { Browser } from "@capacitor/browser";
+import { parseEmoji } from "~/plugins/utils";
 export default {
   props: ["render"],
 
@@ -43,5 +44,10 @@ export default {
       await this.$router.push(url);
     },
   },
+
+  mounted() {
+    const twemojiParse = parseEmoji(this.$refs.description);
+    if (twemojiParse) this.$refs.description = twemojiParse;
+  },
 };
 </script>

NUXT/layouts/default.vue

@@ -214,6 +214,13 @@ div {
 .invert {
   filter: invert(100%);
 }
+
+.emoji {
+  display: inline-block;
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.1em;
+}
 </style>
 
 <style scoped>

NUXT/plugins/utils.js

@@ -41,11 +41,24 @@ function getMutationByKey(key, mutations) {
   if (!key || !mutations) return undefined;
   return mutations.find((mutation) => mutation.entityKey === key).payload;
 }
+
+function setHttp(link) {
+  if (link.search(/^http[s]?\:\/\//) == -1) {
+    link = 'http://' + link;
+  }
+  return link;
+}
+
+// Replace inputted html with tweemoji
+function parseEmoji(body) {
+  if (twemoji) return twemoji.parse(body)
+}
+
 function linkParser(url) {
   let result;
   if (url) {
     try {
-      const slug = new URL(url);
+      const slug = new URL(setHttp(url));
       const host = slug.hostname.toLowerCase().replace(/^www\./, "");
       if (host == "youtube.com") {
         result = slug;