Compare commits
3 commits
7fb2e755b6
...
7793a01828
| Author | SHA1 | Date | |
|---|---|---|---|
| 7793a01828 | |||
| a75d45b03f | |||
| 8b793de39d |
6 changed files with 199 additions and 5 deletions
|
|
@ -58,7 +58,7 @@ return [
|
||||||
|
|
||||||
'asset_url' => env('ASSET_URL'),
|
'asset_url' => env('ASSET_URL'),
|
||||||
|
|
||||||
'trip' => env('TRIP'),
|
'current_trip_id' => env('CURRENT_TRIP_ID'),
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|--------------------------------------------------------------------------
|
|--------------------------------------------------------------------------
|
||||||
|
|
|
||||||
27
resources/views/no-trip.blade.php
Normal file
27
resources/views/no-trip.blade.php
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
<title>Tracking | Ben Goldsworthy</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
|
||||||
|
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
|
||||||
|
crossorigin=""/>
|
||||||
|
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
|
||||||
|
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
|
||||||
|
crossorigin=""></script>
|
||||||
|
<link rel="stylesheet" href="/css/app.css" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>No Trip in Progress at the Moment</h1>
|
||||||
|
<p><a href="/past-trips">Past trips</a></p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
102
resources/views/past-trip.blade.php
Normal file
102
resources/views/past-trip.blade.php
Normal file
|
|
@ -0,0 +1,102 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
<title>Tracking | Ben Goldsworthy</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
|
||||||
|
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
|
||||||
|
crossorigin=""/>
|
||||||
|
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
|
||||||
|
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
|
||||||
|
crossorigin=""></script>
|
||||||
|
<link rel="stylesheet" href="/css/app.css" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>Where in the World was Ben?</h1>
|
||||||
|
<p><a href="/">Current trip</a></p>
|
||||||
|
<p><a href="/past-trips">Past trips</a></p>
|
||||||
|
<p>
|
||||||
|
<span> Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }}</span> |
|
||||||
|
<span class="small">(Last update: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }})</span>
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main id="routeContainer">
|
||||||
|
<div id="map"></div>
|
||||||
|
<section id="checkinList">
|
||||||
|
<ol reversed>
|
||||||
|
@foreach(array_reverse($trip->checkins) as $checkin)
|
||||||
|
@if($checkin->id != 2607)
|
||||||
|
<li>
|
||||||
|
<details id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
|
||||||
|
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ date('j M Y (G:H)', strtotime($checkin->date)) }}</span></summary>
|
||||||
|
{{ $checkin->note ?? "[No note]" }}
|
||||||
|
@if($checkin->image_url)
|
||||||
|
<img class="popup__image" loading="lazy" src="{{ $checkin->image_url }}">
|
||||||
|
@endif
|
||||||
|
</details>
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ol>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<script>
|
||||||
|
var map = L.map('map').setView([{{ end($trip->locations)->latitude }}, {{ end($trip->locations)->longitude }}], 7);
|
||||||
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||||
|
maxZoom: 19,
|
||||||
|
attribution: 'OpenStreetMap'
|
||||||
|
}).addTo(map);
|
||||||
|
|
||||||
|
var routePoints = L.polyline([
|
||||||
|
@foreach($trip->locations as $location)
|
||||||
|
[{{ $location->latitude }}, {{ $location->longitude }}],
|
||||||
|
@endforeach
|
||||||
|
]).addTo(map);
|
||||||
|
|
||||||
|
var checkinMarkers = [];
|
||||||
|
|
||||||
|
var marker = null, popupMarkup = null;
|
||||||
|
@foreach($trip->checkins as $checkin)
|
||||||
|
@if($checkin->id != 2602)
|
||||||
|
marker = L.marker([{{ $checkin->location->latitude }}, {{ $checkin->location->longitude }}]).addTo(map);
|
||||||
|
|
||||||
|
popupMarkup = '<h2 class="popup__title">{{ $checkin->title ?? "No Title" }}</h2>';
|
||||||
|
popupMarkup += `<p class="popup__note">{{ $checkin->note }}</p>`;
|
||||||
|
popupMarkup += '<img class="popup__image" src="{{ $checkin->image_url }}">';
|
||||||
|
marker.bindPopup(popupMarkup).openPopup();
|
||||||
|
|
||||||
|
checkinMarkers[{{ $checkin->id }}] = marker;
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
|
||||||
|
var currLocation = L.marker(
|
||||||
|
[{{ end($trip->locations)->latitude }}, {{ end($trip->locations)->longitude }}],
|
||||||
|
).addTo(map).setZIndexOffset(1000);
|
||||||
|
currLocation.bindPopup('<p>Current location</p>').openPopup();
|
||||||
|
|
||||||
|
function toggleCheckin(isOpen, checkinId) {
|
||||||
|
if (isOpen) {
|
||||||
|
var checkins = document.querySelectorAll('details');
|
||||||
|
|
||||||
|
checkinMarkers[checkinId].openPopup();
|
||||||
|
|
||||||
|
checkins.forEach(checkin => {
|
||||||
|
if (checkin.id != checkinId && checkin.open) checkin.open = false;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
checkinMarkers[checkinId].closePopup();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
33
resources/views/past-trips.blade.php
Normal file
33
resources/views/past-trips.blade.php
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
<title>Tracking | Ben Goldsworthy</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.8.0/dist/leaflet.css"
|
||||||
|
integrity="sha512-hoalWLoI8r4UszCkZ5kL8vayOGVae1oxXe/2A4AO6J9+580uKHDO3JdHb7NzwwzK5xr/Fs0W40kiNHxM9vyTtQ=="
|
||||||
|
crossorigin=""/>
|
||||||
|
<script src="https://unpkg.com/leaflet@1.8.0/dist/leaflet.js"
|
||||||
|
integrity="sha512-BB3hKbKWOc9Ez/TAwyWxNXeoV9c1v6FIeYiBieIWkpLjauysF18NzgR1MBNBXf8/KABdlkX68nAhlwcDFLGPCQ=="
|
||||||
|
crossorigin=""></script>
|
||||||
|
<link rel="stylesheet" href="/css/app.css" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>Past Trips</h1>
|
||||||
|
<p><a href="/">Current trip</a></p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main id="routeContainer">
|
||||||
|
<ul>
|
||||||
|
<li><a href="/past-trip/47xj8go928ql9mq3r20p">Europespedition III: Leds Free or Die Hard</a></li>
|
||||||
|
</ul>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -19,6 +19,7 @@
|
||||||
|
|
||||||
<header>
|
<header>
|
||||||
<h1>Where in the World is Ben?</h1>
|
<h1>Where in the World is Ben?</h1>
|
||||||
|
<p><a href="/past-trips">Past trips</a></p>
|
||||||
<p>
|
<p>
|
||||||
<span> Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }}</span> |
|
<span> Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }}</span> |
|
||||||
<span class="{{ ($trip->is_active) ? "positive" : "negative" }}">{{ ($trip->is_active) ? "Active" : "Ended" }}</span> |
|
<span class="{{ ($trip->is_active) ? "positive" : "negative" }}">{{ ($trip->is_active) ? "Active" : "Ended" }}</span> |
|
||||||
|
|
@ -30,14 +31,19 @@
|
||||||
<main id="routeContainer">
|
<main id="routeContainer">
|
||||||
<div id="map"></div>
|
<div id="map"></div>
|
||||||
<section id="checkinList">
|
<section id="checkinList">
|
||||||
<ol>
|
<ol reversed>
|
||||||
@foreach($trip->checkins as $checkin)
|
@foreach(array_reverse($trip->checkins) as $checkin)
|
||||||
|
@if($checkin->id != 2607)
|
||||||
<li>
|
<li>
|
||||||
<details id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
|
<details id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
|
||||||
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ date('j M Y (G:H)', strtotime($checkin->date)) }}</span></summary>
|
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ date('j M Y (G:H)', strtotime($checkin->date)) }}</span></summary>
|
||||||
{{ $checkin->note ?? "[No note]" }}
|
{{ $checkin->note ?? "[No note]" }}
|
||||||
|
@if($checkin->image_url)
|
||||||
|
<img class="popup__image" loading="lazy" src="{{ $checkin->image_url }}">
|
||||||
|
@endif
|
||||||
</details>
|
</details>
|
||||||
</li>
|
</li>
|
||||||
|
@endif
|
||||||
@endforeach
|
@endforeach
|
||||||
</ol>
|
</ol>
|
||||||
</section>
|
</section>
|
||||||
|
|
@ -61,6 +67,7 @@
|
||||||
|
|
||||||
var marker = null, popupMarkup = null;
|
var marker = null, popupMarkup = null;
|
||||||
@foreach($trip->checkins as $checkin)
|
@foreach($trip->checkins as $checkin)
|
||||||
|
@if($checkin->id != 2602)
|
||||||
marker = L.marker([{{ $checkin->location->latitude }}, {{ $checkin->location->longitude }}]).addTo(map);
|
marker = L.marker([{{ $checkin->location->latitude }}, {{ $checkin->location->longitude }}]).addTo(map);
|
||||||
|
|
||||||
popupMarkup = '<h2 class="popup__title">{{ $checkin->title ?? "No Title" }}</h2>';
|
popupMarkup = '<h2 class="popup__title">{{ $checkin->title ?? "No Title" }}</h2>';
|
||||||
|
|
@ -69,6 +76,7 @@
|
||||||
marker.bindPopup(popupMarkup).openPopup();
|
marker.bindPopup(popupMarkup).openPopup();
|
||||||
|
|
||||||
checkinMarkers[{{ $checkin->id }}] = marker;
|
checkinMarkers[{{ $checkin->id }}] = marker;
|
||||||
|
@endif
|
||||||
@endforeach
|
@endforeach
|
||||||
|
|
||||||
var currLocation = L.marker(
|
var currLocation = L.marker(
|
||||||
|
|
|
||||||
|
|
@ -15,16 +15,40 @@ use GuzzleHttp\Client;
|
||||||
*/
|
*/
|
||||||
|
|
||||||
Route::get('/', function () {
|
Route::get('/', function () {
|
||||||
|
if (config('app.current_trip_id')) {
|
||||||
|
$client = new Client([
|
||||||
|
'base_uri' => 'https://app.wayward.travel/',
|
||||||
|
'timeout' => 3.0
|
||||||
|
]);
|
||||||
|
|
||||||
|
$response = $client->get('trip/'.config('app.current_trip_id').'/user/zmld8ko6qy7d9j3xvq10/json');
|
||||||
|
|
||||||
|
if ($response->getStatusCode() == 200) {
|
||||||
|
$data = json_decode($response->getBody());
|
||||||
|
return view('tracker', ['trip' => $data->trip]);
|
||||||
|
} else {
|
||||||
|
return 'Something went wrong';
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
return view('no-trip');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Route::get('/past-trips', function () {
|
||||||
|
return view('past-trips');
|
||||||
|
});
|
||||||
|
|
||||||
|
Route::get('/past-trip/{tripId}', function ($tripId) {
|
||||||
$client = new Client([
|
$client = new Client([
|
||||||
'base_uri' => 'https://app.wayward.travel/',
|
'base_uri' => 'https://app.wayward.travel/',
|
||||||
'timeout' => 3.0
|
'timeout' => 3.0
|
||||||
]);
|
]);
|
||||||
|
|
||||||
$response = $client->get('trip/'.config('app.trip').'/user/zmld8ko6qy7d9j3xvq10/json');
|
$response = $client->get('trip/'.$tripId.'/user/zmld8ko6qy7d9j3xvq10/json');
|
||||||
|
|
||||||
if ($response->getStatusCode() == 200) {
|
if ($response->getStatusCode() == 200) {
|
||||||
$data = json_decode($response->getBody());
|
$data = json_decode($response->getBody());
|
||||||
return view('tracker', ['trip' => $data->trip]);
|
return view('past-trip', ['trip' => $data->trip]);
|
||||||
} else {
|
} else {
|
||||||
return 'Something went wrong';
|
return 'Something went wrong';
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue