Add toolbar enhancements for v3-dev (rebase of PR pfalstad#162/pfalstad#212)

Port SEVA77 toolbar enhancements to v3-dev architecture:

Toolbar.java:
- Add toolbar separators between button groups for visual clarity
- Add file operation buttons (New, Open, Save As) to toolbar
- Add + symbol to Save As icon for visual distinction from Save
- Add Centre Circuit button to toolbar
- Handle Electron vs browser Save As command differences

Menus.java:
- Add Show Mode checkbox to Options menu (persisted to storage)

UIManager.java:
- Draw mouse mode info on canvas when Show Mode is enabled
- Shift developer mode text down to avoid overlap with mode display

Original PR by SEVA77, remapped to v3-dev split architecture.

Co-Authored-By: SEVA77 <CEBA1996@outlook.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: 3 people

src/com/lushprojects/circuitjs1/client/Menus.java

@@ -61,6 +61,7 @@ public class Menus {
     CheckboxMenuItem noEditCheckItem;
     CheckboxMenuItem mouseWheelEditCheckItem;
     CheckboxMenuItem toolbarCheckItem;
+    CheckboxMenuItem mouseModeCheckItem;
     MenuBar elmMenuBar;
     MenuItem elmEditMenuItem;
     MenuItem elmCutMenuItem;
@@ -215,12 +216,18 @@ public void init() {
 		    sim.setToolbar();
 		}
 	}));
+	m.addItem(mouseModeCheckItem = new CheckboxMenuItem(Locale.LS("Show Mode"),
+		new Command() { public void execute(){
+			sim.setOptionInStorage("showMouseMode", mouseModeCheckItem.getState());
+		}
+	}));
+	mouseModeCheckItem.setState(sim.getOptionFromStorage("showMouseMode", true));
 	m.addItem(crossHairCheckItem = new CheckboxMenuItem(Locale.LS("Show Cursor Cross Hairs"),
 		new Command() { public void execute(){
 		    sim.setOptionInStorage("crossHair", crossHairCheckItem.getState());
 		}
 	}));
-	
+
 	m.addItem(euroResistorCheckItem = new CheckboxMenuItem(Locale.LS("European Resistors")));
 	m.addItem(euroGatesCheckItem = new CheckboxMenuItem(Locale.LS("IEC Gates")));
 	m.addItem(printableCheckItem = new CheckboxMenuItem(Locale.LS("White Background")));

src/com/lushprojects/circuitjs1/client/Toolbar.java

@@ -21,6 +21,7 @@ public class Toolbar extends FlowPanel {
     private Label modeLabel;
     private HashMap<String, Label> highlightableButtons = new HashMap<>();
     private Label activeButton;  // Currently active button
+    private String SEPARATOR = "<div style=\"height:30px;width:0;border-left:2px solid grey;\"></div>";
 
     Label resistorButton;
 
@@ -35,18 +36,32 @@ public Toolbar() {
         style.setDisplay(Style.Display.FLEX);
 	style.setProperty("alignItems", "center");
 
+	add(createIconButton("doc-new", "New Blank Circuit", new MyCommand("file", "newblankcircuit")));
+	add(createIconButton("folder",  "Open File...", new MyCommand("file", "importfromlocalfile")));
+	if (CirSim.isElectron()) {
+		// Additional conditions are required: "Save" should not be available always.
+		//add(createIconButton("floppy", "Save", new MyCommand("file", "save")));
+		add(createIconButton("floppy", "Save As...", new MyCommand("file", "saveas")));
+	} else {
+		add(createIconButton("floppy", "Save As...", new MyCommand("file", "exportaslocalfile")));
+	}
+	add(new HTML("<sup style=\"margin-left:-12px;\"><strong>+</strong></sup>")); // add symbol to "Save As" icon for the visual difference
+	add(new HTML(SEPARATOR));
 	add(createIconButton("ccw", "Undo", new MyCommand("edit", "undo")));
 	add(createIconButton("cw",  "Redo", new MyCommand("edit", "redo")));
+	add(new HTML(SEPARATOR));
 	add(createIconButton("scissors", "Cut", new MyCommand("edit", "cut")));
 	add(createIconButton("copy", "Copy", new MyCommand("edit", "copy")));
 	add(createIconButton("paste", "Paste", new MyCommand("edit", "paste")));
 	add(createIconButton("clone", "Duplicate", new MyCommand("edit", "duplicate")));
+	add(new HTML(SEPARATOR));
 	add(createIconButton("search", "Find Component...", new MyCommand("edit", "search")));
-
+	add(new HTML(SEPARATOR));
+	add(createIconButton("target", "Centre Circuit", new MyCommand("edit", "centrecircuit")));
 	add(createIconButton("zoom-11", "Zoom 100%", new MyCommand("zoom", "zoom100")));
 	add(createIconButton("zoom-in", "Zoom In", new MyCommand("zoom", "zoomin")));
 	add(createIconButton("zoom-out", "Zoom Out", new MyCommand("zoom", "zoomout")));
-
+	add(new HTML(SEPARATOR));
 	add(createIconButton(wireIcon, "WireElm"));
 	add(resistorButton = createIconButton(resistorIcon, "ResistorElm"));
 	add(createIconButton(groundIcon, "GroundElm"));

src/com/lushprojects/circuitjs1/client/UIManager.java

@@ -732,7 +732,7 @@ public void updateCircuit() {
         perfmon.stopContext(); // updateCircuit
 
         if (app.developerMode) {
-            int height = 15;
+            int height = 45;
             int increment = 15;
             g.drawString("Framerate: " + CircuitElm.showFormat.format(framerate), 10, height);
             g.drawString("Steprate: " + CircuitElm.showFormat.format(steprate), 10, height += increment);
@@ -749,6 +749,12 @@ public void updateCircuit() {
             }
         }
 
+        // Add info about mouse mode in graphics
+        if (menus.mouseModeCheckItem.getState()){
+            if (menus.printableCheckItem.getState()) g.setColor(Color.black);
+            g.drawString(Locale.LS("Mode: ") + app.classToLabelMap.get(mouseModeStr), 10, 29);
+        }
+
         app.jsInterface.callUpdateHook();
     }