ajout du bestiaire

docs/.vuepress/theme/layouts/GlobalLayout.vue

@@ -7,7 +7,7 @@
     <Navbar class="d-print-none" />
 
     <v-content>
-      <v-container fluid>
+      <v-container fluid ref="container">
         <v-row align="start" justify="center">
           <v-col cols="12">
             <DefaultGlobalLayout/>
@@ -26,6 +26,8 @@ import GlobalLayout from '@app/components/GlobalLayout.vue'
 import Navbar from '@theme/components/Navbar.vue'
 import NavDrawer from '@theme/components/NavDrawer.vue'
 import RightDrawer from '@theme/components/RightDrawer.vue'
+import Vue from 'vue'
+import RuleTooltip from '@theme/global-components/RT'
 
 export default {
   name: 'GlobalLayout',
@@ -54,6 +56,21 @@ export default {
   mounted () {
     this.$store.commit('setDrawer', this.$vuetify.breakpoint.lgAndUp)
     this.$vuetify.theme.dark = this.$store.state.isThemeDark
+
+    // let conditionLinks = document.links
+    // conditionLinks.forEach((link, idx) => {
+    //   if (link.hash == "#a-terre") {
+    //     let RTClass = Vue.extend(RuleTooltip)
+    //     let rtInstance = new RTClass({
+    //       propsData: { l: link.text, t: link.hash.substring(1, link.hash.length) },
+    //       parent: this.$root
+    //     })
+    //     rtInstance.$mount()
+    //     console.log(link)
+    //     link = rtInstance.$el
+    //     console.log(link)
+    //   }
+    // })
   },
 
   methods: {

docs/.vuepress/theme/layouts/Layout.vue

@@ -2,19 +2,22 @@
   <div>
     <Breadcrumb />
     <Page></Page>
+    <Edit />
   </div>
 </template>
 
 <script>
 import Breadcrumb from '@theme/components/Breadcrumb'
 import Page from '@theme/components/Page'
+import Edit from '@theme/components/Edit'
 
 export default {
   name: 'Layout',
 
   components: {
     Breadcrumb,
-    Page
+    Page,
+    Edit
   },
 
   computed: {

docs/.vuepress/theme/layouts/MagicItemLayout.vue

@@ -2,19 +2,22 @@
   <div class="magic-item">
     <Breadcrumb />
     <MagicItem />
+    <Edit />
   </div>
 </template>
 
 <script>
 import Breadcrumb from '@theme/components/Breadcrumb'
 import MagicItem from '@theme/components/MagicItem'
+import Edit from '@theme/components/Edit'
 
 export default {
   name: 'MagicItemLayout',
 
   components: {
     Breadcrumb,
-    MagicItem
+    MagicItem,
+    Edit
   },
 
   mounted () {

docs/.vuepress/theme/layouts/MonstersLayout.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="monsters">
+
+    <Breadcrumb />
+
+    <h1>Bestiaire</h1>
+
+    <v-data-table
+      class="data-table"
+      :headers="headers"
+      :items="monsters"
+      item-key="key"
+      :sort-by.sync="sortBy"
+      :sort-desc.sync="sortDesc"
+    >
+
+      <template v-slot:item.title="{ item }">
+        <router-link :to="{ path: item.path }" class="subtitle-2">{{ item.title }}</router-link>
+      </template>
+
+      <template v-slot:item.frontmatter.challenge="{ item }">
+        <span>{{ displayChallenge(item.frontmatter.challenge) }}</span>
+      </template>
+
+      <template v-slot:item.frontmatter.environments="{ item }">
+        <span v-if="item.frontmatter.environments">{{ displayList(item.frontmatter.environments) }}</span>
+      </template>
+
+      <template v-slot:item.frontmatter.dungeonTypes="{ item }">
+        <span v-if="item.frontmatter.dungeonTypes">{{ displayList(item.frontmatter.dungeonTypes) }}</span>
+      </template>
+
+    </v-data-table>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import Breadcrumb from '@theme/components/Breadcrumb'
+import {
+  displayChallenge
+} from '@theme/util/monsterHelpers'
+
+export default {
+  components: { Breadcrumb },
+
+  data () {
+    return {
+      sortBy: 'title',
+      sortDesc: false,
+      headers: [
+        { text: "Nom", align: 'start', sortable: true, value: 'title' },
+        { text: "ID", align: 'center', sortable: true, value: 'frontmatter.challenge' },
+        { text: "Type", align: 'start', sortable: false, value: 'frontmatter.type' },
+        { text: "Taille", align: 'center', sortable: false, value: 'frontmatter.size' },
+        { text: "Sous-type", align: 'start', sortable: false, value: 'frontmatter.subtype' },
+        { text: "Environnements", align: 'start', sortable: false, value: 'frontmatter.environments' },
+        { text: "Type de donjons", align: 'start', sortable: false, value: 'frontmatter.dungeonTypes' },
+      ],
+    }
+  },
+
+  computed: {
+    ...mapState({
+      search: state => state.monsterFilters.search,
+      types: state => state.monsterFilters.types,
+      sizes: state => state.monsterFilters.sizes,
+    }),
+
+    monsters() {
+      let results = this.$pagination.pages
+
+      // Filter types
+      let selectedTypes = []
+      for (var i = 0; i < this.types.length; i++) {
+        if (this.types[i].value) {
+          selectedTypes.push(this.types[i].label)
+        }
+      }
+      if (selectedTypes.length) {
+        results = results.filter(item => {
+          return selectedTypes.indexOf(item.frontmatter.type) > -1
+        })
+      }
+
+      // Filter sizes
+      let selectedSizes = []
+      for (var i = 0; i < this.sizes.length; i++) {
+        if (this.sizes[i].value) {
+          selectedSizes.push(this.sizes[i].abbr)
+        }
+      }
+      if (selectedSizes.length) {
+        results = results.filter(item => {
+          return selectedSizes.indexOf(item.frontmatter.size) > -1
+        })
+      }
+
+      return results
+    }
+  },
+
+  methods: {
+    displayList (list) { return list.join(', ') },
+    displayChallenge (challenge) { return displayChallenge(challenge) },
+  },
+
+  mounted () {
+    this.$store.commit('setHasRightDrawer', true)
+    this.$store.commit('setRightDrawer', this.$vuetify.breakpoint.lgAndUp)
+    this.$store.commit('setInRightDrawer', 'monsterFilters')
+  }
+}
+</script>
+
+<style lang="scss">
+
+</style>

docs/.vuepress/theme/layouts/SpellLayout.vue

@@ -2,19 +2,22 @@
   <div class="spell">
     <Breadcrumb />
     <Spell />
+    <Edit />
   </div>
 </template>
 
 <script>
 import Breadcrumb from '@theme/components/Breadcrumb'
 import Spell from '@theme/components/Spell'
+import Edit from '@theme/components/Edit'
 
 export default {
   name: 'SpellLayout',
 
   components: {
     Breadcrumb,
-    Spell
+    Spell,
+    Edit
   },
 
   mounted () {