@extends('app')
@section('content')
@php
use Illuminate\Support\Facades\Storage;
@endphp
<script src="{{ asset('assets/libs/sweetalert2/sweetalert2.all.min.js') }}"></script>
<main>
    <section class="profile">
        <div class="container">
            <div class="profile__header">
                <div class="profile__overlay">
                    <img class="profile__intro" src="{{ user_image_url($user->intro_image, 'intro') }}" alt="">
                    <div class="profile__avatar">
                        <img src="{{ user_image_url($user->image, 'avatar') }}">
                    </div>
                    <div class="profile__user">
                        <div class="profile__user-left">
                            <p class="profile__user-name">{{$user->name}}</p>
                            <p class="profile__user-stats">
                                @if($user->roll == 2 && $user->specialistInfo && $user->specialistInfo->slug)
                                    <span class="profile__user-status">ПРО</span>
                                    <span class="profile__user-status">
                                        <a href="{{ route('showSpecialistPage', ['slug' => $user->specialistInfo->slug]) }}"
                                           style="color: white; display: inline-flex; align-items: center; height: 100%;">Посмотреть мой профиль ></a>
                                    </span>
                                @else
                                    <span class="profile__user-status">ПРО</span>
                                @endif
                            </p>
                        </div>
                        {{-- Кнопка редактирования для всех пользователей --}}
                        <div class="profile__user-right">
                            <button id="openModalBtn" class="btn-main settings__btn profile__user-edit">
                                <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" style="margin-right: 8px;">
                                    <path d="M11.05 3.00002L4.20835 10.2417C3.95002 10.5167 3.70002 11.0584 3.65002 11.4334L3.34169 14.1334C3.23335 15.1084 3.93335 15.775 4.90002 15.6084L7.58335 15.15C7.95835 15.0834 8.47502 14.8084 8.73335 14.525L15.575 7.28335C16.4667 6.35002 16.875 5.15835 15.8083 4.08335C14.75 3.03335 13.575 3.45835 12.6833 4.39169L5.84169 11.6334C5.58335 11.9084 5.31669 12.375 5.25002 12.75L4.83335 15.2167L7.16669 14.8084C7.54169 14.7417 8.00835 14.4667 8.26669 14.1917L15.1083 6.95002C15.6667 6.37502 15.6667 5.50835 15.1083 4.93335C14.55 4.35835 13.6833 4.35835 13.125 4.93335L6.28335 12.175C6.02502 12.45 5.66669 12.6084 5.29169 12.675L2.66669 13.1084C2.41669 13.15 2.20835 12.9417 2.25002 12.6917L2.68335 10.0667C2.75002 9.69169 2.90835 9.33335 3.18335 9.07502L10.025 1.83335C10.9167 0.900017 12.0917 0.475017 13.15 1.52502C14.2167 2.58335 13.8083 3.77502 12.9167 4.70835L11.05 3.00002Z" fill="white"/>
                                </svg>
                                Редактировать фото обложки
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <ul class="profile__navigation">
                <li class="profile__navigation-item {{ (Route::is('showProfilePage') || request()->routeIs('showProfilePage') || request()->is('profile*')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('showProfilePage') }}" class="profile__navigation-link">Главная</a>
                </li>
                <li class="profile__navigation-item {{ (Route::is('showMyProjectPage') || request()->routeIs('showMyProjectPage') || request()->is('myProject*') || request()->is('addProject*')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('showMyProjectPage') }}" class="profile__navigation-link">Проекты</a>
                </li>
                <li class="profile__navigation-item {{ (Route::is('showAlbumPage') || Route::is('showGalleryAlbumPage') || request()->routeIs('showAlbumPage') || request()->routeIs('showGalleryAlbumPage') || \Illuminate\Support\Str::startsWith(request()->path(), 'collections') || \Illuminate\Support\Str::startsWith(request()->path(), 'gallery/collections')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('showAlbumPage') }}" class="profile__navigation-link">Подборки</a>
                </li>
                <li class="profile__navigation-item {{ (Route::is('showReviewsPage') || request()->routeIs('showReviewsPage') || request()->is('reviews*')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('showReviewsPage') }}" class="profile__navigation-link">Отзывы</a>
                </li>
                <li class="profile__navigation-item {{ (Route::is('showFavoritesPage') || request()->routeIs('showFavoritesPage') || request()->is('favorites*')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('showFavoritesPage') }}" class="profile__navigation-link">Избранные</a>
                </li>
                <li class="profile__navigation-item {{ (Route::is('chat.index') || Route::is('chat') || request()->routeIs('chat.index') || request()->routeIs('chat') || \Illuminate\Support\Str::startsWith(request()->path(), 'chat')) ? 'profile__navigation-item--active' : '' }}">
                    <a href="{{ route('chat.index') }}" class="profile__navigation-link">
                        Сообщения
                        @if(auth()->check() && auth()->user()->unreadMessagesCount() > 0)
                            <span class="messages-badge">{{ auth()->user()->unreadMessagesCount() }}</span>
                        @endif
                    </a>
                </li>
            </ul>
        </div>
    </section>
    <section class="setup">
        <div class="container">
            <!-- Tabs -->
            <div class="setup__wrapper">
                <div class="setup__content">
                    <div class="setup__content-item">
                        <p class="setup__content-title">
                            Загрузите фотографии идеи – это один из лучших способов привлечь внимание потенциальных
                            клиентов
                        </p>
                        <p class="setup__content-info">Альбом идеи – это фото ваших идей для реализации. Фотографии являются одним из
                            ключевых путей, по которым потенциальные заказчики могут найти вас на Ремонт.рф.</p>
                        <button class="btn-main setup__content-btn modal__btn2">Создать/Редактировать альбом</button>
                    </div>
                    <div class="setup__content-item">
                        <p class="setup__content-title">
                            Попросите бывших клиентов и коллег оставить отзывы о вашей работе
                        </p>
                        <p class="setup__content-info">Профессионалы с минимум тремя отзывами в 15 раз чаще получают
                            сообщения и запросы на проект.</p>
                        <button class="btn-main setup__content-btn modal__btn3">Запросить отзывы</button>
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>



