From fa23360f13d8657a4aef75f758064f780e132c32 Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Sun, 12 Feb 2023 20:25:23 -0800
Subject: [PATCH] feat: :sparkles: add position, scale , fg, and bg MFM from
 v13

---
 packages/client/src/components/mfm.ts        | 29 ++++++++++++++++++++
 packages/client/src/scripts/get-note-menu.ts | 13 +++++++--
 packages/client/src/scripts/mfm-tags.ts      |  4 +++
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/components/mfm.ts b/packages/client/src/components/mfm.ts
index ddfcc3de17..f2905ec354 100644
--- a/packages/client/src/components/mfm.ts
+++ b/packages/client/src/components/mfm.ts
@@ -254,6 +254,35 @@ export default defineComponent({
 									style = `transform: ${rotate}(${degrees}deg); transform-origin: center center;`;
 									break;
 								}
+								case "position": {
+									if (!defaultStore.state.advancedMfm) break;
+									const x = parseFloat(token.props.args.x ?? "0");
+									const y = parseFloat(token.props.args.y ?? "0");
+									style = `transform: translateX(${x}em) translateY(${y}em);`;
+									break;
+								}
+								case "scale": {
+									if (!defaultStore.state.advancedMfm) {
+										style = "";
+										break;
+									}
+									const x = Math.min(parseFloat(token.props.args.x ?? "1"), 5);
+									const y = Math.min(parseFloat(token.props.args.y ?? "1"), 5);
+									style = `transform: scale(${x}, ${y});`;
+									break;
+								}
+								case "fg": {
+									let color = token.props.args.color;
+									if (!/^[0-9a-f]{3,6}$/i.test(color)) color = "f00";
+									style = `color: #${color};`;
+									break;
+								}
+								case "bg": {
+									let color = token.props.args.color;
+									if (!/^[0-9a-f]{3,6}$/i.test(color)) color = "f00";
+									style = `background-color: #${color};`;
+									break;
+								}
 							}
 							if (style == null) {
 								return h("span", {}, [
diff --git a/packages/client/src/scripts/get-note-menu.ts b/packages/client/src/scripts/get-note-menu.ts
index 8ab714af30..eb8006c1c5 100644
--- a/packages/client/src/scripts/get-note-menu.ts
+++ b/packages/client/src/scripts/get-note-menu.ts
@@ -224,9 +224,16 @@ export function getNoteMenu(props: {
 	}
 
 	function showReactions(): void {
-		os.popup(defineAsyncComponent(() => import('@/components/MkReactedUsersDialog.vue')), {
-			noteId: appearNote.id,
-		}, {}, 'closed');
+		os.popup(
+			defineAsyncComponent(
+				() => import("@/components/MkReactedUsersDialog.vue"),
+			),
+			{
+				noteId: appearNote.id,
+			},
+			{},
+			"closed",
+		);
 	}
 
 	async function translate(): Promise<void> {
diff --git a/packages/client/src/scripts/mfm-tags.ts b/packages/client/src/scripts/mfm-tags.ts
index 51e1fc4e63..b39c8b37b8 100644
--- a/packages/client/src/scripts/mfm-tags.ts
+++ b/packages/client/src/scripts/mfm-tags.ts
@@ -10,6 +10,10 @@ export const MFM_TAGS = [
 	"x2",
 	"x3",
 	"x4",
+	"scale",
+	"position",
+	"fg",
+	"bg",
 	"font",
 	"blur",
 	"rainbow",