Rumperuu
/
Where-in-the-World-is-Ben
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

Add icons to checkins to show media

This commit is contained in:
Ben Goldsworthy 2023-03-02 17:10:55 -05:00
parent 7a39bfd7d5
commit 79f57e6a11
2 changed files with 50 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
public/css/app.css
View File

@ -351,3 +351,11 @@ body {
margin-top: 1em;
}
}
.checkin-icon {
color: black;
}
.checkin-icon--missing {
opacity: 0.4;
}

67
resources/views/partials/checkins-list.blade.php
View File

@ -1,35 +1,52 @@
@foreach($checkinsList as $checkin)
<li>
@php
$hasEmbed = null;
$embedMissing = null;
if (preg_match("/\[\[([^\]]+)\]\]/", $checkin->note, $filepath)) {
if (preg_match("/\.webm/", $filepath[1])) {
$hasEmbed = 'video';
if (file_exists(public_path() . "/videos/" . $filepath[1])) {
$embed = '<video class="popup__video" controls>';
$embed .= '<source src="' . url("/videos/" . $filepath[1]) . '" type="video/webm">';
$embed .= '<p>Your browser doesn\'t support HTML video. Here is a <a href="' . url("/videos/" . $filepath[1]) . '">link to the video</a> instead.</p>';
$embed .= '</video>';
} else {
$embed = '<p>[The video \'' . $filepath[1] . '\' has not yet been uploaded, try again later.]</p>';
$embedMissing = true;
}
} elseif (preg_match("/\.ogg/", $filepath[1])) {
$hasEmbed = 'audio';
if (file_exists(public_path() . "/audio/" . $filepath[1])) {
$embed = '<audio class="popup__audio" controls>';
$embed .= '<source src="' . url("/audio/" . $filepath[1]) . '" type="audio/ogg">';
$embed .= '<p>Download <a href="' . url("/audio/" . $filepath[1]) . '">OGG</a> audio.</p>';
$embed .= '</audio>';
} else {
$embed = '<p>[The recording \'' . $filepath[1] . '\' has not yet been uploaded, try again later.]</p>';
$embedMissing = true;
}
}
$checkin->note = preg_replace("/\[\[[^\]]+\]\]/", $embed, $checkin->note);
}
@endphp
<details class="checkin" id="{{ $checkin->id }}" ontoggle="toggleCheckin(this.open, this.id)">
<summary class="checkin__summary">
<h2 class="checkin__title">{!! $checkin->title ?? "<i>Untitled</i>" !!}</h2>
<h2 class="checkin__title">
{!! $checkin->title ?? "<i>Untitled</i>" !!}
@if($hasEmbed)
@if($hasEmbed === 'video')
<span class="checkin-icon @if($embedMissing) checkin-icon--missing @endif">&#128249;</span>
@endif
@if($hasEmbed === 'audio')
<span class="checkin-icon @if($embedMissing) checkin-icon--missing @endif">&#128264;</span>
@endif
@endif
</h2>
<p class="checkin__meta">{!! render_date_difference($checkin->date) !!}</p>
</summary>
@if($checkin->note)
@php
if (preg_match("/\[\[([^\]]+)\]\]/", $checkin->note, $filepath)) {
if (preg_match("/\.webm/", $filepath[1])) {
if (file_exists(public_path() . "/videos/" . $filepath[1])) {
$embed = '<video class="popup__video" controls>';
$embed .= '<source src="' . url("/videos/" . $filepath[1]) . '" type="video/webm">';
$embed .= '<p>Your browser doesn\'t support HTML video. Here is a <a href="' . url("/videos/" . $filepath[1]) . '">link to the video</a> instead.</p>';
$embed .= '</video>';
} else {
$embed = '<p>[The video \'' . $filepath[1] . '\' has not yet been uploaded, try again later.]</p>';
}
} elseif (preg_match("/\.ogg/", $filepath[1])) {
if (file_exists(public_path() . "/audio/" . $filepath[1])) {
$embed = '<audio class="popup__audio" controls>';
$embed .= '<source src="' . url("/audio/" . $filepath[1]) . '" type="audio/ogg">';
$embed .= '<p>Download <a href="' . url("/audio/" . $filepath[1]) . '">OGG</a> audio.</p>';
$embed .= '</audio>';
} else {
$embed = '<p>[The recording \'' . $filepath[1] . '\' has not yet been uploaded, try again later.]</p>';
}
}
$checkin->note = preg_replace("/\[\[[^\]]+\]\]/", $embed, $checkin->note);
}
@endphp
@if($checkin->id === 3930)
@include('partials.abolition-checkin')