Skip to content

Commit

Permalink
Delay loading the navigation until it is opened.
Browse files Browse the repository at this point in the history
  • Loading branch information
@Damnae
Damnae committed Sep 3, 2023
1 parent 1116179 commit 341c802
Show file tree
Hide file tree
Showing 6 changed files with 77 additions and 75 deletions.
25 changes: 10 additions & 15 deletions src/views/navigation/AvatarNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,21 +34,16 @@
</script>

<template>
<NavTree>
<template #header>Avatars</template>
<NavItem v-for="(avatars, damageType) in avatarsSearchResults" :key="damageType">

<NavTree>
<template #header>{{ damageType }}</template>
<NavItem v-for="avatar in avatars" :key="avatar.AvatarID">
<RouterLink :to="{ name:'avatar', params:{ commitId: commitId, objectId: avatar.AvatarID }}">
<span :title="avatar.AvatarName.Text">{{ avatar.AvatarName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>

</NavItem>
</NavTree>
<NavItem v-for="(avatars, damageType) in avatarsSearchResults" :key="damageType">
<NavTree>
<template #header>{{ damageType }}</template>
<NavItem v-for="avatar in avatars" :key="avatar.AvatarID">
<RouterLink :to="{ name:'avatar', params:{ commitId: commitId, objectId: avatar.AvatarID }}">
<span :title="avatar.AvatarName.Text">{{ avatar.AvatarName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>
</NavItem>
</template>

<style scoped>
Expand Down
35 changes: 30 additions & 5 deletions src/views/navigation/CommitNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,36 @@
<section class="mainnav">
<input v-model.trim="search" placeholder="Search" />
<NavTree :forceOpen="forceNavigationOpen">
<NavItem> <AvatarNav /> </NavItem>
<NavItem> <MonsterNav /> </NavItem>
<NavItem> <EquipmentNav /> </NavItem>
<NavItem> <RelicSetNav /> </NavItem>
<NavItem> <StatusNav /> </NavItem>
<NavItem>
<NavTree>
<template #header>Avatars</template>
<AvatarNav />
</NavTree>
</NavItem>
<NavItem>
<NavTree>
<template #header>Monsters</template>
<MonsterNav />
</NavTree>
</NavItem>
<NavItem>
<NavTree>
<template #header>Light Cones</template>
<EquipmentNav />
</NavTree>
</NavItem>
<NavItem>
<NavTree>
<template #header>Relic Sets</template>
<RelicSetNav />
</NavTree>
</NavItem>
<NavItem>
<NavTree>
<template #header>Status Effects</template>
<StatusNav />
</NavTree>
</NavItem>
</NavTree>
</section>

Expand Down
25 changes: 10 additions & 15 deletions src/views/navigation/EquipmentNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,21 +34,16 @@
</script>

<template>
<NavTree>
<template #header>Light Cones</template>
<NavItem v-for="(equipments, path) in equipmentsSearchResults" :key="path">

<NavTree>
<template #header>{{ path }}</template>
<NavItem v-for="equipment in equipments" :key="equipment.EquipmentID">
<RouterLink :to="{ name:'equipment', params:{ commitId: commitId, objectId: equipment.EquipmentID }}">
<span :title="equipment.EquipmentName.Text">{{ equipment.EquipmentName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>

</NavItem>
</NavTree>
<NavItem v-for="(equipments, path) in equipmentsSearchResults" :key="path">
<NavTree>
<template #header>{{ path }}</template>
<NavItem v-for="equipment in equipments" :key="equipment.EquipmentID">
<RouterLink :to="{ name:'equipment', params:{ commitId: commitId, objectId: equipment.EquipmentID }}">
<span :title="equipment.EquipmentName.Text">{{ equipment.EquipmentName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>
</NavItem>
</template>

<style scoped>
Expand Down
39 changes: 17 additions & 22 deletions src/views/navigation/MonsterNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,28 +37,23 @@
</script>

<template>
<NavTree>
<template #header>Monsters</template>
<NavItem v-for="(monsterTemplate, monsterCampName) in monstersSearchResults">

<NavTree :startsOpen="true">
<template #header>{{ monsterCampName }}</template>
<NavItem v-for="(monsters, monsterTemplateName) in monsterTemplate">

<NavTree>
<template #header :title="monsterTemplateName.toString()">{{ monsterTemplateName }}</template>
<NavItem v-for="monster in monsters" :key="monster.MonsterID">
<RouterLink :to="{ name:'monster', params:{ commitId: commitId, objectId: monster.MonsterID }}">
<span :title="monster.MonsterName.Text">{{ monster.MonsterName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>

</NavItem>
</NavTree>

</NavItem>
</NavTree>
<NavItem v-for="(monsterTemplate, monsterCampName) in monstersSearchResults">
<NavTree :startsOpen="true">
<template #header>{{ monsterCampName }}</template>
<NavItem v-for="(monsters, monsterTemplateName) in monsterTemplate">

<NavTree>
<template #header :title="monsterTemplateName.toString()">{{ monsterTemplateName }}</template>
<NavItem v-for="monster in monsters" :key="monster.MonsterID">
<RouterLink :to="{ name:'monster', params:{ commitId: commitId, objectId: monster.MonsterID }}">
<span :title="monster.MonsterName.Text">{{ monster.MonsterName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>

</NavItem>
</NavTree>
</NavItem>
</template>

<style scoped>
Expand Down
14 changes: 5 additions & 9 deletions src/views/navigation/RelicSetNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
import { ref, computed, inject, Ref, } from 'vue'
import { RouterLink } from 'vue-router';
import { getRelicSets, RelicSet, RelicSetConfig, } from '@/scripts/sources/relicset';
import NavTree from '@/components/NavTree.vue'
import NavItem from '@/components/NavItem.vue'
const commitId = inject<string>('commitId') as string
Expand All @@ -20,14 +19,11 @@
</script>

<template>
<NavTree>
<template #header>Relic Sets</template>
<NavItem v-for="relicset in relicsetsSearchResults" :key="relicset.SetID">
<RouterLink :to="{ name:'relicset', params:{ commitId: commitId, objectId: relicset.SetID }}">
<span :title="relicset.SetName.Text">{{ relicset.SetName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>
<NavItem v-for="relicset in relicsetsSearchResults" :key="relicset.SetID">
<RouterLink :to="{ name:'relicset', params:{ commitId: commitId, objectId: relicset.SetID }}">
<span :title="relicset.SetName.Text">{{ relicset.SetName.Text }}</span>
</RouterLink>
</NavItem>
</template>

<style scoped>
Expand Down
14 changes: 5 additions & 9 deletions src/views/navigation/StatusNav.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
import { ref, computed, inject, Ref, } from 'vue'
import { RouterLink } from 'vue-router';
import { getStatuses, Status, StatusConfig, } from '@/scripts/sources/status';
import NavTree from '@/components/NavTree.vue'
import NavItem from '@/components/NavItem.vue'
const commitId = inject<string>('commitId') as string
Expand All @@ -20,14 +19,11 @@
</script>

<template>
<NavTree>
<template #header>Status Effects</template>
<NavItem v-for="status in statusesSearchResults" :key="status.StatusID">
<RouterLink :to="{ name:'status', params:{ commitId: commitId, objectId: status.StatusID }}">
<span :title="status.StatusName.Text">{{ status.StatusName.Text }}</span>
</RouterLink>
</NavItem>
</NavTree>
<NavItem v-for="status in statusesSearchResults" :key="status.StatusID">
<RouterLink :to="{ name:'status', params:{ commitId: commitId, objectId: status.StatusID }}">
<span :title="status.StatusName.Text">{{ status.StatusName.Text }}</span>
</RouterLink>
</NavItem>
</template>

<style scoped>
Expand Down

0 comments on commit 341c802

Please sign in to comment.