dmitry_k
/
compendium-browser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Fix default tab behavior

pull/12/head
Matt Smith 2024-03-29 17:33:38 -05:00
parent aabef2cf92
commit 961219d9b6
6 changed files with 134 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

177
src/components/components.vue.es.js
View File

@ -1,17 +1,17 @@
import { openBlock as s, createElementBlock as r, createElementVNode as f, normalizeClass as l, Fragment as h, renderList as g, createCommentVNode as m, toDisplayString as T, renderSlot as k, resolveComponent as _, createVNode as p, withCtx as w } from "../lib/vue.esm-browser.js"; import { openBlock as r, createElementBlock as o, createElementVNode as g, normalizeClass as m, Fragment as y, renderList as w, createCommentVNode as _, toDisplayString as v, renderSlot as T, resolveComponent as f, createVNode as i, withCtx as b, createTextVNode as h } from "../lib/vue.esm-browser.js";
function y(...e) { function k(...t) {
return e.reduce((a, t) => a + t, ""); return t.reduce((a, e) => a + e, "");
} }
const b = (e, a) => { const p = (t, a) => {
const t = e.__vccOpts || e; const e = t.__vccOpts || t;
for (const [c, o] of a) for (const [l, s] of a)
t[c] = o; e[l] = s;
return t; return e;
}, C = { }, x = {
name: "Tabs", name: "Tabs",
props: ["context", "actor", "group", "tabs", "flags"], props: ["context", "actor", "group", "tabs", "flags"],
setup() { setup() {
return { concat: y }; return { concat: k };
}, },
data() { data() {
return { return {
@ -19,73 +19,76 @@ const b = (e, a) => {
}; };
}, },
methods: { methods: {
changeTab(e) { changeTab(t) {
e && e.currentTarget && (this.currentTab = e.currentTarget.dataset.tab); t && t.currentTarget && (this.currentTab = t.currentTarget.dataset.tab);
for (let [a, t] of Object.entries(this.tabs)) for (let [a, e] of Object.entries(this.tabs))
this.tabs[a].active = !1; this.tabs[a].active = !1;
this.tabs[this.currentTab] && (this.tabs[this.currentTab].active = !0); this.tabs[this.currentTab] && (this.tabs[this.currentTab].active = !0);
}, },
getTabClass(e, a) { getTabClass(t, a) {
return `tab-link tab-link--${a}${e.active ? " active" : ""}`; return `tab-link tab-link--${a}${t.active ? " active" : ""}`;
} }
}, },
async mounted() { async mounted() {
var e; var a;
this.currentTab = this.tabs.defaultTab ?? "creatures", (e = this.tabs) != null && e[this.currentTab].hidden && (this.currentTab = "creatures"), this.changeTab(!1); const t = (a = Object.values(this.tabs)) == null ? void 0 : a.find((e) => e.active);
Object.values(this.tabs).forEach((e) => console.log(e)), console.log("Active", t), this.currentTab = (t == null ? void 0 : t.key) ?? "creatures", this.changeTab(!1);
} }
}, v = { class: "section section--tabs flexshrink" }, $ = ["data-group"], x = ["data-tab"], B = { key: 1 }; }, C = { class: "section section--tabs flexshrink" }, $ = ["data-group"], B = ["data-tab"], S = { key: 1 };
function S(e, a, t, c, o, i) { function N(t, a, e, l, s, u) {
return s(), r("section", v, [ return r(), o("section", C, [
f("nav", { g("nav", {
class: l("sheet-tabs tabs tabs--" + t.group), class: m("sheet-tabs tabs tabs--" + e.group),
"data-group": t.group "data-group": e.group
}, [ }, [
(s(!0), r(h, null, g(t.tabs, (n, u) => (s(), r("span", { (r(!0), o(y, null, w(e.tabs, (n, c) => (r(), o("span", {
key: "tab-" + t.group + "-" + u key: "tab-" + e.group + "-" + c
}, [ }, [
n.hidden ? m("", !0) : (s(), r("a", { n.hidden ? _("", !0) : (r(), o("a", {
key: 0, key: 0,
onClick: a[0] || (a[0] = (...d) => i.changeTab && i.changeTab(...d)), onClick: a[0] || (a[0] = (...d) => u.changeTab && u.changeTab(...d)),
class: l(i.getTabClass(n, u)), class: m(u.getTabClass(n, c)),
"data-tab": u "data-tab": c
}, [ }, [
n.icon ? (s(), r("i", { n.icon ? (r(), o("i", {
key: 0, key: 0,
class: l(c.concat("fas ", n.icon)) class: m(l.concat("fas ", n.icon))
}, null, 2)) : m("", !0), }, null, 2)) : _("", !0),
n.hideLabel ? m("", !0) : (s(), r("span", B, T(n.label), 1)) n.hideLabel ? _("", !0) : (r(), o("span", S, v(n.label), 1))
], 10, x)) ], 10, B))
]))), 128)) ]))), 128))
], 10, $) ], 10, $)
]); ]);
} }
const N = /* @__PURE__ */ b(C, [["render", S]]), z = { const O = /* @__PURE__ */ p(x, [["render", N]]), V = {
name: "Tab", name: "Tab",
props: ["context", "actor", "tab", "group", "classes"] props: ["context", "actor", "tab", "group", "classes"]
}, P = ["data-group", "data-tab"]; }, z = ["data-group", "data-tab"];
function V(e, a, t, c, o, i) { function I(t, a, e, l, s, u) {
return s(), r("div", { return r(), o("div", {
class: l("tab " + t.tab.key + (t.tab.active ? " active" : "") + (t.classes ? " " + t.classes : "")), class: m("tab " + e.tab.key + (e.tab.active ? " active" : "") + (e.classes ? " " + e.classes : "")),
"data-group": t.group, "data-group": e.group,
"data-tab": t.tab.key "data-tab": e.tab.key
}, [ }, [
k(e.$slots, "default") T(t.$slots, "default")
], 10, P); ], 10, z);
} }
const F = /* @__PURE__ */ b(z, [["render", V]]), I = { const P = /* @__PURE__ */ p(V, [["render", I]]), j = {
name: "Stub", name: "Stub",
props: ["context"] props: ["context"]
}; };
function M(e, a, t, c, o, i) { function E(t, a, e, l, s, u) {
return s(), r("h1", null, "Foobar"); return r(), o("h1", null, [
T(t.$slots, "default", {}, void 0, !0)
]);
} }
const O = /* @__PURE__ */ b(I, [["render", M], ["__scopeId", "data-v-59ae215c"]]), E = { const M = /* @__PURE__ */ p(j, [["render", E], ["__scopeId", "data-v-ceecbcd3"]]), A = {
name: "ArchmageCompendiumBrowser", name: "ArchmageCompendiumBrowser",
props: ["context"], props: ["context"],
components: { components: {
Tabs: N, Tabs: O,
Tab: F, Tab: P,
Stub: O Stub: M
// CompendiumBrowserCreatures, // CompendiumBrowserCreatures,
// CompendiumBrowserPowers, // CompendiumBrowserPowers,
// CompendiumBrowserItems // CompendiumBrowserItems
@ -97,28 +100,28 @@ const O = /* @__PURE__ */ b(I, [["render", M], ["__scopeId", "data-v-59ae215c"]]
}; };
}, },
data() { data() {
var t, a, e;
return { return {
// The only variable we actually need to track is the active tab. // The only variable we actually need to track is the active tab.
tabs: { tabs: {
defaultTab: "creatures",
primary: { primary: {
// Default tab is assigned in the flags() computed property. // Default tab is assigned in the flags() computed property.
creatures: { creatures: {
key: "creatures", key: "creatures",
label: game.i18n.localize("CMPBrowser.Tab.NPCBrowser"), label: game.i18n.localize("CMPBrowser.Tab.NPCBrowser"),
active: !1, active: ((t = this.context) == null ? void 0 : t.defaultTab) === "creatures",
opened: !1 opened: !1
}, },
powers: { powers: {
key: "powers", key: "powers",
label: game.i18n.localize("CMPBrowser.Tab.SpellBrowser"), label: game.i18n.localize("CMPBrowser.Tab.SpellBrowser"),
active: !1, active: ((a = this.context) == null ? void 0 : a.defaultTab) === "powers",
opened: !1 opened: !1
}, },
items: { items: {
key: "items", key: "items",
label: game.i18n.localize("CMPBrowser.Tab.ItemBrowser"), label: game.i18n.localize("CMPBrowser.Tab.ItemBrowser"),
active: !1, active: ((e = this.context) == null ? void 0 : e.defaultTab) === "items",
opened: !1 opened: !1
} }
} }
@ -134,33 +137,67 @@ const O = /* @__PURE__ */ b(I, [["render", M], ["__scopeId", "data-v-59ae215c"]]
async mounted() { async mounted() {
console.log("Compendium browser mounted."); console.log("Compendium browser mounted.");
} }
}, L = { class: "compendium-browser-vue flexcol" }, j = { class: "container container--top" }, A = { class: "container container--bottom" }; }, F = { class: "compendium-browser-vue flexcol" }, L = { class: "container container--top" }, D = { class: "container container--bottom" };
function D(e, a, t, c, o, i) { function G(t, a, e, l, s, u) {
const n = _("Tabs"), u = _("Stub"), d = _("Tab"); const n = f("Tabs"), c = f("Stub"), d = f("Tab");
return s(), r("div", L, [ return r(), o("div", F, [
f("section", j, [ g("section", L, [
p(n, { i(n, {
group: "primary", group: "primary",
tabs: o.tabs.primary, tabs: s.tabs.primary
flags: e.flags }, null, 8, ["tabs"])
}, null, 8, ["tabs", "flags"])
]), ]),
f("section", A, [ g("section", D, [
p(d, { i(d, {
group: "primary", group: "primary",
tab: o.tabs.primary.creatures, tab: s.tabs.primary.creatures,
classes: "container container--bottom flexrow" classes: "container container--bottom flexrow"
}, { }, {
default: w(() => [ default: b(() => [
p(u) i(c, null, {
default: b(() => [
h("Creatures")
]),
_: 1
})
]),
_: 1
}, 8, ["tab"]),
i(d, {
group: "primary",
tab: s.tabs.primary.powers,
classes: "container container--bottom flexrow"
}, {
default: b(() => [
i(c, null, {
default: b(() => [
h("Spells")
]),
_: 1
})
]),
_: 1
}, 8, ["tab"]),
i(d, {
group: "primary",
tab: s.tabs.primary.items,
classes: "container container--bottom flexrow"
}, {
default: b(() => [
i(c, null, {
default: b(() => [
h("Items")
]),
_: 1
})
]), ]),
_: 1 _: 1
}, 8, ["tab"]) }, 8, ["tab"])
]) ])
]); ]);
} }
const q = /* @__PURE__ */ b(E, [["render", D]]); const H = /* @__PURE__ */ p(A, [["render", G]]);
export { export {
q as VueCompendiumBrowser H as VueCompendiumBrowser
}; };
//# sourceMappingURL=components.vue.es.js.map //# sourceMappingURL=components.vue.es.js.map

2
src/components/components.vue.es.js.map
View File

File diff suppressed because one or more lines are too long

2
src/components/styles.vue.css
View File

File diff suppressed because one or more lines are too long

32
src/vue/CompendiumBrowser.vue
View File

@ -2,7 +2,7 @@
<div class="compendium-browser-vue flexcol"> <div class="compendium-browser-vue flexcol">
<!-- Tabs. --> <!-- Tabs. -->
<section class="container container--top"> <section class="container container--top">
<Tabs group="primary" :tabs="tabs.primary" :flags="flags"/> <Tabs group="primary" :tabs="tabs.primary"/>
</section> </section>
<!-- Filters + Content. --> <!-- Filters + Content. -->
@ -14,17 +14,19 @@
have been opened at least once. have been opened at least once.
--> -->
<Tab group="primary" :tab="tabs.primary.creatures" classes="container container--bottom flexrow"> <Tab group="primary" :tab="tabs.primary.creatures" classes="container container--bottom flexrow">
<Stub /> <Stub>Creatures</Stub>
<!-- <CompendiumBrowserCreatures v-if="tabs.primary.creatures.active || tabs.primary.creatures.opened" :tab="tabs.primary.creatures"/> --> <!-- <CompendiumBrowserCreatures v-if="tabs.primary.creatures.active || tabs.primary.creatures.opened" :tab="tabs.primary.creatures"/> -->
</Tab> </Tab>
<!-- <Tab group="primary" :tab="tabs.primary.powers" classes="container container--bottom flexrow"> <Tab group="primary" :tab="tabs.primary.powers" classes="container container--bottom flexrow">
<CompendiumBrowserPowers v-if="tabs.primary.powers.active || tabs.primary.powers.opened" :tab="tabs.primary.powers" :escalation="this.context.escalationDie"/> <Stub>Spells</Stub>
</Tab> --> <!-- <CompendiumBrowserPowers v-if="tabs.primary.powers.active || tabs.primary.powers.opened" :tab="tabs.primary.powers" :escalation="this.context.escalationDie"/> -->
</Tab>
<!-- <Tab group="primary" :tab="tabs.primary.items" classes="container container--bottom flexrow"> <Tab group="primary" :tab="tabs.primary.items" classes="container container--bottom flexrow">
<CompendiumBrowserItems v-if="tabs.primary.items.active || tabs.primary.items.opened" :tab="tabs.primary.items"/> <Stub>Items</Stub>
</Tab> --> <!-- <CompendiumBrowserItems v-if="tabs.primary.items.active || tabs.primary.items.opened" :tab="tabs.primary.items"/> -->
</Tab>
</section> </section>
</div> </div>
@ -60,25 +62,24 @@ export default {
return { return {
// The only variable we actually need to track is the active tab. // The only variable we actually need to track is the active tab.
tabs: { tabs: {
defaultTab: 'creatures',
primary: { primary: {
// Default tab is assigned in the flags() computed property. // Default tab is assigned in the flags() computed property.
creatures: { creatures: {
key: 'creatures', key: 'creatures',
label: game.i18n.localize('CMPBrowser.Tab.NPCBrowser'), label: game.i18n.localize('CMPBrowser.Tab.NPCBrowser'),
active: false, active: this.context?.defaultTab === 'creatures' ?? false,
opened: false opened: false
}, },
powers: { powers: {
key: 'powers', key: 'powers',
label: game.i18n.localize('CMPBrowser.Tab.SpellBrowser'), label: game.i18n.localize('CMPBrowser.Tab.SpellBrowser'),
active: false, active: this.context?.defaultTab === 'powers' ?? false,
opened: false opened: false
}, },
items: { items: {
key: 'items', key: 'items',
label: game.i18n.localize('CMPBrowser.Tab.ItemBrowser'), label: game.i18n.localize('CMPBrowser.Tab.ItemBrowser'),
active: false, active: this.context?.defaultTab === 'items' ?? false,
opened: false opened: false
} }
} }
@ -92,6 +93,13 @@ export default {
console.log("Creating compendium browser..."); console.log("Creating compendium browser...");
}, },
async mounted() { async mounted() {
// const defaultTab = this?.context?.defaultTab ?? 'creatures';
// if (this.tabs.primary?.[defaultTab]) {
// this.tabs.primary[defaultTab].active = true;
// }
// else {
// this.tabs.primary.creatures.active = true;
// }
console.log("Compendium browser mounted."); console.log("Compendium browser mounted.");
} }
} }

2
src/vue/components/dialogs/compendium-browser/stub.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<h1>Foobar</h1> <h1><slot></slot></h1>
</template> </template>
<script> <script>

8
src/vue/components/parts/Tabs.vue
View File

@ -46,10 +46,10 @@ export default {
} }
}, },
async mounted() { async mounted() {
this.currentTab = this.tabs.defaultTab ?? 'creatures'; const activeTab = Object.values(this.tabs)?.find((tab) => tab.active);
if (this.tabs?.[this.currentTab].hidden) { Object.values(this.tabs).forEach((tab) => console.log(tab));
this.currentTab = 'creatures'; console.log('Active', activeTab);
} this.currentTab = activeTab?.key ?? 'creatures';
this.changeTab(false); this.changeTab(false);
} }
} }