Fix creatures/characters. Fix classes.

Author: rjordan

site/crawl-github-pages.js

@@ -636,6 +636,25 @@ Each markdown file can be loaded individually into an AI model's context:
 - **World Building:** [politics.md](politics.md) + [religion.md](religion.md) + [relationships.md](relationships.md)
 - **Combat/Items:** [equipment.md](equipment.md) + [creatures.md](creatures.md)
 
+## Recommended Markdown Viewers
+
+For the best reading experience on different platforms:
+
+### Windows
+- **[Obsidian](https://obsidian.md/)** (Free) - Excellent for interconnected documents, shows relationships between pages
+- **[MarkText](https://github.com/marktext/marktext)** (Free) - Clean, real-time preview editor
+- **[Typora](https://typora.io/)** (Paid) - Premium WYSIWYG markdown editor with beautiful rendering
+
+### Cross-Platform
+- **[Zettlr](https://www.zettlr.com/)** (Free) - Academic-focused with great cross-reference support
+- **[Joplin](https://joplinapp.org/)** (Free) - Note-taking app with excellent markdown support
+
+### Web-Based
+- **GitHub** - View files directly in your browser at the repository
+- **GitLab/Gitea** - If you prefer other Git platforms
+
+**Recommendation:** Obsidian is particularly good for this documentation because it can visualize the connections between characters, magic schools, and world elements as an interactive graph.
+
 ## MCP Server Integration
 
 These files are designed to be served by the MCP server as static content, eliminating the need for dynamic page crawling.

site/public/data/classes.json

@@ -1,10 +1,10 @@
 {
   "classes": {
-    "base": {
+    "core": {
       "warrior": {
         "name": "Warrior",
         "description": "Masters of physical combat, skilled with a variety of weapons and armor. The backbone of military forces and those who rely on strength and martial prowess.",
-        "populationPercentage": 59,
+        "populationPercentage": 65,
         "alternativeNames": [
           "Fighter",
           "Knight",
@@ -14,7 +14,7 @@
       "rogue": {
         "name": "Rogue",
         "description": "Experts in stealth, agility, and cunning, often excelling in dexterous skills and unconventional approaches. Include skilled workers, scouts, and those who rely on finesse.",
-        "populationPercentage": 38,
+        "populationPercentage": 32,
         "alternativeNames": [
           "Scout",
           "Specialist",

site/src/components/Layout.tsx

@@ -23,6 +23,8 @@ function Layout(props: RouteSectionProps) {
             <li><A href="/politics">Politics</A></li>
             <li><A href="/religion">Religion</A></li>
             <li><A href="/relationships">Relationships</A></li>
+            <li><A href='/creatures'>Creatures</A></li>
+            <li><A href='/characters'>Noteable Characters</A></li>
           </ul>
         </div>
       </nav>

site/src/data/index.ts

@@ -87,24 +87,6 @@ export interface OrganizationsData {
   organizations: Record<string, any>
 }
 
-export interface OldCreatureData {
-  name: string
-  rank: string
-  ideology: string
-  morality: string
-  methodology: string
-  temperament: string
-  // abilities?: Record<string, string>
-  // skills?: Record<string, string>
-  // traits?: string[]
-  tags: string[]
-  description: string
-}
-
-export interface OldCreaturesData {
-  creatures: Record<string, OldCreatureData>
-}
-
 // New entity data structures for character and creature cards
 enum RankValue {
   F = 'F',
@@ -275,11 +257,6 @@ export async function fetchCreaturesData(): Promise<CreaturesData> {
   return loadJsonData<CreaturesData>('creatures')
 }
 
-// Keep old creatures data for backward compatibility
-export async function fetchOldCreaturesData(): Promise<OldCreaturesData> {
-  return loadJsonData<OldCreaturesData>('creatures')
-}
-
 // Helper function to fetch all data at once if needed
 export async function fetchAllData() {
   const [magic, classes, equipment, organizations, creatures, site] = await Promise.all([

site/src/index.tsx

@@ -14,9 +14,11 @@ import Alignment from './pages/alignment'
 import Religion from './pages/religion'
 import Relationships from './pages/relationships'
 import Skills from './pages/skills'
+import Characters from './pages/characters'
 import CharacterDetail from './pages/characters/detail'
 import CreatureDetail from './pages/creatures/detail'
-import EntitiesDemo from './pages/entities-demo'
+import EntitiesDemo from './pages/creatures'
+import Creatures from './pages/creatures'
 
 const root = document.getElementById('root')
 
@@ -32,7 +34,9 @@ render(() => (
     <Route path="/alignment" component={Alignment} />
     <Route path="/religion" component={Religion} />
     <Route path="/relationships" component={Relationships} />
+    <Route path="/characters" component={Characters} />
     <Route path="/characters/:id" component={CharacterDetail} />
+    <Route path="/creatures" component={Creatures} />
     <Route path="/creatures/:id" component={CreatureDetail} />
     <Route path="/entities-demo" component={EntitiesDemo} />
   </HashRouter>

site/src/pages/entities-demo.tsx renamed to site/src/pages/characters.tsx

@@ -3,9 +3,8 @@ import EntityCard from '@/components/EntityCard'
 import { fetchCharactersData, fetchCreaturesData } from '@data/index'
 
 // Example usage of EntityCard component with real data
-function EntityCardsDemo() {
+function Characters() {
   const [charactersData] = createResource(fetchCharactersData)
-  const [creaturesData] = createResource(fetchCreaturesData)
 
   // Convert data objects to arrays for rendering
   const characters = () => {
@@ -19,22 +18,9 @@ function EntityCardsDemo() {
     }))
   }
 
-  const creatures = () => {
-    const data = creaturesData()
-    if (!data) return []
-    return Object.entries(data.creatures).map(([id, creature]) => ({
-      id,
-      ...creature,
-      // Generate subtitle from available data
-      subtitle: `Wild Animal` // Could be derived from tags or other data
-    }))
-  }
-
   return (
     <div class="container">
-      <h1>Characters & Creatures</h1>
-      <p>Example usage of the EntityCard component for displaying characters and creatures loaded from JSON data.</p>
-
+      <h1>Notable Characters</h1>
       <Suspense fallback={<div>Loading entities...</div>}>
         <h2>Characters</h2>
         <div class="entity-grid">
@@ -51,25 +37,9 @@ function EntityCardsDemo() {
             />
           )}</For>
         </div>
-
-        <h2>Creatures</h2>
-        <div class="entity-grid">
-          <For each={creatures()}>{(creature) => (
-            <EntityCard
-              id={creature.id}
-              name={creature.name}
-              subtitle={creature.subtitle}
-              description={creature.description}
-              rank={creature.threatLevel}
-              rankLabel="Threat Level"
-              imageUrl={creature.imageUrl || undefined}
-              basePath="/creatures"
-            />
-          )}</For>
-        </div>
       </Suspense>
     </div>
   )
 }
 
-export default EntityCardsDemo
+export default Characters

site/src/pages/classes.tsx

@@ -30,6 +30,11 @@ function Classes() {
       label: 'Alternate Names',
       priority: 'low',
       render: (value) => Array.isArray(value) ? value.join(', ') : value
+    },
+    {
+      key: 'populationPercentage',
+      label: 'Population Percentage',
+      priority: 'low',
     }
   ]
 

site/src/pages/creatures.tsx

@@ -0,0 +1,44 @@
+import { createResource, For, Suspense } from 'solid-js'
+import EntityCard from '@/components/EntityCard'
+import { fetchCharactersData, fetchCreaturesData } from '@data/index'
+
+// Example usage of EntityCard component with real data
+function Creatures() {
+  const [creaturesData] = createResource(fetchCreaturesData)
+
+
+  const creatures = () => {
+    const data = creaturesData()
+    if (!data) return []
+    return Object.entries(data.creatures).map(([id, creature]) => ({
+      id,
+      ...creature,
+      // Generate subtitle from available data
+      subtitle: `Wild Animal` // Could be derived from tags or other data
+    }))
+  }
+
+  return (
+    <div class="container">
+      <h1>Creatures</h1>
+      <Suspense fallback={<div>Loading entities...</div>}>
+        <div class="entity-grid">
+          <For each={creatures()}>{(creature) => (
+            <EntityCard
+              id={creature.id}
+              name={creature.name}
+              subtitle={creature.subtitle}
+              description={creature.description}
+              rank={creature.threatLevel}
+              rankLabel="Threat Level"
+              imageUrl={creature.imageUrl || undefined}
+              basePath="/creatures"
+            />
+          )}</For>
+        </div>
+      </Suspense>
+    </div>
+  )
+}
+
+export default Creatures

site/src/pages/home.tsx

@@ -70,21 +70,6 @@ function Home() {
         </dt>
         <dd>Reserved for the most powerful beings in existence. SSS-rank characters are god-like and can shape the course of history.<br />Combat: can take on entire armies, causing act-of-god level devastation.<br />Skill: unparalleled and can achieve the impossible.</dd>
       </dl>
-
-      <section class="explore-section">
-        <h2>Explore the World</h2>
-        <ul class="world-links">
-          <li><A href="/magic">Magic System</A></li>
-          <li><A href="/skills">Skills & Abilities</A></li>
-          <li><A href="/politics">Political Landscape</A></li>
-          <li><A href="/classes">Character Classes</A></li>
-          <li><A href="/equipment">Equipment & Items</A></li>
-          <li><A href="/alignment">Alignment System</A></li>
-          <li><A href="/religion">Religions & Deities</A></li>
-          <li><A href="/relationships">Relationships</A></li>
-          <li><A href="/entities-demo">Entities Demo</A></li>
-        </ul>
-      </section>
     </div>
   )
 }

site/src/pages/relationships.tsx

@@ -8,7 +8,7 @@ function Relationships() {
       <p>Relationship archetypes are common character tropes found in various forms of media, particularly in anime, manga, and visual novels. These archetypes describe different ways characters express their affection and interact with their love interests. When a character is assigned an archetype it should influence or override their alignement temperament, especially in romantic situations.</p>
 
       <h3>Common Archetypes</h3>
-      <p>These make up about 60% of character relationships.</p>
+      <p>These make up about 80% of character relationships.</p>
       <table>
         <thead>
           <tr>
@@ -124,7 +124,7 @@ function Relationships() {
 
 
       <h3>Uncommon Archetypes</h3>
-      <p>These make up about 30% of character relationships.</p>
+      <p>These make up about 19% of character relationships.</p>
       <table>
         <thead>
           <tr>
@@ -163,7 +163,7 @@ function Relationships() {
       </table>
 
       <h3>Rare Archetypes</h3>
-      <p>These make up about 10% of character relationships.</p>
+      <p>These make up about 1% of character relationships.</p>
       <table>
         <thead>
           <tr>