@inject('mssGapCoveringCalculator', '\App\Helpers\MssGapCoveringCalculator')

@if(!empty($gapTree))
    <div class="grap-aside">
        <ul class="grap-aside__menu">
            @foreach($gapTree as $standard)
                @php $standardGapPercent = $mssGapCoveringCalculator::getPercentOfStandardControlsCovering($standard, $coveredControlIds); @endphp
                <li class="grap-aside__sub">
                    <a href="javascript: void(0);" class="grap-aside__waves-effect @if(isset($standardId) && $standard['id'] == $standardId) active__sub-shadow @endif">
                        <span class="grap-aside__sub-name">{{ $standard['name'] }}</span>
                        <span class="grap-aside__sub-persent">{!! $standardGapPercent !!}%</span>
                        <span class="aside-arrow"></span>
                    </a>
                    <ul class="grap-aside__sub-shadow">
                        <li class="grap-aside__sub-loading-bar">
                            <span>GAP</span>
                            @php
                                $progressBarClass = '';

                                if ($standardGapPercent >= 0 && $standardGapPercent < 50) {
                                    $progressBarClass = 'loading-bar__line-red';
                                } elseif ($standardGapPercent >= 51 && $standardGapPercent < 74) {
                                    $progressBarClass = 'loading-bar__line-orange';
                                } elseif ($standardGapPercent >= 75 && $standardGapPercent < 89) {
                                    $progressBarClass = 'loading-bar__line-blue';
                                } elseif ($standardGapPercent >= 90) {
                                    $progressBarClass = 'loading-bar__line-green';
                                }
                            @endphp
                            <span class="loading-bar__box"><span class="loading-bar__line {!! $progressBarClass !!}" style="max-width:{!! $standardGapPercent !!}%;"></span><span class="loading-bar__persent">{!! $standardGapPercent !!}%</span></span>
                        </li>
                        @foreach($standard['functions'] as $function)
                            @php $functionGapPercent = $mssGapCoveringCalculator::getPercentOfFunctionControlsCovering($function, $coveredControlIds); @endphp
                            <li class="shadow-li-color shadow-li-blue">
                                <a href="javascript: void(0);" class="color__waves-effect @if(isset($functionId) && $function['id'] == $functionId) active__sub-shadow-ul @endif" style="color: {{ $function['color'] }}; background-color: {{ $function['background_color'] }}">
                                    <i class="i-{{ strtolower($function['name']) }}"></i>
                                    <span>{{ $function['name'] }}</span>
                                    <span>{!! $functionGapPercent !!}%</span>
                                </a>
                                @if(!empty($function['controlFamilies']))
                                    <ul class="grap-aside__sub-shadow-ul">
                                        @foreach($function['controlFamilies'] as $controlFamily)
                                            <li>
                                                <a href="#" class="list__waves-effect @if(isset($controlFamilyId) && $controlFamily['id'] == $controlFamilyId) active__list @endif">
                                                    <span>
                                                        {{ $controlFamily['name'] }}
                                                        @php
                                                            $notCoveredControlsCount = 0;

                                                            if (!empty($controlFamily['controls'])) {
                                                                foreach ($controlFamily['controls'] as $control) {
                                                                    if (!in_array($control['id'], $coveredControlIds)) {
                                                                        $notCoveredControlsCount++;
                                                                    }
                                                                }
                                                            }
                                                        @endphp
                                                        @if($notCoveredControlsCount > 0)
                                                        <span class="rounded-circle gap-li-circle">
                                                            <span>{!! $notCoveredControlsCount !!}</span>
                                                        </span>
                                                        @endif
                                                    </span>
                                                </a>
                                                @if(!empty($controlFamily['controls']))
                                                    <ul class="nav nav-tabs">
                                                        @foreach($controlFamily['controls'] as $control)
                                                            <li class="line @if(in_array($control['id'], $coveredControlIds)) active @endif">
                                                                <a data-control-key="{!! $control['id'] !!}" data-function-key="{!! $function['id'] !!}" data-control-family-key="{!! $controlFamily['id'] !!}" data-standard-key="{!! $standard['id'] !!}" href="javascript: void(0);" data-toggle="tab" aria-expanded="false" class="gap-control @if(isset($controlId) && $control['id'] == $controlId) active show @endif">{{ $control['name'] }}</a>
                                                            </li>
                                                        @endforeach
                                                    </ul>
                                                @endif
                                            </li>
                                        @endforeach
                                    </ul>
                                @endif
                            </li>
                        @endforeach
                    </ul>
                </li>
            @endforeach
        </ul>
    </div>
    @if(!isset($standardId, $functionId, $controlFamilyId, $controlId))
        <div class="grap-contant active" id="gap-content">
            <div class="grap-contant__inner tab-content">
                <div class="tab-pane-greeting active">
                    <div class="greeting">
                        <img src="/theme/assets/images/MSS-GAP/background.png" alt="">
                        <span>Click on a subchapter on the left to see more.</span>
                    </div>
                </div>
            </div>
        </div>
    @endif
@endif