jschaufuss/DiceCloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improved spells tab to be more in line with the v1 implementation

Browse Source
This commit is contained in:
Stefan Zermatten
2020-06-29 14:52:47 +02:00
parent 6ddea8a8ab
commit 56f9e82326
8 changed files with 86 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/imports/api/creature/getActiveProperties.js
View File

@@ -4,7 +4,7 @@ import CreatureProperties from '/imports/api/creature/CreatureProperties.js';
export default function getActiveProperties({
ancestorId,
filter = {},
options,
options = {sort: {order: 1}},
includeUntoggled = false,
excludeAncestors,
}){

10
app/imports/api/properties/Spells.js
View File

@@ -38,16 +38,6 @@ let SpellSchema = new SimpleSchema({})
hasAttackRoll: {
type: Boolean,
optional: true,
},
// Spell list that this spell appears on
spellLists: {
type: Array,
defaultValue: [],
},
'spellLists.$': {
type: String,
regEx: VARIABLE_NAME_REGEX,
min: 2,
},
description: {
type: String,

2
app/imports/ui/creature/character/characterSheetTabs/InventoryTab.vue
View File

@@ -1,6 +1,6 @@
<template lang="html">
<div class="inventory">
<column-layout>
<column-layout wide-columns>
<div>
<toolbar-card :color="$vuetify.theme.secondary">
<v-spacer slot="toolbar" />

26
app/imports/ui/creature/character/characterSheetTabs/SpellsTab.vue
View File

@@ -3,18 +3,7 @@
<column-layout wide-columns>
<div v-if="spellsWithoutList.length">
<v-card>
<v-list
two-line
dense
>
<spell-list-tile
v-for="spell in spellsWithoutList"
:key="spell._id"
:data-id="`spell-list-tile-${spell._id}`"
:model="spell"
@click="clickProperty(spell._id)"
/>
</v-list>
<spell-list :spells="spellsWithoutList" />
</v-card>
</div>
<div
@@ -31,18 +20,15 @@
</template>
<script>
import CreatureProperties from '/imports/api/creature/CreatureProperties.js';
import ColumnLayout from '/imports/ui/components/ColumnLayout.vue';
import CreaturePropertiesTree from '/imports/ui/creature/creatureProperties/CreaturePropertiesTree.vue';
import getActiveProperties from '/imports/api/creature/getActiveProperties.js';
import SpellListCard from '/imports/ui/properties/components/spells/SpellListCard.vue';
import SpellListTile from '/imports/ui/properties/components/spells/SpellListTile.vue';
import SpellList from '/imports/ui/properties/components/spells/SpellList.vue';
export default {
components: {
ColumnLayout,
CreaturePropertiesTree,
SpellListTile,
SpellList,
SpellListCard,
},
inject: {
@@ -73,6 +59,12 @@ export default {
filter: {
type: 'spell',
},
options: {
sort: {
level: 1,
order: 1,
},
},
});
},
spellListsWithoutAncestorSpellLists(){

66
app/imports/ui/properties/components/spells/SpellList.vue Normal file
View File

@@ -0,0 +1,66 @@
<template lang="html">
<v-list
two-line
dense
class="spell-list"
>
<template v-for="level in levels">
<v-subheader :key="`${level}-header`">
{{ level === 0 ? 'Cantrips' : `Level ${level}` }}
</v-subheader>
<spell-list-tile
v-for="spell in spellsByLevel[level]"
:key="spell._id"
:data-id="`spell-list-tile-${spell._id}`"
:model="spell"
@click="clickProperty(spell._id)"
/>
</template>
</v-list>
</template>
<script>
import SpellListTile from '/imports/ui/properties/components/spells/SpellListTile.vue';
export default {
components: {
SpellListTile,
},
props: {
spells: {
type: Array,
default: () => [],
},
},
computed: {
levels(){
let levels = new Set();
this.spells.forEach(spell => levels.add(spell.level));
return levels;
},
spellsByLevel(){
let spellsByLevel = {};
this.spells.forEach(spell => {
if (!spellsByLevel[spell.level]){
spellsByLevel[spell.level] = [spell];
} else {
spellsByLevel[spell.level].push(spell);
}
});
return spellsByLevel;
},
},
methods: {
clickProperty(_id){
this.$store.commit('pushDialogStack', {
component: 'creature-property-dialog',
elementId: `spell-list-tile-${_id}`,
data: {_id},
});
},
}
}
</script>
<style lang="css" scoped>
</style>

30
app/imports/ui/properties/components/spells/SpellListCard.vue
View File

@@ -10,30 +10,19 @@
</v-toolbar-title>
<v-spacer />
</template>
<v-list
two-line
dense
>
<spell-list-tile
v-for="spell in spells"
:key="spell._id"
:data-id="`spell-list-tile-${spell._id}`"
:model="spell"
@click="clickProperty(spell._id)"
/>
</v-list>
<spell-list :spells="spells" />
</toolbar-card>
</template>
<script>
import ToolbarCard from '/imports/ui/components/ToolbarCard.vue';
import SpellListTile from '/imports/ui/properties/components/spells/SpellListTile.vue';
import SpellList from '/imports/ui/properties/components/spells/SpellList.vue';
import getActiveProperties from '/imports/api/creature/getActiveProperties.js';
export default {
components: {
ToolbarCard,
SpellListTile,
SpellList,
},
props: {
model: Object,
@@ -46,6 +35,12 @@ export default {
filter: {
type: 'spell',
},
options: {
sort: {
level: 1,
order: 1,
},
},
});
},
},
@@ -57,13 +52,6 @@ export default {
data: {_id},
});
},
clickProperty(_id){
this.$store.commit('pushDialogStack', {
component: 'creature-property-dialog',
elementId: `spell-list-tile-${_id}`,
data: {_id},
});
},
}
};
</script>

8
app/imports/ui/properties/components/spells/SpellListTile.vue
View File

@@ -17,11 +17,6 @@
{{ components }}
</v-list-tile-sub-title>
</v-list-tile-content>
<v-list-tile-action>
<v-list-tile-action-text>
{{ levelText }}
</v-list-tile-action-text>
</v-list-tile-action>
</v-list-tile>
</template>
@@ -42,9 +37,6 @@ export default {
if (this.model.material) components.push(`M (${this.model.material})`);
return components.join(', ');
},
levelText(){
return this.model.level || 'Cantrip'
},
},
methods: {
click(e){

13
app/imports/ui/properties/forms/SpellForm.vue
View File

@@ -102,19 +102,6 @@
@change="change('description', ...arguments)"
/>
<form-sections>
<form-section
name="Advanced"
>
<smart-combobox
label="Spell lists"
multiple
chips
deletable-chips
:value="model.spellLists"
:error-messages="errors.spellLists"
@change="change('spellLists', ...arguments)"
/>
</form-section>
<form-section
name="Casting"
>