feat(geomap): load leaflet

This commit is contained in:
Elian Doran
2025-01-20 19:18:29 +02:00
parent e1952fe6b8
commit 94a0403981
5 changed files with 53 additions and 4 deletions

View File

@@ -106,6 +106,11 @@ const HIGHLIGHT_JS: Library = {
}
};
const LEAFLET: Library = {
js: [ "node_modules/leaflet/dist/leaflet.js" ],
css: [ "node_modules/leaflet/dist/leaflet.css" ],
}
async function requireLibrary(library: Library) {
if (library.css) {
library.css.map((cssUrl) => requireCss(cssUrl));
@@ -196,5 +201,6 @@ export default {
MERMAID,
MARKJS,
I18NEXT,
HIGHLIGHT_JS
HIGHLIGHT_JS,
LEAFLET
};

View File

@@ -1,9 +1,21 @@
import library_loader from "../services/library_loader.js";
import NoteContextAwareWidget from "./note_context_aware_widget.js";
const TPL = `\
<div class="geo-map-widget">
Map goes here.
</div>`
<style>
.note-detail-geo-map,
.geo-map-widget,
.geo-map-container {
height: 100%;
overflow: hidden;
}
</style>
<div class="geo-map-container"></div>
</div>
`
export default class GeoMapWidget extends NoteContextAwareWidget {
@@ -12,7 +24,17 @@ export default class GeoMapWidget extends NoteContextAwareWidget {
}
doRender() {
this.$widget = $(TPL)
this.$widget = $(TPL);
const $container = this.$widget.find(".geo-map-container");
library_loader.requireLibrary(library_loader.LEAFLET)
.then(() => {
//@ts-ignore
L.map($container[0], {
});
});
}
}

View File

@@ -105,6 +105,8 @@ async function register(app: express.Application) {
app.use(`/${assetPath}/node_modules/mind-elixir/dist/`, persistentCacheStatic(path.join(srcRoot, "..", "node_modules/mind-elixir/dist/")));
app.use(`/${assetPath}/node_modules/@mind-elixir/node-menu/dist/`, persistentCacheStatic(path.join(srcRoot, "..", "node_modules/@mind-elixir/node-menu/dist/")));
app.use(`/${assetPath}/node_modules/@highlightjs/cdn-assets/`, persistentCacheStatic(path.join(srcRoot, "..", "node_modules/@highlightjs/cdn-assets/")));
app.use(`/${assetPath}/node_modules/leaflet/dist/`, persistentCacheStatic(path.join(srcRoot, "..", "node_modules/leaflet/dist/")));
}
export default {