Mysaa/gpens
1
0
Fork 0
mirror of https://gitlab.aliens-lyon.fr/savrillo/gpens.git synced 2026-03-18 01:41:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

Resize, fit and center map

Browse Source
This commit is contained in:
Adrien Vannson 2021-10-29 22:27:13 +02:00
parent 8852e70c7e
commit 9721a04087
3 changed files with 30 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -148,7 +148,7 @@
</div> </div>
<div class="container"> <div class="container">
<object type="image/svg+xml" data="maps/M-MGN1-4.svg" id="plan"></object> <object type="image/svg+xml" data="maps/M-MGN1-4.svg" id="map"></object>
<div class="card"> <div class="card">
<h4 class="card-header">Salle actuelle</h4> <h4 class="card-header">Salle actuelle</h4>

39
resources/script.js
View File

@ -39,9 +39,9 @@ function httpGetAsync(theUrl, callback)
} }
function selectRoom(roomId) { function selectRoom(roomId) {
var svg = document.getElementById('plan'); var svg = document.getElementById('map');
var selectedRooms = plan.contentDocument.getElementsByClassName('current-room'); var selectedRooms = map.contentDocument.getElementsByClassName('current-room');
for (var i = 0; i < selectedRooms.length; i++) { for (var i = 0; i < selectedRooms.length; i++) {
selectedRooms[i].classList.remove('current-room'); selectedRooms[i].classList.remove('current-room');
} }
@ -52,7 +52,7 @@ function selectRoom(roomId) {
console.log('Error: the room salle-'+roomId+' does not exist'); console.log('Error: the room salle-'+roomId+' does not exist');
return; return;
} }
room.classList.add('current-room'); room.classList.add('current-room');
httpGetAsync("api/request.php?salle="+room.id.substring("salle-".length), function (s,errcode){ httpGetAsync("api/request.php?salle="+room.id.substring("salle-".length), function (s,errcode){
@ -102,11 +102,16 @@ function updateCurrentRoom()
function initSvgSupport() function initSvgSupport()
{ {
var plan = document.getElementById('plan'); var map = document.getElementById('map');
svgPanZoom(plan, {zoomEnabled: true, controlIconsEnabled: true}); window.panZoom = svgPanZoom(map, {
zoomEnabled: true,
controlIconsEnabled: true
});
panZoom.fit();
panZoom.center();
var salles = plan.contentDocument.querySelectorAll('#salles-group path'); var salles = map.contentDocument.querySelectorAll('#salles-group path');
for (var i = 0; i < salles.length; i++) { for (var i = 0; i < salles.length; i++) {
salles[i].addEventListener('click', function(e) { salles[i].addEventListener('click', function(e) {
@ -119,9 +124,9 @@ function initSvgSupport()
window.addEventListener('load', function() { window.addEventListener('load', function() {
// Init SVG // Init SVG
var plan = document.getElementById('plan'); var map = document.getElementById('map');
if (plan.contentDocument == null) { if (map.contentDocument == null) {
plan.addEventListener('load', initSvgSupport); map.addEventListener('load', initSvgSupport);
} else { } else {
initSvgSupport(); initSvgSupport();
} }
@ -130,8 +135,14 @@ window.addEventListener('load', function() {
if (window.location.hash != "") { if (window.location.hash != "") {
updateCurrentRoom(); updateCurrentRoom();
} }
});
window.onhashchange = function() {
updateCurrentRoom(); window.onhashchange = function() {
} updateCurrentRoom();
};
window.addEventListener('resize', function() {
window.panZoom.resize();
window.panZoom.fit();
window.panZoom.center();
}); });

4
resources/styles.css
View File

@ -1,3 +1,7 @@
#map {
width: 100%;
}
#searchResultInfos { #searchResultInfos {
background-color: #BBBBBB; background-color: #BBBBBB;
} }