From b33c77833256d705daee2952d37e81e73694f7e7 Mon Sep 17 00:00:00 2001
From: vtyeh <vtyeh24@gmail.com>
Date: Thu, 24 Oct 2024 17:45:46 -0700
Subject: [PATCH 1/4] Fix font toggle in classic editor using ProseMirror
 transactions

---
 prose/prose.js         |  1 +
 templates/classic.tmpl | 21 ++++++++++++++++++---
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/prose/prose.js b/prose/prose.js
index cb39c6d..964688f 100644
--- a/prose/prose.js
+++ b/prose/prose.js
@@ -118,3 +118,4 @@ class ProseMirrorView {
 
 let place = document.querySelector("#editor");
 let view = new ProseMirrorView(place, $content.value);
+window.editorView = view;
diff --git a/templates/classic.tmpl b/templates/classic.tmpl
index 58f82c7..b3029f1 100644
--- a/templates/classic.tmpl
+++ b/templates/classic.tmpl
@@ -348,13 +348,27 @@
 		  } catch (e) {}
 		};
 		var fonts = document.querySelectorAll('nav#font-picker a.font');
+		var setFontClass = function(fontClass) {
+			return (state, dispatch) => {
+				if (dispatch && window.editorView) {
+					window.editorView.view.dom.classList.remove("norm", "sans", "wrap");
+					window.editorView.view.dom.classList.add(fontClass);
+				}
+				return true;
+			}
+		}
+		var changeEditorFont = function(fontClass) {
+			if (window.editorView) {
+				const command = setFontClass(fontClass);
+				command(window.editorView.view.state, window.editorView.view.dispatch);
+			}
+		};
 		for (var i=0; i<fonts.length; i++) {
 			fonts[i].addEventListener('click', function(e) {
 				e.preventDefault();
 				selectedFont = this.href.substring(this.href.indexOf('#')+1);
-				// TODO: don't change classes on the editor window
-				//$title.el.className = selectedFont;
-				//$writer.el.className = selectedFont;
+				$title.el.className = selectedFont;
+				changeEditorFont(selectedFont);
 				document.querySelector('nav#font-picker li.selected').classList.remove('selected');
 				this.parentElement.classList.add('selected');
 				H.set('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', selectedFont);
@@ -364,6 +378,7 @@
 			});
 		}
 		var selectedFont = H.get('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', '{{.Post.Font}}');
+		document.addEventListener('DOMContentLoaded', () => {changeEditorFont(selectedFont)});
 		var sfe = document.querySelector('nav#font-picker a.font.'+selectedFont);
 		if (sfe != null) {
 			sfe.click();

From 08fd4be580259f57b9984a08a9c4346fc22f66be Mon Sep 17 00:00:00 2001
From: vtyeh <vtyeh24@gmail.com>
Date: Mon, 28 Oct 2024 11:28:03 -0700
Subject: [PATCH 2/4] Add font classes to prose-editor.less

---
 less/prose-editor.less | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/less/prose-editor.less b/less/prose-editor.less
index 6cd1cb5..773ed2b 100644
--- a/less/prose-editor.less
+++ b/less/prose-editor.less
@@ -33,6 +33,18 @@ body#pad.classic {
 	}
 }
 
+.norm {
+	font-family: serifFont;
+}
+
+.sans {
+	font-family: @sansFont;
+}
+
+.wrap {
+	font-family: @monoFont;
+}
+
 #title {
 	margin-left: @classicHorizMargin;
 	margin-right: @classicHorizMargin;

From 3e9c122568dd203a0b0ee8cd7f83f1287906c03e Mon Sep 17 00:00:00 2001
From: vtyeh <vtyeh24@gmail.com>
Date: Mon, 28 Oct 2024 11:47:46 -0700
Subject: [PATCH 3/4] Remove ProseMirror transaction logic because it is
 unnecessary

---
 templates/classic.tmpl | 19 +++++--------------
 1 file changed, 5 insertions(+), 14 deletions(-)

diff --git a/templates/classic.tmpl b/templates/classic.tmpl
index b3029f1..0c411b4 100644
--- a/templates/classic.tmpl
+++ b/templates/classic.tmpl
@@ -348,19 +348,10 @@
 		  } catch (e) {}
 		};
 		var fonts = document.querySelectorAll('nav#font-picker a.font');
-		var setFontClass = function(fontClass) {
-			return (state, dispatch) => {
-				if (dispatch && window.editorView) {
-					window.editorView.view.dom.classList.remove("norm", "sans", "wrap");
-					window.editorView.view.dom.classList.add(fontClass);
-				}
-				return true;
-			}
-		}
-		var changeEditorFont = function(fontClass) {
+		var setEditorFontClass = function(fontClass) {
 			if (window.editorView) {
-				const command = setFontClass(fontClass);
-				command(window.editorView.view.state, window.editorView.view.dispatch);
+				window.editorView.view.dom.classList.remove("norm", "sans", "wrap");
+				window.editorView.view.dom.classList.add(fontClass);
 			}
 		};
 		for (var i=0; i<fonts.length; i++) {
@@ -368,7 +359,7 @@
 				e.preventDefault();
 				selectedFont = this.href.substring(this.href.indexOf('#')+1);
 				$title.el.className = selectedFont;
-				changeEditorFont(selectedFont);
+				setEditorFontClass(selectedFont);
 				document.querySelector('nav#font-picker li.selected').classList.remove('selected');
 				this.parentElement.classList.add('selected');
 				H.set('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', selectedFont);
@@ -378,7 +369,7 @@
 			});
 		}
 		var selectedFont = H.get('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', '{{.Post.Font}}');
-		document.addEventListener('DOMContentLoaded', () => {changeEditorFont(selectedFont)});
+		document.addEventListener('DOMContentLoaded', () => {setEditorFontClass(selectedFont)});
 		var sfe = document.querySelector('nav#font-picker a.font.'+selectedFont);
 		if (sfe != null) {
 			sfe.click();

From edb742686bc5e96e65a9e2f62a29c5fca7ae5b0e Mon Sep 17 00:00:00 2001
From: vtyeh <vtyeh24@gmail.com>
Date: Mon, 28 Oct 2024 13:39:47 -0700
Subject: [PATCH 4/4] Fix typo in norm class

---
 less/prose-editor.less | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/less/prose-editor.less b/less/prose-editor.less
index 773ed2b..bc47898 100644
--- a/less/prose-editor.less
+++ b/less/prose-editor.less
@@ -34,7 +34,7 @@ body#pad.classic {
 }
 
 .norm {
-	font-family: serifFont;
+	font-family: @serifFont;
 }
 
 .sans {