@php $circle = isset($circle) ? '-circle' : ''; $hash = uniqid('', true); @endphp
@switch($socialNetwork)
    @case('facebook')
        <a data-share="facebook-{{ $hash }}" role="button" target="_blank" rel="me"
            href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(str_replace("http://", "https://", request()->fullurl())) }}&t={{ urlencode($title) }}"
            title="{{ __('Partager sur Facebook') }}">
            <img class="mx-2 my-1" src="{{ Vite::asset("resources/assets/images/facebook{$circle}.png") }}" alt="Facebook">
        </a>
        @break
    @case('twitter')
        <a data-share="twitter-{{ $hash }}" role="button" target="_blank" rel="me"
            href="https://twitter.com/share?url={{ urlencode(str_replace("http://", "https://", request()->fullurl())) }}&text={{ urlencode($title) }}"
            title="{{ __('Partager sur Twitter') }}">
            <img class="mx-2 my-1" src="{{ Vite::asset("resources/assets/images/twitter{$circle}.png") }}" alt="Twitter">
        </a>
        @break
    @case('linkedin')
        <a data-share="linkedin-{{ $hash }}" role="button" target="_blank" rel="me"
            href="http://www.linkedin.com/shareArticle?mini=true&url={{ urlencode(str_replace("http://", "https://", request()->fullurl())) }}&title={{ urlencode($title) }}"
            title="{{ __('Partager sur LinkedIn') }}">
            <img class="mx-2 my-1" src="{{ Vite::asset("resources/assets/images/linkedin{$circle}.png") }}" alt="Linkedin">
        </a>
        @break
    @case('mail')
        <a data-share="mail-{{ $hash }}" role="button" target="_blank"
            href="mailto:?{{ http_build_query([
                'subject' => __('Je souhaite partager ceci que j\'ai trouvé sur :appName', [
                    'appName' => config('app.name')
                ]),
                'body' => $title
            ]) }}"
            title="{{ __('Partager par E-mail') }}">
            <img class="mx-2 my-1" src="{{ Vite::asset('resources/assets/images/mail.png') }}" alt="{{ __('E-mail') }}">
        </a>
        @break
    @case('whatsapp')
        <a data-share="whatsapp-{{ $hash }}" role="button" target="_blank" rel="me"
            href="https://wa.me?text={{ urlencode($title) }} : {{ urlencode(str_replace("http://", "https://", request()->fullurl())) }}"
            title="{{ __('Partager sur Whatsapp') }}">
            <img class="mx-2 my-1" src="{{  Vite::asset("resources/assets/images/whatsapp{$circle}.png") }}" alt="Whatsapp">
        </a>
        @break
    @default
        @dd('Unhandled share')
@endswitch

@push('scripts')
<script nonce="{{ $nonce }}">
    document.addEventListener('DOMContentLoaded', function() {
        /** @type {HTMLLinkElement|null} */
        const facebook = document.querySelector('a[data-share="facebook-{{ $hash }}"]');
        /** @type {HTMLLinkElement|null} */
        const twitter = document.querySelector('a[data-share="twitter-{{ $hash }}"]');
        /** @type {HTMLLinkElement|null} */
        const linkedin = document.querySelector('a[data-share="linkedin-{{ $hash }}"]');
        /** @type {HTMLLinkElement|null} */
        const mail = document.querySelector('a[data-share="mail-{{ $hash }}"]');

        if(facebook) {
            facebook.addEventListener('click', function(e) {
                e.preventDefault();
                window.open(this.href, "Facebook", "height=285,width=550,resizable=1");
            });
        }
        if(twitter) {
            twitter.addEventListener('click', function(e) {
                e.preventDefault();
                window.open(this.href, "Twitter", "height=385,width=550,resizable=1");
            });
        }
        if(linkedin) {
            linkedin.addEventListener('click', function(e) {
                e.preventDefault();
                window.open(this.href, "LinkedIn", "height=485,width=550,resizable=1");
            });
        }
        if(mail) {
            mail.addEventListener('click', function(e) {
                e.preventDefault();
                window.open(this.href, "Mail", "height=485,width=550,resizable=1");
            });
        }
    });
</script>
@endpush