Create advanced control modal

pull/451/head
Luke Prior 2021-04-21 16:31:05 +10:00 zatwierdzone przez GitHub
rodzic d3024aeea0
commit 793fbead14
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 4AEE18F83AFDEB23
1 zmienionych plików z 41 dodań i 1 usunięć

Wyświetl plik

@ -317,6 +317,10 @@
document.body.style.background = 'white';
$('#main span').css('color', 'black')
$('#main p').css('color', 'black')
$('.modal-content p').css('color', 'black')
$('.modal-content h2').css('color', 'black')
$('.modal-content').css('background-color', 'white')
$('.close').css('color', 'black')
$('#myBtn').css('color', 'black')
$('#scanid').css('color', 'black')
$('.c3-axis-y').css('fill', 'black')
@ -332,6 +336,10 @@
document.body.style.background = '#121212';
$('#main span').css('color', 'white')
$('#main p').css('color', 'white')
$('.modal-content p').css('color', 'white')
$('.modal-content h2').css('color', 'white')
$('.modal-content').css('background-color', 'black')
$('.close').css('color', 'white')
$('#myBtn').css('color', 'white')
$('#scanid').css('color', 'white')
$('.c3-axis-y').css('fill', 'white')
@ -1289,6 +1297,25 @@
}
location.reload();
}
// When the user clicks on the button, open the modal
function openModal() {
document.getElementById("myModal").style.display = "block";
changeSettings()
}
// When the user clicks on close button, close the modal
function closeModal() {
document.getElementById("myModal").style.display = "none";
}
// When the user clicks anywhere outside of the modal, close it
$(window).click(function(e) {
if (e.target == document.getElementById("myModal")) {
document.getElementById("myModal").style.display = "none";
}
});
</script>
</head>
<body>
@ -1471,7 +1498,7 @@
<h2 style="display:inline;vertical-align:middle;">Controls</h2>
&nbsp;
<div style="display:inline;vertical-align:middle;">
<button>ADVANCED</button>
<button onclick="openModal()">ADVANCED</button>
</div>
<br>
<br>
@ -1503,6 +1530,19 @@
<div id="mapid"></div>
<i id="myBtn" onclick="changeSettings()" class="fa fa-gear" style="font-size:4vh;"></i>
</div>
<!-- Wrapper for advanced control modal -->
<div id="myModal" class="modal">
<div class="modal-content">
<div class="modal-header">
<span class="close" onclick="closeModal()">&times;</span>
<h2>Advanced Controls</h2>
</div>
<div class="modal-body">
<p>Some text in the Modal...</p>
</div>
</div>
</div>
</div>
</body>
</html>