Merge pull request #208 from samuelthomas2774/collection-settings
Extend ArraySetting for collections
This commit is contained in:
commit
c336c8cb0d
|
@ -27,7 +27,8 @@ export default class Setting {
|
||||||
|
|
||||||
constructor(args, ...merge) {
|
constructor(args, ...merge) {
|
||||||
args = args.args || args;
|
args = args.args || args;
|
||||||
if (args.type instanceof Array) return new CollectionSetting(args, ...merge);
|
|
||||||
|
if (args.type instanceof Array) args.subtype = args.type[0], args.type = 'collection';
|
||||||
if (args.type === 'color') args.type = 'colour';
|
if (args.type === 'color') args.type = 'colour';
|
||||||
|
|
||||||
if (args.type === 'bool') return new BoolSetting(args, ...merge);
|
if (args.type === 'bool') return new BoolSetting(args, ...merge);
|
||||||
|
@ -41,8 +42,9 @@ export default class Setting {
|
||||||
else if (args.type === 'file') return new FileSetting(args, ...merge);
|
else if (args.type === 'file') return new FileSetting(args, ...merge);
|
||||||
else if (args.type === 'guild') return new GuildSetting(args, ...merge);
|
else if (args.type === 'guild') return new GuildSetting(args, ...merge);
|
||||||
else if (args.type === 'array') return new ArraySetting(args, ...merge);
|
else if (args.type === 'array') return new ArraySetting(args, ...merge);
|
||||||
else if (args.type === 'custom') return new CustomSetting(args, ...merge);
|
else if (args.type === 'collection') return new CollectionSetting(args, ...merge);
|
||||||
else if (args.type === 'kvp') return new KvpSetting(args, ...merge);
|
else if (args.type === 'kvp') return new KvpSetting(args, ...merge);
|
||||||
|
else if (args.type === 'custom') return new CustomSetting(args, ...merge);
|
||||||
else throw {message: `Setting type ${args.type} unknown`};
|
else throw {message: `Setting type ${args.type} unknown`};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -8,30 +8,42 @@
|
||||||
* LICENSE file in the root directory of this source tree.
|
* LICENSE file in the root directory of this source tree.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import { Utils } from 'common';
|
||||||
|
import ArraySetting from './array';
|
||||||
import Setting from '../setting';
|
import Setting from '../setting';
|
||||||
import Base from './basesetting';
|
|
||||||
import SettingsSet from '../settingsset';
|
|
||||||
import SettingsCategory from '../settingscategory';
|
|
||||||
import SettingsScheme from '../settingsscheme';
|
|
||||||
|
|
||||||
export default class CollectionSetting extends Base {
|
export default class CollectionSetting extends ArraySetting {
|
||||||
|
|
||||||
constructor(args, ...merge) {
|
constructor(args, ...merge) {
|
||||||
|
// The ArraySetting constructor will call createItem which requires this to be set
|
||||||
|
if (!(args.setting instanceof Setting)) args.setting = new Setting(args.setting || {type: args.subtype});
|
||||||
|
|
||||||
super(args, ...merge);
|
super(args, ...merge);
|
||||||
this.subtype = args.type[0];
|
|
||||||
this.args.type = 'collection';
|
|
||||||
this.items = this.value.map(item => this.create(item));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
create(item) {
|
get setting() {
|
||||||
item.type = this.subtype;
|
return this.args.setting;
|
||||||
return new Setting(item);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The value to use when the setting doesn't have a value.
|
* Creates a new setting for this collection setting.
|
||||||
|
* @param {Setting} item Values to merge into the new setting (optional)
|
||||||
|
* @return {Setting} The new set
|
||||||
*/
|
*/
|
||||||
get defaultValue() {
|
createItem(item) {
|
||||||
return [];
|
if (item instanceof Setting)
|
||||||
|
return item;
|
||||||
|
|
||||||
|
const merge = [...arguments].filter(a => a);
|
||||||
|
const setting = this.setting.clone(...merge);
|
||||||
|
setting.args.id = item ? item.args ? item.args.id : item.id : Math.random();
|
||||||
|
|
||||||
|
setting.setSaved();
|
||||||
|
setting.on('settings-updated', async event => {
|
||||||
|
await this.emit('item-updated', { item: setting, event, updatedSettings: event.updatedSettings });
|
||||||
|
if (event.args.updating_array !== this) await this.updateValue();
|
||||||
|
});
|
||||||
|
return setting;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
/**
|
/**
|
||||||
* BetterDiscord Setting Bool Component
|
* BetterDiscord Collection Setting Component
|
||||||
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
* Copyright (c) 2015-present Jiiks/JsSucks - https://github.com/Jiiks / https://github.com/JsSucks
|
||||||
* All rights reserved.
|
* All rights reserved.
|
||||||
* https://betterdiscord.net
|
* https://betterdiscord.net
|
||||||
|
@ -10,33 +10,34 @@
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bd-formCollection">
|
<div class="bd-formCollection">
|
||||||
<div v-for="(s, index) in setting.items" class="bd-collectionItem">
|
<div v-for="s in setting.items" class="bd-collectionItem">
|
||||||
<KeyValuePair v-if="setting.subtype === 'kvp'" :setting="s" :key="s.id"/>
|
<Setting :setting="s" :key="s.id" />
|
||||||
<Bool v-else-if="setting.subtype === 'bool'" :setting="s" :key="s.id" />
|
<div class="bd-removeCollectionItem" @click="removeItem(s)"><MiMinus/></div>
|
||||||
<div class="bd-removeCollectionItem" @click="() => removeItem(index)"><MiMinus/></div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="bd-newCollectionItem" @click="addItem">+</div>
|
<div class="bd-newCollectionItem" @click="addItem">+</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { Settings } from 'modules';
|
import Setting from './Setting.vue';
|
||||||
import { Setting } from 'structs';
|
|
||||||
import KeyValuePair from './KeyValuePair.vue';
|
|
||||||
import Bool from './Bool.vue';
|
|
||||||
|
|
||||||
import { MiMinus } from '../../common';
|
import { MiMinus } from '../../common';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: ['setting'],
|
props: ['setting'],
|
||||||
components: { KeyValuePair, Bool, MiMinus },
|
components: {
|
||||||
|
MiMinus
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
removeItem(index) {
|
removeItem(item) {
|
||||||
this.setting.value = this.setting.items.splice(index, 1);
|
this.setting.removeItem(item);
|
||||||
},
|
},
|
||||||
addItem() {
|
addItem() {
|
||||||
const add = new Setting({ type: this.setting.subtype });
|
this.setting.addItem();
|
||||||
this.setting.items = this.setting.value = [...this.setting.items, add];
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
beforeCreate() {
|
||||||
|
// https://vuejs.org/v2/guide/components.html#Circular-References-Between-Components
|
||||||
|
this.$options.components.Setting = Setting;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue