@extends('homepagemodules::admin.modules.support.module_container')

@section('module-content')
    <div class="background" style="
        background-color: {{isset($value->settings->backgroundColor)?$value->settings->backgroundColor:'#ffffff'}};
        background-image: {{isset($value->settings->backgroundImage)?'url('.config('locations.homepageImage.asset').$value->settings->backgroundImage.')':''}};
    ">
        @if(isset($value->images))
            @php
                $position = 0;
            @endphp

            @foreach($value->images as $image)
                @php
                    $position++;
                @endphp

                @if($image->position == $position)
                    <div class="staff-clickable"
                         data-id="{{$value->id}}"
                         data-module-type="{{$value->type}}"

                         data-type="staff"
                         data-first-name="{{$image->settings->firstName ?? ""}}"
                         data-first-name-chinese="{{$image->settings->firstNameChinese ?? ""}}"
                         data-last-name="{{$image->settings->lastName ?? ""}}"
                         data-last-name-chinese="{{$image->settings->lastNameChinese ?? ""}}"
                         data-description="{{$image->settings->description ?? ""}}"
                         data-description-chinese="{{$image->settings->descriptionChinese ?? ""}}"
                         data-traffic-id="{{$image->settings->trafficId ?? ""}}"

                         data-image-id="{{$image->id ?? ""}}"
                         data-image-position="{{$position}}"
                         data-image-src="{{$image->image ?? ""}}"
                    >
                        @if(isset($image->image))
                            <img class="lazy-load-img" data-src="{{config('locations.homepageImage.asset').$image->image}}?x-oss-process=image/resize,m_lfit,h_300,w_300" alt="image">
                        @endif
                    </div>
                @else
                    @php
                        $difference = $image->position - $position;
                    @endphp

                    @for($i = 0; $i < $difference; $i++)
                        @if($i >= 1)
                            @php
                                $position++;
                            @endphp
                        @endif

                        <div class="staff-clickable"
                             data-id="{{$value->id}}"
                             data-module-type="{{$value->type}}"

                             data-type="staff"
                             data-first-name=""
                             data-first-name-chinese=""
                             data-last-name=""
                             data-last-name-chinese=""
                             data-description=""
                             data-description-chinese=""
                             data-traffic-id=""

                             data-image-id=""
                             data-image-position="{{$position}}"
                             data-image-src=""
                        ></div>
                    @endfor

                    <div class="staff-clickable"
                         data-id="{{$value->id}}"
                         data-module-type="{{$value->type}}"

                         data-type="staff"
                         data-first-name="{{$image->settings->firstName ?? ""}}"
                         data-first-name-chinese="{{$image->settings->firstNameChinese ?? ""}}"
                         data-last-name="{{$image->settings->lastName ?? ""}}"
                         data-last-name-chinese="{{$image->settings->lastNameChinese ?? ""}}"
                         data-description="{{$image->settings->description ?? ""}}"
                         data-description-chinese="{{$image->settings->descriptionChinese ?? ""}}"
                         data-traffic-id="{{$image->settings->trafficId ?? ""}}"

                         data-image-id="{{$image->id ?? ""}}"
                         data-image-position="{{$position}}"
                         data-image-src="{{$image->image ?? ""}}"
                    >
                        @if(isset($image->image))
                            <img class="lazy-load-img" data-src="{{config('locations.homepageImage.asset').$image->image}}?x-oss-process=image/resize,m_lfit,h_300,w_300" alt="image">
                        @endif
                    </div>
                @endif
            @endforeach

            @php
                $counter = ($position < 6)?(6 - $position):1;
            @endphp

            @for($i = 0; $i < $counter; $i++)
                <div class="staff-clickable"
                     data-id="{{$value->id}}"
                     data-module-type="{{$value->type}}"

                     data-type="staff"
                     data-first-name=""
                     data-first-name-chinese=""
                     data-last-name=""
                     data-last-name-chinese=""
                     data-description=""
                     data-description-chinese=""
                     data-traffic-id=""

                     data-image-id=""
                     data-image-position="{{++$position}}"
                     data-image-src=""
                ></div>
            @endfor
        @else
            @for($i = 0; $i < 6; $i++)
                <div class="staff-clickable"
                     data-id="{{$value->id}}"
                     data-module-type="{{$value->type}}"

                     data-type="staff"
                     data-first-name=""
                     data-first-name-chinese=""
                     data-last-name=""
                     data-last-name-chinese=""
                     data-description=""
                     data-description-chinese=""
                     data-traffic-id=""

                     data-image-id=""
                     data-image-position="{{$i + 1}}"
                     data-image-src=""
                ></div>
            @endfor
        @endif
    </div>
@overwrite