Formatting/run formatter

.gitignore

@@ -1 +1,3 @@
 .DS_Store
+node_modules/
+temp_configs/

.prettierrc

@@ -0,0 +1,11 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "tabWidth": 4,
+  "useTabs": false,
+  "printWidth": 100,
+  "arrowParens": "always",
+  "bracketSpacing": true,
+  "endOfLine": "lf"
+}

CLAUDE.md

@@ -54,6 +54,31 @@ When editing web tools, audit all buttons and controls in the modified code sect
 - Dependencies via CDN only (Three.js, etc.)
 - Web outputs must match MATLAB outputs exactly
 
+### Code Formatting
+
+This project uses **Prettier** for consistent JavaScript formatting. Configuration is in `.prettierrc`.
+
+**Setup:**
+```bash
+npm install           # Install Prettier (first time only)
+```
+
+**Style rules:**
+- Single quotes (`'string'`)
+- No trailing commas
+- 4-space indentation
+- 100 character print width
+- Semicolons required
+
+**Commands:**
+```bash
+npm run format        # Format all JS files
+npm run format:check  # Check formatting (for CI)
+npx prettier --write path/to/file.js  # Format single file
+```
+
+**Before committing:** Run `npm run format` on any modified JavaScript files to ensure consistent style.
+
 ### Shared Modules
 
 Some JavaScript modules are shared between multiple tools and must support different loading patterns:

README.md

@@ -84,6 +84,20 @@ All tools use a consistent dark theme design:
 
 All tools can be tested locally by opening the HTML files directly in a web browser. No server setup is required for basic functionality.
 
+For running tests or code formatting, first install dependencies:
+
+```bash
+npm install
+```
+
+Then you can use:
+
+```bash
+npm test              # Run validation tests
+npm run format        # Format all JS files with Prettier
+npm run format:check  # Check formatting without changes
+```
+
 ## Repository Structure
 
 ```

js/arena-calculations.js

@@ -8,15 +8,15 @@
 
 // Panel specifications (from MATLAB design_arena.m)
 const PANEL_SPECS = {
-    'G3': {
+    G3: {
         panel_width_mm: 32,
         panel_depth_mm: 18,
         pixels_per_panel: 8,
         num_pins: 8,
         pin_dist_mm: 15.24,
         pin_config: 'single'
     },
-    'G4': {
+    G4: {
         panel_width_mm: 40.45,
         panel_depth_mm: 18,
         pixels_per_panel: 16,
@@ -33,7 +33,7 @@ const PANEL_SPECS = {
         pin_config: 'single'
     },
     // Note: G5 is deprecated and no longer supported
-    'G6': {
+    G6: {
         panel_width_mm: 45.4,
         panel_depth_mm: 3.45,
         pixels_per_panel: 20,
@@ -68,7 +68,7 @@ function calculateGeometry(panelType, numPanels, panelsInstalled = null) {
 
     // Calculate geometry
     const alpha = (2 * Math.PI) / numPanels;
-    const cRadius = panelWidth / (Math.tan(alpha / 2)) / 2;
+    const cRadius = panelWidth / Math.tan(alpha / 2) / 2;
     const backCRadius = cRadius + panelDepth;
 
     // Resolution
@@ -112,7 +112,11 @@ function compareGeometry(computed, reference, tolerance = 0.0001) {
 
     const comparisons = [
         { field: 'c_radius_inches', label: 'Inner Radius (in)' },
-        { field: 'back_c_radius_inches', label: 'Outer Radius (in)', refField: 'back_c_radius_inches' },
+        {
+            field: 'back_c_radius_inches',
+            label: 'Outer Radius (in)',
+            refField: 'back_c_radius_inches'
+        },
         { field: 'degs_per_pixel', label: 'Deg/Pixel' },
         { field: 'azimuthal_pixels', label: 'Azimuthal Pixels' }
     ];