lightcordwarez
/
BetterDiscordApp-v2
mirror of https://github.com/JsSucks/BetterDiscordApp
1
0
Fork 0
Code Issues 3 Releases Wiki Activity

Radio and dropdown fixes

This commit is contained in:
Samuel Elliott 2018-03-03 00:03:19 +00:00
parent 05c08ca51f
commit 2c6ae62c7e
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
8 changed files with 16 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/structs/settings/multiplechoiceoption.js
View File

@ -17,7 +17,7 @@ export default class MultipleChoiceOption {
}
get id() {
return this.args.id;
return this.args.id || this.value;
}
get text() {

4
client/src/structs/settings/types/basesetting.js
View File

@ -68,7 +68,7 @@ export default class Setting {
}
merge(newSetting, emit_multi = true) {
return this.setValue(newSetting.value, emit_multi);
return this.setValue(newSetting.args ? newSetting.args.value : newSetting.value, emit_multi);
}
setValue(value, emit_multi = true, emit = true) {
@ -105,7 +105,7 @@ export default class Setting {
strip() {
return {
id: this.id,
value: this.value
value: this.args.value
};
}

4
client/src/structs/settings/types/dropdown.js
View File

@ -26,7 +26,7 @@ export default class DropdownSetting extends Setting {
}
set value(value) {
const selected = this.options.find(option => option.id === value);
const selected = this.options.find(option => option.value === value);
if (selected) this.setValue(selected.id);
else this.setValue(value);
}
@ -40,7 +40,7 @@ export default class DropdownSetting extends Setting {
}
set selected_option(selected_option) {
this.args.value = this.options.find(option => option.id === selected_option.id).id;
this.args.value = selected_option.id;
}
toSCSS() {

4
client/src/structs/settings/types/radio.js
View File

@ -26,7 +26,7 @@ export default class RadioSetting extends Setting {
}
set value(value) {
const selected = this.options.find(option => option.id === value);
const selected = this.options.find(option => option.value === value);
if (selected) this.setValue(selected.id);
else this.setValue(value);
}
@ -40,7 +40,7 @@ export default class RadioSetting extends Setting {
}
set selected_option(selected_option) {
this.value = this.options.find(option => option.id === selected_option.id).id;
this.args.value = selected_option.id;
}
toSCSS() {

4
client/src/ui/components/bd/setting/Dropdown.vue
View File

@ -12,10 +12,10 @@
<div class="bd-form-dropdown">
<div class="bd-title">
<h3 v-if="setting.text">{{setting.text}}</h3>
<Dropdown v-if="!setting.fullwidth" :options="setting.options" :selected="setting.args.value" :disabled="setting.disabled" :change="change" />
<Dropdown v-if="!setting.fullwidth" :options="setting.options" :selected="setting.value" :disabled="setting.disabled" :change="change" />
</div>
<div class="bd-hint">{{setting.hint}}</div>
<Dropdown v-if="setting.fullwidth" :options="setting.options" :selected="setting.args.value" :disabled="setting.disabled" :change="change" />
<Dropdown v-if="setting.fullwidth" :options="setting.options" :selected="setting.value" :disabled="setting.disabled" :change="change" />
</div>
</template>
<script>

5
client/src/ui/components/bd/setting/Radio.vue
View File

@ -26,11 +26,6 @@
props: ['setting', 'change'],
components: {
RadioGroup
},
methods: {
selectOption(option) {
this.change(option.id);
}
}
}
</script>

15
client/src/ui/components/common/Dropdown.vue
View File

@ -11,13 +11,13 @@
<template>
<div class="bd-dropdown" :class="{'bd-active': active, 'bd-disabled': disabled}">
<div class="bd-dropdown-current" @click="() => active = !active && !disabled">
<span class="bd-dropdown-text">{{ getOptionText(selected) }}</span>
<span class="bd-dropdown-text">{{ getSelectedText() }}</span>
<span class="bd-dropdown-arrow-wrap">
<span class="bd-dropdown-arrow"></span>
</span>
</div>
<div class="bd-dropdown-options bd-flex bd-flex-col" ref="options" v-if="active">
<div class="bd-dropdown-option" v-for="option in options" :class="{'bd-dropdown-option-selected': selected === option.id}" @click="selectOption(option)">{{ option.text }}</div>
<div class="bd-dropdown-option" v-for="option in options" :class="{'bd-dropdown-option-selected': selected === option.value}" @click="change(option.value)">{{ option.text }}</div>
</div>
</div>
</template>
@ -30,14 +30,9 @@
};
},
methods: {
getOptionText(value) {
let matching = this.options.filter(opt => opt.id === value);
if (matching.length == 0) return "";
else return matching[0].text;
},
selectOption(option) {
this.active = false;
this.change(option.id);
getSelectedText() {
const selected_option = this.options.find(option => option.value === this.selected);
return selected_option ? selected_option.text : this.selected;
}
},
mounted() {

9
client/src/ui/components/common/RadioGroup.vue
View File

@ -10,7 +10,7 @@
<template>
<div class="bd-radio-group" :class="{'bd-disabled': disabled}">
<label class="bd-radio" v-for="option in options" :class="{'bd-radio-selected': selected === option.id}" @click="selectOption(option)">
<label class="bd-radio" v-for="option in options" :class="{'bd-radio-selected': selected === option.value}" @click="change(option.value)">
<div class="bd-radio-control-wrap">
<svg class="bd-radio-control" name="Checkmark" width="18" height="18" viewBox="0 0 18 18" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><polyline stroke="#3e82e5" stroke-width="2" points="3.5 9.5 7 13 15 5"></polyline></g></svg>
</div>
@ -20,11 +20,6 @@
</template>
<script>
export default {
props: ['options', 'selected', 'disabled', 'change'],
methods: {
selectOption(option) {
this.change(option.id);
}
}
props: ['options', 'selected', 'disabled', 'change']
}
</script>