dtomlinson/anno-production-chain-renderer
1
0
Fork 0
mirror of https://github.com/dtomlinson91/anno-production-chain-renderer.git synced 2025-12-22 06:15:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

add latest

Browse Source
This commit is contained in:
Daniel Tomlinson
2022-09-30 13:44:43 +01:00
parent ed6b122eb8
commit 7a5a5e0e9d
9 changed files with 91 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@@ -13,7 +13,6 @@
},
"dependencies": {
"@quasar/extras": "^1.0.0",
"@types/mermaid": "^9.1.0",
"endent": "^2.1.0",
"mermaid": "^9.1.7",
"quasar": "^2.6.0",
@@ -22,6 +21,7 @@
},
"devDependencies": {
"@quasar/app-vite": "^1.0.0",
"@types/mermaid": "^9.1.0",
"@types/node": "^12.20.21",
"@typescript-eslint/eslint-plugin": "^5.10.0",
"@typescript-eslint/parser": "^5.10.0",
@@ -31,6 +31,7 @@
"eslint-plugin-vue": "^9.0.0",
"prettier": "^2.5.1",
"push-dir": "^0.4.1",
"rollup-plugin-visualizer": "^5.8.2",
"typescript": "^4.5.4"
},
"engines": {

18
quasar.config.js
View File

@@ -28,7 +28,7 @@ module.exports = configure(function (/* ctx */) {
// app boot file (/src/boot)
// --> boot files are part of "main.js"
// https://v2.quasar.dev/quasar-cli-vite/boot-files
boot: [],
boot: ['mermaid'],
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
css: ['app.scss'],
@@ -56,6 +56,7 @@ module.exports = configure(function (/* ctx */) {
alias: {
composables: path.join(__dirname, './src/composables'),
boot: path.join(__dirname, './src/boot'),
},
vueRouterMode: 'hash', // available values: 'hash', 'history'
@@ -79,15 +80,22 @@ module.exports = configure(function (/* ctx */) {
},
// viteVuePluginOptions: {},
// vitePlugins: [
// [ 'package-name', { ..options.. } ]
// ]
// vitePlugins: [],
extendViteConf(viteConf, { isClient, isServer }) {
viteConf.plugins.push(
require('rollup-plugin-visualizer').visualizer({
emitFile: true,
file: 'stats.html',
})
);
},
},
// Full list of options: https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#devServer
devServer: {
// https: true
open: true, // opens browser window automatically
open: false, // opens browser window automatically
},
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#framework

16
src/boot/mermaid.ts Normal file
View File

@@ -0,0 +1,16 @@
import { onMounted } from 'vue';
import mermaid from 'mermaid';
function initialiseMermaid() {
onMounted(() => {
mermaid.initialize({
startOnLoad: false,
logLevel: 'fatal',
securityLevel: 'loose',
theme: 'neutral',
flowchart: { htmlLabels: true }
});
});
}
export { mermaid, initialiseMermaid };

2
src/components/ProductionChain.vue
View File

@@ -5,7 +5,7 @@
<script setup lang="ts">
import { ref, watchEffect } from 'vue';
import mermaid from 'mermaid';
import { mermaid } from 'boot/mermaid';
// DOM Refs
const diagram = ref<HTMLInputElement | null>(null);

2
src/pages/AnnoBase.vue
View File

@@ -35,7 +35,7 @@
import { productionChainsBase } from './data/production-chains-base';
// Mermaid
import { initialiseMermaid } from 'composables/mermaid';
import { initialiseMermaid } from 'boot/mermaid';
// Components
import ChainTiers from 'components/ChainTiers.vue';

2
src/pages/AnnoExpansions.vue
View File

@@ -31,7 +31,7 @@
import { productionChainsExpansions } from './data/production-chains-expansions';
// Mermaid
import { initialiseMermaid } from 'composables/mermaid';
import { initialiseMermaid } from 'boot/mermaid';
// Components
import ChainTiers from 'components/ChainTiers.vue';

50
src/pages/data/production-chains-base.ts
View File

@@ -1,4 +1,5 @@
import { TieredProductionChain } from './models';
import endent from 'endent';
// Icons
// Regions
@@ -167,19 +168,39 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'coalRatio',
mermaidDefinition: `flowchart LR; Coal(<img src='${coalIcon}' class='icon-size' /><span class='ratio-count'>1</span>) --> Charcoal(<img src='${charcoalKilnIcon}' class='icon-size' /><span class='ratio-count'>2</span>)`
mermaidDefinition: endent`
flowchart LR
Coal(<img src='${coalIcon}' class='icon-size' /><span class='ratio-count'>1</span>)
Charcoal(<img src='${charcoalKilnIcon}' class='icon-size' /><span class='ratio-count'>2</span>)
Coal --> Charcoal
`
},
{
productionChain: 'goldRatio',
mermaidDefinition: `flowchart LR; ArcticFur(<span class='icon-flex-row'><img src='${goldOreIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${arcticIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>) --> OldWorldFur(<span class='icon-flex-row'><img src='${goldOreIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${newWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>4</span></span></span>)`
mermaidDefinition: endent`
flowchart LR
ArcticGold(<span class='icon-flex-row'><img src='${goldOreIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${arcticIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>)
NewWorldGold(<span class='icon-flex-row'><img src='${goldOreIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${newWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>4</span></span></span>)
ArcticGold --> NewWorldGold
`
},
{
productionChain: 'furRatio',
mermaidDefinition: `flowchart LR; ArcticFur(<span class='icon-flex-row'><img src='${fursIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${arcticIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>) --> OldWorldFur(<span class='icon-flex-row'><img src='${fursIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${oldWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>4</span></span></span>)`
mermaidDefinition: `
flowchart LR
ArcticFur(<span class='icon-flex-row'><img src='${fursIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${arcticIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>)
OldWorldFur(<span class='icon-flex-row'><img src='${fursIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${oldWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>4</span></span></span>)
ArcticFur --> OldWorldFur
`
},
{
productionChain: 'clayRatio',
mermaidDefinition: `flowchart LR; EnbesaClay(<span class='icon-flex-row'><img src='${clayIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${enbesaIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>) --> OldWorldClay(<span class='icon-flex-row'><img src='${clayIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${oldWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>2</span></span></span>)`
mermaidDefinition: `
flowchart LR
EnbesaClay(<span class='icon-flex-row'><img src='${clayIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${enbesaIcon}' class='electricity-icon' /></span><span class='ratio-count'>1</span></span></span>)
OldWorldClay(<span class='icon-flex-row'><img src='${clayIcon}' class='icon-size' /><span class='icon-flex-col q-pl-sm'><span><img src='${oldWorldIcon}' class='electricity-icon' /></span><span class='ratio-count'>2</span></span></span>)
EnbesaClay --> OldWorldClay
`
}
]
},
@@ -189,15 +210,30 @@ export const productionChainsBase: TieredProductionChain[] = [
productionChains: [
{
productionChain: 'oilPowerPlant',
mermaidDefinition: `flowchart LR; OilWell(<img src='${oilWellIcon}' class='icon-size' /><span class='ratio-count'>3</span>) --> OilPowerPlant(<img src='${oilPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>1</span>)`
mermaidDefinition: `
flowchart LR
OilWell(<img src='${oilWellIcon}' class='icon-size' /><span class='ratio-count'>3</span>)
OilPowerPlant(<img src='${oilPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>1</span>)
OilWell --> OilPowerPlant
`
},
{
productionChain: 'oilTanker',
mermaidDefinition: `flowchart LR; OilTanker(<img src='${oilTankerIcon}' class='icon-size' /><span class='ratio-count'>1</span>) --> OilPowerPlant(<img src='${oilPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>2-3</span>)`
mermaidDefinition: `
flowchart LR
OilTanker(<img src='${oilTankerIcon}' class='icon-size' /><span class='ratio-count'>1</span>)
OilPowerPlant(<img src='${oilPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>2-3</span>)
OilTanker --> OilPowerPlant
`
},
{
productionChain: 'gasPowerPlant',
mermaidDefinition: `flowchart LR; Gas(<img src='${gasIcon}' class='icon-size' /><span class='ratio-count'>6</span>) --> GasPlant(<img src='${gasPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>1</span>)`
mermaidDefinition: `
flowchart LR
Gas(<img src='${gasIcon}' class='icon-size' /><span class='ratio-count'>6</span>)
GasPlant(<img src='${gasPowerPlantIcon}' class='icon-size' /><span class='ratio-count'>1</span>)
Gas --> GasPlant
`
}
]
},

5
tsconfig.json
View File

@@ -2,6 +2,9 @@
"extends": "@quasar/app-vite/tsconfig-preset",
"compilerOptions": {
"baseUrl": ".",
"paths": { "composables/*": ["./src/composables/*"] }
"paths": {
"composables/*": ["./src/composables/*"],
"boot/*": ["./src/boot/*"]
}
}
}

11
yarn.lock
View File

@@ -3114,6 +3114,15 @@ rollup-plugin-visualizer@^5.5.4:
source-map "^0.7.3"
yargs "^17.5.1"
rollup-plugin-visualizer@^5.8.2:
version "5.8.2"
resolved "https://registry.yarnpkg.com/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.8.2.tgz#25a4cc6431aba2eba8ecb7c99d8c3623d493e4bd"
integrity sha512-Fh7KoAa7FVVOojmyyX9ro7fBSR7mPG2cgfDbA877HM4IeJJtSZO+I/R3h/u6TB8wVP5J4pXPpTaRMSREyqCS3g==
dependencies:
open "^8.4.0"
source-map "^0.7.4"
yargs "^17.5.1"
"rollup@>=2.59.0 <2.78.0":
version "2.77.3"
resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.77.3.tgz#8f00418d3a2740036e15deb653bed1a90ee0cc12"
@@ -3277,7 +3286,7 @@ source-map@^0.6.1, source-map@~0.6.0:
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
source-map@^0.7.3:
source-map@^0.7.3, source-map@^0.7.4:
version "0.7.4"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.4.tgz#a9bbe705c9d8846f4e08ff6765acf0f1b0898656"
integrity sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==