Server : Apache System : Linux 145.162.205.92.host.secureserver.net 5.14.0-611.45.1.el9_7.x86_64 #1 SMP PREEMPT_DYNAMIC Wed Apr 1 05:56:53 EDT 2026 x86_64 User : tradze ( 1001) PHP Version : 8.1.34 Disable Function : NONE Directory : /home/tradze/public_html/storage/framework/views/ |
<!doctype html>
<html lang="en">
<head>
<title>Tradze, <?php echo $__env->yieldContent('title'); ?></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE"/>
<meta property="og:title" content="<?php echo $__env->yieldContent('meta_title'); ?>">
<meta property="og:description" content="<?php echo $__env->yieldContent('meta_description'); ?>">
<!-- Global styles START -->
<?php echo $__env->make('frontend_new.partials.core-css', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<!-- Global styles END -->
<!-- Start css page -->
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/plugins/owl.carousel/owl-carousel/owl.theme.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/plugins/owl.carousel/owl-carousel/owl.carousel.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/plugins/FlipClock/compiled/flipclock.css')); ?>" type="text/css" media="screen">
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/bootstrap-css/bootstrap-datepicker.css')); ?>" type="text/css" media="screen">
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/css-carousel-treatments.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend/assets/css/typehead-bootstrap3.css')); ?>" type="text/css" media="screen">
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/css-top-contact.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/build.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/css-book-massage.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/css-treatment.css')); ?>" type="text/css" media="screen"/>
<link rel="stylesheet" href="<?php echo e(asset('/themes/frontend_new/assets/css/salon/css/style.css')); ?>">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" />
<!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" rel="stylesheet"> -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" />
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<?php echo $__env->yieldContent('css_page'); ?>
<style type="text/css">
.salon-slider .item img {
width: 100% !important;
height: 330px !important;
/* height: 100% !important;
*/ background: #000;
width: auto;
margin: 0 auto;
object-fit: cover;
}
.show-hide-map .row-salon-listing-map .col-salon-left
</style>
</head>
<body class="no_testimonials_page">
<?php /*start header*/ ?>
<?php echo $__env->make('frontend_new.partials.salonheader', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php /*end start header*/ ?>
<div class="sec-gap sec-salon-gap-main salon-User-wrap-v-2">
<!-- <div class="back-button">
<a href="<?php echo e(url('booking/treatment')); ?>" class="btn-back"> <i class="fa fa-arrow-left"></i></a>
</div> -->
<!--<div class="top-green-banner-wrap">
<div class="shape shape-left">
<svg width="314" height="343" viewBox="0 0 314 343" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="73.2311" cy="156.229" r="119.5" transform="rotate(5.09161 73.2311 156.229)" stroke="black" stroke-opacity="0.04" stroke-width="73"/>
<circle cx="158.21" cy="340.5" r="118.5" transform="rotate(5.09161 158.21 340.5)" stroke="black" stroke-opacity="0.04" stroke-width="73"/>
</svg>
</div>
<div class="shape shape-right">
<svg width="321" height="392" viewBox="0 0 321 392" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="156.227" cy="52.2292" r="119.5" transform="rotate(5.09161 156.227 52.2292)" stroke="black" stroke-opacity="0.04" stroke-width="73"/>
<circle cx="241.21" cy="236.5" r="118.5" transform="rotate(5.09161 241.21 236.5)" stroke="black" stroke-opacity="0.04" stroke-width="73"/>
</svg>
</div>
<div class="container">
<div class="row">
<div class="col-xs-12">
<div class="top-green-banner-inr">
<div class="top-green-banner-left">
<h1>A Variety Of Services For Every Individual</h1>
<p>Comprehensive Service Solutions: Expert Care and Support Across All Industries for Your Business, Home, and Personal Needs</p>
</div>
<div class="top-green-banner-right">
<img class="desktop_bg_image" src="<?php echo e(asset('/themes/frontend_new/assets/img/banner-top-green-1.png')); ?>" alt="">
</div>
</div>
</div>
</div>
</div>
</div>-->
<div class="sec-salon-slider-main">
<div class="container-gradient" style="background-image: url('<?php echo e(asset('/themes/frontend_new/assets/img/salon-list-banner.jpg')); ?>')">
<div class="container">
<div class="sec-gap sec-salon-banner-main">
<section class="calender_Elements sec-salon-main">
<div class="container_salon">
<div class="outer_calender">
<div class="inner_calender">
<ul class="nav nav-tabs nav-justified" role="tablist">
<li role="presentation">
<a href="#tab-top-left" aria-controls="home" role="tab" data-toggle="tab">
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/ic-treatments.png')); ?>" alt="">
<span class="d-block">SERVICES</span>
</a>
</li>
<!-- <li role="presentation">
<a href="#tab-top-right" aria-controls="profile" role="tab" data-toggle="tab">
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/ic-venue-icon.png')); ?>" alt="">
<span class="d-block">VENUES</span>
</a>
</li> -->
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="tab-top-left">
<div class="right_elements">
<div class="head_textFile">
<!-- <h2></h2> -->
<!-- <?php if(isset($salon_booking_date)): ?>
<p><span> <?php echo e($salon_booking_date); ?></span></p>
<?php endif; ?>
<?php if(isset($salon_booking_time)): ?>
<p><span> <?php echo e($salon_booking_time); ?> </span></p>
<?php endif; ?> -->
<!-- <p></p> -->
</div>
<div class="accordian_layer">
<div class="accordion">
<div class="accordion-item">
<div class="accordion-item-header">
<div class="inner_accordion">
<label class="container_radio">
<!-- <input id="tab_4" type="radio" onclick="checkDiv()" name="radio"> -->
<!-- <span class="checkmark"></span> -->
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/service-icon.png')); ?>" alt=""> <span class="treatmentTitle"><?php echo e($salon_booking_treatment_name ?? 'SERVICES'); ?></span>
</label>
<div class="date_detials">
<!-- 9.00:<span>AM</span> -->
</div>
</div>
</div><!-- /.accordion-item-header -->
<div class="accordion-item-body">
<div class="accordion-item-body-content sec-treatments-con">
<div class="ss1">
<div class="ss2">
<select onchange="select_treatments(this)" class="form-control" id="select2-dropdown">
<option value="">Select Services</option>
<?php foreach($treatments as $treatment): ?>
<?php if(isset($salon_booking_treatment_name) && $salon_booking_treatment_name == $treatment->name): ?>
<option selected value="<?php echo e($treatment->id); ?>"><?php echo e($treatment->name); ?></option>
<?php else: ?>
<option value="<?php echo e($treatment->id); ?>"><?php echo e($treatment->name); ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-item-header">
<div class="inner_accordion">
<label class="container_radio">
<!-- <input id="tab_3" type="radio" onclick="checkDiv()" name="radio"> -->
<!-- <span class="checkmark"></span> -->
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/map-pin-icon.png')); ?>" alt="">
<span id="LocationPicker"><?php echo e($booking['address'] ?? 'Location'); ?></span>
</label>
<div class="date_detials">
</div>
</div>
</div>
<div class="accordion-item-body">
<div class="accordion-item-body-content">
<div class="location-area">
<div class="form-group">
<!-- <input type="text" placeholder="Search" class="form-control"> -->
<?php echo Form::text('findaddress_new',isset($booking['address'])?$booking['address']:null,['class'=>'testing form-control typeahead','style'=>'width:100%important!;','id'=>'findaddress_new']); ?>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-item-header">
<div class="inner_accordion">
<label class="container_radio">
<!-- <input id="tab_1" type="radio" checked="checked" onclick="checkDiv()" name="radio"> -->
<!-- <span class="checkmark"></span> -->
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/date-time-icon.png')); ?>" alt=""> <span id="salonBookingDate"><?php echo e($salon_booking_date ?? 'Date'); ?></span> - <span id="salonBookingTime"><?php echo e($salon_booking_time ?? 'Time'); ?></span>
<!-- <span class="selection-timing">
<span>21/11/2022</span>
<span>08:00-13:00</span>
</span> -->
</label>
<div class="date_detials">
<!-- 9.00:<span>AM</span> -->
</div>
</div>
</div><!-- /.accordion-item-header -->
<div class="accordion-item-body">
<div class="accordion-item-body-content">
<div class="left_elements">
<div id="datepicker" class="calendar">
</div>
<div class="calendar-footer">
<div class="sec-foot-btn select-time-area">
<div class="form-group dd-flex">
<div class='input-group date' id='datetimepicker3'>
<input type='text' id="datetimeforsalon" class="form-control" onfocusout="myFunction()" value="<?php echo e($salon_booking_time); ?>"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-time"></span>
</span>
</div>
</div>
</div>
<label class="sec-foot-btn sec-anytime">
<input type="checkbox" name="test" value="small" onchange="selectAnyTime(this)" />
<span class="btn-any-time">anytime</span>
</label>
<label class="sec-foot-btn select-anydate-area">
<input type="checkbox" name="test" value="big" onchange="selectAnyDate(this)" />
<span class="btn-select-anydate">any date</span>
</label>
</div>
</div>
</div>
</div>
</div>
<div class="ac-item text-center button-foot">
<a class="button-gd" href="<?php echo e(route('booking.salon.owners')); ?>">“Reach for the Stars”</a>
</div>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="tab-top-right">
<div class="sec-search-venue">
<div class="form-group">
<input type="text" placeholder="SEARCH BY VENUE NAME" class="form-control">
<div class="btn-search-ang">
<i class="fa fa-search"></i>
</div>
</div>
</div>
</div>
</div>
<!-- <div class="tab-content">
</div> -->
</div>
</div>
<div class="selection-text">
<h3 class="treatmentTitle"><?php echo e($salon_booking_treatment_name ?? ''); ?></h3>
</div>
<div class="show-hide-area-top">
<a href="javascript:void(0)" class="btn-show-hide desktop-show-hide" data-map="hide"><i class="fa fa-close"></i> Hide map </a>
<a href="javascript:void(0)" class="btn-show-hide mobile-show-hide" data-map="show"><i class="fa fa-close"></i> Show map </a>
</div>
</div>
</section>
</div>
</div>
</div>
<div class="container">
<div class="header-block text-center">
<h2 class="salon_list_title"><?php if(isset($salon_users_count) && $salon_users_count > 0 ): ?>
<?php echo e($salon_users_count); ?> Stars offering <?php echo e($salon_booking_treatment_name ?? ''); ?> near you
<?php else: ?>
'Oops! This is not ideal…There are currently 0 stars available.'
<?php endif; ?>
</h2>
</div>
<div class="loader">
<span><i class='fa fa-spin fa-spinner fa-4x'></i></span>
</div>
<div class="row row-salon-listing-map">
<div class="col-md-6 col-sm-6 col-salon-left">
<div class="sec-salon-listing">
<?php if(isset($salon_users)): ?>
<?php foreach($salon_users as $salon): ?>
<div class="col-md-12 sec-salon-listing-item">
<div class="card-salon-service">
<div class="salon-slider">
<div class="owl-carousel owl-slider-cm owl-theme">
<?php if(isset($salon->salongallaryall) && count($salon->salongallaryall) !== 0): ?>
<?php foreach($salon->salongallaryall as $salonImage): ?>
<div class="item"><img src="<?php echo e(asset('/').$salonImage->path); ?>" alt=""></div>
<?php endforeach; ?>
<?php else: ?>
<div class="item"><img src="<?php echo e(asset('/themes/frontend_new/assets/img/online_coming_soon.jpg')); ?>"></div>
<?php endif; ?>
</div>
</div>
<div class="card-lower">
<div class="name-star">
<a href="<?php echo e(route('booking.salon.details', ['id' => $salon->id])); ?>" style="color: black;"><h2><?php echo e($salon->name); ?></h2></a>
<p class="d-flex">
<span class="rate">4.9</span>
<span class="star-wrap"><?php for($i = 1; $i <= 5; $i++) { ?>
<?php if($i <= $salon->salon_rating): ?>
<i class="fa-solid fa-star fa-2xl" style="color: #ffc800;"></i>
<?php else: ?>
<i class="fa-solid fa-star opacity_star fa-2xl" style="color: #f5f2b3;"></i>
<?php endif; ?>
<?php } ?>
</span>
</p>
</div>
<div style="clear:both;"></div>
<!--
<p><span class="rate">4.2</span><i class="fa fa-star" aria-hidden="true"></i> <i class="fa fa-star" aria-hidden="true"></i> <i class="fa fa-star" aria-hidden="true"></i> <i class="fa fa-star" aria-hidden="true"></i> <i class="fa fa-star" aria-hidden="true"></i><span class="reviews">477 reviews</span></p> -->
<?php if(isset($salon->address)): ?>
<?php foreach($salon->address as $address): ?>
<?php if($address->is_main == 1): ?>
<p><?php echo e($address->address. ', ' . $address->county . ', ' . $address->postcode); ?>
</p>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
<!-- <p>Golders Green, London</p> -->
<div class="d-flex open-close-timings">
<div class="left">
<p>
<span style="color:#198639;">open -</span> 09:00 AM - 07:00 AM
</p>
<p>Sunday - Saturday</p>
</div>
<div class="right">
<a href="<?php echo e(route('booking.salon.details', ['id' => $salon->id])); ?>" class="btn-venue">Go to venue</a>
</div>
</div>
<div class="card-lower-item-cover" style="display:none;">
<div class="card-lower-footer">
<a role="button" data-toggle="collapse" href="#collapseExample_<?php echo e($salon->id); ?>" aria-expanded="false" aria-controls="collapseExample" class="btn-venue btn-venue-top collapsed"> </a>
</div>
<div class="collapse" id="collapseExample_<?php echo e($salon->id); ?>">
<div class="well-text">
<div class="row">
<div class="col-md-12">
<div class="para-item">
<?php $about = !empty($salon->profile->about)?substr($salon->profile->about, 0, 250).'....':''; ?>
<p><?php echo e($about); ?></p>
</div>
</div>
<div class="col-md-12">
<div class="sd-timening">
<div class="sheduled-listing-main">
<?php if(isset($salon->workingdays)): ?>
<?php foreach($salon->workingdays as $weekday): ?>
<?php if($weekday->dayoff == 1): ?>
<div class="sheduled_inner">
<div class="sheduled_inner_block">
<div class="block_sheduled">
<div class="list_greedIcon set_closed">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle cx="178" cy="536" r="6" transform="translate(-172 -530)" fill="#3ba150"></circle></svg>
</div>
<div class="week_elemets">
<span class="set_closed"><?php echo e($weekday->name); ?></span>
</div>
</div>
</div>
<div class="sheduled_elemetslayer">
<span class="set_closed">closed</span>
</div>
</div>
<?php else: ?>
<div class="sheduled_inner">
<div class="sheduled_inner_block">
<div class="block_sheduled">
<div class="list_greedIcon ">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><circle cx="178" cy="536" r="6" transform="translate(-172 -530)" fill="#3ba150"></circle></svg>
</div>
<div class="week_elemets">
<span class="set_open"><?php echo e($weekday->name); ?></span>
</div>
</div>
</div>
<div class="sheduled_elemetslayer">
<span class="set_open"> <?php echo e($weekday->bo_start); ?> – <?php echo e($weekday->bo_end); ?></span>
</div>
</div>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="vanu-button">
<a href="<?php echo e(route('booking.salon.details', ['id' => $salon->id])); ?>" class="btn-venue">Go to venue</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
<div class="col-md-6 col-sm-6 col-salon-right">
<div id="map" class="map-main">
<!-- <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2482.749951672759!2d-0.15638264848554279!3d51.51780327953688!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x48761acd9f5b8ec9%3A0x554bd1ae86dd3835!2sGielly%20Green%20Boutique%20Salon%2C%2042-44%20George%20St%2C%20London%20W1U%207ES%2C%20UK!5e0!3m2!1sen!2sin!4v1668155567434!5m2!1sen!2sin" width="100%" height="100%" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe> -->
</div>
</div>
</div>
<div class="col-md-12 navigation_wrapper">
<nav aria-label="Page navigation">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li class="active"><a href="#">1</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<!-- <div class="container">
<div class="row custom-row">
<?php foreach($salon_users as $user): ?>
<a href="<?php echo e(route('booking.salon.details', ['id' => $user->id])); ?>">
<div class="col-three">
<div class="box-inner">
<div class="imgbox">
<img src="<?php echo e(asset('/themes/frontend_new/assets/img/placeholder.png')); ?>" alt="">
</div>
<h2><?php echo e($user->name); ?></h2>
</div>
</div>
</a>
<?php endforeach; ?>
</div>
</div> -->
</div>
<?php /*start footer*/ ?>
<?php echo $__env->make('frontend_new.partials.footer', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php /*end footer*/ ?>
<?php echo e(csrf_field()); ?>
<?php /*start core js*/ ?>
<?php echo $__env->make('frontend_new.partials.core-js', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<?php /*end core js*/ ?>
<!--Page JS-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
<script type="text/javascript" src="<?php echo e(asset('/themes/frontend_new/assets/plugins/owl.carousel/owl-carousel/owl.carousel.js')); ?>"></script>
<!-- <script type="text/javascript" src="<?php echo e(asset('/themes/frontend_new/assets/css/salon/js/jquery-3.3.1.min.js')); ?>"></script>
--><script type="text/javascript" src="<?php echo e(asset('/themes/frontend_new/assets/css/salon/js/calender.js')); ?>"></script>
<script type="text/javascript" src="<?php echo e(asset('/themes/frontend_new/assets/css/salon/js/custom.js')); ?>"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.min.js"
integrity="sha256-eTyxS0rkjpLEo16uXTS0uVCS4815lc40K2iVpWDvdSY=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(document).ready(function () {
$(".owl-treatments").owlCarousel({
autoPlay: 3000, //Set AutoPlay to 3 seconds
navigation: false,
pagination: true,
itemsCustom: [
[0, 2],
[450, 2],
[600, 3],
[700, 4],
[1000, 5],
[1200, 6],
[1400, 6],
[1600, 7]
],
});
$(".owl-slider-cm").owlCarousel({
navigation : false, // Show next and prev buttons
slideSpeed : 300,
paginationSpeed : 400,
items : 1,
itemsDesktop : false,
itemsDesktopSmall : false,
itemsTablet: false,
loop:true,
itemsMobile : false
});
$(".owl-social").owlCarousel({
autoPlay: 3000, //Set AutoPlay to 3 seconds
navigation: false,
pagination: true,
itemsCustom: [
[0, 2],
[450, 2],
[600, 3],
[700, 3],
[1000, 4],
[1200, 5],
[1400, 5],
[1600, 5]
],
});
$(".owl-event").owlCarousel({
autoPlay: 3000, //Set AutoPlay to 3 seconds
navigation: true,
pagination: false,
itemsCustom: [
[0, 1],
[450, 1],
[600, 3],
[700, 3],
[1000, 4],
[1200, 4],
[1400, 5],
[1600, 5]
],
});
});
</script>
<script>
$(document).ready(function () {
$('#select2-dropdown').select2();
$('#select2-dropdown').on('change', function (e) {
var data = $('#select2-dropdown').select2("val");
// @this.set('ottPlatform', data);
});
});
</script>
<script>
let ajaxUrl = "<?php echo route('booking.salon.setdate'); ?>";
let ajaxUrlTime = "<?php echo route('booking.salon.settime'); ?>";
</script>
<script>
function myFunction(){
var x = document.getElementById("datetimeforsalon");
let time = x.value;
$.ajax({
method: "GET",
url: ajaxUrlTime+"?time="+time,
cache: false,
dataType: "json",
})
.done(function(data) {
$("#salonBookingTime").html(data.time);
});
}
</script>
<script type="text/javascript">
$(document).ready(function () {
var CSRF_TOKEN = $('input[name="_token"]').val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': CSRF_TOKEN
}
});
});
</script>
<?php if(isset($salon_users) && count($salon_users) > 0): ?>
<script type="text/javascript">
function initMap() {
var input = document.getElementById('findaddress_new');
console.log("input", input);
var autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.setComponentRestrictions({'country': ['UK']});//{'country': ['it']}
google.maps.event.addListener(autocomplete, 'place_changed', function() {
var place = autocomplete.getPlace() ;
console.log(place);
var postalCode = '';
var postalCodeS = '';
var completeAddress = place.formatted_address;
console.log("address", completeAddress);
jQuery.each( place.address_components, function( index, value ){
console.log(value.types);
if(value.types[0]=='postal_code'){
console.log("inside if");
postalCode = value.long_name;
postalCodeS = value.short_name;
}
});
console.log("postal Code", postalCode);
//jQuery("#gaddress").text('Postal code : '+postalCode);
//jQuery("#gaddress_short").text('Short Postal code : '+postalCodeS);
//console.log(postalCode+" is the postal code");
var lat = place.geometry.location.lat();
var lng = place.geometry.location.lng();
//window.alert(JSON.stringify(place));
//window.alert(place.address_components[0].long_name); ------- long name of address
//window.alert(place.address_components[0].short_name); ------- short name of address
//jQuery("#final_address").val(place.formatted_address);
jQuery("#latitude").val(lat);
jQuery("#longitude").val(lng);
$.ajax({
method: "POST",
url: "<?php echo e(route('bookings.setpostcode')); ?>",
cache: false,
data: { postcode:postalCode, address: completeAddress },
dataType: "json",
})
.error(function(data){
var response = jQuery.parseJSON(data.responseText);
$('#modalInfo').find('.modal-title').text('ERROR');
$('#modalInfo').find('.modal-body').html("<h5 class='text-danger'>"+response.message+"</h5>");
$('#modalInfo').modal('show');
})
.done(function(data) {
// selecttype();
console.log(data);
$("#LocationPicker").html(completeAddress);
hideAll();
window.location.reload();
// load_hours(date);
// $('#modalInfo').find('.modal-title').text('SUCCESS');
// $('#modalInfo').find('.modal-body').html("<h5 class='text-success'>"+data.message+"</h5>");
// $('#modalInfo').modal('show');
});
});
const center = { lat: <?php echo e($salon_users[0]->lat); ?>, lng: <?php echo e($salon_users[0]->long); ?> };
const map = new google.maps.Map(document.getElementById("map"), {
zoom: 10,
center: center,
});
var locations = <?php print_r(json_encode($salon_users)) ?>;
var infoWindow;
var getBUrl = $(location).attr("origin");
$.each( locations, function( index, value ){
console.log(value);
// $.each(value.salongallaryall, function( i, image ) {
// var setImage = image.name;
// })
//therapist marker
infoTherapistWindow = new google.maps.InfoWindow({
content: `<div id="therapistInfoWindow_${index}"><a href="<?php echo e(URL('/booking/salon/details/${value.id}')); ?>"><img class="img-responsive" src="${getBUrl}${value.salongallaryall[0].path}" style="width:100px; height:auto"/><p style="text-align:center; font-weight:700; margin-top:10px;"> ${value.name} </p></a></div>`
});
console.log("lat:", value.lat, "lng:", value.long );
var salonMarker = new google.maps.Marker({
position: { lat: +value.lat, lng: +value.long },
map,
title: value.name,
infoWindow: infoTherapistWindow,
});
infoTherapistWindow.open(map, salonMarker);
google.maps.event.addListener(salonMarker,'click',function() {
// map.setZoom(9);
map.setCenter(salonMarker.getPosition());
console.log(value);
var URL = `<?php echo e(route('booking.salon.details', ['id' => ''])); ?>`
console.log(URL);
// window.location.href = URL;
});
});
window.initMap = initMap;
}
</script>
<?php endif; ?>
<script type="text/javascript">
function select_treatments(e){
console.log(e.value);
$.ajax({
method: "POST",
url: "<?php echo e(route('booking.salon.settreatments')); ?>",
cache: false,
data: {id: e.value},
dataType: "json",
})
.done(function(data) {
console.log(data);
$(".treatmentTitle").html(data.treatment.name);
hideAll();
window.location.reload();
});
}
function hideAll() {
const elements = document.getElementsByClassName("accordion-item-header");
for(var i = 0; i<elements.length; i++ ){
var classes = elements[i].classList;
if(classes.contains('active'))
{
elements[i].classList.remove("active");
}
}
const styles = document.getElementsByClassName("accordion-item-body");
for(var i = 0; i<styles.length; i++ ){
styles[i].style.removeProperty("max-height");
}
}
function selectAnyDate(value){
if(value.checked){
$.ajax({
method: "GET",
url: ajaxUrl+"?date=AnyDate",
cache: false,
dataType: "json",
})
.done(function(data) { $("#salonBookingDate").html(data.date); });
jQuery("#salonBookingDate").html("AnyDate");
} else {
jQuery("#salonBookingDate").html("Date");
}
}
function selectAnyTime(value){
if(value.checked){
jQuery("#salonBookingTime").html("AnyTime");
$.ajax({
method: "GET",
url: ajaxUrlTime+"?time=AnyTime",
cache: false,
dataType: "json",
})
.done(function(data) {
// window.location.reload();
$("#salonBookingTime").html(data.time);
});
} else {
jQuery("#salonBookingTime").html("Time");
}
}
$(document).ready(function() {
// if (!Modernizr.touch || !Modernizr.inputtypes.date) {
$('#datetimepicker3').each(function() {
var defaultVal = $(this).val();
console.log(this.name, defaultVal);
$(this).attr('type', 'text')
.val(moment(defaultVal).format('LT'))
.datetimepicker({
format: 'LT',
stepping: 30,
// widgetParent: ???,
widgetPositioning: {
horizontal: "auto",
vertical: "top"
}
});
});
// }
});
</script>
<script type="text/javascript">
jQuery('.desktop-show-hide').click(function () {
jQuery(".loader").show();
jQuery(".row-salon-listing-map").hide();
jQuery('body').toggleClass('show-hide-map');
if (jQuery(this).attr('data-map') != "hide"){
// jQuery(this).data("map","hide");
jQuery(this).attr('data-map','hide');
jQuery(this).html("<i class='fa fa-close' aria-hidden='true'></i> Hide Map")
}
else{
jQuery(this).attr('data-map','show');
jQuery(this).html("<i class='fa fa-map-marker' aria-hidden='true'></i> Show Map");
}
//reinitAllOwlCarousels();
setTimeout(function () {
jQuery(".loader").hide();
jQuery(".row-salon-listing-map").show();
}, 2500);
setTimeout(function () {
// Destroy and reinitialize each carousel
$('.owl-carousel').each(function() {
$(this).trigger('destroy.owl.carousel');
$(this).owlCarousel({
// Your desired configurations for each carousel
});
});
$('.owl-slider-cm').each(function() {
$(this).owlCarousel({
items: 1,
loop: true,
margin: 10,
responsiveClass: true,
responsive: {
0: {
items: 1,
nav: true,
loop: true // Add loop option for the responsive breakpoint
},
600: {
items: 1,
nav: false,
loop: true // Add loop option for the responsive breakpoint
},
1000: {
items: 1,
nav: true,
loop: true // Add loop option for the responsive breakpoint
}
}
});
// initOwlCarousels();
});
}, 2500);
// $(".owl-slider-cm").owlCarousel({
// navigation : false, // Show next and prev buttons
// slideSpeed : 300,
// paginationSpeed : 400,
// items : 1,
// itemsDesktop : false,
// itemsDesktopSmall : false,
// itemsTablet: false,
// itemsMobile : false
// });
});
// Function to reinitialize all Owl Carousels
function reinitAllOwlCarousels() {
$('.owl-carousel').each(function() {
$(this).trigger('destroy.owl.carousel').removeClass('owl-loaded');
$(this).find('.owl-stage-outer').children().unwrap();
$(this).removeClass('owl-carousel owl-loaded');
// initOwlCarousels();
});
}
jQuery('.mobile-show-hide').click(function () {
jQuery(".loader").show();
jQuery(".row-salon-listing-map").hide();
jQuery('body').toggleClass('show-hide-map-mobile');
if (jQuery(this).attr('data-map') != "hide"){
// jQuery(this).data("map","hide");
jQuery(this).attr('data-map','hide');
jQuery(this).html("<i class='fa fa-close' aria-hidden='true'></i> Hide Map")
}
else{
jQuery(this).attr('data-map','show');
jQuery(this).html("<i class='fa fa-map-marker' aria-hidden='true'></i> Show Map");
}
setTimeout(function () {
jQuery(".loader").hide();
jQuery(".row-salon-listing-map").show();
}, 2500);
});
</script>
<script>
const accordionItemHeaders = document.querySelectorAll(".accordion-item-header");
accordionItemHeaders.forEach(accordionItemHeader => {
accordionItemHeader.addEventListener("click", event => {
// Uncomment in case you only want to allow for the display of only one collapsed item at a time!
const currentlyActiveAccordionItemHeader = document.querySelector(".accordion-item-header.active");
if(currentlyActiveAccordionItemHeader && currentlyActiveAccordionItemHeader!==accordionItemHeader) {
currentlyActiveAccordionItemHeader.classList.toggle("active");
currentlyActiveAccordionItemHeader.nextElementSibling.style.maxHeight = 0;
}
accordionItemHeader.classList.toggle("active");
const accordionItemBody = accordionItemHeader.nextElementSibling;
if (accordionItemHeader.classList.contains("active")) {
accordionItemBody.style.maxHeight = accordionItemBody.scrollHeight + "px";
}
else {
accordionItemBody.style.maxHeight = 0;
}
});
});
</script>
<script type="text/javascript">
$(function () {
$('#datetimepicker3').datetimepicker({
format: 'LT',
stepping: 30,
widgetPositioning: {
horizontal: "auto",
vertical: "top"
}
});
});
</script>
<style type="text/css">
.loader{
display: none;
height: 100px;
color: #000;
text-align: center;
}
</style>
<script async defer src='https://maps.googleapis.com/maps/api/js?key=<?php echo e(config("googlemaps.key")); ?>&libraries=places&callback=initMap'></script>
<?php echo $__env->yieldContent('custom_scripts'); ?>
</body>
</html>