mirror of
https://github.com/bilawalsidhu/gods-eye-view.git
synced 2026-11-04 10:24:02 +00:00
refactor(build): place the views in the page instead of expanding templates
index.html now lists each view's host and the loading screen itself, so the gev:template expansion plugin, its view list, the loading-screen template and the ./build/html export are gone. createApplication takes omitViews for views an application leaves out; their hosts are removed, and a view an earlier call rendered is unmounted.
This commit is contained in:
1 parent
f279200af5
commit
5bf797ef71
18 files changed
+176
-174
No files matched your search
@@ -1,52 +0,0 @@
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { APPLICATION_VIEW_NAMES } from './applicationViews.js';
|
||||
|
||||
export const APPLICATION_TEMPLATES = Object.freeze([
|
||||
'scene-chrome',
|
||||
'cockpit',
|
||||
'display-controls',
|
||||
'command-dock',
|
||||
'layer-panels',
|
||||
'context',
|
||||
'welcome',
|
||||
'provider-settings',
|
||||
'hud-loading',
|
||||
]);
|
||||
const allowed = new Set(APPLICATION_TEMPLATES);
|
||||
const views = new Set(APPLICATION_VIEW_NAMES);
|
||||
|
||||
/**
|
||||
* The element a Vue view renders into. `display: contents` keeps the view's
|
||||
* own elements laid out as children of the page.
|
||||
* @param {string} name Application template name.
|
||||
*/
|
||||
export function applicationViewHost(name) {
|
||||
return `<div class="gev-view" data-gev-view="${name}"></div>\n`;
|
||||
}
|
||||
|
||||
/** Expand only known component templates; markers cannot name filesystem paths. */
|
||||
export function expandApplicationHtml(html) {
|
||||
return html.replace(
|
||||
/^[ \t]*<!-- gev:template ([^\s]+) -->\r?\n?/gm,
|
||||
(_, name) => {
|
||||
if (!allowed.has(name))
|
||||
throw new Error(`Unknown application template: ${name}`);
|
||||
if (views.has(name)) return applicationViewHost(name);
|
||||
return readFileSync(
|
||||
new URL(`../src/ui/templates/${name}.html`, import.meta.url),
|
||||
'utf8',
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/** Assemble static application markup before Vite processes scripts and assets. */
|
||||
export function applicationHtmlPlugin() {
|
||||
return {
|
||||
name: 'application-component-templates',
|
||||
transformIndexHtml: {
|
||||
order: 'pre',
|
||||
handler: expandApplicationHtml,
|
||||
},
|
||||
};
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
/**
|
||||
* Application templates that are now Vue views (src/ui/views). Their markers
|
||||
* expand to a mount host instead of static markup, and
|
||||
* `mountApplicationViews()` renders them before the page is wired. The
|
||||
* loading screen stays static so it paints before any script runs.
|
||||
*/
|
||||
export const APPLICATION_VIEW_NAMES = Object.freeze([
|
||||
'provider-settings',
|
||||
'scene-chrome',
|
||||
'cockpit',
|
||||
'display-controls',
|
||||
'command-dock',
|
||||
'layer-panels',
|
||||
'context',
|
||||
'welcome',
|
||||
]);
|
||||
@@ -1,5 +1,4 @@
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import { applicationHtmlPlugin } from './application-html.js';
|
||||
import cesium from 'vite-plugin-cesium';
|
||||
import vue from '@vitejs/plugin-vue';
|
||||
import { VUE_PLUGIN_OPTIONS } from './vueOptions.js';
|
||||
@@ -157,7 +156,6 @@ export function createBrowserViteConfig({
|
||||
// Next, so no provider route answers a Host the server does not allow.
|
||||
hostCheckPlugin(),
|
||||
cesium(),
|
||||
applicationHtmlPlugin(),
|
||||
// Application views are Vue single-file components.
|
||||
vue(VUE_PLUGIN_OPTIONS),
|
||||
...plugins,
|
||||
|
||||
Reference in new issue
Block a user