gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 07:08:55 +02:00
Code Issues Actions 18 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>
.note-detail-geo-map,
.geo-map-widget,
.geo-map-container {
height: 100%;
overflow: hidden;
}
.leaflet-top,
.leaflet-bottom {
@ -19,7 +16,6 @@ const TPL = /*html*/`\
}
</style>
<div class="geo-map-container"></div>
</div>`;
export type Leaflet = typeof L;
@ -27,8 +23,6 @@ export type InitCallback = (L: Leaflet) => void;
export default class GeoMapWidget extends NoteContextAwareWidget {
map?: Map;
$container!: JQuery<HTMLElement>;
private initCallback?: InitCallback;
constructor(widgetMode: "type", initCallback?: InitCallback) {
@ -39,20 +33,10 @@ export default class GeoMapWidget extends NoteContextAwareWidget {
doRender() {
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) {
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 L from "leaflet";
const TPL = /*html*/`
<div class="geo-view">
@ -8,26 +9,46 @@ const TPL = /*html*/`
position: relative;
height: 100%;
}
.geo-map-container {
height: 100%;
overflow: hidden;
}
</style>
Geo View is not implemented yet.
<div class="geo-map-container"></div>
</div>`;
export default class GeoView extends ViewMode<{}> {
private $root: JQuery<HTMLElement>;
private $container!: JQuery<HTMLElement>;
private map?: L.Map;
constructor(args: ViewModeArgs) {
super(args, "geoMap");
this.$root = $(TPL);
this.$container = this.$root.find(".geo-map-container");
args.$parent.append(this.$root);
}
async renderList() {
console.log("Rendered");
this.renderMap();
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 {
return true;
}