jason/Jnf.me
jason/Jnf.me
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added refresh function and AJAX/JSON data loader.

Browse Source
This commit is contained in:
Jason Williams 2018-08-11 15:18:23 -06:00
parent cfa0df515a
commit a3274b6429
1 changed files with 38 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
www/where/index.php
View File

@ -1,4 +1,5 @@
<?php <?php
if (isset($_GET["data"])):
$options = array( $options = array(
'http' => array( 'http' => array(
'method' => 'GET', 'method' => 'GET',
@ -12,6 +13,12 @@
foreach($data as $item) { foreach($data as $item) {
$output[$item["entity_id"]] = $item; $output[$item["entity_id"]] = $item;
} }
header('Content-Type: application/json');
echo json_encode($output['device_tracker.jasonsphone_jason']);
exit();
else:
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
@ -33,25 +40,42 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=&AIzaSyCo79O07nOpWmdxKBUdgslJRrBwYSykDxwv=3.exp"></script> <script src="https://maps.googleapis.com/maps/api/js?key=&AIzaSyCo79O07nOpWmdxKBUdgslJRrBwYSykDxwv=3.exp"></script>
<script> <script>
var map;
$(function() { $(function() {
var myLatlng = new google.maps.LatLng(51.0426695, -114.0898373); var locConnaught = new google.maps.LatLng(51.0426695, -114.0898373);
var mapOptions = { var mapOptions = {
zoom: 15, zoom: 15,
center: myLatlng, center: locConnaught,
disableDefaultUI: true, disableDefaultUI: true,
styles: [{"featureType":"poi","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"poi","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"administrative","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":0},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road","elementType":"labels","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"off"}]},{"featureType":"water","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road.local","elementType":"all","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"on"}]},{"featureType":"water","elementType":"geometry","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"on"}]},{"featureType":"transit","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":0},{"lightness":-100},{"visibility":"off"}]},{"featureType":"landscape","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road","elementType":"geometry","stylers":[{"hue":"#bbbbbb"},{"saturation":-100},{"lightness":26},{"visibility":"on"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"hue":"#dddddd"},{"saturation":-100},{"lightness":-3},{"visibility":"on"}]}] styles: [{"featureType":"poi","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"poi","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"administrative","elementType":"all","stylers":[{"hue":"#000000"},{"saturation":0},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road","elementType":"labels","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"off"}]},{"featureType":"water","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road.local","elementType":"all","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"on"}]},{"featureType":"water","elementType":"geometry","stylers":[{"hue":"#ffffff"},{"saturation":-100},{"lightness":100},{"visibility":"on"}]},{"featureType":"transit","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":0},{"lightness":-100},{"visibility":"off"}]},{"featureType":"landscape","elementType":"labels","stylers":[{"hue":"#000000"},{"saturation":-100},{"lightness":-100},{"visibility":"off"}]},{"featureType":"road","elementType":"geometry","stylers":[{"hue":"#bbbbbb"},{"saturation":-100},{"lightness":26},{"visibility":"on"}]},{"featureType":"landscape","elementType":"geometry","stylers":[{"hue":"#dddddd"},{"saturation":-100},{"lightness":-3},{"visibility":"on"}]}]
} }
map = new google.maps.Map(document.getElementById('map'), mapOptions); map = new google.maps.Map(document.getElementById('map'), mapOptions);
updateLocation();
setInterval(function() {
updateLocation();
}, 60000);
}); });
function updateLocation() {
$.getJSON('?data', function(data) {
$('h1').html((data.state == 'away') ? 'Nobody Knows' : 'At ' + data.state.replace(/^\w/, c => c.toUpperCase()));
var locLive = new google.maps.LatLng(data.attributes.latitude, data.attributes.longitude);
map.setCenter(locLive);
})
}
</script> </script>
<body> <body>
<div id="map"></div> <div id="map"></div>
<div id="container"> <div id="container">
<div id="centered"> <div id="centered">
<p>Where tf is Jason?</p> <p>Where tf is Jason?</p>
<h1><? echo ($output['device_tracker.jasonsphone_jason']['state'] == 'away') ? 'Nobody Knows' : 'At '.ucwords($output['device_tracker.jasonsphone_jason']['state']); ?></h1> <h1>Nobody Knows</h1>
</div> </div>
</div> </div>
</body> </body>
</html> </html>
<? endif; ?>