Fix font changing

npezza93 · Nov 18, 2023 · 80c6a92 · 80c6a92
1 parent 96aa6c9
commit 80c6a92
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 10 deletions.
diff --git a/archipelago/WebView/LigaturesAddon.js b/archipelago/WebView/LigaturesAddon.js
@@ -22,13 +22,14 @@ export default class {
 
       if (!this.looking && termFont && this.font?.name !== termFont) {
         this.looking = true
-        let font = JSON.parse(window.fonts.find(font => JSON.parse(font).name == termFont))
+        let font = window.font
         if (!font.ligatures) {
           let uint8Array = new Uint8Array(font.raw);
           font.ligatures = loadBuffer(uint8Array.buffer, { cacheSize: 100000 })
         }
         this.font = font
         this._terminal.refresh(0, this._terminal.rows - 1)
+        this._terminal.clearTextureAtlas()
         this.looking = false
       }
 

diff --git a/archipelago/WebView/application.min.js b/archipelago/WebView/application.min.js
@@ -24364,13 +24364,14 @@ class LigaturesAddon_default {
       const termFont = this._terminal.options.fontFamily;
       if (!this.looking && termFont && this.font?.name !== termFont) {
         this.looking = true;
-        let font = JSON.parse(window.fonts.find((font2) => JSON.parse(font2).name == termFont));
+        let font = window.font;
         if (!font.ligatures) {
           let uint8Array = new Uint8Array(font.raw);
           font.ligatures = import_npezza93_font_ligatures.loadBuffer(uint8Array.buffer, { cacheSize: 1e5 });
         }
         this.font = font;
         this._terminal.refresh(0, this._terminal.rows - 1);
+        this._terminal.clearTextureAtlas();
         this.looking = false;
       }
       if (this.font) {
@@ -24836,6 +24837,13 @@ class terminal_controller_default extends BridgeComponent {
       event.preventDefault();
     }
   }
+  resetFont() {
+    if (this.xterm) {
+      this.xterm.clearTextureAtlas();
+      this.xterm.refresh(0, this.xterm.rows - 1);
+      this.fit();
+    }
+  }
   send(event, data = {}, callback) {
     data.metadata = { url: "archipelago-1" };
     const message = { component: this.component, event, data, callback };
@@ -24975,14 +24983,15 @@ class terminal_controller_default extends BridgeComponent {
 // controllers/font_loader_controller.js
 class font_loader_controller_default extends BridgeComponent {
   static component = "font-loader";
+  static outlets = ["terminal"];
   connect() {
     super.connect();
-    this.fonts = [];
+    window.fonts = [];
     if (window.font) {
       this.loadFont(window.font);
     }
     this.send("change", {}, ({ data }) => {
-      let existingFont = this.fonts.find((font) => font.name == data.name);
+      let existingFont = window.fonts.find((font) => font.name == data.name);
       if (!existingFont) {
         this.loadFont(data);
       }
@@ -24998,7 +25007,9 @@ class font_loader_controller_default extends BridgeComponent {
     style.innerHTML = css;
     document.head.appendChild(style);
     document.body.insertAdjacentHTML("beforeend", inits);
-    this.fonts = [...this.fonts, font];
+    window.fonts = [...window.fonts, font];
+    window.font = font;
+    setTimeout(() => this.terminalOutlet.resetFont(), 130);
   }
   send(event, data = {}, callback) {
     data.metadata = { url: "archipelago-1" };

diff --git a/archipelago/WebView/controllers/font_loader_controller.js b/archipelago/WebView/controllers/font_loader_controller.js
@@ -2,16 +2,17 @@ import { BridgeComponent } from "@hotwired/strada"
 
 export default class extends BridgeComponent {
   static component = "font-loader"
+  static outlets = [ "terminal" ]
 
   connect() {
     super.connect()
-    this.fonts = []
+    window.fonts = []
 
     if (window.font) {
       this.loadFont(window.font)
     }
     this.send("change", {}, ({data}) => {
-      let existingFont = this.fonts.find((font) => font.name == data.name)
+      let existingFont = window.fonts.find((font) => font.name == data.name)
 
       if (!existingFont) {
         this.loadFont(data)
@@ -31,7 +32,9 @@ export default class extends BridgeComponent {
     style.innerHTML = css
     document.head.appendChild(style);
     document.body.insertAdjacentHTML('beforeend', inits)
-    this.fonts = [...this.fonts, font]
+    window.fonts = [...window.fonts, font]
+    window.font = font
+    setTimeout(() => this.terminalOutlet.resetFont(), 130)
   }
 
   send(event, data = {}, callback) {

diff --git a/archipelago/WebView/controllers/terminal_controller.js b/archipelago/WebView/controllers/terminal_controller.js
@@ -83,6 +83,14 @@ export default class extends BridgeComponent {
     }
   }
 
+  resetFont() {
+    if (this.xterm) {
+      this.xterm.clearTextureAtlas()
+      this.xterm.refresh(0, this.xterm.rows - 1)
+      this.fit()
+    }
+  }
+
   send(event, data = {}, callback) {
     data.metadata = { url: "archipelago-1" }
 

diff --git a/archipelago/WebView/index.html b/archipelago/WebView/index.html
@@ -7,7 +7,7 @@
     <script type="module" src="./application.min.js"></script>
   </head>
   <body>
-    <div data-controller="terminal" data-action="contextmenu@window->terminal#onContextMenu resize@window->terminal#fit"></div>
-    <div data-controller="font-loader" style="display:none"></div>
+    <div class="archipelago-terminal" data-controller="terminal" data-action="contextmenu@window->terminal#onContextMenu resize@window->terminal#fit"></div>
+    <div data-controller="font-loader" data-font-loader-terminal-outlet=".archipelago-terminal" style="display:none"></div>
   </body>
 </html>