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

Move scripts

Browse Source
This commit is contained in:
Adrien Vannson 2021-10-12 11:27:08 +02:00
parent ab4b764924
commit e6f472e7be
2 changed files with 129 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

119
index.html
View File

@ -8,87 +8,7 @@
</head> </head>
<body> <body>
<script type="text/javascript" src="./svg-pan-zoom.min.js"></script> <form>
<script type="text/javascript" src="./tinycolor-min.js"></script>
<script type="text/javascript">
function httpGetAsync(theUrl, callback)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4)
callback(xmlHttp.responseText, xmlHttp.status);
}
xmlHttp.open("GET", theUrl, true);
xmlHttp.send(null);
}
function putWaitNetworkScreen()
{
outputDiv.innerHTML = "Récupération des informations auprès du serveur...";
}
function salleInfosToHtml(salle) {
titres = "<h2>"+salle.nom+"</h2>"+((salle.aliaz.length!=0)?(" ou <h2>"+salle.aliaz.join("</h2> ou <h2>")+"</h2>"):"");
locataires = salle.locataires.join(", ");
return titres + ((salle.description!=null)?("\n<br/>\n" + salle.description):"") + ((salle.locataires.length!=0)?("\n<br/>\n<b>Locataires</b>: " + locataires):"");
}
function initSvgSupport() {
var plan = document.getElementById('plan');
svgPanZoom(plan, {zoomEnabled: true, controlIconsEnabled: true});
var salles = plan.contentDocument.getElementsByClassName('svg-salle');
var outputDiv = document.getElementById('selectedSalleInfos');
console.log(salles.length);
function selectSalle(e) {
if(document.lastSelectedSalle != null) {
document.lastSelectedSalle.style.fill = document.lastSelectedSalleFColor;
document.lastSelectedSalle.style.fill_opacity = document.lastSelectedSalleFOpacity;
}
document.lastSelectedSalle = e.target;
window.clearTimeout(document.wnsTimeout);
document.wnsTimeout = window.setTimeout(putWaitNetworkScreen, 400);
httpGetAsync("https://perso.ens-lyon.fr/samy.avrillon/gpens/api/salles.php?salle="+e.target.id.substring("path-salle-".length),function (s,errcode){
window.clearTimeout(document.wnsTimeout);
try{
if(s=="404"){
outputDiv.innerHTML = "Aucune information disponible pour cette salle. Si vous en avez, indiquez-les à l'adresse <a href=mailto:samy.avrillon@ens-lyon.fr>samy.avrillon@ens-lyon.fr</a> en indiquant l'identifiant de la salle : "+document.lastSelectedSalle.id.substring("path-salle-".length);
return;
}
ss = JSON.parse(s)
if(document.lastSelectedSalle.id==("path-salle-"+ss["id"])){
if(errcode==200){
outputDiv.innerHTML = salleInfosToHtml(ss);
}else
outputDiv.innerHTML = "Erreur lors de l'appel à l'interface php: ERREUR "+errcode;
}
} catch(err){console.error("Les données récupéréés de cette salle ne sont pas valides.");console.error(err)}
}
);
document.lastSelectedSalleFColor = e.target.style.fill
document.lastSelectedSalleFOpacity = e.target.style.fill_opacity
e.target.style.fill = tinycolor(e.target.style.fill).saturate(100).brighten(50).toHexString();
}
for (var i = 0; i < salles.length; i++) {
salles[i].addEventListener('click', selectSalle);
}
}
</script>
<form>
<label for="selector_site_M"> Site </label> <label for="selector_site_M"> Site </label>
<input type="radio" name="site" value="M" id="selector_site_M" checked="true">Monod</input> <input type="radio" name="site" value="M" id="selector_site_M" checked="true">Monod</input>
<input type="radio" name="site" value="D" id="selector_site_D">Descartes</input> <input type="radio" name="site" value="D" id="selector_site_D">Descartes</input>
@ -111,34 +31,37 @@
| |
<input type="button" value="Vue d'ensemble" id="overviewButton" onclick="overviewButton"/> <input type="button" value="Vue d'ensemble" id="overviewButton" onclick="overviewButton"/>
</form> </form>
<br/> <br/>
<object <object
type="image/svg+xml" type="image/svg+xml"
data="https://perso.ens-lyon.fr/samy.avrillon/gpens/maps/M-MGN1-3.svg" data="https://perso.ens-lyon.fr/samy.avrillon/gpens/maps/M-MGN1-3.svg"
id="plan" id="plan"
onload="initSvgSupport()" onload="initSvgSupport()"
> >
Votre navigateur ne sait pas charger les objets HTML.... Je vais voir ce que je peux faire. Votre navigateur ne sait pas charger les objets HTML.... Je vais voir ce que je peux faire.
</object> </object>
<div id="selectedSalleInfos"> <div id="selectedSalleInfos">
Il faut que vous sélectionnez une salle. Il faut que vous sélectionnez une salle.
</div> </div>
<hr/> <hr/>
<form> <form>
<label for="salleNameSearch">Rechercher par nom de salle : </label> <input name="salleNameSearch" type="text" id="salleNameSearch"/> <input name="salleNameButton" type=button value="Rechercher" onclick="salleNameSearch" /> <label for="salleNameSearch">Rechercher par nom de salle : </label> <input name="salleNameSearch" type="text" id="salleNameSearch"/> <input name="salleNameButton" type=button value="Rechercher" onclick="salleNameSearch" />
<br/> <br/>
<label for="salleLocSearch">Rechercher par locataire : </label> <input name="salleLocSearch" type="text" id="salleLocSearch"/> <input name="salleLocButton" type=button value="Rechercher" onclick="salleLocSearch" /> <label for="salleLocSearch">Rechercher par locataire : </label> <input name="salleLocSearch" type="text" id="salleLocSearch"/> <input name="salleLocButton" type=button value="Rechercher" onclick="salleLocSearch" />
</form> </form>
<div id="searchResultInfos"> <div id="searchResultInfos">
Il faut que vous fassiez une recherche. Il faut que vous fassiez une recherche.
</div> </div>
<script type="text/javascript" src="./svg-pan-zoom.min.js"></script>
<script type="text/javascript" src="./tinycolor-min.js"></script>
<script type="text/javascript" src="resources/script.js"></script>
</body> </body>
</html> </html>

