message positioning for svgs

src/components/messageView/message/calcPosition.ts

@@ -0,0 +1,33 @@
+import {computed} from "vue";
+
+// Size of "side-gutters" of message window.
+const margin = 20;
+const messagePadding = 15;
+const firstChildMargin = 45;
+
+
+function calcXPosition(messageWidth: number, windowWidth: number, modifier: string) {
+	let offset = margin;
+
+	if (modifier == "sf") {
+		offset = windowWidth - messageWidth - margin;
+	}
+
+	return offset
+}
+
+function calcMessagePosition(modifier: string, messageWidth: number, 
+    windowWidth: number, anchorPosition: any) {
+
+	const X = calcXPosition(messageWidth, windowWidth, modifier);
+
+    // Depends on if first child.
+    let Y = firstChildMargin;
+    if (anchorPosition != "none") {
+        Y = anchorPosition + messagePadding;
+    }
+
+	return `translate(${X} ${Y})`;
+}
+
+export default calcMessagePosition;