@extends('layouts.member-login')
@section('title', 'My Colleagues Profile')
@section('page_title', 'ColleaguesProfile')

@section('page_level_css')
<link href="{{ asset('assets/vendors/general/select2/dist/css/select2.css') }}" rel="stylesheet" type="text/css" />
<style>
    .dz-image img {
        position: relative;
        height: 100%;
    }
</style>
<link href="{{asset('assets/vendors/general/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css')}}" rel="stylesheet" type="text/css" />
@endsection

@section('content')
@php
$textLength = 250;
@endphp

<div class="kt-content kt-grid__item kt-grid__item--fluid kt-grid kt-grid--hor" id="kt_content">
    <!-- begin:: Content -->
    <div class="kt-container kt-container--fluid kt-grid__item kt-grid__item--fluid">
        <!-- begin:: Page -->
        <div class="kt-grid kt-grid--ver kt-grid--root">
            <div class="kt-grid kt-grid--hor kt-grid--root">

                @include('member.include.user-info-box')

                <div class="mt-4">
                    <div class="my-profile-cms-content">
                        <div class="row">

                            @include('member.include.2026-pn')

                            <div class="col-xl-9 col-lg-9 col-md-7 col-sm-12">
                                <div class="grey-bg-wrap post-section">
                                    <div class="mb-4">
                                        <div class="title-wrapper mb-4">
                                            <h2 class="secondary-title text-capitalize text-white mb-0">Close Colleagues</h2>
                                        </div>
                                        <div class="main-box-white mb-4">
                                            <div class="mb-5 position-relative">
                                                <h2 class="secondary-title text-capitalize mb-2">What's a Close Colleague?</h2>
                                                <label class="close-colleagues-paragraph">
                                                    A Close Colleague is someone that you know in "real life" or someone you have worked with in the past (not someone that you just met online). 
                                                    This is an important distinction to make on LabPair, as "Close Colleagues" serve as your inner social circle.
                                                    For example, you can choose to <span class="underline">share your posts with your Close Colleagues first</span> before posting publicly on LabPair. 
                                                    A successful collaboration can depend on compatible personalities and professional styles just as much as research capability. 
                                                    You can <span class="underline">contact mutual Close Colleagues to learn more about potential collaborators</span> before extending an official offer of collaboration.
                                                </label>
                                            </div>

                                            <div class="row">
                                                <div class="col-lg-12">
                                                    <div class="data-right-content">
                                                        <div class="h3-wrap mb-2">
                                                            <h3>Close Colleague Requests ({{$colleaguesDataCount}})</h3>
                                                        </div>

                                                        @foreach ($colleaguesPendingData as $data)
                                                        <div class="row close-colleague-friend mb-4">
                                                            <div class="col-lg-2">
                                                                <div class="profile-image">
                                                                    <a href="{{getMURL('view-profile/' . $data->other_profile->id)}}" target="_blank">
                                                                        <img src="{{getImage($data->other_profile->image) ?? asset('assets/media/extra/neutron-star.png')}}">
                                                                    </a>
                                                                </div>
                                                            </div>
                                                            <div class="col-lg-6">
                                                                <label class="w-100 user-name">{{$data->other_profile->full_name}}</label>

                                                                @if($data->other_profile->role == 'General' && isset($data->other_profile->investigator->status) && $data->other_profile->investigator->status == 'Active')
                                                                <label class="w-100 laboratory-name">Works in the laboratory of
                                                                    <a href="{{getMURL('view-profile/' . $data->other_profile->investigator->id)}}" target="_blank" class="investigator-name">{{$data->other_profile->investigator->name}} {{$data->other_profile->investigator->last_name}}</a>
                                                                </label>
                                                                @else
                                                                <label class="w-100 laboratory-name">Principal Investigator</label>
                                                                @endif
                                                                <label class="w-100 position-name">{{$data->other_profile->position}}</label>
                                                                <label class="w-100 research-name">{{$data->other_profile->research_name}}</label>
                                                            </div>
                                                            <div class="col-lg-2">
                                                                <button type="button" class="primary-btn d-block text-center disabled" id="IgnoreCloseColleaguesRequest" data-status="Reject" data-type="UserColleague" data-request-id="{{$data->id}}">Ignore</button>
                                                            </div>
                                                            <div class="col-lg-2">
                                                                <button type="button" class="primary-btn d-block text-center" id="AcceptCloseColleaguesRequest" data-status="Accept" data-type="UserColleague" data-request-id="{{$data->id}}">Accept</button>
                                                            </div>
                                                        </div>
                                                        @endforeach

                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row mt-5 pt-3">
                                                <div class="col-lg-12">
                                                    <div class="data-right-content">
                                                        <div class="h3-wrap mb-2">
                                                            <h3>Potential Close Colleagues ({{$potentialDataCount}})</h3>
                                                        </div>

                                                        @foreach ($potentialPendingData as $data)
                                                        <div class="row close-colleague-friend mb-4 align-items-center">
                                                            <div class="col-lg-2">
                                                                <div class="profile-image">
                                                                    <a href="{{getMURL('view-profile/' . $data->other_profile->id)}}" target="_blank">
                                                                        <img src="{{getImage($data->other_profile->image) ?? asset('assets/media/extra/neutron-star.png')}}">
                                                                    </a>
                                                                </div>
                                                            </div>
                                                            <div class="col-lg-6">
                                                                <label class="w-100 user-name mb-0">{{$data->other_profile->full_name}}</label>

                                                                @if($data->other_profile->role == 'General' && isset($data->other_profile->investigator->status) && $data->other_profile->investigator->status == 'Active')
                                                                <label class="w-100 laboratory-name mb-0">Works in the laboratory of
                                                                    <a href="{{getMURL('view-profile/' . $data->other_profile->investigator->id)}}" target="_blank" class="investigator-name">{{$data->other_profile->investigator->name}} {{$data->other_profile->investigator->last_name}}</a>
                                                                </label>
                                                                @else
                                                                <label class="w-100 laboratory-name mb-0">Principal Investigator</label>
                                                                @endif
                                                                <label class="w-100 position-name mb-0">{{$data->other_profile->position}}</label>
                                                                <label class="w-100 research-name mb-0">{{$data->other_profile->research_name}}</label>
                                                            </div>
                                                            <div class="col-lg-2">
                                                                <button type="button" class="primary-btn d-block text-center disabled" id="IgnoreCloseColleaguesRequest" data-status="Reject" data-type="ColleaguePotential" data-request-id="{{$data->id}}">Ignore</button>
                                                            </div>
                                                            <div class="col-lg-2">
                                                                <button type="button" class="primary-btn d-block text-center" id="AcceptCloseColleaguesRequest" data-status="Accept" data-type="ColleaguePotential" data-request-id="{{$data->id}}">Request</button>
                                                            </div>
                                                        </div>
                                                        @endforeach

                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end:: Content -->
