<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" type="image/png" sizes="16x16" href="<?php echo e(asset('images/favicon.png')); ?>">

    <link href="<?php echo e(asset('css/bootstrap.min.css')); ?>" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap"
          rel="stylesheet">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link href="<?php echo e(asset('css/custom.css')); ?>" rel="stylesheet">
    <link href="<?php echo e(asset('css/style.css')); ?>" rel="stylesheet">
    <link href="<?php echo e(asset('css/blue.css')); ?>" id="theme" rel="stylesheet">
    <link rel="stylesheet" href="<?php echo e(asset('css/swiper-bundle.min.css')); ?>">

    <!-- AOS Animation -->
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css"
          integrity="sha512-3pIirOrwegjM6erE5gPSwkUzO+3cTjpnV9lexlNZqvupR64iZBnOOTiiLPb9M36zpMScbmUNIcHUqKD47M719g=="
          crossorigin="anonymous" referrerpolicy="no-referrer"/>

    <!-- custom css landing page -->
    <link rel="stylesheet" href="<?php echo e(asset('css/mystyle.css')); ?>">

    
    <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
    <link rel="stylesheet" href="/resources/demos/style.css">
</head>
<style>
    .ui-autocomplete-category {
        font-weight: bold;
        padding: .2em .4em;
        margin: .8em 0 .2em;
        line-height: 1.5;
    }
</style>
<header class="topbar mainHead">
    <div class="mblNavbar">
        <a class="navbar-brand mblshow" href="<?php echo e(route('dashboard.home')); ?>">

            
            
            

            <img src="<?php echo e(asset('images/tmLogo.gif')); ?>" style="width: 100%" alt="Loading...">


            <!--            <img src="images/Global-Logo.gif" alt="homepage" class="dark-logo mainLogo"/>-->
        </a>
        <a class="nav-link nav-toggler hidden-md-up text-muted waves-effect waves-dark mblshow"
           href="javascript:void(0)"><i class="mdi mdi-menu"></i></a>
    </div>
    <nav class="navbar top-navbar navbar-expand-md navbar-light">


        <a class="navbar-brand" href="<?php echo e(route('front.index')); ?>">
            
            <img src="<?php echo e(asset('images/tmLogo.gif')); ?>" class="dark-logo mainLogo" alt="Loading...">
        </a>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">

            <ul class="navbar-nav srchNav mr-auto mt-md-0">
                <li class="nav-item"><a class="nav-link nav-toggler hidden-md-up text-muted waves-effect waves-dark"
                                        href="javascript:void(0)"><i class="mdi mdi-menu"></i></a></li>
                <!-- This is  -->
                <li class="nav-item srchNv">
                    <div class="input-group mb-2">
                        <div class="input-group-prepend">
                        </div>

                        <div class="input-group">
                            <input id="search" name="search" class="form-control" id="header-search"
                                   placeholder="Search">
                            <div class="input-group-append">
                                <button id="search-button" class="input-group-text header-search-icon ml-1"><i
                                        class="fas fa-search"></i></button>
                            </div>
                        </div>

                    </div>
                </li>
            </ul>

            <ul class="navbar-nav my-lg-0">

                <li class="nav-item">
                    <a class="nav-link dropdown-toggle proLink waves-effect waves-dark "
                       href="<?php echo e(route('dashboard.home')); ?>">
                        <img src="<?php echo e(asset('images/icon/home-icon-upper.png')); ?>" alt="user" class="profile-pic"/>
                        Home</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link dropdown-toggle proLink waves-effect waves-dark "
                       href="<?php echo e(route('dashboard.notification')); ?>">

                        <img src="<?php echo e(asset('images/icon/notify-icon.png')); ?>" alt="user" class="profile-pic"/>

                        <?php if($userNotification->count() == 0): ?>
                            <span class="custom-badge">0</span>
                        <?php else: ?>
                            <span class="badge badge-danger" style="position: relative; top: -8px; right: 5px;"
                                  id="notificationCount">
                        <?php echo e($userNotification->count() != 0 ? $userNotification->count() : 0); ?>

                        </span>
                        <?php endif; ?>
                        <span>Notifications</span></a>
                </li>

                <li class="nav-item">
                    <a class="nav-link dropdown-toggle proLink waves-effect waves-dark "
                       href="<?php echo e(route('dashboard.profile')); ?>">
                        <img src="<?php echo e(asset('images/icon/setting-icon.png')); ?>" alt="user" class="profile-pic"/>
                        <span>Account Setting</span>
                    </a>
                </li>
                <li class="nav-item">
                    <form id="logout-form" action="<?php echo e(route('logout')); ?>" method="POST">
                        <?php echo csrf_field(); ?>
                        <a class="nav-link dropdown-toggle proLink waves-effect waves-dark" href="#"
                           onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                            <img src="<?php echo e(asset('images/login.png')); ?>" alt="user" class="profile-pic login"/>
                            <span style="color: white">Logout</span>
                        </a>
                    </form>
                </li>

            </ul>
        </div>
    </nav>
