From e56ae88ceb3187639db825282e3e960e69bd5d63 Mon Sep 17 00:00:00 2001
From: monman53 <tetsuro53@gmail.com>
Date: Fri, 14 Jun 2024 21:40:04 +0900
Subject: [PATCH] changeable UI stroke width

---
 src/Controller.vue | 4 ++++
 src/SVG/SVG.vue    | 4 ++--
 src/globals.ts     | 2 ++
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/Controller.vue b/src/Controller.vue
index 5633520..548b059 100644
--- a/src/Controller.vue
+++ b/src/Controller.vue
@@ -199,6 +199,10 @@ const replaceApple = (cx: number, cy: number, r: number) => {
             <tr>
                 <td><label><input type="checkbox" v-model="options.opticalAxis"> Optical axis</label></td>
             </tr>
+            <tr>
+                <td>UI stroke width</td>
+                <td><input type="range" min="0" max="3" step="0.01" v-model.number="style.widthUI"></td>
+            </tr>
         </template>
         <!-- Field -->
         <template v-if="options.advanced">
diff --git a/src/SVG/SVG.vue b/src/SVG/SVG.vue
index a48afbb..1b6d7d5 100644
--- a/src/SVG/SVG.vue
+++ b/src/SVG/SVG.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, ref, onMounted } from 'vue'
 
-import { state, lights, lens, sensor, field, options, lensR, lensD, infR, fNumber } from '../globals'
+import { state, lights, lens, sensor, style, options, lensR, lensD, infR, fNumber } from '../globals'
 import * as h from '../handlers'
 
 import Grid from './Grid.vue'
@@ -24,7 +24,7 @@ const svgViewBox = computed(() => {
 })
 
 const strokeWidth = computed(() => {
-  const scale = 1 / state.value.scale
+  const scale = style.value.widthUI / state.value.scale
   const scaleFd = 2
   const scaleBg = 4
   return {
diff --git a/src/globals.ts b/src/globals.ts
index ab14d1b..7a705b4 100644
--- a/src/globals.ts
+++ b/src/globals.ts
@@ -118,6 +118,8 @@ export const style0 = () => {
         // Rays
         rayWidth: 0.2,
         rayIntensity: 0.5,
+        // UI
+        widthUI: 1.0,
     }
 }
 export const style = ref(style0())