aboutsummaryrefslogtreecommitdiff
path: root/src/components/settings_modal/helpers
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/settings_modal/helpers')
-rw-r--r--src/components/settings_modal/helpers/float_setting.vue16
-rw-r--r--src/components/settings_modal/helpers/integer_setting.vue36
-rw-r--r--src/components/settings_modal/helpers/modified_indicator.vue2
-rw-r--r--src/components/settings_modal/helpers/number_setting.js (renamed from src/components/settings_modal/helpers/integer_setting.js)22
-rw-r--r--src/components/settings_modal/helpers/number_setting.vue27
5 files changed, 74 insertions, 29 deletions
diff --git a/src/components/settings_modal/helpers/float_setting.vue b/src/components/settings_modal/helpers/float_setting.vue
new file mode 100644
index 00000000..15edb3c3
--- /dev/null
+++ b/src/components/settings_modal/helpers/float_setting.vue
@@ -0,0 +1,16 @@
+<template>
+ <NumberSetting
+ v-bind="$attrs"
+ >
+ <slot />
+ </NumberSetting>
+</template>
+
+<script>
+import NumberSetting from './number_setting.vue'
+export default {
+ components: {
+ NumberSetting
+ }
+}
+</script>
diff --git a/src/components/settings_modal/helpers/integer_setting.vue b/src/components/settings_modal/helpers/integer_setting.vue
index 695e2673..43fa7e1a 100644
--- a/src/components/settings_modal/helpers/integer_setting.vue
+++ b/src/components/settings_modal/helpers/integer_setting.vue
@@ -1,27 +1,17 @@
<template>
- <span
- v-if="matchesExpertLevel"
- class="IntegerSetting"
+ <NumberSetting
+ v-bind="$attrs"
+ truncate="1"
>
- <label :for="path">
- <slot />
- </label>
- <input
- :id="path"
- class="number-input"
- type="number"
- step="1"
- :disabled="disabled"
- :min="min || 0"
- :value="state"
- @change="update"
- >
- {{ ' ' }}
- <ModifiedIndicator
- :changed="isChanged"
- :onclick="reset"
- />
- </span>
+ <slot />
+ </NumberSetting>
</template>
-<script src="./integer_setting.js"></script>
+<script>
+import NumberSetting from './number_setting.vue'
+export default {
+ components: {
+ NumberSetting
+ }
+}
+</script>
diff --git a/src/components/settings_modal/helpers/modified_indicator.vue b/src/components/settings_modal/helpers/modified_indicator.vue
index 8311533a..45db3fc2 100644
--- a/src/components/settings_modal/helpers/modified_indicator.vue
+++ b/src/components/settings_modal/helpers/modified_indicator.vue
@@ -5,12 +5,12 @@
>
<Popover
trigger="hover"
+ :trigger-attrs="{ 'aria-label': $t('settings.setting_changed') }"
>
<template #trigger>
&nbsp;
<FAIcon
icon="wrench"
- :aria-label="$t('settings.setting_changed')"
/>
</template>
<template #content>
diff --git a/src/components/settings_modal/helpers/integer_setting.js b/src/components/settings_modal/helpers/number_setting.js
index e64d0cee..73c39948 100644
--- a/src/components/settings_modal/helpers/integer_setting.js
+++ b/src/components/settings_modal/helpers/number_setting.js
@@ -8,6 +8,8 @@ export default {
path: String,
disabled: Boolean,
min: Number,
+ step: Number,
+ truncate: Number,
expert: [Number, String]
},
computed: {
@@ -15,8 +17,11 @@ export default {
const [firstSegment, ...rest] = this.path.split('.')
return [firstSegment + 'DefaultValue', ...rest].join('.')
},
+ parent () {
+ return this.$parent.$parent
+ },
state () {
- const value = get(this.$parent, this.path)
+ const value = get(this.parent, this.path)
if (value === undefined) {
return this.defaultState
} else {
@@ -24,21 +29,28 @@ export default {
}
},
defaultState () {
- return get(this.$parent, this.pathDefault)
+ return get(this.parent, this.pathDefault)
},
isChanged () {
return this.state !== this.defaultState
},
matchesExpertLevel () {
- return (this.expert || 0) <= this.$parent.expertLevel
+ return (this.expert || 0) <= this.parent.expertLevel
}
},
methods: {
+ truncateValue (value) {
+ if (!this.truncate) {
+ return value
+ }
+
+ return Math.trunc(value / this.truncate) * this.truncate
+ },
update (e) {
- set(this.$parent, this.path, parseInt(e.target.value))
+ set(this.parent, this.path, this.truncateValue(parseFloat(e.target.value)))
},
reset () {
- set(this.$parent, this.path, this.defaultState)
+ set(this.parent, this.path, this.defaultState)
}
}
}
diff --git a/src/components/settings_modal/helpers/number_setting.vue b/src/components/settings_modal/helpers/number_setting.vue
new file mode 100644
index 00000000..3eab5178
--- /dev/null
+++ b/src/components/settings_modal/helpers/number_setting.vue
@@ -0,0 +1,27 @@
+<template>
+ <span
+ v-if="matchesExpertLevel"
+ class="NumberSetting"
+ >
+ <label :for="path">
+ <slot />
+ </label>
+ <input
+ :id="path"
+ class="number-input"
+ type="number"
+ :step="step || 1"
+ :disabled="disabled"
+ :min="min || 0"
+ :value="state"
+ @change="update"
+ >
+ {{ ' ' }}
+ <ModifiedIndicator
+ :changed="isChanged"
+ :onclick="reset"
+ />
+ </span>
+</template>
+
+<script src="./number_setting.js"></script>