</div>

<div class="modal post-section" id="viewWishlistSocialCounter">
    <div class="modal-dialog edit-popup">
        <div class="modal-content">

            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title">Responses</h4>
                <button type="button" class="btn-close close" data-dismiss="modal"></button>
            </div>

            <!-- Modal body -->
            <div class="modal-body">

                <div class="col-12 p-0">

                    <ul class="filter-ul mt-3 mb-0 ml-0 mr-0 p-0 nav nav-tabs social-actions" role="tablist">

                        <li class="nav-item" id="wishlistTabLike">
                            <a class="nav-link wishlistShowSocialCounter wishlistLikeCount" href="#wishlistAllData" title="filter" role="tab" data-toggle="tab" data-id="" data-type="Like">
                                <div class="filter-li text-center">
                                    <i class="fa fa-thumbs-up"><sub class="socialCountClass">0</sub></i>
                                    <span class="content">Likes</span>
                                </div>
                            </a>
                        </li>

                    </ul>
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="wishlistAllData">
                            <div class="filter-result"></div>
                        </div>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>
</div>

<div class="">
    <div class="modal fade" id="removeSavedModal" tabindex="-1" role="dialog" aria-labelledby="removeSavedModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title text-white text-capitalize text-left">Remove Saved Item</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <input type="hidden" id="document_id">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body text-center">
                    <p>Are you sure you want to remove this item from your Saved Items?</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="primary-btn disabled" data-dismiss="modal">Cancel</button>
                    <button type="button" class="primary-btn" data-dismiss="modal" id="confirmRemovedSavedItemPost">Remove</button>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="add-gene-list-modal">
    <div class="modal fade" id="sharePostModal" tabindex="-1" role="dialog" aria-labelledby="closeModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document" style="min-width:0px !important">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title text-white text-capitalize text-left" id="share_title">Share Profile</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="post-sub-content-wrapper">
                        <p>Enter email addresses of individuals to send << item>> to (One per line).</p>
                        <div class="row mb-3">
                            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                                <textarea class="check_value_share_post form-control" name="multiple_email" id="multiple_email" rows="6"></textarea>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="primary-btn disabled" data-dismiss="modal" id="AddGeneListCloseButton">Cancel</button>
                    <button type="button" title="Save" id="sendRequestSharePost" class="primary-btn text-center d-block disabled" disabled="disabled">Send</button>
                </div>
            </div>
        </div>
    </div>
