production refactor

src/render/components/context.js

@@ -0,0 +1,38 @@
+
+const Context = 
+{
+    props: ["modifier", "context", "avatar", "audio", "id"],
+
+    setup(props) {
+        const playback = Vue.ref(false);
+
+        Vue.onMounted(() => {
+            window.mainApi.on("playback", (id, status) => {
+                if (id === props.id) {
+                    playback.value = status;
+                }
+            });
+        });
+
+        return { playback };
+    },
+
+    template: `
+        <span :class="'context ' + modifier + '-context'">
+
+            <div 
+                v-if="avatar != 'False'"
+                class="context-avatar"
+                :class="{ audio: playback }"
+            >      
+
+                <img :src="avatar">
+                
+            </div>
+
+            {{ context }}
+
+        </span> `
+}
+
+export default Context;