@extends('layouts.espace_collaboration')
@section('meta-title', 'Esquisse en cours')
@section('meta-keywords', '')
@section('meta-description', '')
@section('sub-menu')
    @include('front.espace_collaboration.menu')
@endsection
@section('content')
    @php
        $migrated = $projet->migrated && $projet->forfait != 'fantastique';
    @endphp
    <div class="row bg-white">
        <div class="col {{ $migrated ? 'col-md-push-4 mr-md-4' : '' }}">
            <section class="pt-40 bg-white">
                <div class="container-start-project text-center">
                    <p class=" font-weight-bold">{!! lang('Félicitations, vous avez lancé votre projet !') !!}</p>
                    <p>{!! lang("En attendant la finalisation de vos travaux de concept d'idées, faites découvrir Pipcke à vos amis et proches. Offrez-leur <b>25 €</b> de réduction sur toute souscription à un forfait Fantastique
                                                                                                                                                                                                                                                                                                                                                    ou <b>15 €</b> sur toute souscription à un forfait Incontournable,
                                                                                                                                                                                                                                                                                                                                                    , et nous vous offrons à leur souscription un bon d’achat de <b>50 €</b> sur toute commande de produits passée via notre site.") !!}</p>
                </div>
                @include('partials.parrainage')
            </section>

            <section class="pt-40 pb-40">
                <div class="container-start-project">

                    <p class="text-center">
                        {!! lang(
                            "N’hésitez pas à enrichir votre Brief en <a class='text-underline' href='__route_etat_des_lieux__'>téléchargeant <br> des photos</a> et <a class='text-underline' href='__route_inspirations__'>des liens d’inspiration</a>.",
                            [
                                '__route_etat_des_lieux__' => route('client.brief', ['project_id' => $projet->id, 'panel' => 'inspirations']),
                                '__route_inspirations__' => route('client.brief', ['project_id' => $projet->id, 'panel' => 'inspirations']),
                            ],
                        ) !!}</p>

                    <div class="text-center mt-20">
                        <a class="btn btn17 btn-xs"
                            href="{{ route('client.brief', $projet->id) }}">{!! lang('Consulter votre brief') !!}</a>
                    </div>
                </div>

            </section>
        </div>
        @if ($migrated)
            <div class=" {{ $migrated ? 'col-md-4 col-md-pull-8' : 'col-md-3 col-md-pull-9' }}">
                <div class="internal-chat-esquisse" style="top:130px;max-width: 30%;">
                    <section class="internal-chat-area">
                        <header>
                            <img src="{{ asset($projet->designers[0]->designer->photo ?? $projet->designers[0]->designer->picture) }}"
                                alt="">
                            <div class="details" style="display:flex; flex-direction:column">
                                <span>{{ $projet->designers[0]->designer->username }} </span>
                                <small
                                    class="time">{{ (new \Carbon\Carbon($projet->designers[0]->designer->updated_at))->diffForHumans() }}</small>
                            </div>
                            <div
                                class="status-dot {{ (new \Carbon\Carbon())->diffInMinutes(new \Carbon\Carbon($projet->designers[0]->designer->updated_at)) == 0 ? '' : 'offline' }}">
                                <i class="fa fa-circle"></i>
                            </div>
                        </header>
                        <div class="chat-box scroll-chat_conception_cli" style="height: 50vh;">
                            @foreach ($chatRoom->messages as $message)
                                @include('front.components.chat_message_update')
                            @endforeach
                        </div>
                        <div class="typing-area-container">
                            @php
                                $senderId = auth()->id();
                                $receiverId = $receiver->id ?? '-1';
                                $projetId = $chatRoom->projet_id;
                            @endphp
                            <form class="typing-area" name="chat-component-update_conception_cli"
                                id="chat-component-update_conception_cli" method="post"
                                action="{{ route('chat.send-message', ['sender_id' => $senderId, 'receiver_id' => $receiverId, 'projetId' => $projetId]) }}">
                                {{ csrf_field() }}
                                <div class="smileys smileys-chat-update smiley_conception_cli">
                                    <label class="smiley_update_conception_cli smiley-update-1" style="opacity: 1;"
                                        data-value=":rougir:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-2" style="opacity: 1;"
                                        data-value=":pleurer:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-3" style="opacity: 1;"
                                        data-value=":demon:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-4" style="opacity: 1;"
                                        data-value=":ange:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-5" style="opacity: 1;"
                                        data-value=":coeur:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-19" style="opacity: 1;"
                                        data-value=":like:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-6" style="opacity: 1;"
                                        data-value=":sourire:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-7" style="opacity: 1;"
                                        data-value=":triste:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-8" style="opacity: 1;"
                                        data-value=":surpris:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-9" style="opacity: 1;"
                                        data-value=":rire:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-18" style="opacity: 1;"
                                        data-value=":clin-d-oeil:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-11" style="opacity: 1;"
                                        data-value=":choqué:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-12" style="opacity: 1;"
                                        data-value=":sourire-lunettes:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-13" style="opacity: 1;"
                                        data-value=":yeux:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-14" style="opacity: 1;"
                                        data-value=":lunettes:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-15" style="opacity: 1;"
                                        data-value=":langue:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-16" style="opacity: 1;"
                                        data-value=":incertain:"></label>
                                    <label class="smiley_update_conception_cli smiley-update-17" style="opacity: 1;"
                                        data-value=":vexé:"></label>
                                </div>
                                <div style="display: flex;justify-content: center;">
                                    <textarea name="message_conception_cli" id="message_content_conception_cli" placeholder="Entrez votre message..."
                                        class="form-control"></textarea>
                                    <div class="" style="display:inline-block;width: 50px;padding: 5px 0 0 5px;">
                                        <label id="attachedLabel_conception_cli" for="attachedFile_conception_cli"
                                            title="Envoyer un fichier">
                                            <i class="fa fa-upload" aria-hidden="true"></i>
                                        </label>
                                        <button id="submitChat_conception_cli" style="display: none;"><i class="fa fa-send"
                                                aria-hidden="true" title="Envoyer message"></i></button>
                                        <i class="fa fa-smile-o typing_area_label_conception_cli" aria-hidden="true"
                                            title="Insérer un emoji"></i>
                                        <input type="file" name="attachedFile_conception_cli"
                                            id="attachedFile_conception_cli" class="form-control hidden"
                                            accept="image/*, application/pdf, video/mp4,video/x-m4v,video/*" />
                                    </div>
                                </div>
                            </form>
                        </div>
                    </section>
                </div>
            </div>
        @endif
    </div>

@endsection