Added campaign retrieval function, added banner to homepage.

assets/components/campaigns/campaign.vue

@@ -50,9 +50,9 @@ function ratioFilter(banner) {
 
 function entityCampaign() {
 	const bannerCampaigns = this.entity.campaigns
-		.concat(this.entity.children?.flatMap(child => child.campaigns))
+		.concat(this.entity.children?.flatMap((child) => child.campaigns))
 		.concat(this.entity.parent?.campaigns)
-		.filter(campaignX => campaignX && this.ratioFilter(campaignX.banner));
+		.filter((campaignX) => campaignX && this.ratioFilter(campaignX.banner));
 
 	if (bannerCampaigns.length > 0) {
 		const randomCampaign = bannerCampaigns[Math.floor(Math.random() * bannerCampaigns.length)];
@@ -66,7 +66,7 @@ function entityCampaign() {
 }
 
 function tagCampaign() {
-	const campaignBanners = this.tag.banners.filter(banner => banner.campaigns.length > 0 && this.ratioFilter(banner));
+	const campaignBanners = this.tag.banners.filter((banner) => banner.campaigns.length > 0 && this.ratioFilter(banner));
 	const banner = campaignBanners[Math.floor(Math.random() * campaignBanners.length)];
 
 	if (banner?.campaigns.length > 0) {
@@ -83,17 +83,25 @@ function tagCampaign() {
 	return null;
 }
 
-function campaign() {
+async function genericCampaign() {
+	const randomCampaign = await this.$store.dispatch('fetchRandomCampaign', { minRatio: this.minRatio, maxRatio: this.maxRatio });
+
+	this.campaign = randomCampaign;
+	this.$emit('campaign', randomCampaign);
+
+	return randomCampaign;
+}
+
+async function mounted() {
 	if (this.entity) {
-		return this.entityCampaign();
+		await this.entityCampaign();
 	}
 
 	if (this.tag) {
-		return this.tagCampaign();
+		await this.tagCampaign();
 	}
 
-	this.$emit('campaign', null); // allow parent to toggle campaigns depending on availability
-	return null;
+	await this.genericCampaign();
 }
 
 export default {
@@ -124,11 +132,15 @@ export default {
 		},
 	},
 	emits: ['campaign'],
-	computed: {
-		campaign,
+	data() {
+		return {
+			campaign: null,
+		};
 	},
+	mounted,
 	methods: {
 		entityCampaign,
+		genericCampaign,
 		ratioFilter,
 		tagCampaign,
 	},
@@ -139,7 +151,6 @@ export default {
 .campaign {
 	height: 100%;
 	display: inline-flex;
-	flex-grow: 1;
 	align-items: center;
 	justify-content: center;
 }