@extends('layouts.guest') 

@section('title', 'PDCN - ' . $panneau->nom)

@section('content')

<style>

html {
  scroll-behavior: smooth;
}


:root {
    --theme-color: {{ $panneau->themePrimaryColor ?? '#f5991a' }};
    --theme-text-color: {{ \Illuminate\Support\Str::of($panneau->themePrimaryColor)->isNotEmpty() && contrastColor($panneau->themePrimaryColor) === 'white' ? '#ffffff' : '#000000' }};

    --bg-primary-color: {{ $panneau->themeSecondaryColor ?? '#dc4c4c' }};
    --bg-primary-text-color: {{ \Illuminate\Support\Str::of($panneau->themeSecondaryColor)->isNotEmpty() && contrastColor($panneau->themeSecondaryColor) === 'white' ? '#ffffff' : '#000000' }};
}

.navbar_pdcn,
.navbar-brand_pdcn {
    background-color: var(--theme-color) !important;
    color: var(--theme-text-color) !important;
}

.bg-primary_pdcn {
    background-color: var(--bg-primary-color) !important;
    color: var(--bg-primary-text-color) !important;
}

.scroll-top-link i {
  transition: all 0.2s ease;
}

.scroll-top-link:hover i,
.scroll-top-link:active i{
  color : var(--theme-color) !important;
  transform: scale(1.2);
}


.chantier-container {
    border: 1px solid transparent;
    background-image: linear-gradient(white, white),
    repeating-linear-gradient(
        45deg,
        red 0 15px,
        white 2px 30px
    );
    background-origin: border-box;
    background-clip: content-box, border-box;
    padding: 0.5rem;
    text-align: center;
    width: fit-content;
    margin: 2rem auto;
}

.chantier-title {
    background-color: #b30000;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.8rem;
    padding: 1rem 2rem;
    margin-bottom: 0.5rem;
    display: inline-block;
}

.chantier-icons {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-bottom: 0.5rem;;
}

.chantier-icons img {
    max-height: 85px;
    max-width: 85px;
}

.navbar-guest-padding {
    padding: 1.5rem !important;
}

.navbar-auth-padding {
    padding: 0.2rem !important;
}

@media (max-width: 576px) {
    body {
        font-size: 90% !important;
    }


    .navbar-brand_pdcn {
         font-size: 80% !important;  
    }

    .container-pdcn {
        padding-top: 1.5rem !important; 
        padding-bottom: 0.7rem !important;
    }

    .navbar-guest-padding {
        padding: 1rem !important;
    }

    .small
    {
        font-size: 85% !important;
    }

    .chantier-title {
        font-size: 1.1rem;
    }

    .chantier-icons img {
        height: 40px;
    }

    .chantier-container {
        padding: 0.75rem;
        margin: 1rem auto;
        max-width: 95%;
    }
}

/* Chrome, Edge, Safari */
/* ::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f5991a ;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  border: 2px solid #f5991a ;
} */

/* Firefox */
/* * {
  scrollbar-width: thin;
  scrollbar-color: red #f5991a ;
} */

</style>

@php
    $viewType = $panneau->typeMiseEnForme == 1 ? 'pdcn_informations_type1' : 'pdcn_informations_type2';

    function contrastColor($hexColor) {
        $hex = str_replace('#', '', $hexColor);
        $r = hexdec(substr($hex, 0, 2));
        $g = hexdec(substr($hex, 2, 2));
        $b = hexdec(substr($hex, 4, 2));
        $brightness = ($r * 299 + $g * 587 + $b * 114) / 1000;
        return $brightness > 128 ? 'black' : 'white';
    }
@endphp

@if($panneau->actif == false)

    <!-- Navbar INACTIF -->
    <nav class="navbar navbar_pdcn bg-danger fixed-top shadow justify-content-center {{ auth()->guest() ? 'navbar-guest-padding' : '' }}">
        <div class="container-fluid d-flex justify-content-center align-items-center">
            <span class="col-10 h3 mb-0 h1 text-uppercase fw-bold text-center text-danger">
                Panneau connecté inactif
            </span>
        </div>
    </nav>

    <div class="py-5 container-pdcn">
        @include('panneaux.blocs.'.$viewType, ['panneau' => $panneau])
    </div>

