File: /home/imensosw/liftcincy.imenso.co/resources/views/frontend/find_events.blade.php
@extends('frontend.layouts.layout_custom')
@section('style')
<style>
.iframe {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
.op-selected {
background-color: red;
}
.heading2 {
margin-bottom: 20px;
margin-top: 20px
}
</style>
@endsection
@section('pageTitle')
<title>{{ trans('panel.site_title') }} {{trans('panel.find_event_page_title')}}</title>
@endsection
@section('content')
<div class="modal upper_modal" id="opportunity_modal">
<div class="modal-content">
<div class="modal-body">
<div class="ccontainer">
<div class="crow">
<div class="ccol ccol-lg-4 ccol-sm-6 mx-auto">
<hr />
<h1 class="mb-1 opportunity_title">Loading...</h1>
<div class="d-flex flex-justify-between mb-1 opportunity_modal_data">
<div class="mr-1 col start_date_div">
<div style="min-width: 100px;">
<strong class="d-block">{{ trans('opportunity.date') }}</strong>
<span class="start_date"></span>
</div>
</div>
<div class="mr-1 col start_time_div">
<div style="min-width: 100px;">
<strong class="d-block">{{ trans('opportunity.time') }}</strong>
<span class="start_time"></span>
</div>
</div>
<div class="col">
<div style="min-width: 100px;">
<strong class="d-block">{{ trans('opportunity.location') }}</strong>
<span class="address_location"></span> <a class='text-link address_link'
href="" target="_blank">View on Map</a>
</div>
</div>
</div>
<div class="mb-2 opportunity_modal_data">
<strong class="d-block">{{ trans('opportunity.desc') }}</strong>
<span class="opportunity_desc"></span>
</div>
<div class="opportunity_modal_data">
@if ($user_type == 'Volunteer')
<a href="javascript:;" id="apply_to_opportunity_button"
class="apply_to_opportunity_button cbtn cbtn-primary mr-2"></a>
@elseif ($user_type == 'Admin' || $user_type == 'Partner')
<a href="javascript:;" id="login_to_apply"
class="cbtn cbtn-primary mr-2">{{ trans('opportunity.signup') }}</a>
@else
<a href="javascript:;" id="login_to_apply_opportunity"
class="cbtn cbtn-primary mr-2 login_to_apply_opportunity">{{ trans('opportunity.signup') }}</a>
@endif
<a href="javascript:;" id="close_opportunity"
class="cbtn cbtn-text-primary close">{{ trans('opportunity.close') }}</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@include('frontend.include.navbar')
<div data-scroll-container class="page-wrapper">
<div class="bg_strip21"><img src="images/bg_strip2.svg" alt="image" class="img-svg" /></div>
<section class="small_banner burger bg-black">
<div class="ccontainer">
<div class="crow g-0">
<div class="ccol ccol-xl-4 ccol-lg-4 ccol-md-7 ccol-sm-8 mx-auto">
<div class="bannerslider__content">
<div class="d-flex flex-justify-between">
<h1 class="border-bottom-0 text-white pb-2">{{ trans('event.find_event') }}</h1>
</div>
</div>
</div>
</div>
</div>
<div class="bg_strip31"><img src="images/bg_strip01.svg" alt="image" class="img-svg" /></div>
</section>
<section style="padding-top: 0; /*scroll-behavior: smooth;*/" class="burger_b">
<div class="pt-2">
<div class="ccontainer">
<div class="crow">
<div class="ccol ccol-lg-6 mx-auto">
<div class="grid_section two-col">
<form action="{{ route('frontend.find_events') }}" id="find_events" method="POST">@csrf
<div class="crow">
<input type="hidden" name="metro_id" class="main_metro_id">
<div class="ccol ccol-md-4 mobilehide">
<div class="d-flex flex-item-align-center">
<span class="text-left" style="min-width: 90px">Select Metro:</span>
<select class="form-control event_areas1 metro_event_area select2" name="metro_id1">
@if (count($metros))
{{-- <option value="">{{ trans('event.select_area') }}</option> --}}
@foreach ($metros as $key => $metro)
<option value="{{ $metro->id }}"
dat_status="{{ $metro->active_status }}"
@if ($metro_id == $metro->id) selected @endif
@if ($metro->total_opportunities + $metro->total_events == 0 || $metro->active_status == 0) disabled @endif>
{{ $metro->metro_name .', '. $metro->metro_state }}@if ($metro->total_opportunities + $metro->total_events == 0 || $metro->active_status == 0)
(Coming Soon)
@endif
</option>
@endforeach
@endif
</select>
</div>
</div>
<div class="ccol ccol-md-4 mobileshow">
<div class="d-flex flex-item-align-center">
<span class="text-left" style="min-width: 90px">Select Metro:</span>
<select class="form-control event_areas1 metro_event_area select2" name="metro_id2">
@if (count($metros))
{{-- <option value="">{{ trans('event.select_area') }}</option> --}}
@foreach ($metros as $key => $metro)
<option value="{{ $metro->id }}" @if ($metro_id == $metro->id) selected @endif
@if ($metro->total_opportunities + $metro->total_events == 0 || $metro->active_status == 0) disabled @endif>
Greater {{ $metro->metro_name }}
@if ($metro->total_opportunities + $metro->total_events == 0 || $metro->active_status == 0)
(Coming Soon)
@endif
</option>
@endforeach
@endif
</select>
</div>
</div>
<div class="ccol ccol-md-4">
<div class="d-flex flex-item-align-center">
<span class="text-left" style="min-width: 80px">Event Type:</span>
<select class="form-control event_areas select2" name="event_type">
{{-- <option value="all" @if ($event_type == 'all') selected @endif >All</option> --}}
<option value="event"
@if ($event_type == 'event') selected @endif>Live Events
</option>
<option value="opportunity"
@if ($event_type == 'opportunity') selected @endif>Volunteer
Opportunities</option>
</select>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
@if (($event_type == 'all' || $event_type == 'event') && $events->count())
<div class="crow flex-justify-center">
<div class="ccol ccol-md-5 ccol-sm-6">
{{-- <h2 class="heading2 text-center">Music Events</h2> --}}
<div class="crow g-0">
@if ($events->count())
@foreach ($events as $key => $event)
<div class="ccol ccol-lg-4 ccol-md-4 ccol-sm-4">
<div class="school_grid">
<a href="{{ route('frontend.event_detail', [$event->slug]) }}"
data-modal="#modal" class="modal_trigger school_grid_img">
<?php $feature_image = 'https://res.cloudinary.com/lift-cincy/image/upload/v1651630293/blurred-img/0_inbble.png';
if (!empty($event->feature_image)) {
$feature_image = URL::asset('Event/' . $event->id . '/' . $event->feature_image);
}
?>
<img src="{{ $feature_image }}" alt="image" />
</a>
<div class="d-flex flex-justify-between flex-item-align-center">
<div class="badge badge-black mr-1 small">
{{ date('l, M. d, Y', strtotime($event->start_date)) }} @
{{ date('h:i A', strtotime($event->start_time)) }}</div>
<!-- <div class="badge badge-black mr-1 small">
Ongoing Event
</div> -->
<div class="small">
<div style="min-width:60px">
<span
class="box_circle age mr-05">{{ $event->event_age_group }}</span>
<span class="ticket_xs">{{ $event->event_hours }}h</span>
</div>
</div>
</div>
<a href="{{ route('frontend.event_detail', [$event->slug]) }}"
class="heading_2">{{ $event->event_title }}</a>
<div class="small">
@if (empty($event->address_location))
{{-- @ The Andrew Brady Music Center | Cincinnati --}}
@else
{{ __('@ ') . $event->address_location }}
@endif
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
@endif
@if (($event_type == 'all' || $event_type == 'opportunity') && $opportunities->count())
<div class="crow flex-justify-center">
<div class="ccol ccol-md-5 ccol-sm-6">
{{-- <h2 class="heading2 text-center">Volunteer Opportunity</h2> --}}
<div class="crow g-0">
@if ($opportunities->count())
@foreach ($opportunities as $key => $opportunity)
<div class="ccol ccol-lg-4 ccol-md-4 ccol-sm-4">
<div class="school_grid">
<a href="javascript:;" data-modal="#opportunity_modal"
onClick="get_opportunity_detail('{{ $opportunity->id }}');"
class="modal_trigger school_grid_img">
<?php
$feature_image = URL::asset('frontend/images/image_1.png');
if (!empty($opportunity->feature_image)) {
$feature_image = URL::asset('Opportunity/' . $opportunity->partner_id . '/' . $opportunity->id . '/' . $opportunity->feature_image);
}
?>
<img src="{{ $feature_image }}" alt="image" />
</a>
<div class="d-flex flex-justify-between flex-item-align-center">
@if($opportunity->on_going == 1)
<div class="badge badge-black mr-1 small">
<!-- {{ date('l, M. d, Y', strtotime($opportunity->start_date)) }} @
{{ date('h:i A', strtotime($opportunity->start_time)) }} -->
Ongoing Opportunity
</div>
@else
<div class="badge badge-black mr-1 small">
{{ date('l, M. d, Y', strtotime($opportunity->start_date)) }} @
{{ date('h:i A', strtotime($opportunity->start_time)) }}
</div>
@endif
<!-- <div class="small"> -->
<div style="">
<span
class=" small_circle">{{ $opportunity->opportunity_hours }}h</span>
</div>
<!-- </div> -->
</div>
<a href="javascript:;" data-modal="#opportunity_modal"
onClick="get_opportunity_detail('{{ $opportunity->id }}');"
class="modal_trigger heading_2">{{ $opportunity->opportunity_title }}</a>
<div class="small">
@if (empty($opportunity->address_location))
{{-- @ The Andrew Brady Music Center | Cincinnati --}}
@else
{{ __('@ ') . $opportunity->address_location }}
@endif
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
@endif
</div>
</div>
</section>
@include('frontend.include.footer')
</div>
@endsection
@section('script')
<script src="{{ asset('assets/js/sweet-alert.min.js') }}"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".inner_nav a").removeClass("active")
$("#getticket").addClass("active");
$('.metro_event_area').on('change', function() {
$('.main_metro_id').val($(this).val());
$('.metro_event_area').val($(this).val());
$('#find_events').submit();
});
$('.event_areas').on('change', function() {
$('.main_metro_id').val($('.metro_event_area').val());
$('#find_events').submit();
});
$(".accordion h2").click(function() {
$(this).toggleClass("open")
var id = this.id; /* getting heading id */
/* looping through all elements which have class .accordion-content */
$(".accordion-content").each(function() {
if ($("#" + id).next()[0].id != this.id) {
$(this).slideUp("slow");
}
});
$(this).next().slideToggle(); /* Selecting div after h1 */
});
$('body').on('click', '.applied_to_opportunity', function() {
swal("", "{{ trans('new.applied_to_opportunity') }}");
});
$('body').on('click', '.apply_to_opportunity', function() {
var opportunity_id = $(this).attr('data_id');
var action_url = $(this).attr('action_url');
var this_oppor = $(this);
var postData = new FormData();
postData.append('opportunity_id', opportunity_id);
swal({
title: "{{ trans('new.are_you_sure') }}",
text: "{{ trans('new.apply_to_opportunity') }}",
//icon: "info", //Success, warning, info, error
buttons: true,
dangerMode: true,
})
.then((willComment) => {
if (willComment) {
swal({
title: "{{ trans('opportunity.proccessing') }}",
text: "{{ trans('opportunity.proccessing_text') }}",
//icon: "warning", //Success, warning, info, error
buttons: false,
dangerMode: true,
});
$.ajax({
headers: {
'X-CSRF-Token': '{{ csrf_token() }}'
},
async: true,
type: "post",
dataType: 'json',
contentType: false,
url: action_url,
data: postData,
processData: false,
success: function(data) {
if (data.success == 'done') {
//$('body').find('.'+files_div).attr('src',data.doc_url);
//$('.delete_feature_image').hide();
this_oppor.addClass('applied_to_opportunity');
this_oppor.removeClass('apply_to_opportunity');
this_oppor.html('Registered');
swal("Great!", data.msg, "success");
} else {
swal("You are in!", data.msg, "error");
}
},
error: function(data, errorThrown) {
swal("Oops!", errorThrown, "error");
},
});
}
});
});
$('#login_to_apply').on('click', function() {
swal("Oops!", "{{ trans('opportunity.login_text') }}", "error");
});
$('#login_to_apply_opportunity').on('click', function() {
var data_url = $(this).attr('data-url');
var url = "{{ route('dashboard.opportunities') }}" + '?opportunity_url=' + data_url;
$('#login_to_apply_opportunity').attr('href', url);
});
//Please login with your volunteer account to apply to this Volunteer Opportunity!
});
function get_opportunity_detail(opportunity_id) {
$('#opportunity_modal').find('.opportunity_modal_data').hide();
$('#opportunity_modal').find('.start_date_div').show();
$('#opportunity_modal').find('.start_time_div').show();
$('#opportunity_modal').find('.opportunity_title').html('Loading...');
$('#opportunity_modal').find('.start_date').html('');
$('#opportunity_modal').find('.start_time').html('');
$('#opportunity_modal').find('.address_location').html('');
$('#opportunity_modal').find('.address_link').attr('href', '#');
$('#opportunity_modal').find('.opportunity_desc').html('');
$('#opportunity_modal').find('.apply_to_opportunity_button').html('');
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass('apply_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass('applied_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('action_url', '');
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('data_id', '');
//
action_url = "{{ route('opportunity_detail', '') }}/" + opportunity_id;
var postData = new FormData();
$.ajax({
headers: {
'X-CSRF-Token': '{{ csrf_token() }}'
},
async: true,
type: "post",
dataType: 'json',
contentType: false,
url: action_url,
data: postData,
processData: false,
success: function(data) {
var opportunity = data.opportunity;
if (data.success == 'done') {
$('#opportunity_modal').find('.start_date_div').show();
$('#opportunity_modal').find('.start_time_div').show();
$('#opportunity_modal').find('.opportunity_title').html(opportunity.opportunity_title);
$('#opportunity_modal').find('.start_date').html(opportunity.start_date);
$('#opportunity_modal').find('.start_time').html(opportunity.start_time);
if (opportunity.on_going == 1) {
$('#opportunity_modal').find('.start_date_div').hide();
$('#opportunity_modal').find('.start_time_div').hide();
}
$('#opportunity_modal').find('.address_location').html(opportunity.address_location);
$('#opportunity_modal').find('.address_link').attr('href', opportunity.address_link);
$('#opportunity_modal').find('.opportunity_desc').html(opportunity.opportunity_desc);
$('#opportunity_modal').find('.apply_to_opportunity_button').html(opportunity
.apply_to_opportunity_button);
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass(
'apply_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass(
'applied_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').addClass(opportunity
.apply_to_opportunity_button_class);
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('action_url',
opportunity.action_url);
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('data_id', opportunity
.id);
$('#opportunity_modal').find('.login_to_apply_opportunity').attr('data-url', opportunity
.slug);
$('#opportunity_modal').find('.opportunity_modal_data').show();
//$('body').find('.'+files_div).attr('src',data.doc_url);
//$('.delete_feature_image').hide();
} else {
$('#opportunity_modal').find('.opportunity_modal_data').hide();
$('#opportunity_modal').find('.start_date_div').show();
$('#opportunity_modal').find('.start_time_div').show();
$('#opportunity_modal').find('.opportunity_title').html('Loading...');
$('#opportunity_modal').find('.start_date').html('');
$('#opportunity_modal').find('.start_time').html('');
$('#opportunity_modal').find('.address_location').html('');
$('#opportunity_modal').find('.address_link').attr('href', '#');
$('#opportunity_modal').find('.opportunity_desc').html('');
$('#opportunity_modal').find('.apply_to_opportunity_button').html('');
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass(
'apply_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').removeClass(
'applied_to_opportunity');
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('action_url', '');
$('#opportunity_modal').find('.apply_to_opportunity_button').attr('data_id', '');
}
},
error: function(data, errorThrown) {
swal("Oops!", errorThrown, "error");
},
});
}
</script>
@endsection