init commit for Forge branch

src/render/components/bubble.js

@@ -0,0 +1,48 @@
+const Bubble =
+{
+    props: ["category", "text", "html", "blob", "modifier", "child"],
+
+    setup(props)
+    {
+        const getUrl = () => {
+            return `data:${props.category};base64,${props.blob}`;
+        }
+
+        Vue.onMounted(() => {
+
+            const el = document.getElementById("messenger");
+
+            setTimeout(() => {
+
+                el.dispatchEvent(new CustomEvent('adjust-scroll'));
+
+            }, 100);
+
+        });
+
+        if (!props.text) props.text = "..."; 
+
+        return { getUrl };
+    },
+
+    template: `
+        <div :class="'bubble ' + modifier + '-bubble ' + modifier +'-'+ child">
+
+            <small class="bubble-notify" v-if="modifier=='ai'"></small>
+
+            <p v-if="category=='text'">{{ text }}</p>
+
+            <p v-else-if="category=='audio'">{{ text }}</p>
+
+            <div v-else-if="category=='html'" v-html="html"></div>
+
+            <img v-else-if="category == 'image'" :src="getUrl()" />
+
+            <a v-else :download="text" :href="getUrl()">{{ text }}</a>
+
+        </div>`
+};
+
+export default Bubble;
+
+// TODO: should include other styling/actions for audio bubbles