@extends('template')
@section('content')
@push('swipper')
{{-- swiper --}}
{{-- <script src="{{ url('https://cdn.jsdelivr.net/npm/swiper@10/swiper-element-bundle.min.js') }}"></script> --}}
<script src="{{ asset('js/swiper-slider.js') }}"></script>
{{-- swiper --}}
@endpush
@push('calendar')
{{-- fullcalendar --}}
<link rel="stylesheet" href="{{ asset('assets/extensions/Kalendar/fullcalendar.css') }}">
<script src="{{ asset('assets/extensions/Kalendar/index.global.min.js') }}"></script>
{{-- fullcalendar --}}
{{-- script --}}
<script>
document.addEventListener('DOMContentLoaded', function() {
var event = @json($eventCalendar);
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth'
});
if (Array.isArray(event) && event.length > 0) {
event.map(function(event) {
var endDate = new Date(event.tanggal_berakhir);
endDate.setDate(endDate.getDate() + 1);
calendar.addEvent({
title: event.nama,
start: event.tanggal_mulai,
end: endDate,
allDay: true,
backgroundColor: '#333',
borderColor: '#fff',
});
calendar.render();
});
}
});
</script>
@endpush
@php
use Carbon\Carbon;
@endphp
<style>
.darken-video {
filter: brightness(50%); /* Adjust the percentage to control the darkness */
}
</style>
<div id="videobackground" class="mb-5" >
<div class="swiper mySwipey">
<div class="swiper-wrapper">
@foreach($video_background as $item)
<div class="swiper-slide">
<div class="h-screen">
<video style="object-fit: cover !important; width: 100%; height: 100%;" class="darken-video" muted autoplay playsinline src="{{asset('video/videobackground/'.$item->video)}}"></video>
</div>
</div>
@endforeach
<div class="slide-captions container bigger" style="max-width: 700px"></div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</div>
<div class="container mb-5">
<section class="row " >
<div class="col-lg-7 col">
<div class="swiper mySwiper bigger">
<div class="swiper-wrapper "style="position: relative!important;">
@foreach ($pengumuman as $item)
<div class="swiper-slide " >
@if(isset($item->link_yt))
<div>
@php
if ($item->link_yt != '') {
$link = $item->link_yt;
$video_id = explode("?v=", $link);
$video_id = $video_id[1];
$id_yt = explode("&", $video_id);
$id_yt = $id_yt[0];
} else {
$data['id_yt'] = "";
}
@endphp
<iframe src="https://www.youtube.com/embed/{{ $id_yt }}" muted title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" style=" width:100%;height:500px; border-radius:15px; "></iframe>
</div>
@else
<div>
<a href="{{ $item->link }}" target="_blank">
<img class=" w-100 " style=" min-height:500px; max-height:500px; border-radius:15px;object-fit:cover;"
src="{{ asset('images/pengumuman/' . $item->photo) }}" alt="">
</a>
</div>
@endif
</div>
@endforeach
</div>
{{-- <div class="slide-captions text-uppercase">
</div> --}}
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</div>
<div class="col-lg-5 col-12 m-3 m-lg-0">
@foreach ($banner as $item)
<img src="{{ asset('images/banner/' . $item->photo) }}" alt="..." class="h-100 w-75"
style="object-fit: cover">
@endforeach
</div>
</section>
</div>
<div class=" py-5 " style="background-color:black;background: rgba(25, 25, 25, .10);">
<div class="container hidden">
<div class="border-bottom border-danger mb-5 "style="width:fit-content;border-width:2px!important;">
<h1>Berita Terkini</h1>
</div>
</div>
<section class="row container m-auto hidden" style=" margin-top:75px;">
@if ($berita_terbaru)
<a style="text-decoration: none;"
href="{{ route('beritaDetail', Crypt::encryptString($berita_terbaru->id)) }}"
class="col-lg-7 link big">
<img src="{{ asset('images/berita/' . $berita_terbaru->photo) }}" class="img-fluid "
style="border-radius: 20px;" alt="Responsive image">
<div class="my-3">
<h5>{{ $berita_terbaru->title }}</h5>
<p class="text-secondary"><i
class="bi bi-calendar-week mr-2"></i>{{ Carbon::parse($berita_terbaru->tanggal)->formatLocalized('%d %b %Y') }}
</p>
</div>
</a>
@else
<div class="col-lg-7">
<img src="{{ asset('assets/images/samples/origami.jpg') }}" class="img-fluid "
style="border-radius: 20px;" alt="Responsive image">
<div class="my-3">
<h5>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis officia assumenda culpa
facere, atque omnis veritatis magni error eos. Excepturi fuga modi quisquam aut quas vitae
suscipit earum vero cupiditate.</h5>
<p class="text-secondary"><i class="bi bi-calendar-week mr-2"></i>17 Agustus 2023
</p>
</div>
</div>
@endif
<div class="col">
@foreach ($berita as $item)
<a style="text-decoration: none;" href="{{ route('beritaDetail', Crypt::encryptString($item->id)) }}"
class="d-flex bigger card flex-row p-2 mb-2 align-items-center link">
<img src="{{ asset('images/berita/' . $item->photo) }}"style=" width:85px; height:85px;object-fit:cover;"
alt="..." class="img-thumbnail mr-3 ">
<div>
<p>{{{ Str::words(strip_tags($item->title), 8, ' ...') }}}</p>
<p style="text-decoration: none;" class="text-secondary"><i
class="bi bi-calendar-week mr-2"></i>{{ Carbon::parse($item->tanggal)->formatLocalized('%d %b %Y') }}
</p>
</div>
</a>
@endforeach
<a href="{{ route('berita') }}" class="link h5"> Berita Lainnya ..</a>
</div>
<script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script>
</section>
</div>
<section class="hidden">
<div class="container my-5">
<div class="border-bottom border-danger my-3 "style="width:fit-content;border-width:2px!important;">
<h1>Event</h1>
</div>
<div class=" row">
<div class="row col-lg-7 col">
@foreach ($event as $item)
<a href="{{ $item->link }}" target="_blank" class="d-flex m-3 col-lg-5 col link bigger">
<img src="{{ asset('images/event/' . $item->photo) }}" class="img-fluid "
style=" width:65px; height:65px;object-fit:cover;"alt="Responsive image">
<div class="mx-3">
<h5>{{ $item->nama }}</h5>
{{-- <p class="text-secondary"><i
class="bi bi-calendar-week mr-2"></i>{{ Carbon::parse($item->tanggal)->formatLocalized('%d %b %Y') }}
</p> --}}
</div>
</a>
@endforeach
</div>
<div class="col-lg-5 center col row">
<div id='calendar' style="background-color:white!important;"></div>
</div>
</div>
</div>
</section>
{{-- <script>
document.addEventListener("DOMContentLoaded", function() {
var youtubeVideo = document.getElementById("youtubeVideo");
setTimeout(function() {
if (youtubeVideo.contentWindow) {
youtubeVideo.contentWindow.postMessage(
'{"event":"command","func":"playVideo","args":""}', '*');
}
}, 1000);
});
</script> --}}
{{-- script --}}
@endsection
Anons79 File Manager Version 1.0, Coded By Anons79
Email: [email protected]
Anons79 Mini Shell