@extends('front/layouts.app')
@section('js')
    <script src="{{ asset('js/easyzoom.js') }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{ asset('js/slick/slick.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('.3holder').slick({
                infinite: true,
                slidesToShow: 3,
                slidesToScroll: 1
            });
            var base_url = '{{ url('/') }}';
            
            $('.add-cart.item_add').on('click', function(){
                 $.ajax({
                    url: base_url + "/ajax/count_product_click/" + $('#productId').val(),
                    type: "get",
                    success: function (response) {
                       // you will get response from your php page (what you echo or print)                 

                    }


                });
            });
            // Instantiate EasyZoom instances
            var $easyzoom = $('.easyzoom').easyZoom();

            // Setup thumbnails example
            var api1 = $easyzoom.filter('.easyzoom--with-thumbnails').data('easyZoom');
        
        
        
            $('.thumbnails').on('click', 'a', function(e) {
                    var $this = $(this);

                    e.preventDefault();

                    // Use EasyZoom's `swap` method
                    api1.swap($this.data('standard'), $this.attr('href'));
            });

            // Setup toggles example
            var api2 = $easyzoom.filter('.easyzoom--with-toggle').data('easyZoom');

            $('.toggle').on('click', function() {
                    var $this = $(this);

                    if ($this.data("active") === true) {
                            $this.text("Switch on").data("active", false);
                            api2.teardown();
                    } else {
                            $this.text("Switch off").data("active", true);
                            api2._init();
                    }
            });
        });
    </script>
@stop
@section('content')


    <div class="category-banner-container bg-gray">
        <div class="category-banner banner text-uppercase" style="background-color: rgba(237, 73, 00, 0.76);">
        <h1 class="text-white text-center">
            {{ $new->title }}
        </h1>
        </div>
    </div>
    <nav aria-label="breadcrumb" class="breadcrumb-nav">
        <div class="container">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="/"><i class="icon-home"></i></a></li>
                <li class="breadcrumb-item"><a href="{{ url('blog') }}">Novosti</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ $new->title }} </li>
            </ol>
        </div><!-- End .container -->
    </nav>

<!---->
            <div class="product">
                <div class="container">
                
            <!---->
            <div class="row">
                    <div class="col-md-9 product-price1">
                        <div class="row">
                            <div class="col-md-7 single-top">	
                                @if (!empty($new->image))
                                <img width="100%" height="100%" src="{{ asset('product_uploads/' . $new->image) }}" alt="" />
                                @endif
                                

                            </div>	
                        
                            <div class="col-md-5 single-top-in simpleCart_shelfItem">
                                <div class="single-para ">
                                            <div class="review">
                                                <h4>Akcija važi od {{ date('d.m.Y', strtotime($new->from)) }} do {{ date('d.m.Y', strtotime($new->to))  }}</h4>
                                                {{ $new->short_desc }}

                                            </div>
                                        <div class="clearfix"> </div>
                                        </div>
                            </div>
                        </div>
                        <div class="clearfix"> </div>
                        
                        <div class="cd-tabs mt-4">
                            <ul class="cd-tabs-content">
                                <li data-content="fashion" class="selected" >
                                    <div class="facts">
                                        {!! $new->long_desc !!}   
                                    </div>

                                </li>
                               
                                <div class="clearfix"></div>
                            </ul> 
                        </div> 
                        
                        @if(count($related) > 0)
                        <div class="top-product">
                            <h3 class="real">Proizvodi na akciji</h3>

                                <div class="3holder">
                                @foreach ($related as $prd)