<!-- Modal -->
<div class="modal__wrapper2" style="display: none">
    <div class="modal">
        <div class="modal__close2"><img src="{{asset('assets/img/close.svg')}}" alt="cancel" width="20" height="20"></div>
        <div class="modal__body">
            <form action="{{route('saveIdeaAlbum')}}" method="POST" class="steps__form" enctype="multipart/form-data" id="albumForm">
                @csrf
                <meta name="csrf-token" content="{{ csrf_token() }}">
                <div class="steps">
                    <div class="form__step">
                        <div class="form__header">
                            <p class="form__title">Создать новый альбом идей</p>
                            <p class="form__subtitle">Альбом идей – это креативные проекты для реализации. Фотографии являются одним из
                                ключевых путей, по которым потенциальные заказчики могут найти вас на Ремонт.рф.</p>

                            @if(session('error'))
                                <div class="alert alert-danger" style="color: red; background: #ffe6e6; padding: 10px; border-radius: 5px; margin: 10px 0;">
                                    {{ session('error') }}
                                </div>
                            @endif

                            @if(session('errorConfirm'))
                                <div class="alert alert-warning" style="color: orange; background: #fff3cd; padding: 10px; border-radius: 5px; margin: 10px 0;">
                                    {{ session('errorConfirm') }}
                                </div>
                            @endif
                        </div>
                        <div class="form__wrapper">
                            <div class="form__main">
                                <div class="form-group controls">
                                    <div class="form-group" style="width: 100%; outline: none;">
                                        <span class="dropdown-label-icon"></span>
                                        <span class="dropdown-icon"></span>
                                        <select class="input-main" id="project-select" name="project" style="padding: 10px;margin-bottom: 20px;">
                                            <option value="-1">Выберите альбом или создайте новый</option>
                                            <option value="NewProject">Создать новый альбом</option>
                                            @foreach($albums as $album)
                                                <option value="{{ $album->id }}">{{ $album->title }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <span class="coError" data-bind="project"></span>
                                </div>

                                <div class="form-group" id="new-project-name" style="display: none;">
                                    <label>Название нового албома
                                    <input class="input-main form-group__input" type="text" placeholder="Имя проекта" name="new_project_name" value="{{ old('new_project_name') }}" required>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label>Описание</label>
                                    <textarea class="input-main form-group__input" type="text" name="description" placeholder="Описание" required>{{ old('description') }}</textarea>
                                </div>
                                <div class="form-group">
                                    <label class="control-label text-m" for="stylesFld">Категория</label>
                                    <div class="form-horizontal">
                                        <select id="category" name="category" class="input-main" onchange="showSubcategories()" style="padding: 10px;margin-bottom: 20px;" required>
                                            <option value="" disabled selected>Выберите категорию</option>