</header>

<aside class="left-sidebar sdBar">
    <div class="scroll-sidebar pt-3">
        <nav class="sidebar-nav">
            <ul id="sidebarnav" class="in">
                <li>
                    <a href="<?php echo e(route('dashboard.home')); ?>"><img src="<?php echo e(asset('images/icon/home-icon.png')); ?>" alt="">
                        <span>Home</span></a>
                </li>

                <li>
                    <a class="has-arrow waves-effect waves-dark" id="collapse" aria-expanded="false"
                       data-toggle="collapse">
                        <img src="<?php echo e(asset('images/icon/essential-icon.png')); ?>">
                        <span>Essential Categories</span>
                    </a>
                    <ul aria-expanded="false" class="collapse listone" id="collapse1">
                        <?php $__currentLoopData = $selectedCategories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $category): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <li>
                                <a href="<?php echo e(route('dashboard.category', $category->id)); ?>">
                                    <span><?php echo e($category->categories); ?></span>
                                </a>
                            </li>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </ul>
                </li>


                <li>
                    <a class="has-arrow waves-effect waves-dark" id="collapse2" aria-expanded="false"
                       data-toggle="collapse">
                        <img src="<?php echo e(asset('images/icon/group-icon.png')); ?>">
                        <span>Friends</span>
                    </a>
                    <ul aria-expanded="false" class="collapse listone" id="collapse2-list">
                        <li>
                            <a class="dropdown-item" href="<?php echo e(route('dashboard.friends')); ?>">Friends</a>
                        </li>
                        <li>
                            <a class="dropdown-item" href="<?php echo e(route('dashboard.make.friends')); ?>">Add Friends</a>
                        </li>
                        <li>
                            <a class="dropdown-item" href="<?php echo e(route('dashboard.confirm.requests')); ?>">Friend
                                Requests</a>
                        </li>
                        <li>
                            <a class="dropdown-item" href="<?php echo e(route('dashboard.pending.request')); ?>">Pending
                                Requests</a>
                        </li>
                        <li>
                            <a class="dropdown-item" href="<?php echo e(route('dashboard.cancelled.request')); ?>">Cancelled
                                Requests</a>
                        </li>
                    </ul>
                </li>

                
                
                
                
                
                
                
                
                
                
                
                
                
                
                
                
                

                <li>
                    <a href="<?php echo e(route('dashboard.messenger')); ?>"><img src="<?php echo e(asset('images/icon/messenger-icon.png')); ?>">
                        <span>GMC Communicator</span></a>
                </li>
                
                
                
                

            </ul>
        </nav>
        <footer class="footer footSide">
            <nav class="extraLinks">
                <li><a href="<?php echo e(route('dashboard.terms')); ?>">Terms of Use</a></li>
                <li><a href="<?php echo e(route('dashboard.privacy')); ?>">Privacy Policy</a></li>
            </nav>

            <p>© 2023 Global Man Cave</p>
        </footer>

    </div>

</aside>

