@extends('layouts.store.master')
@section('page','Blog Numero')
@section('classes_body','no-mg no-pd')
@section('body')

<section style="margin-top: 180px;">
    <div class="breadcrums wow animate__animated animate__fadeInUp">
        Inicio / Blog
    </div>
    <div class="container-fluid p-5">
        <div class="blog-publication">
            <div id="blog-image" style="min-width: 400px;">
                
            </div>
            <div id="blog-title" class="blog-title wow animate__animated animate__fadeInUp" style="margin-bottom: 15px;">
                
            </div>
            <div id="blog-content" class="blog-content wow animate__animated animate__fadeInUp">
            
            </div>
        </div>
        <button onclick="location.href='{{route('blogs.index')}}'" style="font-size: 12px; color: white; float: right;" type="submit" class="btn red px-5 py-2 wow animate__animated animate__fadeInUp">
            Leer más entradas
        </button>
    </div>
     @include('layouts.store.newsletter')
     <h5 class="section-title wow animate__animated animate__fadeInUp">Conoce nuestras marcas</h5>
    @include('layouts.store.brand_carousel')
    </section>
    @push('scripts')
        <!-- Se cambia versión slim a min de jQuery ya que causa error con las peticiones ajax y el preload no desaparece -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" 
            integrity="sha512-+NqPlbbtM1QqiK8ZAo4Yrj2c4lNQoGv8P79DPtKzj++l5jnN39rHA/xsqn8zE9l0uSoxaCdrOgFs6yjyfbBxSg==" 
            crossorigin="anonymous" 
            referrerpolicy="no-referrer"></script>
        @include('layouts.store.scripts.menu-footer');
        <script type="text/javascript" src="{{asset('/js/slick.min.js')}}"></script>
        <script src="https://wowjs.uk/dist/wow.min.js"></script>
        <script>
         new WOW().init();

         /**
             * Get individual blog register
             *
             * @author Diego Velez <diego.velez@nuvem.mx>
             * @created 2021-06-10
             * @param 
             * @return void
             */

         $(document).ready(function(){
                axios.get('{{config('store.api_medshipper_url')."get-blogs?enterprising_id=". env('ENTERPRISING_ID',false)}}').then(function (response) {
                    $.each(response.data.data,function(indice,row){
                       if (row.id=={{$id}}) {
                          $('#blog-image').append(`<img class="wow animate__animated animate__fadeInUp blog-image" src="`+row.images[0].url+`">`);
                          $('#blog-title').append(`<h2 style="font-size: 18px;">`+row.title+`</h2>`);
                          $('#blog-content').append(`<p style="font-size: 14px; text-align: justify; min-height:150px">`+row.content+`</p>`);
                       }
                    });
                }).catch(function (error) {
                    console.error(error);
                    let message = error;
                });  
         });
        </script>
    @endpush
@endsection