{{-- Standard Link --}}
@php
use Illuminate\Support\Str;
+ use App\Http\Controllers\FrontController;
- if (!Str::startsWith($href, 'http') && !Str::startsWith($href, '/tools/') && !Str::startsWith($href, '/storage/') && !Str::startsWith($href, '/front/')) {
- $linkData=\App\Http\Controllers\FrontController::getLinkData($href);
+ if (!Str::startsWith($href, 'http') &&
+ !Str::startsWith($href, '/tools/') &&
+ !Str::startsWith($href, '/storage/') &&
+ !Str::startsWith($href, '/front/')) {
+ $linkData = FrontController::getLinkData($href);
- $href=$linkData['url'];
- if($linkData['type']==='pdf'){
- $attributes["@click.prevent"]='openPDF($el.attributes.href.value)';
- }else if($linkData['type']=='video'){
- $attributes['@click.prevent']='openPDF($el.attributes.href.value)';
+ $href = $linkData['url'];
+
+ if ($linkData['type'] === 'pdf') {
+ $attributes['@click.prevent'] = 'openPDF($el.attributes.href.value)';
+ } else if ($linkData['type'] == 'video' || $linkData['type'] == 'audio') {
+ // Set data needed to launch media player
+ $player_data = [
+ 'ID' => $linkData['id'],
+ 'player' => [
+ 'type' => $linkData['type'], // video / audio
+ 'sources' => [
+ [
+ 'src' => $href,
+ ]
+ ]
+ ],
+ 'title' => $linkData['title'] ?? '',
+ 'image' => $linkData['image'],
+ ];
+
+ $attributes['id'] = "media_{$linkData['id']}"; // Needed so media can be found on page load via querystring ID
+ $attributes['data-player'] = htmlspecialchars(json_encode($player_data));
+ $attributes['@click.prevent'] = "\$dispatch('player-open', { sourceData: JSON.parse(\$el.dataset.player) })";
}
}
@endphp
// Open PDF viewer if querystring is already set
let querystring = new URLSearchParams(location.search);
- if (querystring.get('file')) {
- this.openPDF(querystring.get('file'), false);
+ if (querystring.get('pdf')) {
+ this.openPDF(querystring.get('pdf'), false);
}
},
if (updateQuerystring) {
const location = new URL(window.location.href);
- location.searchParams.set('file', PDF_URL);
+ location.searchParams.set('pdf', PDF_URL);
history.replaceState(null, document.title, location.toString());
}
// Update the page URL to remove querystring
const location = new URL(window.location.href);
- location.searchParams.delete('file');
+ location.searchParams.delete('pdf');
history.replaceState(null, document.title, location.toString());
},
}
<body x-data="app()"
@resize.window.debounce="measureWidth()"
class="font-primary p-8 @stack('extra_body_classes')">
- @endsection
-
- @section('main')
- {{--
- Content has constrained width so that nothing shifts when overlay is opened and scrolling is disabled.
- The body width changes when scrollbars are removed, which causes alignment problems, especially with
- fixed-position elements.
- --}}
- <div style="width: var(--content-width)">
- <x-header main="true"/>
-
- <div class="min-h-content flex flex-col mx-22 pt-22 opacity-0" :class="{ 'opacity-0': maskContents }">
- @yield('content')
- </div>
+@endsection
+
+@section('main')
+ {{--
+ Content has constrained width so that nothing shifts when overlay is opened and scrolling is disabled.
+ The body width changes when scrollbars are removed, which causes alignment problems, especially with
+ fixed-position elements.
+ --}}
+ <div style="width: var(--content-width)">
+ <x-header main="true"/>
+
+ <div class="min-h-content flex flex-col mx-22 pt-22 opacity-0" :class="{ 'opacity-0': maskContents }">
+ @yield('content')
</div>
+ </div>
- {{-- MENU OVERLAY --}}
-
<div class="overlay menu-overlay
- bg-blue text-white
- z-30"
- x-show="menuOpen"
- x-transition.opacity.duration.500ms
- x-transition:leave.opacity.duration.500ms.delay.500ms
- x-cloak>
+ {{-- MENU OVERLAY --}}
+ <div class="overlay menu-overlay
+ bg-blue text-white
+ z-30"
+ x-show="menuOpen"
+ x-transition.opacity.duration.500ms
+ x-transition:leave.opacity.duration.500ms.delay.500ms
+ x-cloak>
- <x-header logo-class="text-white"/>
+ <x-header logo-class="text-white"/>
-
<ul class="w-full font-medium text-6xl">
- @foreach ($menu as $link)
+ <ul class="w-full font-medium text-6xl">
+ @foreach ($menu as $link)
- @php
- $prevent='menuOpen = false; setTimeout(() => window.location = $event.target.href, 200);';
- if($link['type']==='pdf'){
- $prevent='menuOpen = false;openPDF($el.attributes.href.value)';
- }
- @endphp
- {{-- Overflow is hidden for text entrance animation. --}}
- {{-- Extra padding and negative margin added so hover scale effect isn't clipped --}}
- <li class="overflow-hidden pl-4 -ml-4">
- <div x-show="menuOpen"
- class="transition transform ease-out-quint"
- style="transition-delay: {{ 250 + (50 * $loop->index) }}ms"
- x-transition:enter="duration-1000"
- x-transition:enter-start="translate-y-[100px]"
- x-transition:enter-end="translate-x-0"
- x-transition:leave="duration-500"
- x-transition:leave-start="translate-x-0"
- x-transition:leave-end="translate-y-[100px]">
- <x-link
- href="{{ $link['url'] }}"
- @click.prevent="{!! $prevent !!}"
- class="block py-8 text-current
- transform origin-bottom-left
- transition-transform duration-200
- hover:scale-105">
- {{ $link['title'] }}
- </x-link>
- </div>
- </li>
- <li class="bg-blue-dark h-px
- transform origin-left
- transition ease-out-quint"
- x-show="menuOpen"
- style="transition-delay: {{ 250 + (50 * $loop->index) }}ms"
- x-transition:enter="duration-2000"
- x-transition:enter-start="scale-x-0"
- x-transition:enter-end="scale-x-100"
- x-transition:leave="duration-500"
- x-transition:leave-start="scale-x-100"
- x-transition:leave-end="scale-x-0">
- </li>
- @endforeach
- </ul>
- </div>
-
- {{-- Search Overlay --}}
- <x-search/>
-
- {{-- PDF Viewer Overlay --}}
- <div class="overlay pdf-overlay
- bg-white text-black
- pt-20
- z-20"
- x-show="PDFOpen"
- x-transition:enter.opacity.duration.500ms
- x-transition:leave.opacity.duration.200ms
- x-cloak>
-
- {{-- PDF Viewer iframe --}}
- <iframe x-ref="PDFViewer" src="" frameborder="0"
- class="absolute left-0 w-full top-[90px] h-[calc(100vh-90px)]"></iframe>
-
- <x-header>
- <x-slot name="right">
- <div x-show="PDFOpen && !menuOpen" x-transition:enter.opacity.duration.500ms.delay.300ms
- x-transition:leave.opacity.duration.0ms.delay.0ms>
- <x-close
- x-show="PDFOpen"
- @click.prevent="closePDF()"
- class="flex"
- />
+ @php
+ $prevent='menuOpen = false; setTimeout(() => window.location = $event.target.href, 200);';
+ if($link['type']==='pdf'){
+ $prevent='menuOpen = false;openPDF($el.attributes.href.value)';
+ }
+ @endphp
+ {{-- Overflow is hidden for text entrance animation. --}}
+ {{-- Extra padding and negative margin added so hover scale effect isn't clipped --}}
+ <li class="overflow-hidden pl-4 -ml-4">
+ <div x-show="menuOpen"
+ class="transition transform ease-out-quint"
+ style="transition-delay: {{ 250 + (50 * $loop->index) }}ms"
+ x-transition:enter="duration-1000"
+ x-transition:enter-start="translate-y-[100px]"
+ x-transition:enter-end="translate-x-0"
+ x-transition:leave="duration-500"
+ x-transition:leave-start="translate-x-0"
+ x-transition:leave-end="translate-y-[100px]">
+ <x-link
+ href="{{ $link['url'] }}"
+ @click.prevent="{!! $prevent !!}"
+ class="block py-8 text-current
+ transform origin-bottom-left
+ transition-transform duration-200
+ hover:scale-105">
+ {{ $link['title'] }}
+ </x-link>
</div>
- </x-slot>
- </x-header>
- </div>
+ </li>
+ <li class="bg-blue-dark h-px
+ transform origin-left
+ transition ease-out-quint"
+ x-show="menuOpen"
+ style="transition-delay: {{ 250 + (50 * $loop->index) }}ms"
+ x-transition:enter="duration-2000"
+ x-transition:enter-start="scale-x-0"
+ x-transition:enter-end="scale-x-100"
+ x-transition:leave="duration-500"
+ x-transition:leave-start="scale-x-100"
+ x-transition:leave-end="scale-x-0">
+ </li>
+ @endforeach
+ </ul>
+ </div>
+
+ {{-- Search Overlay --}}
+ <x-search/>
+
+ {{-- PDF Viewer Overlay --}}
+ <div class="overlay pdf-overlay
+ bg-white text-black
+ pt-20
+ z-20"
+ x-show="PDFOpen"
+ x-transition:enter.opacity.duration.500ms
+ x-transition:leave.opacity.duration.200ms
+ x-cloak>
+
+ {{-- PDF Viewer iframe --}}
+ <iframe x-ref="PDFViewer" src="" frameborder="0"
+ class="absolute left-0 w-full top-[90px] h-[calc(100vh-90px)]"></iframe>
+
+ <x-header>
+ <x-slot name="right">
+ <div x-show="PDFOpen && !menuOpen" x-transition:enter.opacity.duration.500ms.delay.300ms
+ x-transition:leave.opacity.duration.0ms.delay.0ms>
+ <x-close
+ x-show="PDFOpen"
+ @click.prevent="closePDF()"
+ class="flex"
+ />
+ </div>
+ </x-slot>
+ </x-header>
+ </div>
+
+ {{-- Media Player --}}
+ <x-media-library.player/>
@endsection
projects / odl.git / commitdiff