<?php echo $__env->yieldContent('content'); ?>

<script src="<?php echo e(asset('js/jquery.min.js')); ?>"></script>
<script src="<?php echo e(asset('js/popper.min.js')); ?>"></script>
<script src="<?php echo e(asset('js/bootstrap.min.js')); ?>"></script>
<script src="<?php echo e(asset('js/jquery.slimscroll.js')); ?>"></script>
<script src="<?php echo e(asset('js/waves.js')); ?>"></script>
<script src="<?php echo e(asset('js/sticky-kit.min.js')); ?>"></script>
<script src="<?php echo e(asset('js/custom.js')); ?>"></script>
<script src="<?php echo e(asset('js/fontawesome.js')); ?>"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"
        integrity="sha512-VEd+nq25CkR676O+pLBnDW09R7VQX9Mdiij052gVCp5yVH3jGtH70Ho/UUv4mJDsEdTvqRCFZg0NKGiojGnUCw=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<?php if(session()->has('success')): ?>
    <script type="text/javascript">  toastr.success('<?php echo e(session('success')); ?>');</script>
    <?php session()->remove('success'); ?>
<?php endif; ?>
<?php if(session()->has('error')): ?>
    <script type="text/javascript"> toastr.error('<?php echo e(session('error')); ?>');</script>
<?php endif; ?>



<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<script>
    var data = [];

    // Fetch data using AJAX on page load
    $(document).ready(function () {
        $.ajax({
            url: '<?php echo e(route("auto-complete")); ?>',
            method: 'GET',
            dataType: 'json',
            success: function (responseData) {
                // Clear existing data
                data = [];

                // Append additional data to the existing data
                const additionalData = [
                    {label: "Home", url: "home"},
                    {label: "Terms of use", url: "terms-of-us"},
                    {label: "Privacy policy", url: "privacy-policy"},
                    {label: "Gmc communicator", url: "messenger"},
                    {label: "Notifications", url: "notification"},
                    {label: "Settings", url: "profile"},
                ];

                data = responseData.concat(additionalData);

                // Set the source after data is available
                setAutocompleteSource();
            },
            error: function (error) {
                console.log('Error fetching autocomplete data');
                console.error(error);
            }
        });
    });

    // Function to set the autocomplete source
    function setAutocompleteSource() {
        $.widget("custom.catcomplete", $.ui.autocomplete, {});

        $("#search").catcomplete({
            delay: 0,
            source: data,
            select: function (event, ui) {
                // Your select logic here
            }
        });
    }

    // Use the fetched data for autocomplete
    $(function () {
        $("#search-button").on("click", function () {
            var selectedCategory = $("#search").val();
            var urlName = null;

            data.forEach(function (item) {
                if (item.label === selectedCategory) {
                    urlName = item.url;
                }
            });

            if (urlName !== null) {
                var newUrl = '<?php echo e(env("APP_URL")); ?>/' + urlName;
                window.location.href = newUrl;
            }
        });
    });
</script>



<script>
    document.addEventListener("DOMContentLoaded", function () {
        document.getElementById("header-search").addEventListener("keypress", function (event) {
            if (event.key === "Enter") {
                event.preventDefault();
                document.getElementById("searchForm").submit();
            }
        });
    });

    $(document).ready(function () {
        // Toggle collapse for the first list
        $('#collapse').on('click', function () {
            console.log("In")
            $('#collapse').attr('aria-expanded', function (i, attr) {
                return attr === 'true' ? 'false' : 'true';
            });
            $('#collapse1').toggleClass('show');
        });

        // Toggle collapse for the second list
        $('#collapse2').on('click', function () {
            $('#collapse2').attr('aria-expanded', function (i, attr) {
                return attr === 'true' ? 'false' : 'true';
            });
            $('#collapse2-list').toggleClass('show');
        });
    });

</script>

</html>
<?php /**PATH /home/servicedemoweb/public_html/global-man-cave/resources/views/layout/dashboard-app.blade.php ENDPATH**/ ?>