Add config file and support categories

2026-04-23 07:10:41 +00:00 · 2020-07-13 18:25:39 +02:00
parent c01cd04235
commit a7f885293e
6 changed files with 177 additions and 90 deletions
--- a/src/app/app.ts
+++ b/src/app/app.ts
@@ -13,6 +13,7 @@ import {
 import '@mcschema/java-1.16'
 import { RegistryFetcher } from './RegistryFetcher'
 import { ErrorsView } from './ErrorsView'
+import config from '../config.json'

 const LOCAL_STORAGE_THEME = 'theme'
 const LOCAL_STORAGE_LANGUAGE = 'language'
@@ -28,56 +29,16 @@ const addChecked = (el: HTMLElement) => {
  }, 2000)
 }

-const languages: { [key: string]: string } = {
-  'en': 'English',
-  'pt': 'Português',
-  'ru': 'Русский',
-  'zh-cn': '简体中文'
+const buildModel = (model: any) => {
+  if (model.schema) {
+    models[model.id] = new DataModel(SCHEMAS.get(model.schema))
+  } else if (model.children) {
+    model.children.forEach(buildModel)
+  }
 }

-const models: { [key: string]: DataModel } = {
-  'loot-table': new DataModel(SCHEMAS.get('loot_table')),
-  'predicate': new DataModel(SCHEMAS.get('predicate')),
-  'advancement': new DataModel(SCHEMAS.get('advancement')),
-  'dimension': new DataModel(SCHEMAS.get('dimension')),
-  'dimension-type': new DataModel(SCHEMAS.get('dimension_type')),
-  'worldgen/biome': new DataModel(SCHEMAS.get('biome')),
-  'worldgen/carver': new DataModel(SCHEMAS.get('configured_carver')),
-  'worldgen/feature': new DataModel(SCHEMAS.get('configured_feature')),
-  'worldgen/structure-feature': new DataModel(SCHEMAS.get('configured_structure_feature')),
-  'worldgen/surface-builder': new DataModel(SCHEMAS.get('configured_surface_builder')),
-  'worldgen/processor-list': new DataModel(SCHEMAS.get('processor_list')),
-  'worldgen/template-pool': new DataModel(SCHEMAS.get('template_pool'))
-}
-
-const registries = [
-  'attribute',
-  'block',
-  'enchantment',
-  'entity_type',
-  'fluid',
-  'item',
-  'loot_condition_type',
-  'loot_function_type',
-  'loot_pool_entry_type',
-  'mob_effect',
-  'stat_type',
-  'worldgen/block_state_provider_type',
-  'worldgen/block_placer_type',
-  'worldgen/biome_source',
-  'worldgen/carver',
-  'worldgen/chunk_generator',
-  'worldgen/decorator',
-  'worldgen/feature',
-  'worldgen/feature_size_type',
-  'worldgen/foliage_placer_type',
-  'worldgen/structure_feature',
-  'worldgen/structure_pool_element',
-  'worldgen/structure_processor',
-  'worldgen/surface_builder',
-  'worldgen/tree_decorator_type',
-  'worldgen/trunk_placer_type'
-]
+let models: { [key: string]: DataModel } = {}
+config.models.forEach(buildModel)

 const treeViewObserver = (el: HTMLElement) => {
  el.querySelectorAll('.node-header[data-error]').forEach(e => {
@@ -99,6 +60,7 @@ LOCALES.language = localStorage.getItem(LOCAL_STORAGE_LANGUAGE)?.toLowerCase() ?

 const homeLink = document.getElementById('home-link')!
 const homeGenerators = document.getElementById('home-generators')!
+const categoryGenerators = document.getElementById('category-generators')!
 const selectedModel = document.getElementById('selected-model')!
 const modelSelector = document.getElementById('model-selector')!
 const modelSelectorMenu = document.getElementById('model-selector-menu')!
@@ -141,7 +103,7 @@ const views: {[key: string]: AbstractView} = {
 Promise.all([
  fetchLocale(LOCALES.language),
  ...(LOCALES.language === 'en' ? [] : [fetchLocale('en')]),
-  RegistryFetcher(COLLECTIONS, registries)
+  RegistryFetcher(COLLECTIONS, config.registries)
 ]).then(responses => {

  let selected = ''
@@ -180,11 +142,11 @@ Promise.all([
    })

    languageSelectorMenu.innerHTML = ''
-    Object.keys(languages).forEach(key => {
+    config.languages.forEach(lang => {
      languageSelectorMenu.insertAdjacentHTML('beforeend',
-        `<div class="btn${key === LOCALES.language ? ' selected' : ''}">${languages[key]}</div>`)
+        `<div class="btn${lang.code === LOCALES.language ? ' selected' : ''}">${lang.name}</div>`)
      languageSelectorMenu.lastChild?.addEventListener('click', evt => {
-        updateLanguage(key, true)
+        updateLanguage(lang.code, true)
        languageSelectorMenu.style.visibility = 'hidden'
      })
    })
@@ -336,17 +298,23 @@ Promise.all([
      (document.querySelector('.content') as HTMLElement).style.overflowY = 'initial'
      modelSelector.style.display = 'none'
      panels.forEach(v => v.style.display = 'none')
-      homeGenerators.innerHTML = ''
-      Object.keys(models).forEach(m => {
-        homeGenerators.insertAdjacentHTML('beforeend', 
-          `<div class="home-generator-card">
-            ${locale(m)}
+
+      const addGen = (output: HTMLElement) => (m: any) => {
+        output.insertAdjacentHTML('beforeend', 
+          `<div class="generators-card${m.id === selected ? ' selected' : ''}">
+            ${locale(m.name)}
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M6.22 3.22a.75.75 0 011.06 0l4.25 4.25a.75.75 0 010 1.06l-4.25 4.25a.75.75 0 01-1.06-1.06L9.94 8 6.22 4.28a.75.75 0 010-1.06z"></path></svg>
          </div>`)
-          homeGenerators.lastChild?.addEventListener('click', evt => {
-          reload(publicPath + m)
+          output.lastChild?.addEventListener('click', evt => {
+          reload(publicPath + m.id)
        })
-      })
+      }
+
+      homeGenerators.innerHTML = ''
+      categoryGenerators.innerHTML = ''
+      config.models.forEach(addGen(homeGenerators))
+      config.models.find(m => m.id === selected)?.children?.forEach(addGen(categoryGenerators))
+      
    } else {
      homeViewEl.style.display = 'none';
      (document.querySelector('.gutter') as HTMLElement).style.display = ''
--- a/src/config.json
+++ b/src/config.json
@@ -0,0 +1,116 @@
+{
+  "languages": [
+    {
+      "code": "en",
+      "name": "English"
+    },
+    {
+      "code": "pt",
+      "name": "Português"
+    },
+    {
+      "code": "ru",
+      "name": "Русский"
+    },
+    {
+      "code": "zh-cn",
+      "name": "简体中文"
+    }
+  ],
+  "models": [
+    {
+      "id": "loot-table",
+      "name": "Loot Table",
+      "schema": "loot_table"
+    },
+    {
+      "id": "predicate",
+      "name": "Predicate",
+      "schema": "predicate"
+    },
+    {
+      "id": "advancement",
+      "name": "Advancement",
+      "schema": "advancement"
+    },
+    {
+      "id": "dimension",
+      "name": "Dimension",
+      "schema": "dimension"
+    },
+    {
+      "id": "dimension-type",
+      "name": "Dimension Type",
+      "schema": "dimension_type"
+    },
+    {
+      "id": "worldgen",
+      "name": "Worldgen",
+      "children": [
+        {
+          "id": "worldgen/biome",
+          "name": "Biome",
+          "schema": "biome"
+        },
+        {
+          "id": "worldgen/carver",
+          "name": "Carver",
+          "schema": "configured_carver"
+        },
+        {
+          "id": "worldgen/feature",
+          "name": "Feature",
+          "schema": "configured_feature"
+        },
+        {
+          "id": "worldgen/structure-feature",
+          "name": "Structure Feature",
+          "schema": "configured_structure_feature"
+        },
+        {
+          "id": "worldgen/surface-builder",
+          "name": "Surface Builder",
+          "schema": "configured_surface_builder"
+        },
+        {
+          "id": "worldgen/processor-list",
+          "name": "Processor List",
+          "schema": "processor_list"
+        },
+        {
+          "id": "worldgen/template-pool",
+          "name": "Template Pool",
+          "schema": "template_pool"
+        }
+      ]
+    }
+  ],
+  "registries": [
+    "attribute",
+    "block",
+    "enchantment",
+    "entity_type",
+    "fluid",
+    "item",
+    "loot_condition_type",
+    "loot_function_type",
+    "loot_pool_entry_type",
+    "mob_effect",
+    "stat_type",
+    "worldgen/block_state_provider_type",
+    "worldgen/block_placer_type",
+    "worldgen/biome_source",
+    "worldgen/carver",
+    "worldgen/chunk_generator",
+    "worldgen/decorator",
+    "worldgen/feature",
+    "worldgen/feature_size_type",
+    "worldgen/foliage_placer_type",
+    "worldgen/structure_feature",
+    "worldgen/structure_pool_element",
+    "worldgen/structure_processor",
+    "worldgen/surface_builder",
+    "worldgen/tree_decorator_type",
+    "worldgen/trunk_placer_type"
+  ]
+}
--- a/src/index.html
+++ b/src/index.html
@@ -96,7 +96,8 @@
        <textarea id="source-view-output" spellcheck="false" autocorrect="off" autocapitalize="off"></textarea>
      </div>
      <div id="home-view" class="home">
-        <div id="home-generators" class="home-generators"></div>
+        <div id="home-generators" class="generators-list"></div>
+        <div id="category-generators" class="generators-list"></div>
      </div>
    </div>
    <div id="errors-view" class="errors">
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -299,16 +299,17 @@ body {
 }

 .home {
+  display: flex;
  padding: 20px;
 }

-.home-generators {
+.generators-list {
  display: flex;
  flex-direction: column;
  margin: 0 20px;
 }

-.home-generator-card {
+.generators-card {
  margin: 5px 0;
  padding: 8px 15px;
  cursor: pointer;
@@ -321,13 +322,17 @@ body {
  align-items: center;
  justify-content: space-between;
  transition: background-color 0.2s;
+  transition: margin 0.2s;
 }

-.home-generator-card:hover {
+.generators-card:hover,
+.generators-card.selected {
  background-color: var(--nav-faded-hover);
+  margin-left: 8px;
+  margin-right: -8px;
 }

-.home-generator-card svg {
+.generators-card svg {
  margin-left: 10px;
 }

--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,7 +6,8 @@
    "moduleResolution": "node",
    "esModuleInterop": true,
    "downlevelIteration": true,
-    "forceConsistentCasingInFileNames": true
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true
  },
  "include": [
    "src"
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,6 +1,7 @@
 const CopyWebpackPlugin = require('copy-webpack-plugin')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const MergeJsonWebpackPlugin = require("merge-jsons-webpack-plugin");
+const config = require('./src/config.json')

 module.exports = (env, argv) => ({
  entry: './src/app/app.ts',
@@ -28,12 +29,10 @@ module.exports = (env, argv) => ({
    }),
    new MergeJsonWebpackPlugin({
      output: {
-        groupBy: [ 'de', 'en', 'fr', 'it', 'ja', 'pt', 'ru', 'zh-cn' ].map(code => (
-          {
-            pattern: `{./src/locales/${code}.json,./node_modules/@mcschema/core/locales/${code}.json}`,
-            fileName: `./locales/${code}.json`
-          }
-        ))
+        groupBy: config.languages.map(lang => ({
+          pattern: `{./src/locales/${lang.code}.json,./node_modules/@mcschema/core/locales/${lang.code}.json}`,
+          fileName: `./locales/${lang.code}.json`
+        }))
      }
    }),
    new HtmlWebpackPlugin({
@@ -41,23 +40,20 @@ module.exports = (env, argv) => ({
      filename: 'index.html',
      template: 'src/index.html'
    }),
-    ...[
-      [ 'loot-table', 'Loot Table' ],
-      [ 'predicate', 'Predicate' ],
-      [ 'advancement', 'Advancement' ],
-      [ 'dimension', 'Dimension' ],
-      [ 'dimension-type', 'Dimension Type' ],
-      [ 'worldgen/biome', 'Biome' ],
-      [ 'worldgen/carver', 'Carver' ],
-      [ 'worldgen/feature', 'Feature' ],
-      [ 'worldgen/structure-feature', 'Structure Feature' ],
-      [ 'worldgen/surface-builder', 'Surface Builder' ],
-      [ 'worldgen/processor-list', 'Processor List' ],
-      [ 'worldgen/template-pool', 'Template Pool' ],
-    ].map(page => new HtmlWebpackPlugin({
-      title: `${page[1]} Generators Minecraft`,
-      filename: `${page[0]}/index.html`,
-      template: 'src/index.html'
-    }))
+    ...config.models.flatMap(buildModel)
  ]
 })
+
+function buildModel(model) {
+  const page = new HtmlWebpackPlugin({
+    title: `${model.name} Generators Minecraft`,
+    filename: `${model.id}/index.html`,
+    template: 'src/index.html'
+  })
+  if (model.schema) {
+    return page
+  } else if (model.children) {
+    return [page, ...model.children.flatMap(buildModel)]
+  }
+  return []
+}