web-mooc/resources/views/course_player/course_content_body.blade.php
2026-01-12 08:05:36 +07:00

107 lines
5.1 KiB
PHP

<div class="course-video-area border-primary border">
<!-- Video -->
<div class="course-video-wrap">
<div class="plyr__video-embed">
@php $watermark_type = get_player_settings('watermark_type'); @endphp
@if ($watermark_type == 'js')
@include('course_player.watermark')
@endif
@include('course_player.player_page')
</div>
</div>
</div>
<!-- Thumb image -->
@if ($lesson_details->lesson_type == 'text' && $lesson_details->attachment_type == 'text')
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light p-3">
<div class="h-100">{!! removeScripts($lesson_details->attachment) !!}</div>
<div class="position-absolute top-50 start-50 translate-middle">
</div>
</div>
@elseif ($lesson_details->lesson_type == 'video-url')
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light">
<div class="plyr__video-embed " id="player">
<iframe width="560" height="315"
src="{{ $lesson_details->lesson_src }}?https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1"
title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
<div class="position-absolute top-50 start-50 translate-middle">
</div>
</div>
</div>
@include('frontend.course_player.player_config')
@elseif($lesson_details->lesson_type == 'image')
<div class="overflow-hidden bd-r-10 mb-16 position-relative bg-light">
@php
// $img = asset('uploads/lesson_file/attachment/' . $lesson_details->attachment);
$img = route('course.get_file', ['course_id' => $lesson_details->course_id, 'lesson_id' => $lesson_details->id])
@endphp
<img width="100%" class="max-w-auto" height="auto" src="{{ $img }}" />
</div>
@elseif($lesson_details->lesson_type == 'google_drive')
@php
$video_url = trim($lesson_details->lesson_src);
// Extract Google Drive file ID reliably from standard share links
preg_match('/\/d\/([a-zA-Z0-9_-]+)/', $video_url, $matches);
$video_id = $matches[1] ?? null;
@endphp
@if($video_id)
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light">
<!-- Responsive 16:9 ratio wrapper -->
<div class="ratio ratio-16x9 w-100 h-100">
<iframe
src="https://drive.google.com/file/d/{{ $video_id }}/preview"
allowfullscreen
allow="autoplay; fullscreen; picture-in-picture"
class="border-0 rounded-10"
frameborder="0"
loading="lazy">
</iframe>
</div>
</div>
@include('frontend.course_player.player_config')
@else
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light d-flex align-items-center justify-content-center">
<div class="text-center text-danger">
<h5>Invalid Google Drive Link</h5>
<p class="mb-2">Could not extract video ID.</p>
<small class="text-muted">Use a link like:<br>
https://drive.google.com/file/d/<strong>FILE_ID</strong>/view
</small>
</div>
</div>
@endif
@elseif($lesson_details->lesson_type == 'html5')
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light">
<video id="player" playsinline controls>
<source class="remove_video_src" src="{{ $lesson_details->lesson_src }}" type="video/mp4">
</video>
</div>
@include('frontend.course_player.player_config')
@elseif($lesson_details->lesson_type == 'document_type')
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light">
@if ($lesson_details->attachment_type == 'pdf')
<iframe class="embed-responsive-item" width="100%" height="500px"
src="{{ asset('uploads/lesson_file/attachment/' . $lesson_details->attachment) }}"
allowfullscreen></iframe>
@elseif($lesson_details->attachment_type == 'doc')
<iframe
src="https://view.officeapps.live.com/op/embed.aspx?src={{ asset('uploads/lesson_file/attachment/' . $lesson_details->attachment) }}"
width='100%' height='650px' frameborder='0'></iframe>
@elseif($lesson_details->attachment_type == 'txt')
<iframe src="{{ asset('uploads/lesson_file/attachment/' . $lesson_details->attachment) }}"
width='100%' height='650px' frameborder='0'></iframe>
@endif
</div>
@else
<div class="overflow-hidden bd-r-10 mb-16 h-314 h-md-428 position-relative bg-light">
<iframe class="embed-responsive-item" width="100%" height="550px" src="{{ $lesson_details->lesson_src }}"
allowfullscreen></iframe>
</div>
@endif