gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 15:19:01 +02:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

chore(views/geomap): basic initialization

Browse Source
This commit is contained in:
Elian Doran 2025-07-06 11:30:24 +03:00
parent 54063b97ad
commit cd742a4617
No known key found for this signature in database
2 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
apps/client/src/widgets/geo_map.ts
View File

@ -8,10 +8,7 @@ const TPL = /*html*/`\
<style> <style>
.note-detail-geo-map, .note-detail-geo-map,
.geo-map-widget, .geo-map-widget,
.geo-map-container {
height: 100%;
overflow: hidden;
}
.leaflet-top, .leaflet-top,
.leaflet-bottom { .leaflet-bottom {
@ -19,7 +16,6 @@ const TPL = /*html*/`\
} }
</style> </style>
<div class="geo-map-container"></div>
</div>`; </div>`;
export type Leaflet = typeof L; export type Leaflet = typeof L;
@ -27,8 +23,6 @@ export type InitCallback = (L: Leaflet) => void;
export default class GeoMapWidget extends NoteContextAwareWidget { export default class GeoMapWidget extends NoteContextAwareWidget {
map?: Map;
$container!: JQuery<HTMLElement>;
private initCallback?: InitCallback; private initCallback?: InitCallback;
constructor(widgetMode: "type", initCallback?: InitCallback) { constructor(widgetMode: "type", initCallback?: InitCallback) {
@ -39,20 +33,10 @@ export default class GeoMapWidget extends NoteContextAwareWidget {
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
this.$container = this.$widget.find(".geo-map-container");
const map = L.map(this.$container[0], {
worldCopyJump: true
});
this.map = map;
if (this.initCallback) { if (this.initCallback) {
this.initCallback(L); this.initCallback(L);
} }
L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
detectRetina: true
}).addTo(map);
} }
} }

25
apps/client/src/widgets/view_widgets/geo_view/index.ts
View File

@ -1,4 +1,5 @@
import ViewMode, { ViewModeArgs } from "../view_mode.js"; import ViewMode, { ViewModeArgs } from "../view_mode.js";
import L from "leaflet";
const TPL = /*html*/` const TPL = /*html*/`
<div class="geo-view"> <div class="geo-view">
@ -8,26 +9,46 @@ const TPL = /*html*/`
position: relative; position: relative;
height: 100%; height: 100%;
} }
.geo-map-container {
height: 100%;
overflow: hidden;
}
</style> </style>
Geo View is not implemented yet. <div class="geo-map-container"></div>
</div>`; </div>`;
export default class GeoView extends ViewMode<{}> { export default class GeoView extends ViewMode<{}> {
private $root: JQuery<HTMLElement>; private $root: JQuery<HTMLElement>;
private $container!: JQuery<HTMLElement>;
private map?: L.Map;
constructor(args: ViewModeArgs) { constructor(args: ViewModeArgs) {
super(args, "geoMap"); super(args, "geoMap");
this.$root = $(TPL); this.$root = $(TPL);
this.$container = this.$root.find(".geo-map-container");
args.$parent.append(this.$root); args.$parent.append(this.$root);
} }
async renderList() { async renderList() {
console.log("Rendered"); this.renderMap();
return this.$root; return this.$root;
} }
async renderMap() {
const map = L.map(this.$container[0], {
worldCopyJump: true
});
L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
detectRetina: true
}).addTo(map);
this.map = map;
}
get isFullHeight(): boolean { get isFullHeight(): boolean {
return true; return true;
} }