@extends('layouts.app')
@section('title', 'Brands | Products')
@section('extrastyles')
    <style>
        .select2-container {
            z-index: 99999;
        }
        .recipeFile{
            opacity: 0;
            overflow: hidden;
            position: absolute;
            cursor: pointer !important;
        }
        .hide {
            display: none !important;
        }
    </style>
@endsection

@section('content')
    <h2>
        <a href="{{application_url('energized-health/recipe')}}">
            <i aria-hidden="true" class="fa fa-arrow-left" style="cursor: pointer;" tabindex="0"></i>
        </a>
    </h2>
    <div class="studio98_websters">
        <div class="ibox float-e-margins">
            <div class="ibox-title2">
                <h5>{{ $recipe->title }}</h5>
                <div class="pull-right">
                </div>
            </div>
            @include('flash::message')
            <div class="clearfix"></div>
            @foreach($comments as $comment)
                <div class="card mb-2 mt-1" style="width: 100%" id="recipe-comment-{{$comment->id}}">
                    <div class="card-body">
                        <div class="d-flex flex-row " style="justify-content: space-between">
                            <strong class="text-primary d-flex flex-row" style="color: #00a9e7!important;">{{ $comment->user->first_name.' '.$comment->user->last_name }}</strong>
                            <div class="actions">
                                <a class="d-flex ml-2 text-danger delete-comment" data-id="{{ $comment->id }}">
                                    <i class="fa fa-trash"></i>
                                </a>
                            </div>
                        </div>
                        <div class="py-2">{!! $comment->comment !!}</div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
@endsection

@section('footer')
    <script>
        $(document).on('click', '.delete-comment', function () {
            if(confirm('Are you sure you want to delete this?')) {
                const id = $(this).data('id');
                $.ajax({
                    method: 'POST',
                    url: '{{ energized_url('recipe/remove-comment')}}',
                    data: 'comment_id='+id+'&_token='+csrf_token,
                }).done(function() {
                    location.reload();
                });
            }
        });
    </script>
@endsection