@extends('site.layouts.master')
@section('content')
    <div class="main-container">
        <div class="container mb-4 text-center">
            <div class="row">
                <div class="col-5">
                    <div class="rival">
                        <img src="/site/img/male-vector.jpg">
                        @php
                            $myStatusColor = 'sucssess';
                            $myStatus = 'مساوی شدی';
                            $opStatusColor = 'sucssess';
                            $opStatus = 'مساوی شدی';
                            if($winner == auth()->id()){
                                $myStatus = 'ایول! بردی😍';
                                $opStatus = 'حریفت با موفقیت باخت😎';
                                $opStatusColor = 'danger';
                            }elseif($winner == null){
                                $myStatusColor = 'sucssess';
                                $myStatus = 'مساوی شدی';
                                $opStatusColor = 'sucssess';
                                $opStatus = 'مساوی شدی';
                            }else{
                                $myStatus = 'ای بابا! دفعه بعد جبران کن😶';
                                $opStatus = 'متاسفانه برد😪';
                                $myStatusColor = 'danger';
                            }
                        @endphp
                            <div class="result result-{{ $myStatusColor }}">
                                <p>{{ auth()->user()->name }}</p>
                                <p>
                                    {{ $myStatus }}
                                </p>
                                <b>
                                    {{ $myPoints }} امتیاز
                                </b>
                            </div>
                    </div>
                </div>
                <div class="col-2" style="margin: auto">
                    <p style="font-size: 15px;">
                        vs
                    </p>
                </div>
                <div class="col-5">
                    <div class="rival">
                        <img src="/site/img/user1.png">
                            <div class="result result-{{ $opStatusColor }}">
                                <p>{{ $opponent->name }}</p>
                                <p>
                                    {{ $opStatus }}
                                </p>
                                <b>
                                    {{ $opponentPoints }} امتیاز
                                </b>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="main-container mt-2">
        <div class="container mb-4 text-center">
            <div class="answer-result">
                <h6 style="text-align: right;">
                    سوالات به همراه پاسخ:
                </h6>
                <ul>
                    @foreach ($questions as $item)
                    @php
                        $bank = $item->bank;
                        $correct = $bank->correct_answer;
                        switch ($correct) {
                            case 1:
                                $correct = $bank->answer_1;
                                break;
                            case 2:
                                $correct = $bank->answer_2;
                                break;
                            case 3:
                                $correct = $bank->answer_3;
                                break;
                            case 4:
                                $correct = $bank->answer_4;
                                break;

                            default:
                                # code...
                                break;
                        }
                    @endphp
                        <li>
                                {!! $bank->question !!}
                            <p class="nswer-li">
                                <b>پاسخ صحیح:</b>
                                <p>{!! $correct !!}</p>
                            </p>
                        </li>
                        <hr>
                    @endforeach
                </ul>
            </div>
        </div>
    </div>
@endsection