zenno/chara/convo: use condition_type

Fixes #8.

zenno/src/lib/data/convo.ts

@@ -32,7 +32,25 @@ export interface Conversation {
 	/**
 	 * Some unknown number in the game's local database.
 	 */
-	condition_type: 0 | 1 | 2 | 3 | 4;
+	condition_type: Required;
+}
+
+export enum Required {
+	None = 0,
+	All = 1,
+	Chara1 = 2,
+	Chara2 = 3,
+	Chara3 = 4,
+}
+
+export function requiredCharas(c: Conversation): number[] {
+	switch (c.condition_type) {
+		case Required.None: return []
+		case Required.All: return [c.chara_1, c.chara_2, c.chara_3].filter((id) => id != null);
+		case Required.Chara1: return [c.chara_1];
+		case Required.Chara2: return [c.chara_2!];
+		case Required.Chara3: return [c.chara_3!];
+	}
 }
 
 export async function conversation(): Promise<Conversation[]> {

zenno/src/routes/chara/convo/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { character, charaNames, type Character } from '$lib/data/character';
-	import { byChara, locations, groupPopulars, conversation, type Conversation } from '$lib/data/convo';
+	import { byChara, locations, groupPopulars, conversation, type Conversation, requiredCharas } from '$lib/data/convo';
 	import CharaPick from '$lib/CharaPick.svelte';
 	import { onMount } from 'svelte';
 
@@ -24,8 +24,7 @@
 	const cur1Name = $derived(cur?.chara_1 && names.get(cur.chara_1)?.en);
 	const cur2Name = $derived(cur?.chara_2 && names.get(cur.chara_2)?.en);
 	const cur3Name = $derived(cur?.chara_3 && names.get(cur.chara_3)?.en);
-	const alone = $derived([cur?.chara_1, cur?.chara_2, cur?.chara_3].filter((x) => x != null).length == 1 ? ' alone' : '');
+	const suggested = $derived.by(() => {
-	const suggested = $derived.by(async () => {
 		if (cur == null) {
 			return [];
 		}
@@ -36,6 +35,7 @@
 		return r.map(([chara_id, count]) => ({ chara_id, chara_name: names.get(chara_id), count }));
 	});
 	const curLoc = $derived(cur != null ? locations[cur.location] : null);
+	const req = $derived(cur != null ? requiredCharas(cur) : []);
 </script>
 
 <h1 class="text-4xl">Lobby Conversations</h1>
@@ -53,23 +53,27 @@
 		</select>
 	</div>
 </div>
-{#await suggested}
-	<div class="mt-4 w-full text-center text-3xl">Loading...</div>
-{:then suggested}
 {#if cur}
 	<div class="shadow-sm transition-shadow hover:shadow-md">
 		<div class="mt-8 flex text-center text-lg">
-				<span class="flex-1">{cur1Name}{alone}</span>
+			<span class={{ 'flex-1': true, 'font-bold italic': req.includes(cur.chara_1) }}>{cur1Name}</span>
 			{#if cur2Name}
-					<span class="flex-1">{cur2Name}</span>
+				<span class={{ 'flex-1': true, 'font-bold italic': cur.chara_2 != null && req.includes(cur.chara_2) }}>{cur2Name}</span>
 			{/if}
 			{#if cur3Name}
-					<span class="flex-1">{cur3Name}</span>
+				<span class={{ 'flex-1': true, 'font-bold italic': cur.chara_3 != null && req.includes(cur.chara_3) }}>{cur3Name}</span>
 			{/if}
 		</div>
 		<div class="flex w-full text-center text-lg">
 			<span class="flex-1">at {curLoc?.name.en}</span>
 		</div>
+		{#if req.length > 0}
+			<div class="mt-2 flex w-full text-center text-sm italic">
+				<span class="flex-1">
+					The conversation will not appear unless you own a trainee or support card of all characters with names in italics.
+				</span>
+			</div>
+		{/if}
 	</div>
 	<div class="mt-4 block text-center">
 		<span>Other characters who appear here most often:</span>
@@ -81,9 +85,7 @@
 	</div>
 	<div class="mt-4 block text-center">
 		<span>
-				Set these characters to fixed positions (main, upgrades, story, races) to maximize the chance of getting this
+			Set these characters to fixed positions (main, upgrades, story, races) to maximize the chance of getting this conversation.
-				conversation.
 		</span>
 	</div>
 {/if}
-{/await}