Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Resize map to fit viewport on enter/exit of fullscreen #4814

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
12 changes: 10 additions & 2 deletions resources/js/webtrees.js
Expand Up @@ -676,6 +676,14 @@
* @returns Map
*/
webtrees.buildLeafletJsMap = function (id, config, resetCallback) {
// Resize map on enter/exit fullscreen
document.addEventListener("fullscreenchange", (event) => {
map.on('resize', () => {
map.closePopup();
resetCallback(event);
});
});

const zoomControl = new L.control.zoom({
zoomInTitle: config.i18n.zoomIn,
zoomoutTitle: config.i18n.zoomOut,
Expand Down Expand Up @@ -737,9 +745,8 @@
defaultLayer = config.mapProviders[0].children[0].layer;
}


// Create the map with all controls and layers
return L.map(id, {
const map = L.map(id, {
zoomControl: false,
})
.addControl(zoomControl)
Expand All @@ -751,6 +758,7 @@
openedSymbol: config.icons.collapse,
}));

return map;
};

/**
Expand Down
2 changes: 1 addition & 1 deletion resources/views/modules/place-hierarchy/map.phtml
Expand Up @@ -95,7 +95,7 @@ use Fisharebest\Webtrees\View;

map.fitBounds(<?= json_encode($data['bounds'], JSON_THROW_ON_ERROR) ?>, { padding: [50, 30] });
sidebar.innerHTML = <?= json_encode($data['sidebar'], JSON_THROW_ON_ERROR) ?>;
};
};

window.onload = function() {
// Activate marker popup when sidebar entry clicked
Expand Down
2 changes: 1 addition & 1 deletion resources/views/modules/places/tab.phtml
Expand Up @@ -102,7 +102,7 @@ use Fisharebest\Webtrees\I18N;
}
};

// Can't use window.onload here. seems to be because of AJAX loading
// Cannot use window.onload here. seems to be because of AJAX loading
const _loadListeners = function() {
// Activate marker popup when sidebar entry clicked
sidebar.querySelectorAll('.gchart').forEach((element) => {
Expand Down