Update console.html

This commit is contained in:
Namhyeon Go 2024-06-25 17:22:03 +09:00
parent d671daaf46
commit 243cadd5d0

View File

@ -4,7 +4,8 @@
<title>Caterpillar Proxy Web Console</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.42.0/css/jquery.terminal.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.42.0/css/jquery.terminal.min.css" rel="stylesheet" type="text/css">
<link href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" rel="stylesheet" type="text/css">
<style type="text/css">/*<!--<![CDATA[*/
body {
background: #2e8d36 url(https://pub-1a7a176eea68479cb5423e44273657ad.r2.dev/bg.jpg) no-repeat;
@ -34,11 +35,13 @@
<h1>Caterpillar Proxy Web Console</h1>
<p>Download an worker script of <a href="https://github.com/gnh1201/caterpillar">Caterpillar Proxy</a>.</p>
<div id="console"></div>
<div id="map"></div>
<p><a href="https://github.com/gnh1201/caterpillar">Fork me. gnh1201/caterpillar (GitHub)</a></p>
</main>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.42.0/js/jquery.terminal.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.42.0/js/jquery.terminal.min.js" type="text/javascript" ></script>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" type="text/javascript"></script>
<script type="text/javascript">//<!--<![CDATA[
var env = {
"target": "http://localhost/",
@ -124,6 +127,25 @@
if (env.filename != null) {
download_text(env.filename, text);
}
// method(relay_get_geolocation)
if (env.method == "relay_get_geolocation") {
var geodata = responseData.result.data;
term.echo('', {
finalize: function($div) {
$div.children().last().append($("#map").css("height", "160px"));
map.setView([geodata.lat, geodata.lon], 13);
var circle = L.circle([geodata.lat, geodata.lon], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius: 500
}).addTo(map);
term.echo();
}
});
}
},
error: function(xhr, status, error) {
term.echo(error);
@ -254,6 +276,12 @@
checkArity: false
});
});
var map = L.map('map');
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);
//]]>--></script>
</body>
</html>