The following is a description of the layout of source files for Fluid Earth so that is possible to find the files in which future changes need to be made.
The first file the browser encounters is dist/index.html
, a blank page with
links to styles and scripts that load the rest of the single-page app (SPA). The
web server root is the dist/
directory, so a link to /global.css
in
dist/index.html
refers to dist/global.css
.
The contents of dist/
are generated by the Vite build tool. The
dist/index.html
file is generated from index.html
, and static assets are
copied from public/
. Compilation is controlled by vite.config.js
.
The dist/assets/
styles and scripts are created from the JavaScript and
Svelte files in src
, with src/main.js
as the starting point that imports the
rest of the files in the import tree.
Two Svelte components are particularly noteworthy: src/App.svelte
and
src/map/Map.svelte
. App.svelte
defines all the reactive global variables and
their relationships. It also contains all the menus, overlays, and the map.
Map.svelte
controls all the WebGL logic and displays the map (by default as a
globe) with the props as defined by App.svelte
.
The data and metadata needed to display information on the map is generated by
scripts in the backend
directory, which output this data and metadata to
public/tera/
and public/tera/inventory.json.br
, respectively.