@else

    <nav class="navbar navbar_pdcn fixed-top shadow {{ auth()->guest() ? 'navbar-guest-padding' : 'navbar-auth-padding' }}"">
        <div class="container-fluid position-relative d-flex align-items-center ">
            
            @auth
                <a href="{{ url()->previous() }}" class="text-dark me-3" style="font-size: 1.5rem;">
                    <i class="fas fa-arrow-left"></i>
                </a>
            @endauth

            <span class="col-10 position-absolute start-50 translate-middle-x navbar-brand_pdcn mb-0 h5 fw-bold text-uppercase text-center">
                <i class="fa-solid fa-helmet-safety"></i>
                    <span>Panneau connecté</span>
                <i class="fa-solid fa-helmet-safety"></i>
            </span>
        </div>
    </nav>
    
    <div class="py-5 container-pdcn">
    
        <div class="d-flex justify-content-center align-items-center mt-3">
            @foreach($panneau->labels->where('actif', true) as $label)
                <div class="col-md-2 text-center d-md-block">                               
                    <img src="{{ asset('storage/' . $label->logo) }}" alt="Logo {{ $label->libelle }}" style="max-height: 80px;">                               
                </div>
            @endforeach
        </div>

        @include('panneaux.blocs.'.$viewType, ['panneau' => $panneau])


        <!-- INTERVENANTS -->
        @php
            $lastUpdateIntervenant = $panneau->intervenants->max('updated_at');
        @endphp
        <div class="card shadow-sm rounded-3 mt-4">
            <div class="card-header bg-primary_pdcn text-white d-flex justify-content-between align-items-center">
                <div class="text-uppercase">
                    <i class="bi bi-people-fill me-2"></i> Intervenants
                </div>
                <div class="col-6 text-end small">
                    Dernière modification : {{ $lastUpdateIntervenant ? \Carbon\Carbon::parse($lastUpdateIntervenant)->format('d/m/Y H:i') : 'Non disponible' }}
                </div>
            </div>

            <div class="card-body">                
                @if($panneau->intervenants->isEmpty())
                    <div class="">
                        <i class="fa-solid fa-bullhorn"></i> Pour l'instant, aucun intervenant n'est renseigné. <br> <small>À venir prochainement...</small>
                    </div>
                @else
                    @foreach($panneau->intervenants->sortBy('numeroOrdre') as $intervenant)
                        <div class="row anchor" id="intervenant-{{ $intervenant->id }}">
                            
                            <!-- Type de l'intervenant -->
                            <div class="col-12 col-md-4 fw-semibold">
                                {{ $intervenant->type }}
                            </div>

                            <!-- Détails de l'intervenant -->
                            <div class="col-12 col-md-5 mt-2 mt-md-0">
                                <span class="fw-semibold">{{ $intervenant->libelleType }}</span><br>
                                <small>
                                    {{ $intervenant->adresse }}<br>
                                    {{ $intervenant->codePostal }} {{ $intervenant->ville }}<br>
                                    {{ preg_replace('/(\d{2})(?=\d)/', '$1 ', $intervenant->numeroTel) }}
                                </small>
                            </div>

                            <!-- Logo intervenant sur desktop -->
                            @if($intervenant->logo)
                                <div class="col-12 col-md-3 text-center d-md-block">                               
                                    <img src="{{ asset('storage/' . $intervenant->logo) }}" alt="Logo {{ $intervenant->libelle }}" style="max-height: 70px;">                               
                                </div>
                            @endif
        
                        </div>

                        @if(!$loop->last)
                            <hr class="m-md-5 m-4" style="width: 90%; background: linear-gradient(to right, #ccc, #333, #ccc); border: 0; height: 1px;">
                        @endif

                    @endforeach
                @endif
            </div>
        </div>


        <!-- LOTS -->
        @php
            $lastUpdateLot = $panneau->lots->max('updated_at');
        @endphp
        <div class="card shadow-sm rounded-3 mt-5">
            <div class="card-header bg-primary_pdcn text-white d-flex justify-content-between align-items-center">
                <div class="text-uppercase">
                    <i class="fa-solid fa-person-digging me-2"></i> Lots
                </div>
                <div class="col-6 text-end justify-content-end small d-flex align-items-center">
                    Dernière modification : {{ $lastUpdateLot ? \Carbon\Carbon::parse($lastUpdateLot)->format('d/m/Y H:i') : 'Non disponible' }}
                    <a href="#top" class="text-white ms-3 scroll-top-link" title="Remonter en haut">
                        <i class="fas fa-arrow-up"></i>
                    </a>
                </div>
            </div>

            <div class="card-body">
                @php
                // Tri et réindexation
                $lotsTries = $panneau->lots
                    ->sortBy(function($lot) {
                        $ordrePrincipal = $lot->lotParent->numeroOrdre ?? $lot->numeroOrdre;
                        return sprintf('%04d-%05d', $ordrePrincipal, $lot->lotParent ? $lot->id : 0);
                    })
                    ->values(); // ← ici on réindexe proprement
                @endphp

                @if($lotsTries->isEmpty())
                    <div class="">
                        <i class="fa-solid fa-bullhorn"></i> Pour l'instant, aucun lot n'est renseigné. <br> <small>À venir prochainement...</small>
                    </div>
                @else
                    @foreach($lotsTries as $index => $lot)
                        @php
                            $isCoTraitant = $lot->lotParent !== null;
                            $isLastItem = $loop->last;
                            $showHr = true;

                            $nextLot = !$isLastItem ? $lotsTries[$index + 1] : null;

                            // Debug de l'élément actuel et du suivant
                            /*
                            echo "<pre style='color: red;'>";
                            echo "Actuel: {$lot->nom} (ID {$lot->id}) | Co-traitant: " . ($isCoTraitant ? 'oui' : 'non') . "\n";
                            if ($nextLot) {
                                echo "Suivant: {$nextLot->nom} (ID {$nextLot->id}) | Co-traitant: " . ($nextLot->lotParent ? 'oui' : 'non') . "\n";
                            } else {
                                echo "Suivant: — (dernier élément)\n";
                            }
                            echo "</pre>";
                            */

                            if (!$isLastItem) {
                                if ($nextLot->lotParent) {
                                    $showHr = false;
                                }
                            } else {
                                $showHr = false;
                            }
                        @endphp

                        <div class="row anchor {{ $isCoTraitant ? ' mt-2 ps-4 ps-xs-3 ps-md-3 ms-md-4 ms-0' : '' }}" id="intervenant-{{ $lot->id }}">
                            <div class="col-auto fw-semibold">
                                @if($isCoTraitant)
                                    <i class="fa-solid fa-arrow-turn-up fa-rotate-90"></i>
                                @else
                                    Lot n°{{ $lot->numeroOrdre }}
                                @endif
                            </div>
                            
                            <div class="col-8 col-md-3 ps-0">
                                {{ $isCoTraitant ? 'Co-traitant' : $lot->designation }}
                            </div>
                            
                             @if($isCoTraitant)
                                <div class="col-12 col-xs-8 col-md-6 ps-4 ps-xs-3 ps-md-3 mt-0 mt-md-0">
                             @else
                                <div class="col-12 col-md-6 mt-2 mt-md-0">
                            @endif
                            
                                <span class="fw-semibold">{{ $lot->nom }}</span><br>
                                <small>
                                    {{ $lot->adresse }}<br>
                                    {{ $lot->codePostal }} {{ $lot->ville }}<br>
                                    {{ preg_replace('/(\d{2})(?=\d)/', '$1 ', $lot->numeroTel) }}
                                </small>
                            </div>
                        </div>

                        @if($showHr)
                            <hr class="m-md-5 m-4" style="width: 90%; background: linear-gradient(to right, #ccc, #333, #ccc); border: 0; height: 1px;">
                        @endif
                    @endforeach
                @endif
            </div>
        </div>

        <!--  SOUS TRAITANTS -->
        @php
            $lastUpdateSousTraitant = $panneau->sousTraitants->max('updated_at');
        @endphp
        <div class="card shadow-sm rounded-3 mt-5">
            <div class="card-header bg-primary_pdcn text-white d-flex justify-content-between align-items-center">
                <div class="text-uppercase">
                    <i class="fa-solid fa-trowel me-2"></i> Sous traitants
                </div>
                <div class="col-6 text-end justify-content-end small d-flex align-items-center">
                    Dernière modification : {{ $lastUpdateSousTraitant ? \Carbon\Carbon::parse($lastUpdateSousTraitant)->format('d/m/Y H:i') : 'Non disponible' }}
                    <a href="#top" class="text-white ms-3 scroll-top-link" title="Remonter en haut">
                        <i class="fas fa-arrow-up"></i>
                    </a>
                </div>
            </div>

            <div class="card-body">                
                @if($panneau->sousTraitants->isEmpty())
                    <div class="">
                        <i class="fa-solid fa-bullhorn"></i> Pour l'instant, aucun sous traitant n'est renseigné. <br> <small>À venir prochainement...</small>
                    </div>
                @else
                    @foreach($panneau->sousTraitants->sortBy('numeroOrdre') as $sousTraitant)
                        <div class="row anchor" id="intervenant-{{ $sousTraitant->id }}">
                            
                            <!-- Nom du sous traitant -->
                            <div class="col-5 col-md-4 fw-bold">
                                {{ $sousTraitant->nom }}
                            </div>

                            <!-- Détails du sous traitant -->
                            <div class="col-7 col-md-8">
                                <span class="fw-semibold">{{ $sousTraitant->designation }}</span><br>
                                <small>
                                    {{ $sousTraitant->adresse }}<br>
                                    {{ $sousTraitant->codePostal }} {{ $sousTraitant->ville }}<br>
                                    {{ preg_replace('/(\d{2})(?=\d)/', '$1 ', $sousTraitant->numeroTel) }}
                                </small>
                            </div>        

                        </div>

                        @if(!$loop->last)
                            <hr class="m-md-5 m-4" style="width: 90%; background: linear-gradient(to right, #ccc, #333, #ccc); border: 0; height: 1px;">
                        @endif

                    @endforeach
                @endif
            </div>
        </div>

        <!--  PERMIS -->
        @php
            $lastUpdatePermis = $panneau->permis->max('updated_at');
        @endphp
        <div class="card shadow-sm rounded-3 mt-5">
            <div class="card-header bg-primary_pdcn text-white d-flex justify-content-between align-items-center">
                <div class="text-uppercase">
                    <i class="fa-solid fa-pager me-2"></i> Permis
                </div>
                <div class="col-6 text-end justify-content-end small d-flex align-items-center">
                    Dernière modification : {{ $lastUpdatePermis ? \Carbon\Carbon::parse($lastUpdatePermis)->format('d/m/Y H:i') : 'Non disponible' }}
                    <a href="#top" class="text-white ms-3 scroll-top-link" title="Remonter en haut">
                        <i class="fas fa-arrow-up"></i>
                    </a>
                </div>
            </div>

            <div class="card-body">                
                @if(isset($panneau->permis))
                    <div class="row anchor" id="permis-{{ $panneau->permis->id }}">                        
                        <!-- Type de permis-->
                        <div class="col-12 col-md-12">
                            {{ $panneau->permis->type }} <b>N° {{ $panneau->permis->numero }}</b> - {{ $panneau->permis->libelleType }} - 
                        </div>

                        <!-- Date permis -->
                        <div class="col-12 col-md-12 mb-2 mt-2">
                            <span class="d-block d-md-inline">
                                Date d'obtention : {{ $panneau->permis->dateObention ?: 'N.C' }}
                            </span>
                            <span class="d-block d-md-inline">
                                <span class="d-none d-md-inline"> - </span>
                                Date de publication : {{ $panneau->permis->publieLe ?: 'N.C' }}
                            </span>
                        </div>      
                    </div>                    
                @else                    
                    <div class="">
                        <i class="fa-solid fa-bullhorn"></i> Pour l'instant, aucun permis n'est renseigné. <br> <small>À venir prochainement...</small>
                    </div>
                @endif
            </div>
        </div>


        <!-- CHANTIER INTERDIT AU PUBLIC -->
        <div class="chantier-container mt-5">
            <div class="chantier-title">Chantier interdit au public</div>
                <div class="chantier-icons">
                 <img src="{{ asset('storage/images/default/'. rawurlencode('PDCN_Port du casque.png')) }}" alt="Casque obligatoire">
                 <img src="{{ asset('storage/images/default/'. rawurlencode('PDCN_risque general.png')) }}" alt="Danger">
                 <img src="{{ asset('storage/images/default/'. rawurlencode('PDCN_acces interdit.png')) }}" alt="Accès interdit">            
            </div>
        </div>

        <figure class="small mt-4">
            <blockquote class="blockquote fs-6">
                <p>Affichage dématérialisé autorisé selon Art R8221-1 </p>
            </blockquote>
            <figcaption class="blockquote-footer">
            Créé par décret n°2008-244 du 7 mars 2008  art.(V) Relatif au travail dissimulé, le décret n°2023-452 du 9 juin 2023</cite>
            </figcaption>
        </figure>

        

</div>

@endif


@endsection