</div>

@include('member.include.tooltip-modal-box')
<!-- Modal-->

@endsection

@section('page_level_js')
<script src="//cdnjs.cloudflare.com/ajax/libs/dragula/3.7.2/dragula.js"></script>
<script src="{{ asset('assets/vendors/general/select2/dist/js/select2.full.js') }}" type="text/javascript"></script>
<script src="{{asset('assets/vendors/general/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js')}}" type="text/javascript"></script>
<script src="{{asset('assets/vendors/custom/js/vendors/bootstrap-datepicker.init.js')}}" type="text/javascript"></script>
@endsection

@push('footerscript')
<script type="text/javascript">
    $(document).on('click', '.viewCollapseComment', function() {
        $(this).hide();
        $(this).parents('.postMessageBox').find('.viewMoreComment').show();

        var currentMessageCount = parseInt($(this).attr('data-current-comment'));
        var totalMessageCount = parseInt($(this).attr('data-total-comment'));
        if (currentMessageCount >= totalMessageCount) {
            $(this).parents('.postMessageBox').find('.viewCollapseComment,.viewMoreComment').hide();
            $(this).parents('.postMessageBox').find('.hideCollapseComment').show();
            // console.log('Hide show more button and show collapse');
        }
    });
    $(document).on('click', '.hideCollapseComment', function() {
        $(this).hide();
        $(this).parents('.postMessageBox').find('.viewCollapseComment').show();
        $("#viewComments" + $(this).attr('data-post-id')).removeClass('show');
    });

    $(document).on('click', '.viewMoreComment', function() {
        var currentMessageCount = parseInt($(this).attr('data-current-comment'));
        var totalMessageCount = parseInt($(this).attr('data-total-comment'));
        var postId = $(this).attr('data-post-id');

        currentMessageCount += 3;
        if (currentMessageCount >= totalMessageCount) {
            $(this).hide();
            $(this).parents('.postMessageBox').find('.hideCollapseComment').show();
        }
        $(this).parents('.postMessageBox').find('.viewCollapseComment,.hideCollapseComment,.viewMoreComment').attr('data-current-comment', currentMessageCount);
        //viewCollapseComment
        var removeMessageIdentifire = '#viewComments' + postId + ' .mainMessage.singleMessageClass:lt(' + currentMessageCount + ')';
        $(removeMessageIdentifire).removeClass('hideMessage');
    });

    // Hide the extra content initially
    $('.read-more-content').addClass('hide');
    $('.read-more-show, .read-more-hide').removeClass('hide');
    // Set up the toggle effect:
    $(document).on('click', '.read-more-show', function(e) {
        $(this).next('.read-more-content').removeClass('hide');
        $(this).addClass('hide');
        e.preventDefault();
    });
    $(document).on('click', '.read-more-hide', function(e) {
        $(this).parent('.read-more-content').addClass('hide');
        var moreid = $(this).attr("more-id");
        $('.read-more-show#' + moreid).removeClass('hide');
        e.preventDefault();
    });


    //Like & Save Button
    $(document).on('click', '.wishlistPostLikeAction', function() {
        let $this = $(this);

        var formData = {};
        formData.post_id = $(this).attr('data-id');
        formData.type = "Like"; //Like
        formData.action = $(this).attr('data-action'); //Save/Unsave

        $.ajax({
            url: "{{getMURL('ajax/post-social-action')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {

                    var addClass = '',
                        removeClass = '';
                    addClass = (data.raction == 'Save') ? 'far' : 'fa';
                    removeClass = (data.raction == 'Save') ? 'fa' : 'far';
                    $this.attr('data-action', data.raction);
                    $this.find('i').removeClass(removeClass);
                    $this.find('i').addClass(addClass);
                    //showToastrSuccess(data.message, 'Post Action');
                } else {
                    showToastrError(data.message, 'Post Action');
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', 'Post Action');
            }
        });
    });

    $(document).on('click', '.removedSavedItemPost,.removedSavedItemProfile', function() {
        $('#confirmRemovedSavedItemPost').attr('data-id', $(this).attr('data-id'));
        $('#removeSavedModal').modal('show');
    });


    $(document).on('click', '#confirmRemovedSavedItemPost', function() {
        let $this = $(this);

        var formData = {};
        formData.remove_id = $(this).attr('data-id');

        $.ajax({
            url: "{{getMURL('ajax/remove-saved-social-action')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {

                    $('#SavedItemMainDiv' + formData.remove_id).remove();
                    showToastrSuccess(data.message, 'Saved Item Action');
                } else {
                    showToastrError(data.message, 'Saved Item Action');
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', 'Saved Item Action');
            }
        });
    });

    //Like & Save Button

    //Social model
    var baseProfileURL = "{{getURL('public/storage/')}}";
    var noProfileImage = "{{asset('assets/media/extra/neutron-star.png')}}";

    //View comment related
    $(document).on('click', '.ShowHideMessageBox', function() {
        var showText = $(this).attr('data-text');
        var currentText = $(this).html();
        $(this).html(showText);
        $(this).attr('data-text', currentText);
    });
    $(document).on('click', '.replyClass', function() {
        $(this).parents('.comment-form').find('.inputTextMessage').attr('placeholder', 'Add a reply...');
        $(this).parents('.comment-form').find('.sendWishlistMessage').attr('data-parent', $(this).attr('data-id'));
    });

    $(document).on('click', '.sendWishlistMessage', function() {
        let $this = $(this);
        var formData = {};
        formData.message = $this.parents('.message').find('.inputTextMessage').val();
        formData.post_id = $(this).attr('data-id');
        formData.parent_id = $(this).attr('data-parent');

        $.ajax({
            url: "{{getMURL('ajax/send-post-message')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {
                    showToastrSuccess(data.message, 'Send Message');
                    $this.parents('.message').find('.inputTextMessage').attr('placeholder', 'Add a comment...');
                    $this.attr('data-parent', '');
                } else {
                    showToastrError(data.message, 'Send Message');
                }
                $this.parents('.message').find('.inputTextMessage').val('');
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', 'Send Message');
            }
        });
    });


    $(document).on('click', '.likeMessage', function() {
        let $this = $(this);

        var formData = {};
        formData.message_id = $(this).attr('data-id');
        formData.post_id = $(this).attr('data-post-id');
        formData.action = $(this).attr('data-action');

        $.ajax({
            url: "{{getMURL('ajax/post-message-like')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                $this.attr('data-action', data.raction);
                if (data.raction == 'Like') {
                    $this.find('i').removeClass('fa');
                    $this.find('i').addClass('far');
                } else {
                    $this.find('i').removeClass('far');
                    $this.find('i').addClass('fa');
                }
                if (data.status != 1) {
                    showToastrError(data.message, 'Like Message');
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', 'Like Message');
            }
        });
    });
    $(document).on('click', '.SaveUserProfile', function() {
        var formData = {};
        formData.user_id = $(this).attr('data-id');
        formData.action = "Unsave";

        let $this = $(this);

        $.ajax({
            url: "{{getMURL('ajax/save-user-profile')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {
                    showToastrSuccess(data.message, title);

                } else {
                    showToastrError(data.message, title);
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', title);
            }
        });
    });

    $(document).on('click', '.LikeUserProfile', function() {
        var formData = {};
        formData.user_id = $(this).attr('data-id');
        formData.action = $(this).attr('data-action');

        let $this = $(this);

        if (formData.action == 'Like') {
            var title = "Like Profile";
        } else {
            var title = "Unlike Profile";
        }
        $.ajax({
            url: "{{getMURL('ajax/like-user-profile')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {
                    showToastrSuccess(data.message, title);
                    $this.attr('data-action', data.raction);
                    if (data.raction == 'Like') {
                        $this.find('i').removeClass('fa');
                        $this.find('i').addClass('far');
                    } else {
                        $this.find('i').removeClass('far');
                        $this.find('i').addClass('fa');
                    }
                } else {
                    showToastrError(data.message, title);
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', title);
            }
        });
    });

    $(document).on('click', '.wishlistPostSaveAction', function() {
        let $this = $(this);

        var formData = {};
        formData.post_id = $(this).attr('data-id');
        formData.type = $(this).attr('data-type'); //Save,UserSave,AdsSave' (Call GoTo OtherProfileManagerController@postSocialAction)
        formData.action = $(this).attr('data-action'); //Save/Unsave

        $.ajax({
            url: "{{getMURL('ajax/post-social-action')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: formData,
            success: function(data) {
                if (data.status == 1) {

                    var addClass = '',
                        removeClass = '';
                    addClass = (data.raction == 'Save') ? 'far' : 'fas';
                    removeClass = (data.raction == 'Save') ? 'fas' : 'far';
                    $this.attr('data-action', data.raction);
                    $this.find('i').removeClass(removeClass);
                    $this.find('i').addClass(addClass);
                } else {
                    showToastrError(data.message, 'Post Action');
                }
            },
            error: function(errorThrown) {
                showToastrError('Something went wrong, Please try again later.', 'Post Action');
            }
        });
    });
    $(document).on("click", ".sharePostProfile", function() {
        var type = $(this).attr("data-type");
        $('#sendRequestSharePost').attr('data-id', $(this).attr("data-id"));
        $('#sendRequestSharePost').attr('data-type', type);
        //share_title
        if (type == "Post") {
            $("#share_title").html("Share Post")
            $("#sharePostModal").modal("show");
        } else if (type == "User") {
            $("#share_title").html("Share Profile")
            $("#sharePostModal").modal("show");
        } else {
            if (type.length > 0) {
                $("#share_title").html("Share " + type);
                $("#sharePostModal").modal("show");
            } else {
                $("#share_title").html("")
            }
        }
    });

    $("#multiple_email").on("keyup", function() {
        var link_text = $(this).val();
        var flag = true
        if (link_text == "") {
            flag = false;
        }
        if (flag) {
            var array = link_text.split(/\r?\n/);
            $.each(array, function(i) {
                if (!ValidateEmail($.trim(array[i])) && array[i] != "") {
                    flag = false;
                }
            });
        }
        checkSharePostButton(flag);
    });

    function checkSharePostButton(flag) {
        if (flag) {
            $("#sendRequestSharePost").removeAttr('disabled');
            $("#sendRequestSharePost").removeClass("disabled");
        } else {
            $("#sendRequestSharePost").attr('disabled', 'disabled');
            $("#sendRequestSharePost").addClass("disabled");
        }
    }

    $("#sendRequestSharePost").on("click", function(e) {
        var ID = $(this).attr('data-id');
        var type = $(this).attr('data-type');
        shareProfile(ID);
    });

    function shareProfile(userID) {
        $.ajax({
            url: "{{getURL('ajax/share-profile')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: {
                'user_id': userID,
                'multiple_email': $("#multiple_email").val(),
                'split_by_enter': 1
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#sharePostModal").modal("toggle");
                    $("#multiple_email").val('');
                    checkSharePostButton(false);
                } else {
                    showToastrError(data.message, "Error");
                }
            },
            error: function(errorThrown) {

            }
        });
    }

    $(document).on("click", "#IgnoreCloseColleaguesRequest,#AcceptCloseColleaguesRequest", function() {
        var status = $(this).attr("data-status");
        var type = $(this).attr("data-type");
        var request_id = $(this).attr("data-request-id");

        $.ajax({
            url: "{{getURL('ajax/action-close-colleagues-request')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: {
                'status': status,
                'type': type,
                'request_id': request_id
            },
            success: function(data) {
                if (data.status == 1) {
                    window.location.reload();
                } else {
                    showToastrError(data.message, "Error");
                }
            },
            error: function(errorThrown) {

            }
        });
    });
</script>
@endpush