Compare commits
No commits in common. "7fb2e755b6c7ca85e26ec82554f2a9bb45b42783" and "b10b85b9580ac3c797fb7983f57e03ea22ad38b8" have entirely different histories.
7fb2e755b6
...
b10b85b958
2 changed files with 15 additions and 47 deletions
|
@ -38,35 +38,6 @@ details h2 {
|
|||
display: inline;
|
||||
}
|
||||
|
||||
details {
|
||||
border-top: 1px solid black;
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
details[open] summary {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
#checkinList li:first-child details {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.leaflet-popup {
|
||||
max-width: 85vw;
|
||||
max-height: 85vh;
|
||||
min-width: 60vw;
|
||||
}
|
||||
|
||||
.leaflet-popup-content {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.popup__image {
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 70vw;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
#routeContainer {
|
||||
grid-template-columns: 3fr 1fr;
|
||||
|
@ -81,13 +52,15 @@ details[open] summary {
|
|||
#checkinList {
|
||||
grid-column-start: 2;
|
||||
}
|
||||
|
||||
.leaflet-popup {
|
||||
min-width: 350px;
|
||||
}
|
||||
|
||||
.popup__image {
|
||||
max-width: 50vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.leaflet-popup-content {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.popup__image {
|
||||
max-width: 500px;
|
||||
max-height: 400px;
|
||||
}
|
||||
|
||||
|
|
|
@ -20,10 +20,10 @@
|
|||
<header>
|
||||
<h1>Where in the World is Ben?</h1>
|
||||
<p>
|
||||
<span> Tracking started: {{ date('j M Y (G:H)', strtotime($trip->date_start)) }}</span> |
|
||||
<span> Tracking started: {{ $trip->date_start }}</span> |
|
||||
<span class="{{ ($trip->is_active) ? "positive" : "negative" }}">{{ ($trip->is_active) ? "Active" : "Ended" }}</span> |
|
||||
<span class="{{ ($trip->is_tracking) ? "positive" : "negative" }}">{{ ($trip->is_tracking) ? "Currently tracking" : "Not currently tracking" }}</span>
|
||||
<span class="small">(Last update: {{ date('j M Y (G:H)', strtotime($trip->updated_at)) }})</span>
|
||||
<span class="small">(Last update: {{ $trip->updated_at }})</span>
|
||||
</p>
|
||||
</header>
|
||||
|
||||
|
@ -34,7 +34,7 @@
|
|||
@foreach($trip->checkins as $checkin)
|
||||
<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>
|
||||
<summary><h2>{{ $checkin->title ?? "[No title]" }}</h2> <span>{{ $checkin->date }}</span></summary>
|
||||
{{ $checkin->note ?? "[No note]" }}
|
||||
</details>
|
||||
</li>
|
||||
|
@ -45,7 +45,7 @@
|
|||
|
||||
<footer>
|
||||
<script>
|
||||
var map = L.map('map').setView([{{ end($trip->locations)->latitude }}, {{ end($trip->locations)->longitude }}], 7);
|
||||
var map = L.map('map').setView([{{ end($trip->locations)->latitude }}, {{ end($trip->locations)->longitude }}], 10);
|
||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
maxZoom: 19,
|
||||
attribution: 'OpenStreetMap'
|
||||
|
@ -64,17 +64,12 @@
|
|||
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 += '<p class="popup__note">{{ $checkin->note }}</p>';
|
||||
popupMarkup += '<img class="popup__image" src="{{ $checkin->image_url }}">';
|
||||
marker.bindPopup(popupMarkup).openPopup();
|
||||
|
||||
checkinMarkers[{{ $checkin->id }}] = marker;
|
||||
@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) {
|
||||
|
|
Loading…
Reference in a new issue