76
resources/script.js Normal file
View File

@ -0,0 +1,76 @@
function httpGetAsync(theUrl, callback)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
callback(xmlHttp.responseText, xmlHttp.status);
}
}
xmlHttp.open("GET", theUrl, true);
xmlHttp.send(null);
}
function putWaitNetworkScreen()
{
outputDiv.innerHTML = "Récupération des informations auprès du serveur...";
}
function salleInfosToHtml(salle)
{
titres = "<h2>"+salle.nom+"</h2>"+((salle.aliaz.length!=0)?(" ou <h2>"+salle.aliaz.join("</h2> ou <h2>")+"</h2>"):"");
locataires = salle.locataires.join(", ");
return titres + ((salle.description!=null)?("\n<br/>\n" + salle.description):"") + ((salle.locataires.length!=0)?("\n<br/>\n<b>Locataires</b>: " + locataires):"");
}
function initSvgSupport() {
var plan = document.getElementById('plan');
svgPanZoom(plan, {zoomEnabled: true, controlIconsEnabled: true});
var salles = plan.contentDocument.getElementsByClassName('svg-salle');
var outputDiv = document.getElementById('selectedSalleInfos');
console.log(salles.length);
function selectSalle(e) {
if(document.lastSelectedSalle != null) {
document.lastSelectedSalle.style.fill = document.lastSelectedSalleFColor;
document.lastSelectedSalle.style.fill_opacity = document.lastSelectedSalleFOpacity;
}
document.lastSelectedSalle = e.target;
window.clearTimeout(document.wnsTimeout);
document.wnsTimeout = window.setTimeout(putWaitNetworkScreen, 400);
httpGetAsync("https://perso.ens-lyon.fr/samy.avrillon/gpens/api/salles.php?salle="+e.target.id.substring("path-salle-".length), function (s,errcode){
window.clearTimeout(document.wnsTimeout);
try{
if (s=="404") {
outputDiv.innerHTML = "Aucune information disponible pour cette salle. Si vous en avez, indiquez-les à l'adresse <a href=mailto:samy.avrillon@ens-lyon.fr>samy.avrillon@ens-lyon.fr</a> en indiquant l'identifiant de la salle : "+document.lastSelectedSalle.id.substring("path-salle-".length);
return;
}
ss = JSON.parse(s)
if (document.lastSelectedSalle.id==("path-salle-"+ss["id"])) {
if (errcode==200) {
outputDiv.innerHTML = salleInfosToHtml(ss);
} else {
outputDiv.innerHTML = "Erreur lors de l'appel à l'interface php: ERREUR "+errcode;
}
}
} catch(err) {
console.error("Les données récupéréés de cette salle ne sont pas valides.");
console.error(err)
}
});
document.lastSelectedSalleFColor = e.target.style.fill;
document.lastSelectedSalleFOpacity = e.target.style.fill_opacity;
e.target.style.fill = tinycolor(e.target.style.fill).saturate(100).brighten(50).toHexString();
}
for (var i = 0; i < salles.length; i++) {
salles[i].addEventListener('click', selectSalle);
}
}