From 8d3d6ebd8ae40770747e472d1ebf92a552cae4db Mon Sep 17 00:00:00 2001
From: Daniel James <danielt70@icloud.com>
Date: Sun, 16 Jun 2024 22:29:11 +0100
Subject: [PATCH] [feature/bbcode-icon-name] Add icon preview to ACP form

PHPBB3-17326
---
 phpBB/adm/style/acp_bbcodes.html | 5 ++++-
 phpBB/adm/style/admin.js         | 5 +++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/phpBB/adm/style/acp_bbcodes.html b/phpBB/adm/style/acp_bbcodes.html
index 774bac5e08..afefc3f978 100644
--- a/phpBB/adm/style/acp_bbcodes.html
+++ b/phpBB/adm/style/acp_bbcodes.html
@@ -51,7 +51,10 @@
 		<legend>{{ lang('APPEARANCE') }}</legend>
 	<dl>
 		<dt><label for="bbcode_font_icon">{{ lang('BBCODE_FONT_ICON') }}</label><br /><span>{{ lang('BBCODE_FONT_EXPLAIN') }}</span></dt>
-		<dd><input type="text" name="bbcode_font_icon" id="bbcode_font_icon" value="{{ BBCODE_FONT_ICON }}" /></dd>
+		<dd>
+			<input type="text" name="bbcode_font_icon" id="bbcode_font_icon" value="{{ BBCODE_FONT_ICON }}" />
+			<i id="bbcode_icon_preview" class="icon fa-{{ BBCODE_FONT_ICON }}" aria-hidden="true"></i>
+		</dd>
 	</dl>
 	</fieldset>
 
diff --git a/phpBB/adm/style/admin.js b/phpBB/adm/style/admin.js
index 23bd4a116b..050408971c 100644
--- a/phpBB/adm/style/admin.js
+++ b/phpBB/adm/style/admin.js
@@ -259,5 +259,10 @@ function parse_document(container)
 		$('.actions a:has(i.acp-icon)').mouseover(function () {
 			$(this).css("text-decoration", "none");
 		});
+
+		// Live update BBCode font icon preview
+		$('#bbcode_font_icon').on('keyup', function(e) {
+			$('#bbcode_icon_preview').attr('class', "icon fa-" + $('#bbcode_font_icon').val());
+		});
 	});
 })(jQuery);