diff --git a/src/composables/mermaid.ts b/src/composables/mermaid.ts
index 68604ea..124f8b6 100644
--- a/src/composables/mermaid.ts
+++ b/src/composables/mermaid.ts
@@ -1,7 +1,7 @@
import { onMounted } from 'vue';
import mermaid from 'mermaid';
-export function initialiseMermaid() {
+function initialiseMermaid() {
onMounted(() => {
mermaid.initialize({
startOnLoad: false,
@@ -12,3 +12,5 @@ export function initialiseMermaid() {
});
});
}
+
+export { mermaid, initialiseMermaid };
diff --git a/src/pages/data/production-chains-base.ts b/src/pages/data/production-chains-base.ts
index eb631e1..ea28afb 100644
--- a/src/pages/data/production-chains-base.ts
+++ b/src/pages/data/production-chains-base.ts
@@ -186,7 +186,7 @@ export const productionChainsBase: TieredProductionChain[] = [
},
{
productionChain: 'furRatio',
- mermaidDefinition: `
+ mermaidDefinition: endent`
flowchart LR
ArcticFur(
1)
OldWorldFur(
4)
@@ -195,7 +195,7 @@ export const productionChainsBase: TieredProductionChain[] = [
},
{
productionChain: 'clayRatio',
- mermaidDefinition: `
+ mermaidDefinition: endent`
flowchart LR
EnbesaClay(
1)
OldWorldClay(2)
@@ -210,7 +210,7 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'oilPowerPlant',
- mermaidDefinition: `
+ mermaidDefinition: endent`
flowchart LR
OilWell(
3)
OilPowerPlant(
1)
@@ -219,7 +219,7 @@ export const productionChainsBase: TieredProductionChain[] = [
},
{
productionChain: 'oilTanker',
- mermaidDefinition: `
+ mermaidDefinition: endent`
flowchart LR
OilTanker(
1)
OilPowerPlant(2-3)
@@ -228,7 +228,7 @@ export const productionChainsBase: TieredProductionChain[] = [
},
{
productionChain: 'gasPowerPlant',
- mermaidDefinition: `
+ mermaidDefinition: endent`
flowchart LR
Gas(
6)
GasPlant(
1)
@@ -243,27 +243,66 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'timber',
- mermaidDefinition: `flowchart LR; Wood(
1)-->Timber(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Wood(1)
+ Timber(1)
+ Wood --> Timber
+ `
},
{
productionChain: 'bricks',
- mermaidDefinition: `flowchart LR; Clay(1) --> Bricks(
2)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Clay(1)
+ Bricks(2)
+ Clay --> Bricks
+ `
},
{
productionChain: 'steelBeams',
- mermaidDefinition: `flowchart LR; CharcoalKiln(
66%1) & Iron(
33%1) --> Steel(
66%1) --> SteelBeams(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ CharcoalKiln(66%1)
+ Iron(33%1)
+ Steel(66%1)
+ SteelBeams(1)
+ CharcoalKiln & Iron --> Steel --> SteelBeams
+ `
},
{
productionChain: 'windows',
- mermaidDefinition: `flowchart LR; Sand(
50%1) --> GlassMakers(
50%1) --> WindowMakers(
1); Wood(25%1) --> WindowMakers`
+ mermaidDefinition: endent`
+ flowchart LR
+ Sand(50%1)
+ GlassMakers(50%1)
+ WindowMakers(1)
+ Wood(25%1)
+ Sand --> GlassMakers --> WindowMakers
+ Wood --> WindowMakers
+ `
},
{
productionChain: 'concrete',
- mermaidDefinition: `flowchart LR; Iron(25%1) & Coal(
25%1) --> Steel(50%1) --> Concrete(
1); Limestone(
50%1) --> Concrete`
+ mermaidDefinition: endent`
+ flowchart LR
+ Iron(25%1)
+ Coal(25%1)
+ Steel(50%1)
+ Concrete(1)
+ Limestone(50%1)
+ Iron & Coal --> Steel --> Concrete
+ Limestone --> Concrete
+ `
},
{
productionChain: 'mudBricks',
- mermaidDefinition: `flowchart LR; Clay(25%1) & Teff(
1) --> MudBricks(
1)`
+ mermaidDefinition: endent`
+ flowchart LR; Clay(25%1)
+ Teff(1)
+ MudBricks(1)
+ Clay & Teff --> MudBricks
+ `
}
]
},
@@ -273,11 +312,35 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'steamMotors',
- mermaidDefinition: `flowchart LR; Coal(1) & Iron(1) --> Steel(2) --> SteamMotors(
3); style SteamMotors stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7;; Copper(
2) & Zinc(
2) --> Brass(
4) --> SteamMotors`
+ mermaidDefinition: endent`
+ flowchart LR
+ Coal(1)
+ Iron(1)
+ Steel(2)
+ SteamMotors(3)
+ Copper(2)
+ Zinc(2)
+ Brass(4)
+ style SteamMotors stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7
+ Coal & Iron --> Steel --> SteamMotors
+ Copper & Zinc --> Brass --> SteamMotors
+ `
},
{
productionChain: 'steamCarriages',
- mermaidDefinition: `flowchart LR; SteamMotors(3) --> SteamCarriages(
2); Wood(1) & Caoutchouc(
4) --> Coaches(
8) --> SteamCarriages; style SteamCarriages stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7; style SteamMotors stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7;`
+ mermaidDefinition: endent`
+ flowchart LR
+ SteamMotors(3)
+ SteamCarriages(2)
+ Wood(1)
+ Caoutchouc(4)
+ Coaches(8)
+ SteamCarriages
+ style SteamMotors stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7
+ style SteamCarriages stroke:#0675BD,stroke-width:5px,stroke-dasharray: 7 7
+ SteamMotors --> SteamCarriages
+ Wood & Caoutchouc --> Coaches --> SteamCarriages
+ `
}
]
},
@@ -287,27 +350,62 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'workClothes',
- mermaidDefinition: `flowchart LR; Wool(
1) --> WorkClothes(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Wool(1)
+ WorkClothes(1)
+ Wool --> WorkClothes
+ `
},
{
productionChain: 'schnapps',
- mermaidDefinition: `flowchart LR; Potato(
1) --> Schnapps(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Potato(1)
+ Schnapps(1)
+ Potato --> Schnapps
+ `
},
{
productionChain: 'sausages',
- mermaidDefinition: `flowchart LR; Pig(
1) --> Sausages(
2)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Pig(1)
+ Sausages(2)
+ Pig --> Sausages
+ `
},
{
productionChain: 'bread',
- mermaidDefinition: `flowchart LR; Grain(
2) --> Flour(
1) --> Bread(
2)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Grain(2)
+ Flour(1)
+ Bread(2)
+ Grain --> Flour --> Bread
+ `
},
{
productionChain: 'soap',
- mermaidDefinition: `flowchart LR; Pigs(
2) --> Tallow(
2) --> Soap(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ Pigs(2)
+ Tallow(2)
+ Soap(1)
+ Pigs --> Tallow --> Soap
+ `
},
{
productionChain: 'beer',
- mermaidDefinition: `flowchart LR; Grain(2) --> Malthouse(
1) --> Brewery(
2); HopFarm(
3) --> Brewery`
+ mermaidDefinition: endent`
+ flowchart LR
+ Grain(2)
+ Malthouse(1)
+ Brewery(2)
+ HopFarm(3)
+ Grain --> Malthouse --> Brewery
+ HopFarm --> Brewery
+ `
}
]
},
@@ -317,19 +415,52 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'cannedFood',
- mermaidDefinition: `flowchart LR; Beef(
66%2) & RedPepper(
66%2) --> ArtisnalKitchen(
66%2) --> Cannery(
1); Iron(16%1) --> Cannery`
+ mermaidDefinition: endent`
+ flowchart LR
+ Beef(66%2)
+ RedPepper(66%2)
+ ArtisnalKitchen(66%2)
+ Cannery(1)
+ Iron(16%1)
+ Beef & RedPepper --> ArtisnalKitchen --> Cannery
+ Iron --> Cannery
+ `
},
{
productionChain: 'sewingMachines',
- mermaidDefinition: `flowchart LR; Charcoal(1) --> Steel(1) --> SewingMachines(
1); Iron(50%1) --> Steel; Wood(50%1) --> SewingMachines`
+ mermaidDefinition: endent`
+ flowchart LR
+ Charcoal(1)
+ Steel(1)
+ SewingMachines(1)
+ Iron(50%1)
+ Steel
+ Wood(50%1)
+ Charcoal & Iron --> Steel --> SewingMachines
+ Wood --> SewingMachines
+ `
},
{
productionChain: 'rum',
- mermaidDefinition: `flowchart LR; SugarCane(
1) & Wood(50%1) --> Rum(
1)`
+ mermaidDefinition: endent`
+ flowchart LR
+ SugarCane(1)
+ Wood(50%1)
+ Rum(1)
+ SugarCane & Wood --> Rum
+ `
},
{
productionChain: 'furs',
- mermaidDefinition: `flowchart LR; Cotton(
2) --> CottonMill(
1) --> FurCoats(
1); Furs(2) --> FurCoats`
+ mermaidDefinition: endent`
+ flowchart LR
+ Cotton(2)
+ CottonMill(1)
+ FurCoats(1)
+ Furs(2)
+ Cotton --> CottonMill --> FurCoats
+ Furs --> FurCoats
+ `
}
]
},