Refactor #4953 - For Knob

pull/5206/head
mertsincan 2024-02-02 15:47:31 +00:00
parent c797f944a6
commit 239b0809f4
1 changed files with 8 additions and 5 deletions

View File

@ -29,6 +29,9 @@
<script> <script>
import BaseKnob from './BaseKnob.vue'; import BaseKnob from './BaseKnob.vue';
// Set fix value for SSR.
const Math_PI = 3.14159265358979;
export default { export default {
name: 'Knob', name: 'Knob',
extends: BaseKnob, extends: BaseKnob,
@ -38,8 +41,8 @@ export default {
radius: 40, radius: 40,
midX: 50, midX: 50,
midY: 50, midY: 50,
minRadians: (4 * Math.PI) / 3, minRadians: (4 * Math_PI) / 3,
maxRadians: -Math.PI / 3 maxRadians: -Math_PI / 3
}; };
}, },
methods: { methods: {
@ -47,7 +50,7 @@ export default {
let dx = offsetX - this.size / 2; let dx = offsetX - this.size / 2;
let dy = this.size / 2 - offsetY; let dy = this.size / 2 - offsetY;
let angle = Math.atan2(dy, dx); let angle = Math.atan2(dy, dx);
let start = -Math.PI / 2 - Math.PI / 6; let start = -Math_PI / 2 - Math_PI / 6;
this.updateModel(angle, start); this.updateModel(angle, start);
}, },
@ -55,7 +58,7 @@ export default {
let mappedValue; let mappedValue;
if (angle > this.maxRadians) mappedValue = this.mapRange(angle, this.minRadians, this.maxRadians, this.min, this.max); if (angle > this.maxRadians) mappedValue = this.mapRange(angle, this.minRadians, this.maxRadians, this.min, this.max);
else if (angle < start) mappedValue = this.mapRange(angle + 2 * Math.PI, this.minRadians, this.maxRadians, this.min, this.max); else if (angle < start) mappedValue = this.mapRange(angle + 2 * Math_PI, this.minRadians, this.maxRadians, this.min, this.max);
else return; else return;
let newValue = Math.round((mappedValue - this.min) / this.step) * this.step + this.min; let newValue = Math.round((mappedValue - this.min) / this.step) * this.step + this.min;
@ -205,7 +208,7 @@ export default {
return this.midY - Math.sin(this.valueRadians) * this.radius; return this.midY - Math.sin(this.valueRadians) * this.radius;
}, },
largeArc() { largeArc() {
return Math.abs(this.zeroRadians - this.valueRadians) < Math.PI ? 0 : 1; return Math.abs(this.zeroRadians - this.valueRadians) < Math_PI ? 0 : 1;
}, },
sweep() { sweep() {
return this.valueRadians > this.zeroRadians ? 0 : 1; return this.valueRadians > this.zeroRadians ? 0 : 1;