@extends('main.layouts.main')

@section('content')
    <div class="profile-top">
        <div class="avatar">
            <img src="{{ (!$user->avatar_url) ? asset('/assets/main/images/other/nouser.png') : $user->avatar_url }}"
                 alt="Это вы">
            <ul class="have">
                <li title="Друзья">
                    <i class="fad fa-user-friends"></i>
                    <span>100</span>
                </li>
                <li title="Лайки">
                    <i class="fad fa-thumbs-up"></i>
                    <span>83</span>
                </li>
            </ul>
        </div>
        <div class="profile-right">
            <div class="info">
                <div class="top-info">
                    <h2>{{ $user->name }} {{ $user->surname }}
                        @if ($user->verify == 1)
                            <i class="fad fa-check verify" title="Этот пользователь верифицирован"></i>
                        @endif
                    </h2>
                    @if ($user->online())
                        <span class="online">online</span>
                    @else
                        <span class="offline">offline</span>
                    @endif
                </div>
                @if ($user->status_text != '')
                    <div class="profile-status">
                        <i class="fad fa-lightbulb-on"></i>
                        <span class="text">{{ $user->status_text }}</span>
                    </div>
                @endif
                <ul class="about">
                    <li>
                        <span>Дата рождения:</span>
                        <p>{{ $user->dob }}</p>
                    </li>
                    <li>
                        <span>Город:</span>
                        <p>{{ $user->city->name }}</p>
                    </li>
                    <li>
                        <span>Род занятий:</span>
                        <p>{{ $user->skill }}</p>
                    </li>
                    <li>
                        <span>О себе:</span>
                        <p>{{ $user->about }}</p>
                    </li>
                </ul>
            </div>
            <form action="" class="form-create-post" style="align-items:center;">
                <div style="width: 100%">
                    <textarea rows="2" placeholder="О чём хотите рассказать?" name="body"></textarea>
                    <span class="invalid-feedback body-error-field d-none" role="alert">

                </span>
                </div>
                <button class="public-article" onclick="publicArticle(event)">
                    <i class="fad fa-paper-plane"></i>
                </button>
            </form>
            <ul class="posts">
                @foreach($user->articles as $article)
                    <li>
                        <div class="author-controllers">
                            <div style="display:flex; align-items:center;">
                                <img
                                    src="{{ (!$user->avatar_url) ? asset('/assets/main/images/other/nouser.png') : $user->avatar_url }}"
                                    alt="Это вы">
                                <div style="margin-left: 10px;">
                                    <p style="color: #ffffff;font-weight: 700;">{{ $user->surname }} {{ $user->name }}</p>
                                </div>

                            </div>
                            <div class="controllers">
                                <i class="far fa-ellipsis-h"></i>
                                <ul>
                                    <li>
                                        <form action="{{ route('article_destroy') }}" method="post"
                                              id="delete-article_{{ $article->id }}">
                                            @csrf
                                            <input type="hidden" name="id" value="{{ $article->id }}">
                                        </form>
                                        <a
                                            href="#"
                                            onclick="event.preventDefault(); document.getElementById('delete-article_{{ $article->id }}').submit()"
                                        >Удалить</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="body">
                            <p>{{ $article->body }}</p>
                        </div>
                        <div style="display:flex;justify-content: space-between; align-items: center;">
                            <ul class="actions">
                                <li class="like">
                                    @if($article->like()['status'] == 1)
                                        <i class="fas disable fa-heart" onclick="likeArticle({{ $article->id }})"></i>
                                    @else
                                        <i class="far disable fa-heart" onclick="likeArticle({{ $article->id }})"></i>
                                    @endif
                                    <span class="count_likes" article-id="{{ $article->id }}">{{ $article->likes_count() }}</span>
                                </li>
                            </ul>
                            <span
                                style="font-style: italic; color: #e3e3e3; font-size: 12px;">{{ $article->created_at->format('d.m.Y') }}</span>
                        </div>
                    </li>
                @endforeach

            </ul>
        </div>

    </div>
@endsection