feat: add selectable fine-tuning step options
This commit is contained in:
ws50529
+13
-4
@@ -383,13 +383,22 @@
|
||||
</h3>
|
||||
|
||||
<div class="mb-4">
|
||||
<div class="grid grid-cols-3 gap-2 mb-3">
|
||||
<button v-for="option in aFineStepOptions" :key="option.value" type="button"
|
||||
@click="aFineStep = option.value"
|
||||
:class="aFineStep === option.value ? 'bg-indigo-600 text-white border-indigo-500 shadow-sm' : 'bg-white dark:bg-gray-800 text-slate-500 dark:text-gray-400 border-slate-200 dark:border-gray-700'"
|
||||
class="rounded-lg border py-2 text-xs font-bold transition-colors">
|
||||
<span class="block">{{ option.label }}</span>
|
||||
<span class="block text-[10px] opacity-75">+/-{{ formatAFineDelta(option.value) }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="text-[11px] font-semibold text-slate-400 dark:text-gray-500 mb-2">
|
||||
{{ isTouchInput ? '觸控拖曳微調' : '直接輸入 / 滾動微調' }}
|
||||
</div>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<label v-if="!isTouchInput" class="block">
|
||||
<span class="text-[9px] text-slate-400 block uppercase font-bold mb-1">a1</span>
|
||||
<input type="number" :value="formatFineCoeff(currentA1)" step="0.001"
|
||||
<input type="number" :value="formatFineCoeff(currentA1)" :step="aFineStep"
|
||||
@change="setAFineDirect(1, $event.target.value)" @keydown="onlyNumberKey"
|
||||
@wheel.prevent="handleAFineWheel(1, $event)"
|
||||
class="w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm font-mono text-center text-indigo-700 dark:text-indigo-300">
|
||||
@@ -401,7 +410,7 @@
|
||||
</button>
|
||||
<label v-if="!isTouchInput" class="block">
|
||||
<span class="text-[9px] text-slate-400 block uppercase font-bold mb-1">a2</span>
|
||||
<input type="number" :value="formatFineCoeff(currentA2)" step="0.001"
|
||||
<input type="number" :value="formatFineCoeff(currentA2)" :step="aFineStep"
|
||||
@change="setAFineDirect(2, $event.target.value)" @keydown="onlyNumberKey"
|
||||
@wheel.prevent="handleAFineWheel(2, $event)"
|
||||
class="w-full bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg p-3 text-sm font-mono text-center text-emerald-700 dark:text-emerald-300">
|
||||
@@ -438,9 +447,9 @@
|
||||
<div class="text-[11px] font-semibold text-slate-400 dark:text-gray-500 mb-1">共同平移</div>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
<button @pointerdown.prevent="startA1A2Repeat('common', -1)" @pointerup="stopA1A2Repeat" @pointerleave="stopA1A2Repeat" @pointercancel="stopA1A2Repeat"
|
||||
class="rounded-lg bg-slate-200 dark:bg-gray-800 hover:bg-slate-300 dark:hover:bg-gray-700 text-slate-700 dark:text-gray-300 py-2 text-xs font-bold transition-colors">a1 - 0.001, a2 - 0.001</button>
|
||||
class="rounded-lg bg-slate-200 dark:bg-gray-800 hover:bg-slate-300 dark:hover:bg-gray-700 text-slate-700 dark:text-gray-300 py-2 text-xs font-bold transition-colors">a1 - {{ formatAFineDelta() }}, a2 - {{ formatAFineDelta() }}</button>
|
||||
<button @pointerdown.prevent="startA1A2Repeat('common', 1)" @pointerup="stopA1A2Repeat" @pointerleave="stopA1A2Repeat" @pointercancel="stopA1A2Repeat"
|
||||
class="rounded-lg bg-slate-200 dark:bg-gray-800 hover:bg-slate-300 dark:hover:bg-gray-700 text-slate-700 dark:text-gray-300 py-2 text-xs font-bold transition-colors">a1 + 0.001, a2 + 0.001</button>
|
||||
class="rounded-lg bg-slate-200 dark:bg-gray-800 hover:bg-slate-300 dark:hover:bg-gray-700 text-slate-700 dark:text-gray-300 py-2 text-xs font-bold transition-colors">a1 + {{ formatAFineDelta() }}, a2 + {{ formatAFineDelta() }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
+18
-9
@@ -39,7 +39,13 @@ export default {
|
||||
fixedOverrides: { a: {}, b: {} },
|
||||
outOfRangeB: [false, false, false, false, false, false, false],
|
||||
outOfRangeA: [false, false, false, false, false, false, false],
|
||||
aFineStep: 0.001,
|
||||
aFineStep: 0.01,
|
||||
aFinePrecisionStep: 0.001,
|
||||
aFineStepOptions: [
|
||||
{ label: '整數', value: 1 },
|
||||
{ label: '小數1', value: 0.1 },
|
||||
{ label: '小數2', value: 0.001 },
|
||||
],
|
||||
aFineRepeatDelayTimer: null,
|
||||
aFineRepeatTimer: null,
|
||||
aFineDrag: null,
|
||||
@@ -132,17 +138,17 @@ export default {
|
||||
},
|
||||
currentA1() {
|
||||
const a = this.parseCoeffs(this.a_str);
|
||||
return this.roundToStep(a[1] || 0, this.aFineStep);
|
||||
return this.roundToStep(a[1] || 0, this.aFinePrecisionStep);
|
||||
},
|
||||
currentA2() {
|
||||
const a = this.parseCoeffs(this.a_str);
|
||||
return this.roundToStep(a[2] || 0, this.aFineStep);
|
||||
return this.roundToStep(a[2] || 0, this.aFinePrecisionStep);
|
||||
},
|
||||
currentA1A2Diff() {
|
||||
return this.roundToStep(this.currentA1 - this.currentA2, this.aFineStep);
|
||||
return this.roundToStep(this.currentA1 - this.currentA2, this.aFinePrecisionStep);
|
||||
},
|
||||
currentA1A2Sum() {
|
||||
return this.roundToStep(this.currentA1 + this.currentA2, this.aFineStep);
|
||||
return this.roundToStep(this.currentA1 + this.currentA2, this.aFinePrecisionStep);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@@ -250,12 +256,15 @@ export default {
|
||||
if (text.includes('e-')) return Number(text.split('e-')[1]);
|
||||
return text.includes('.') ? text.split('.')[1].length : 0;
|
||||
},
|
||||
roundToStep(value, step = this.aFineStep) {
|
||||
roundToStep(value, step = this.aFinePrecisionStep) {
|
||||
const scale = 1 / step;
|
||||
return Math.round(value * scale) / scale;
|
||||
},
|
||||
formatFineCoeff(value) {
|
||||
return this.roundToStep(value, this.aFineStep).toFixed(this.stepDecimals(this.aFineStep));
|
||||
return this.roundToStep(value, this.aFinePrecisionStep).toFixed(this.stepDecimals(this.aFinePrecisionStep));
|
||||
},
|
||||
formatAFineDelta(step = this.aFineStep) {
|
||||
return this.roundToStep(step, step).toFixed(this.stepDecimals(step));
|
||||
},
|
||||
setAFineDirect(index, rawValue) {
|
||||
const nextValue = parseFloat(rawValue);
|
||||
@@ -355,8 +364,8 @@ export default {
|
||||
setA1A2(a1, a2) {
|
||||
const a = this.padTo7(this.parseCoeffs(this.a_str));
|
||||
a[0] = 1.0;
|
||||
a[1] = this.roundToStep(a1, this.aFineStep);
|
||||
a[2] = this.roundToStep(a2, this.aFineStep);
|
||||
a[1] = this.roundToStep(a1, this.aFinePrecisionStep);
|
||||
a[2] = this.roundToStep(a2, this.aFinePrecisionStep);
|
||||
this.a_str = a.map(x => parseFloat(x.toPrecision(10))).join(', ');
|
||||
this.calcSlidersFromText();
|
||||
},
|
||||
|
||||
File diff suppressed because one or more lines are too long
+2
-2
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user