Adding project file name to the right side of the menu bar

googlefonts · Jan 8, 2025 · f50308f · f50308f
1 parent 08dc923
commit f50308f
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/src/fontra/client/core/fontra-menus.js b/src/fontra/client/core/fontra-menus.js
@@ -1,3 +1,4 @@
+import * as html from "./html-utils.js";
 import { translate } from "/core/localization.js";
 import { MenuBar } from "/web-components/menu-bar.js";
 
@@ -18,7 +19,15 @@ export function makeFontraMenuBar(menuItemKeys, delegate) {
   }
 
   menuBarArray.push(getHelpMenuItems()); // Help-Menu at the end.
-  return new MenuBar(menuBarArray);
+  const menuBar = new MenuBar(menuBarArray);
+
+  // add project file name to the right side of the menu bar
+  const projectNameWrapper = html.div();
+  projectNameWrapper.textContent = delegate.projectFileName;
+  projectNameWrapper.style.marginLeft = "auto";
+  menuBar.contentElement.appendChild(projectNameWrapper);
+
+  return menuBar;
 }
 
 function getFontraMenuItems() {

diff --git a/src/fontra/client/core/view-controller.js b/src/fontra/client/core/view-controller.js
@@ -37,6 +37,7 @@ export class ViewController {
 
   constructor(font) {
     this.fontController = new FontController(font);
+    this.projectFileName = font.wsURL.split("/").slice(-1)[0];
   }
 
   async start() {