templates/front/product/view.html.twig line 1

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <link rel="manifest" href="{{ asset('assets/manifest.json') }}">
  5.     {#    <link rel="icon" href="assets/images/favicon/2.png" type="image/x-icon" />#}
  6.     {#    <link rel="apple-touch-icon" href="assets/images/favicon/2.png" />#}
  7.     <meta name="theme-color" content="#F45C2C" />
  8.     <meta name="apple-mobile-web-app-capable" content="yes" />
  9.     <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  10.     <meta name="apple-mobile-web-app-title" content="pcboomboom.rs" />
  11.     <meta name="msapplication-TileImage" content="{{ asset('assets/images/logo/favicon_io (2)/favicon.ico') }}" />
  12.     <meta name="msapplication-TileColor" content="#FFFFFF" />
  13.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  14.     <link rel="preconnect" href="https://fonts.googleapis.com" />
  15.     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  16.     <link rel="preconnect" href="https://fonts.googleapis.com" />
  17.     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  19.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  20.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  21.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  22.     <meta name="description" content="
  23.     {% if product.metaDescription is not null%}
  24.         {{ product.metaDescription |trans }}
  25.     {% else %}
  26.         {{ constant('App\\Classes\\Data\\MetaTagsData::DESC') }}
  27.     {% endif %}">
  28.     <meta name="keywords" content="
  29.     {% if product.metaKeywords is not null%}
  30.         {{ product.metaKeywords |trans }}
  31.     {% else %}
  32.         {{ constant('App\\Classes\\Data\\MetaTagsData::KEYWORDS') }}
  33.     {% endif %}">
  34.     <meta name="author" content="pcboomboom.rs">
  35.     <link rel="icon" href="{{ asset('assets/images/logo/favicon_io (2)/favicon.ico') }}" type="image/x-icon">
  36.     <!-- Ako želite podržati i mobilne uređaje -->
  37.     <link rel="apple-touch-icon" href="{{ asset('assets/images/logo/favicon_io (2)/apple-touch-icon.png') }}">
  39.     <!-- facebook -->
  40.     <meta property="og:type" content="article" />
  41.     <meta property="og:title" content="{{ product.title |trans }} | pcboomboom.rs" />
  42.     <meta property="og:url" content="{{ app.request.uri }}" />
  43.     <meta property="og:image" content="{{ asset(product.mainImage.thumbnail500) }}"/>
  46.     <meta property="og:site_name" content="pcboomboom.rs - {{ constant('App\\Classes\\Data\\MetaTagsData::TITLE') }}"/>
  47.     <meta property="fb:admins" content="1285367254" />
  48.     <meta property="og:description" content="" />
  49.     <!-- ./facebook -->
  51.     <title>{{ product.title |trans }} - {{ constant('App\\Classes\\Data\\MetaTagsData::TITLE') }} | pcboomboom.rs</title>
  53.     <!-- Google font -->
  54.     <link rel="preconnect" href="https://fonts.gstatic.com">
  55.     <link href="https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700&display=swap" rel="stylesheet">
  57.     <!-- bootstrap css -->
  58.     <link id="rtl-link" rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/bootstrap.css') }}">
  60.     <!-- font-awesome css -->
  61.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/font-awesome.css') }}">
  63.     <!-- feather icon css -->
  64.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/feather-icon.css') }}">
  66.     <!--Plugin CSS file with desired skin-->
  67.     <link rel="stylesheet" href="{{ asset('assets/shop/assets/css/vendors/ion.rangeSlider.min.css') }}">
  69.     <!-- animation css -->
  70.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/animate.css') }}">
  72.     <!-- slick css -->
  73.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/slick/slick.css') }}">
  74.     <link rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/vendors/slick/slick-theme.css') }}">
  76.     <!-- Theme css -->
  77.     <link id="color-link" rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/demo2.css') }}">
  78.     <link id="color-link" rel="stylesheet" type="text/css" href="{{ asset('assets/shop/assets/css/demo1.css') }}">
  80. </head>
  82. <body class="theme-color1 light ltr">
  84. {% include 'front/include/header.html.twig' %}
  85. <!-- mobile fix menu -->
  86. {% include 'front/include/mobile_menu.html.twig' %}
  87. <div id="fb-root"></div>
  88. <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v14.0" nonce="kV2PhO6v"></script>
  89. <section class="breadcrumb-section section-b-space d-print-none">
  90.     <ul class="circles">
  91.         <li><img src="{{ asset('assets/shop/assets/circles/1.svg') }}"></li>
  92.         <li><img src="{{ asset('assets/shop/assets/circles/2.svg') }}"></li>
  93.         <li><img src="{{ asset('assets/shop/assets/circles/3.svg') }}"></li>
  94.         <li><img src="{{ asset('assets/shop/assets/circles/4.svg') }}"></li>
  95.         <li><img src="{{ asset('assets/shop/assets/circles/5.svg') }}"></li>
  96.         <li><img src="{{ asset('assets/shop/assets/circles/6.svg') }}"></li>
  97.         <li><img src="{{ asset('assets/shop/assets/circles/7.svg') }}"></li>
  98.         <li><img src="{{ asset('assets/shop/assets/circles/8.svg') }}"></li>
  99.         <li><img src="{{ asset('assets/shop/assets/circles/9.svg') }}"></li>
  100.         <li><img src="{{ asset('assets/shop/assets/circles/10.svg') }}"></li>
  102.     </ul>
  103.     <div class="container">
  104.         <div class="row">
  105.             <div class="col-12">
  106.                 <h3>PROIZVOD</h3>
  107.                 <ol class="breadcrumb">
  108.                     <li class="breadcrumb-item">
  109.                         <a href="{{ path('app_shop_home') }}">
  110.                             <i class="fas fa-home"></i>
  111.                         </a>
  112.                     </li>
  113.                     <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop_all') }}" class="text-dark">PRODAVNICA</a></li>
  114.                     {% if category.parent is not null %}
  115.                         {% if category.parent.parent is not null %}
  116.                             {% if category.parent.parent.parent is not null %}
  117.                                 {% if category.parent.parent.parent.parent is not null %}
  118.                                     <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop', {id:category.parent.parent.parent.parent.id}) }}" class="text-dark">{{ category.parent.parent.parent.parent.title }}</a></li>
  119.                                 {% endif %}
  120.                                 <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop', {id:category.parent.parent.parent.id}) }}" class="text-dark">{{ category.parent.parent.parent.title }}</a></li>
  121.                             {% endif %}
  122.                             <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop', {id:category.parent.parent.id}) }}" class="text-dark">{{ category.parent.parent.title }}</a></li>
  123.                         {% endif %}
  124.                         <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop', {id:category.parent.id}) }}" class="text-dark">{{ category.parent.title }}</a></li>
  125.                     {% endif %}
  126.                     <li class="breadcrumb-item" aria-current="page"><a href="{{ path('app_shop', {id:category.id}) }}" class="text-dark">{{ category.title }}</a></li>
  127.                     <li class="breadcrumb-item active" aria-current="page">{{ product.title |trans }}</li>
  128.                 </ol>
  129.             </div>
  130.         </div>
  131.     </div>
  132. </section>
  134. <section>
  135.     <div class="container">
  136.         <div class="row gx-4 gy-5">
  137.             <div class="col-12">
  138.                 <div class="details-items">
  139.                     <div class="row g-4">
  140.                         <div class="col-md-6">
  141.                             <div class="row">
  142.                                 <div class="col-lg-2 d-print-none">
  143.                                     <div class="details-image-vertical black-slide rounded">
  144.                                         <div>
  145.                                             <img src="{{ asset(product.mainImage.thumbnail100) }}"
  146.                                                  class="img-fluid blur-up lazyload" alt="">
  147.                                         </div>
  148.                                         {% if not product.image.empty %}
  149.                                             {% for img in product.image %}
  150.                                                 <div>
  151.                                                     <img src="{{ asset(img.thumbnail100) }}"
  152.                                                          class="img-fluid blur-up lazyload" alt="">
  153.                                                 </div>
  154.                                             {% endfor %}
  155.                                         {% endif %}
  156.                                     </div>
  157.                                 </div>
  158.                                 <div class="col-lg-10">
  159.                                     <div class="details-image-1 ratio_asos">
  160.                                         <div>
  161.                                             <img src="{{ asset(product.mainImage.thumbnail500) }}" id="zoom_00"
  162.                                                  data-zoom-image="{{ asset(product.mainImage.thumbnail500) }}"
  163.                                                  class="img-fluid w-100 image_zoom_cls-0 blur-up lazyload" alt="">
  164.                                         </div>
  165.                                         {% if not product.image.empty %}
  166.                                             {% for img in product.image %}
  167.                                                 <div>
  168.                                                     <img src="{{ asset(img.thumbnail500) }}" id="zoom_0{{ loop.index }}"
  169.                                                          data-zoom-image="{{ asset(img.thumbnail500) }}"
  170.                                                          class="img-fluid w-100 image_zoom_cls-0 blur-up lazyload" alt="">
  171.                                                 </div>
  172.                                             {% endfor %}
  173.                                         {% endif %}
  174.                                     </div>
  175.                                 </div>
  176.                             </div>
  177.                         </div>
  180.                         <div class="col-md-6">
  181.                             <div class="cloth-details-size">
  182.                                 <div class="details-image-concept">
  183.                                     <h3 class="text-muted">{{ product.category.title }}</h3>
  184.                                     <h2>{{ product.title }} <a href="{{ path('app_product_pdf', {id:product.id}) }}"><i class="fa fa-file-pdf mx-2"></i></a></h2>
  185.                                 </div>
  187.                                 <div class="label-section">
  188.                                     {% if product.new %}
  189.                                         <span class="label label-black">Novo</span>
  190.                                     {% endif %}
  191.                                     {% if product.discount %}
  192.                                         <span class="label label-theme">Popust</span>
  193.                                     {% endif %}
  194.                                     {% if product.superProduct %}
  195.                                         <span class="label label-theme">Super proizvod</span>
  196.                                     {% endif %}
  197.                                     {% if product.outOfStock %}
  198.                                         <span class="label label-theme">Nema na stanju</span>
  199.                                     {% endif %}
  200.                                     {% if product.isOutlet %}
  201.                                         <span class="label label-black">Outlet</span>
  202.                                     {% endif %}
  203.                                 </div>
  205.                                 {% if product.discount %}
  206.                                     <h3 class="price-detail">{{ ((product.pricePDV  | number_format(2, '.', ','))) }} RSD
  207.                                         <del>{{ ((product.price * ((product.vat/100) + 1)) | round)  | number_format(2, '.', ',') }} RSD</del>
  208.                                     </h3>
  209.                                 {% else %}
  210.                                     <h3 class="price-detail">{{ ((product.pricePDV  | number_format(2, '.', ','))) }} RSD</h3>
  211.                                 {% endif %}
  213.                                 <div id="selectSize" class="addeffect-section product-description border-product">
  214.                                     <h6 class="product-title size-text">Proizvođač</h6>
  216.                                     <div class="size-box">
  217.                                         <h6 class="product-title hurry-title d-block">{{ product.factory.title }}</h6>
  218.                                     </div>
  219.                                     {#                                    <h6 class="product-title size-text">Dobavljač</h6>#}
  221.                                     {#                                    <div class="size-box">#}
  222.                                     {#                                        <h6 class="product-title hurry-title d-block">{{ product.vendor.title }}</h6>#}
  223.                                     {#                                    </div>#}
  224.                                     <h6 class="product-title size-text">Atributi</h6>
  226.                                     {% set attributes = product.attribute %}
  228.                                     {% if not attributes.empty %}
  230.                                         {% set attributes = attributes|slice(0,9) %}
  232.                                         {% set chunkSize = 3 %}
  233.                                         {% set totalChunks = (attributes|length / chunkSize)|round(0, 'ceil') %}
  235.                                         {% for i in 0..(totalChunks - 1) %}
  236.                                             <div class="size-box">
  237.                                                 {% for atr in attributes|slice(i * chunkSize, chunkSize) %}
  238.                                                     <span class="label label-theme">{{ atr.title }} - {{ atr.value }}</span>
  239.                                                 {% endfor %}
  240.                                             </div>
  241.                                         {% endfor %}
  243.                                     {% endif %}
  245.                                     <h6 class="product-title size-text">Šifra proizvoda</h6>
  247.                                     <div class="size-box">
  248.                                         <h6 class="product-title hurry-title d-block">#{{ product.sku }} - {{ product.vendor.id }}</h6>
  249.                                     </div>
  251.                                     <h6 class="product-title size-text">Barkod</h6>
  253.                                     <div class="size-box">
  254.                                         <h6 class="product-title hurry-title d-block">{{ product.barcode }}</h6>
  255.                                     </div>
  257.                                     {#                                    <h6 class="product-title size-text">Te</h6>#}
  259.                                     {#                                    <div class="size-box">#}
  260.                                     {#                                        <h6 class="product-title hurry-title d-block">{{ product.weight | round }} kg</h6>#}
  261.                                     {#                                    </div>#}
  262.                                     {% if product.connected is not null %}
  263.                                         <div class="color-image">
  264.                                             <div class="image-select">
  265.                                                 <h5>Povezani proizvod:</h5>
  266.                                                 <ul class="image-section">
  267.                                                     <li>
  268.                                                         <a href="{{ path('app_shop_product_view', {id: product.connected.id }) }}">
  269.                                                             <img src="{{ asset(product.connected.mainImage.thumbnail100) }}"
  270.                                                                  class="img-fluid blur-up lazyload" alt="">
  271.                                                         </a>
  272.                                                     </li>
  273.                                                 </ul>
  274.                                             </div>
  275.                                         </div>
  276.                                     {% endif %}
  279.                                     <h6 class="product-title product-title-2 d-block d-print-none">Količina</h6>
  280.                                     {% if not product.outOfStock %}
  281.                                     <form id="add-to-cart-form" method="post">
  282.                                         <input name="pid" type="hidden" id="pid" value="{{ product.id }}"/>
  283.                                         <div class="qty-box d-print-none">
  284.                                             <div class="input-group">
  285.                                                 <span class="input-group-prepend">
  286.                                                     <button type="button" class="btn quantity-left-minus" data-type="minus" data-field="">
  287.                                                         <i class="fas fa-minus"></i>
  288.                                                     </button>
  289.                                                 </span>
  290.                                                 <input type="text" name="quantity" class="form-control input-number" value="1">
  291.                                                 <span class="input-group-prepend">
  292.                                                         <button type="button" class="btn quantity-right-plus" data-type="plus" data-field="">
  293.                                                             <i class="fas fa-plus"></i>
  294.                                                         </button>
  295.                                                 </span>
  296.                                             </div>
  297.                                         </div>
  298.                                 </div>
  299.                                 <div class="product-buttons d-print-none">
  300.                                     {% if app.user %}
  301.                                         <a href="#" class="btn btn-solid" id="wishList" data-product-id="{{ product.id }}">
  302.                                             <i class="fa fa-bookmark fz-16 me-2"></i>
  303.                                             <span>Dodajte u omiljene</span>
  304.                                         </a>
  305.                                     {% endif %}
  306.                                     <button type="submit" id="cartEffect" class="btn btn-solid hover-solid btn-animation">
  307.                                         <i class="fa fa-shopping-cart"></i>
  308.                                         <span style="font-weight: bold;">Dodajte u korpu</span>
  309.                                     </button>
  310.                                 </div>
  311.                                 </form>
  313.                                 {% else %}
  314.                                 <input name="pid" type="hidden" id="pid" value="{{ product.id }}"/>
  315.                                 <div class="qty-box d-print-none">
  316.                                     <div class="input-group">
  317.                                                     <span class="input-group-prepend">
  318.                                                         <button type="button" disabled class="btn quantity-left-minus" data-type="minus" data-field="">
  319.                                                             <i class="fas fa-minus"></i>
  320.                                                         </button>
  321.                                                     </span>
  322.                                         <input type="text" name="quantity" disabled class="form-control input-number"
  323.                                                value="1">
  324.                                         <span class="input-group-prepend">
  325.                                                             <button type="button" class="btn quantity-right-plus"
  326.                                                                     data-type="plus" disabled data-field="">
  327.                                                                 <i class="fas fa-plus"></i>
  328.                                                             </button>
  329.                                                         </span>
  330.                                     </div>
  331.                                 </div>
  332.                             </div>
  333.                             <div class="product-buttons d-print-none">
  334.                                 {% if app.user %}
  335.                                     <a href="#" class="btn btn-solid" id="wishList" data-product-id="{{ product.id }}">
  336.                                         <i class="fa fa-bookmark fz-16 me-2"></i>
  337.                                         <span>Dodajte u omiljene</span>
  338.                                     </a>
  339.                                 {% endif %}
  340.                                 <button type="submit" id="cartEffect" disabled
  341.                                         class="btn btn-solid hover-solid btn-animation">
  342.                                     <i class="fa fa-shopping-cart"></i>
  343.                                     <span style="font-weight: bold;">Dodajte u korpu</span>
  345.                                 </button>
  346.                             </div>
  347.                             {% endif %}
  348.                             <ul class="product-count shipping-order d-print-none">
  349.                                 <li>
  350.                                     <img src="{{ asset('assets/shop/assets/images/gif/truck.png') }}" class="img-fluid blur-up lazyload" alt="image">
  351.                                     {#                                            <span class="lang">{{ product.deliveryDesc }}</span> / <span class="lang">&nbsp;{{ product.daysDelivery }} radna dana&nbsp;</span>#}
  352.                                     {#                                            <span class="lang">&nbsp;{{ product.priceDelivery | number_format(2, '.', ',') }} RSD</span>#}
  353.                                     <span class="lang"><span class="lang">&nbsp;Isporuka do 7 radnih dana.&nbsp;</span>
  354.                                             <span class="lang">&nbsp;Dostavu plaćate naknadno kuriru pri preuzimanju pošiljke.</span>
  355.                                 </li>
  356.                             </ul>
  357.                             <div class="border-product d-print-none">
  358.                                 <h6 class="product-title d-block">Podelite</h6>
  359.                                 <div class="product-icon">
  360.                                     <ul class="product-social">
  361.                                         <li>
  363.                                             {#                                            <div  data-href="https://pcboomboom.rs{{ path('app_shop_product_view', {id: product.id }) }}" data-layout="button_count" data-size="small">#}
  364.                                             {#                                                <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fpcboomboom.rs%2Fproizvod" class="fb-xfbml-parse-ignore">#}
  365.                                             {#                                                    <i class="fab fa-facebook-f"></i>#}
  366.                                             {#                                                </a>#}
  367.                                             {#                                            </div>#}
  369.                                             <div class="fb-share-button" data-href="https://pcboomboom.rs{{ path('app_shop_product_view', {id: product.id }) }}" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">Podelite</a></div>
  370.                                             {#                                            <div class="fb-share-button" data-href="http://prikolicacentar.rs/proizvod/{{ product.id }}/" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">Share</a></div>#}
  372.                                             {#                                            <div  data-href="http://pcboomboom.rs/proizvod" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore"><i class="fab fa-facebook-f"></i></a></div>#}
  373.                                             {#                                            <div  data-href="http://pcboomboom.rs/proizvod/{{ product.id }}/" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore"><i class="fab fa-facebook-f"></i></a></div>#}
  374.                                             {#
  376.                                             <a href="#">
  377.                                                 <i class="fab fa-facebook-f"></i>
  378.                                             </a>
  379.                                         </li>
  380.                                         <li>
  381.                                             <a href="https://www.google.com/">
  382.                                                 <i class="fab fa-google-plus-g"></i>
  383.                                             </a>
  384.                                         </li>
  385.                                         <li>
  386.                                             <a href="https://twitter.com/">
  387.                                                 <i class="fab fa-twitter"></i>
  388.                                             </a>
  389.                                         </li>
  390.                                         <li>
  391.                                             <a href="https://www.instagram.com/">
  392.                                                 <i class="fab fa-instagram"></i>
  393.                                             </a>
  394.                                         </li>
  395.                                         <li class="pe-0">
  396.                                             <a href="https://www.google.com/">
  397.                                                 <i class="fas fa-rss"></i>
  398.                                             </a>
  399.                                         </li>
  400.                                     </ul>
  401.                                 </div>
  402.                             </div>
  403. {#                            <div class="border-product">#}
  404.                                             {#                                    <div class="product-icon">#}
  405.                                             {#                                        <ul class="product-social">#}
  406.                                             {#                                            <li>#}
  407.                                             {#                                                <div class="fb-share-button" data-href="http://pcboomboom.rs/proizvod" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">Share</a></div>#}
  408.                                             {#                                                <div class="fb-share-button" data-href="http://pcboomboom.rs/proizvod/{{ product.id }}/" data-layout="button_count" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">Share</a></div>#}
  409.                                             {#                                            </li>#}
  410.                                             {#                                        </ul>#}
  411.                                             {#                                    </div>#}
  412.                                             {#                                </div>#}
  413.                                 </div>
  414.                             </div>
  416.                         </div>
  417.                     </div>
  418.                 </div>
  419.                 <div id="toast-container" style="position: fixed; top: 20px; right: 20px; z-index: 9999;"></div>
  421.                 <div class="col-12 mb-4">
  422.                     <div class="cloth-review">
  423.                         <nav>
  424.                             <div class="nav nav-tabs" id="nav-tab" role="tablist">
  425.                                 <button class="nav-link active" id="nav-speci-tab" data-bs-toggle="tab" data-bs-target="#desc" type="button">Specifikacija</button>
  426.                                 <button class="nav-link d-print-none" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#opt" type="button">Deklaracija</button>
  427.                                 <button class="nav-link d-print-none" id="nav-contact-tab" data-bs-toggle="tab" data-bs-target="#review" type="button">Komentari</button>
  428.                             </div>
  429.                         </nav>
  430.                         <div class="tab-content" id="nav-tabContent">
  431.                             <div class="tab-pane fade show active" id="desc">
  432.                                 <div class="mb-4 table-responsive">
  434.                                     {{ product.description |raw }}
  436.                                 </div>
  437.                             </div>
  440.                             <div class="tab-pane fade " id="opt">
  441.                                 <div class="table-responsive mb-4">
  443.                                     {{ product.options |raw }}
  445.                                 </div>
  446.                             </div>
  448.                             <div class="tab-pane fade" id="review">
  449.                                 <div class="row g-4">
  450.                                     {% if app.user %}
  451.                                         <form class="row" id="commentForm">
  452.                                             <div class="col-lg-2">
  453.                                                 <div class="d-block my-3">
  454.                                                     <div class="form-check custome-radio-box">
  455.                                                         <input class="form-check-input" type="radio" name="rating" id="credit" value="1">
  456.                                                         <label class="form-check-label" for="credit">
  457.                                                             <ul class="rating d-inline-block">
  458.                                                                 <li>
  459.                                                                     <i class="fas fa-star theme-color"></i>
  460.                                                                 </li>
  461.                                                                 <li>
  462.                                                                     <i class="fas fa-star"></i>
  463.                                                                 </li>
  464.                                                                 <li>
  465.                                                                     <i class="fas fa-star"></i>
  466.                                                                 </li>
  467.                                                                 <li>
  468.                                                                     <i class="fas fa-star"></i>
  469.                                                                 </li>
  470.                                                                 <li>
  471.                                                                     <i class="fas fa-star"></i>
  472.                                                                 </li>
  473.                                                             </ul>
  474.                                                         </label>
  475.                                                     </div>
  476.                                                 </div>
  477.                                                 <div class="d-block my-3">
  479.                                                     <div class="form-check custome-radio-box">
  480.                                                         <input class="form-check-input" type="radio" name="rating" id="credit" value="2">
  481.                                                         <label class="form-check-label" for="credit">
  482.                                                             <ul class="rating d-inline-block">
  483.                                                                 <li>
  484.                                                                     <i class="fas fa-star theme-color"></i>
  485.                                                                 </li>
  486.                                                                 <li>
  487.                                                                     <i class="fas fa-star theme-color"></i>
  488.                                                                 </li>
  489.                                                                 <li>
  490.                                                                     <i class="fas fa-star"></i>
  491.                                                                 </li>
  492.                                                                 <li>
  493.                                                                     <i class="fas fa-star"></i>
  494.                                                                 </li>
  495.                                                                 <li>
  496.                                                                     <i class="fas fa-star"></i>
  497.                                                                 </li>
  498.                                                             </ul>
  499.                                                         </label>
  500.                                                     </div>
  502.                                                 </div>
  503.                                                 <div class="d-block my-3">
  504.                                                     <div class="form-check custome-radio-box">
  505.                                                         <input class="form-check-input" type="radio" name="rating" id="credit" value="3">
  506.                                                         <label class="form-check-label" for="credit">
  507.                                                             <ul class="rating d-inline-block">
  508.                                                                 <li>
  509.                                                                     <i class="fas fa-star theme-color"></i>
  510.                                                                 </li>
  511.                                                                 <li>
  512.                                                                     <i class="fas fa-star theme-color"></i>
  513.                                                                 </li>
  514.                                                                 <li>
  515.                                                                     <i class="fas fa-star theme-color"></i>
  516.                                                                 </li>
  517.                                                                 <li>
  518.                                                                     <i class="fas fa-star"></i>
  519.                                                                 </li>
  520.                                                                 <li>
  521.                                                                     <i class="fas fa-star"></i>
  522.                                                                 </li>
  523.                                                             </ul>
  524.                                                         </label>
  525.                                                     </div>
  526.                                                 </div>
  527.                                                 <div class="d-block my-3">
  529.                                                     <div class="form-check custome-radio-box">
  530.                                                         <input class="form-check-input" type="radio" name="rating" id="credit" value="4">
  531.                                                         <label class="form-check-label" for="credit">
  532.                                                             <ul class="rating d-inline-block">
  533.                                                                 <li>
  534.                                                                     <i class="fas fa-star theme-color"></i>
  535.                                                                 </li>
  536.                                                                 <li>
  537.                                                                     <i class="fas fa-star theme-color"></i>
  538.                                                                 </li>
  539.                                                                 <li>
  540.                                                                     <i class="fas fa-star theme-color"></i>
  541.                                                                 </li>
  542.                                                                 <li>
  543.                                                                     <i class="fas fa-star theme-color"></i>
  544.                                                                 </li>
  545.                                                                 <li>
  546.                                                                     <i class="fas fa-star"></i>
  547.                                                                 </li>
  548.                                                             </ul>
  549.                                                         </label>
  550.                                                     </div>
  552.                                                 </div>
  553.                                                 <div class="d-block my-3">
  555.                                                     <div class="form-check custome-radio-box">
  556.                                                         <input class="form-check-input" type="radio" name="rating" id="credit" value="5">
  557.                                                         <label class="form-check-label" for="credit">
  558.                                                             <ul class="rating d-inline-block">
  559.                                                                 <li>
  560.                                                                     <i class="fas fa-star theme-color"></i>
  561.                                                                 </li>
  562.                                                                 <li>
  563.                                                                     <i class="fas fa-star theme-color"></i>
  564.                                                                 </li>
  565.                                                                 <li>
  566.                                                                     <i class="fas fa-star theme-color"></i>
  567.                                                                 </li>
  568.                                                                 <li>
  569.                                                                     <i class="fas fa-star theme-color"></i>
  570.                                                                 </li>
  571.                                                                 <li>
  572.                                                                     <i class="fas fa-star theme-color"></i>
  573.                                                                 </li>
  574.                                                             </ul>
  575.                                                         </label>
  576.                                                     </div>
  577.                                                 </div>
  578.                                             </div>
  579.                                             <div class="col-lg-10">
  580.                                                 <div class="review-box">
  581.                                                     <div class="row g-4">
  582.                                                         <div class="col-12 col-md-6">
  583.                                                             <input hidden="hidden" name="member" value="{{ app.user.id }}">
  584.                                                             <label class="mb-1" for="name">Ime</label>
  585.                                                             <input type="text" class="form-control" id="name"
  586.                                                                    placeholder="Unesite Vaše ime" required value="{{ app.user.fullName }}">
  587.                                                         </div>
  588.                                                         <div class="col-12 col-md-6">
  589.                                                             <label class="mb-1" for="id">Email</label>
  590.                                                             <input type="email" class="form-control" id="id"
  591.                                                                    placeholder="Unesite Vaš email" required value="{{ app.user.email }}">
  592.                                                         </div>
  593.                                                         <div class="col-12">
  594.                                                             <label class="mb-1" for="comments">Komentar</label>
  595.                                                             <textarea name="comment" class="form-control" placeholder="Ostavite komentar" id="comments" style="height: 100px" required></textarea>
  596.                                                         </div>
  597.                                                         <div class="col-12">
  598.                                                             <button type="submit" class="btn default-light-theme default-theme default-theme-2">Sačuvajte</button>
  599.                                                         </div>
  600.                                                     </div>
  601.                                                 </div>
  602.                                             </div>
  603.                                         </form>
  604.                                     {% else %}
  605.                                         <div class="col-lg-12">
  606.                                             <div class="customer-rating">
  607.                                                 <h3>Morate biti prijavljeni da bi mogli ostavljati komentare.</h3>
  608.                                             </div>
  609.                                         </div>
  610.                                     {% endif %}
  612.                                     <div class="col-12 mt-4 mb-4">
  613.                                         <div class="customer-review-box">
  615.                                             {% if productComments is not empty %}
  616.                                                 <h4>Predhodni komentari</h4>
  617.                                                 {% for comm in productComments %}
  618.                                                     {% if not comm.isSuspended %}
  619.                                                         <div class="customer-section">
  621.                                                             <div class="customer-details">
  622.                                                                 <h5>{{ comm.createdBy.fullName }}</h5>
  623.                                                                 {% if comm.ocena is not null %}
  624.                                                                     {% if comm.ocena == 1 %}
  625.                                                                         <ul class="rating my-2 d-inline-block">
  626.                                                                             <li>
  627.                                                                                 <i class="fas fa-star theme-color"></i>
  628.                                                                             </li>
  629.                                                                             <li>
  630.                                                                                 <i class="fas fa-star"></i>
  631.                                                                             </li>
  632.                                                                             <li>
  633.                                                                                 <i class="fas fa-star"></i>
  634.                                                                             </li>
  635.                                                                             <li>
  636.                                                                                 <i class="fas fa-star"></i>
  637.                                                                             </li>
  638.                                                                             <li>
  639.                                                                                 <i class="fas fa-star"></i>
  640.                                                                             </li>
  641.                                                                         </ul>
  642.                                                                     {% endif %}
  643.                                                                     {% if comm.ocena == 2 %}
  644.                                                                         <ul class="rating my-2 d-inline-block">
  645.                                                                             <li>
  646.                                                                                 <i class="fas fa-star theme-color"></i>
  647.                                                                             </li>
  648.                                                                             <li>
  649.                                                                                 <i class="fas fa-star theme-color"></i>
  650.                                                                             </li>
  651.                                                                             <li>
  652.                                                                                 <i class="fas fa-star"></i>
  653.                                                                             </li>
  654.                                                                             <li>
  655.                                                                                 <i class="fas fa-star"></i>
  656.                                                                             </li>
  657.                                                                             <li>
  658.                                                                                 <i class="fas fa-star"></i>
  659.                                                                             </li>
  660.                                                                         </ul>
  661.                                                                     {% endif %}
  662.                                                                     {% if comm.ocena == 3 %}
  663.                                                                         <ul class="rating my-2 d-inline-block">
  664.                                                                             <li>
  665.                                                                                 <i class="fas fa-star theme-color"></i>
  666.                                                                             </li>
  667.                                                                             <li>
  668.                                                                                 <i class="fas fa-star theme-color"></i>
  669.                                                                             </li>
  670.                                                                             <li>
  671.                                                                                 <i class="fas fa-star theme-color"></i>
  672.                                                                             </li>
  673.                                                                             <li>
  674.                                                                                 <i class="fas fa-star"></i>
  675.                                                                             </li>
  676.                                                                             <li>
  677.                                                                                 <i class="fas fa-star"></i>
  678.                                                                             </li>
  679.                                                                         </ul>
  680.                                                                     {% endif %}
  681.                                                                     {% if comm.ocena == 4 %}
  682.                                                                         <ul class="rating my-2 d-inline-block">
  683.                                                                             <li>
  684.                                                                                 <i class="fas fa-star theme-color"></i>
  685.                                                                             </li>
  686.                                                                             <li>
  687.                                                                                 <i class="fas fa-star theme-color"></i>
  688.                                                                             </li>
  689.                                                                             <li>
  690.                                                                                 <i class="fas fa-star theme-color"></i>
  691.                                                                             </li>
  692.                                                                             <li>
  693.                                                                                 <i class="fas fa-star theme-color"></i>
  694.                                                                             </li>
  695.                                                                             <li>
  696.                                                                                 <i class="fas fa-star"></i>
  697.                                                                             </li>
  698.                                                                         </ul>
  699.                                                                     {% endif %}
  700.                                                                     {% if comm.ocena == 5 %}
  701.                                                                         <ul class="rating my-2 d-inline-block">
  702.                                                                             <li>
  703.                                                                                 <i class="fas fa-star theme-color"></i>
  704.                                                                             </li>
  705.                                                                             <li>
  706.                                                                                 <i class="fas fa-star theme-color"></i>
  707.                                                                             </li>
  708.                                                                             <li>
  709.                                                                                 <i class="fas fa-star theme-color"></i>
  710.                                                                             </li>
  711.                                                                             <li>
  712.                                                                                 <i class="fas fa-star theme-color"></i>
  713.                                                                             </li>
  714.                                                                             <li>
  715.                                                                                 <i class="fas fa-star theme-color"></i>
  716.                                                                             </li>
  717.                                                                         </ul>
  718.                                                                     {% endif %}
  719.                                                                 {% endif %}
  720.                                                                 <p class="font-light">{{ comm.comment }}</p>
  722.                                                                 <p class="date-custo font-light">- {{ comm.created | date("d.m.Y") }}</p>
  723.                                                             </div>
  724.                                                         </div>
  725.                                                     {% endif %}
  726.                                                 {% endfor %}
  727.                                             {% else %}
  728.                                                 <h4>Ovaj proizvod nije komentarisan. Budite prvi koji će ostaviti mišljenje o proizvodu.</h4>
  729.                                             {% endif %}
  731.                                         </div>
  732.                                     </div>
  733.                                 </div>
  734.                             </div>
  735.                         </div>
  736.                     </div>
  737.                 </div>
  738.             </div>
  739.         </div>
  740. </section>
  741. <!-- Shop Section end -->
  743. {{ render(controller('App\\Controller\\shop\\ProductController::productsCategory', { category: product.category } )) }}
  747. <!-- Newsletter modal start -->
  748. {% include 'front/include/subscribe.html.twig' %}
  749. <!-- Newsletter modal end -->
  750. <!-- footer start -->
  751. {% include 'front/include/footer.html.twig' %}
  752. <!-- footer end -->
  754. <!-- tap to top Section Start -->
  755. {% include 'front/include/top.html.twig' %}
  756. <!-- tap to top Section End -->
  758. <div class="bg-overlay"></div>
  760. <!-- latest jquery-->
  761. <script src="{{ asset('assets/shop/assets/js/jquery-3.5.1.min.js') }}"></script>
  763. <!-- Add To Home js -->
  764. <script src="{{ asset('pwa.js') }}"></script>
  766. <!-- Bootstrap js-->
  767. <script src="{{ asset('assets/shop/assets/js/bootstrap/bootstrap.bundle.min.js') }}"></script>
  769. <!-- feather icon js-->
  770. <script src="{{ asset('assets/shop/assets/js/feather/feather.min.js') }}"></script>
  772. <!-- lazyload js-->
  773. <script src="{{ asset('assets/shop/assets/js/lazysizes.min.js') }}"></script>
  775. <!-- Slick js-->
  776. <script src="{{ asset('assets/shop/assets/js/slick/slick.js') }}"></script>
  777. <script src="{{ asset('assets/shop/assets/js/slick/slick-animation.min.js') }}"></script>
  778. <script src="{{ asset('assets/shop/assets/js/slick/custom_slick.js') }}"></script>
  780. <!-- Notify js-->
  781. <script src="{{ asset('assets/shop/assets/js/bootstrap/bootstrap-notify.min.js') }}"></script>
  783. <!-- timer js -->
  784. {#<script src="{{ asset('assets/shop/assets/js/timer.js') }}"></script>#}
  786. <!-- sticky cart bottom js-->
  787. <script src="{{ asset('assets/shop/assets/js/sticky-cart-bottom.js') }}"></script>
  789. <!-- sticky cart bottom js-->
  790. <script src="{{ asset('assets/shop/assets/js/check-box-select.js') }}"></script>
  792. <!-- Zoom Js -->
  793. <script src="{{ asset('assets/shop/assets/js/jquery.elevatezoom.js') }}"></script>
  794. <script src="{{ asset('assets/shop/assets/js/zoom-filter.js') }}"></script>
  796. <!--Plugin JavaScript file-->
  797. {#<script src="{{ asset('assets/shop/assets/js/ion.rangeSlider.min.js') }}"></script>#}
  799. <!-- Filter Hide and show Js -->
  800. <script src="{{ asset('assets/shop/assets/js/filter.js') }}"></script>
  802. <!-- add to cart modal resize -->
  803. {#<script src="{{ asset('assets/shop/assets/js/cart_modal_resize.js') }}"></script>#}
  805. <!-- Notify js-->
  806. <script src="{{ asset('assets/shop/assets/js/bootstrap/bootstrap-notify.min.js') }}"></script>
  808. <!-- script js -->
  809. {#<script src="{{ asset('assets/shop/assets/js/theme-setting.js') }}"></script>#}
  810. <script src="{{ asset('assets/shop/assets/js/script.js') }}"></script>
  811. <script>
  812.     $(function() {
  813.         $('.cloth-review .tab-pane table').each(function() {
  814.             console.log('Found table:', this);
  816.             // Uklonite sve prethodne inline stilove i klase
  817.             $(this).removeAttr('style').removeClass().addClass('table table-bordered table-striped table-hover');
  818.             $(this).find('thead').removeAttr('style').removeClass();
  819.             $(this).find('tbody tr').removeAttr('style').removeClass();
  820.             $(this).find('th').removeAttr('style').removeClass();
  821.             $(this).find('td').removeAttr('style').removeClass();
  823.             // Smanjite margine i padding koristeći jQuery
  824.             $(this).css({
  825.                 'margin-bottom': '1rem',  // Smanjenje margine između tabela
  826.             });
  828.             // Postavite konkretne stilove za th i td elemente
  829.             $(this).find('th').css({
  830.                 'border': '1px solid #border-color',  // Postavite border-color
  831.                 'background-color': '#light-blue',    // Postavite light-blue
  832.                 'font-weight': '500',
  833.                 'padding': '0.5rem !important',
  834.                 'white-space': 'pre'
  835.             });
  837.             $(this).find('td').css({
  838.                 'border': '1px solid #border-color',  // Postavite border-color
  839.                 'text-align': 'left',
  840.                 'padding': '0.5rem !important',
  841.                 'white-space': 'pre'
  842.             });
  844.             // Isključite specifične stilove iz svih th i td elemenata
  845.             $(this).find('th, td').each(function() {
  846.                 var currentStyles = $(this).attr('style') || '';
  847.                 var newStyles = currentStyles
  848.                     .replace(/white-space:\s*nowrap;?\s*/gi, '')  // Uklanja white-space: nowrap;
  849.                     .replace(/text-align:\s*center;?\s*/gi, '');  // Uklanja text-align: center;
  851.                 $(this).attr('style', newStyles.trim());  // Postavlja ažurirane stilove
  852.             });
  854.             console.log('Specific styles applied and previous styles removed.');
  855.         });
  856.     });
  857.     $(function () {
  858.         $('[data-toggle="tooltip"]').tooltip()
  859.     })
  863.     $(document).ready(function() {
  864.         function updateNavbarSearchbar() {
  865.             // Provera da li <header> ima klasu 'nav-down' ili 'nav-up'
  866.             if ($('header').hasClass('nav-down') || $('header').hasClass('nav-up')) {
  867.                 // Ukloni inline stil ako postoji
  868.                 $('.main-header.navbar-searchbar').removeAttr('style');
  869.             } else {
  870.                 // Postavi inline stilove ako klase 'nav-down' ili 'nav-up' ne postoje
  871.                 $('.main-header.navbar-searchbar').css({
  872.                     'position': 'relative',
  873.                     // 'top': '-100px', // Zavisno od toga da li ti ovo treba ili ne
  874.                     'left': '0',
  875.                     'width': '100%',
  876.                     'margin-top': '0',
  877.                     'background-color': 'white', // Zamena za $white
  878.                     'box-shadow': '0px 4px 10px rgba(23, 32, 90, 0.15)',
  879.                     'transition': 'all 0.5s ease',
  880.                     'z-index': '6'
  881.                 });
  882.             }
  883.         }
  885.         // Poziv funkcije prilikom učitavanja stranice
  886.         updateNavbarSearchbar();
  888.         // Ako se menja klasa na headeru, pozovi ponovo
  889.         $(window).on('scroll', function() {
  890.             updateNavbarSearchbar();
  891.         });
  892.         $('#add-to-cart-form').on('submit', function(event) {
  893.             event.preventDefault();
  895.             $.ajax({
  896.                 url: '{{ path("app_cart_add") }}',
  897.                 type: 'POST',
  898.                 data: $(this).serialize(),
  899.                 success: function(response) {
  900.                     if (response.status === 'success') {
  901.                         // Update the cart item count in the header
  902.                         $('#korpa').text(response.totalItems);
  904.                         // Show success toast
  905.                         $.notify({
  906.                             message: response.message
  907.                         },{
  908.                             type: 'success',
  909.                             delay: 2000
  910.                         });
  911.                     } else {
  912.                         // Show error toast
  913.                         $.notify({
  914.                             message: response.message
  915.                         },{
  916.                             type: 'danger',
  917.                             delay: 2000
  918.                         });
  919.                     }
  920.                 }
  921.             });
  922.         });
  924.         $('#wishList').on('click', function(e) {
  925.             e.preventDefault(); // Sprečava standardno ponašanje linka
  927.             var productId = $(this).data('product-id');
  929.             $.ajax({
  930.                 url: '{{ path("app_favorite_add") }}', // Symfony ruta za dodavanje omiljenog
  931.                 type: 'GET', // Metod zahteva, može biti i 'GET' ako je vaša ruta tako definisana
  932.                 data: { product_id: productId }, // Podaci koji se šalju
  933.                 success: function(response) {
  934.                     if (response.status === 'success') {
  935.                         // Update the cart item count in the header
  936.                         $('#listaZelja').text(response.totalFavorites);
  938.                         // Show success toast
  939.                         $.notify({
  940.                             message: response.message
  941.                         },{
  942.                             type: 'success',
  943.                             delay: 2000
  944.                         });
  945.                     } else {
  946.                         // Show error toast
  947.                         $.notify({
  948.                             message: response.message
  949.                         },{
  950.                             type: 'danger',
  951.                             delay: 2000
  952.                         });
  953.                     }
  954.                 }
  955.             });
  956.         });
  958.         $('#commentForm').submit(function(event) {
  959.             event.preventDefault();
  961.             $.ajax({
  962.                 url: '{{ path('app_comment_add', {id: product.id}) }}',
  963.                 method: 'POST',
  964.                 data: $(this).serialize(),
  965.                 success: function(response) {
  966.                     if (response.status === 'success') {
  967.                         $.notify({ message: response.message }, { type: 'success' });
  968.                     } else {
  969.                         $.notify({ message: response.message }, { type: 'danger' });
  970.                     }
  971.                 },
  972.                 error: function() {
  973.                     $.notify({ message: 'Došlo je do greške. Pokušajte ponovo.' }, { type: 'danger' });
  974.                 }
  975.             });
  976.         });
  977.     });
  978.     {% block footerjavascript %}
  979.     $(document).ready(function() {
  980.         $('.addtoKorpa-btn').on('click', function() {
  981.             // Prikupljanje ID-a proizvoda iz data atributa dugmeta
  982.             var productId = $(this).data('product-id');
  984.             // Pronalazak odgovarajuće forme i slanje forme preko AJAX-a
  985.             var $form = $('#add-to-cart-form-' + productId);
  987.             $.ajax({
  988.                 url: $form.attr('action'),
  989.                 type: 'POST',
  990.                 data: $form.serialize(),
  991.                 success: function(response) {
  992.                     if (response.status === 'success') {
  993.                         // Ažuriranje broja proizvoda u korpi u zaglavlju
  994.                         $('#korpa').text(response.totalItems);
  996.                         // Prikazivanje uspešne poruke
  997.                         $.notify({
  998.                             message: response.message
  999.                         },{
  1000.                             type: 'success',
  1001.                             delay: 2000
  1002.                         });
  1003.                     } else {
  1004.                         // Prikazivanje poruke o grešci
  1005.                         $.notify({
  1006.                             message: response.message
  1007.                         },{
  1008.                             type: 'danger',
  1009.                             delay: 2000
  1010.                         });
  1011.                     }
  1012.                 }
  1013.             });
  1015.             return false; // Sprečavanje default submitovanja forme
  1016.         });
  1017.         $('.addtoKorpaModal-btn').on('click', function() {
  1018.             // Pronalazak najbliže forme roditelja dugmeta
  1019.             var $form = $(this).closest('form');
  1021.             $.ajax({
  1022.                 url: $form.attr('action'),
  1023.                 type: 'POST',
  1024.                 data: $form.serialize(),
  1025.                 success: function(response) {
  1026.                     if (response.status === 'success') {
  1027.                         // Ažuriranje broja proizvoda u korpi u zaglavlju
  1028.                         $('#korpa').text(response.totalItems);
  1030.                         // Prikazivanje uspešne poruke
  1031.                         $.notify({
  1032.                             message: response.message
  1033.                         },{
  1034.                             type: 'success',
  1035.                             delay: 2000
  1036.                         });
  1037.                     } else {
  1038.                         // Prikazivanje poruke o grešci
  1039.                         $.notify({
  1040.                             message: response.message
  1041.                         },{
  1042.                             type: 'danger',
  1043.                             delay: 2000
  1044.                         });
  1045.                     }
  1046.                 }
  1047.             });
  1049.             return false; // Sprečavanje default submitovanja forme
  1050.         });
  1052.         $('.search-type').on('input', function() {
  1053.             var query = $(this).val();
  1055.             if (query.length >= 3) {
  1056.                 $.ajax({
  1057.                     url: "{{ path('app_ajax_search') }}",
  1058.                     type: "GET",
  1059.                     dataType: 'json',
  1060.                     data: {
  1061.                         q: query
  1062.                     },
  1063.                     success: function(data) {
  1064.                         var resultsContainer = $('#search-results');
  1065.                         resultsContainer.empty();
  1067.                         if (data.results.length > 0) {
  1068.                             $.each(data.results, function(index, product) {
  1069.                                 var productHtml = '<li>' +
  1070.                                     '<div class="product-cart media">' +
  1071.                                     '<img src="' + product.slika + '" class="img-fluid blur-up lazyload" alt="">' +
  1072.                                     '<div class="media-body">' +
  1073.                                     '<a href="' + product.link + '">' +
  1074.                                     '<h6 class="mb-1">' + product.text + '</h6>' +
  1075.                                     '</a>' +
  1076.                                     '<p class="mb-0 mt-1">' + product.pricePDV + ' RSD</p>' +
  1077.                                     '</div>' +
  1078.                                     '</div>' +
  1079.                                     '</li><br>';
  1080.                                 // var productHtml = '<div><a href="' + product.link + '" class="man-section"><div class="image-section"><img src=' +
  1081.                                 //     product.slika +
  1082.                                 //     '></div><div class="description-section"><h6>' +
  1083.                                 //     product.text +
  1084.                                 //     "</h6><span>" +
  1085.                                 //     product.pricePDV +
  1086.                                 //     "</span></div></a>";
  1088.                                 resultsContainer.append(productHtml);
  1089.                             });
  1090.                         } else {
  1091.                             resultsContainer.append('<div class="empty-message">',
  1092.                                 "Nije pronađen nijedan proizvod !",
  1093.                                 "</div>");
  1094.                         }
  1095.                     },
  1096.                     error: function() {
  1097.                         console.log('Error loading search results.');
  1098.                     }
  1099.                 });
  1100.             }
  1101.         });
  1102.         $('.close-search').on('click', function() {
  1103.             $('.search-type').val('');
  1104.             $('#search-results').empty();
  1105.         });
  1107.         function updateCartCount() {
  1108.             $.ajax({
  1109.                 url: '{{ path('app_cart_count') }}',
  1110.                 method: 'GET',
  1111.                 success: function(response) {
  1112.                     $('#korpa').text(response.totalItems);
  1113.                 },
  1114.                 error: function() {
  1115.                     console.error('Failed to fetch cart count.');
  1116.                 }
  1117.             });
  1118.         }
  1119.         updateCartCount();
  1121.         {% if app.user %}
  1122.         $('[id^=zelja_]').on('click', function(e) {
  1123.             e.preventDefault(); // Sprečava standardno ponašanje linka ili dugmeta
  1126.             var productId = $(this).data('product-id');
  1128.             $.ajax({
  1129.                 url: '{{ path("app_favorite_add") }}', // Symfony ruta za dodavanje omiljenog
  1130.                 type: 'GET', // Metod zahteva, može biti i 'GET' ako je vaša ruta tako definisana
  1131.                 data: { product_id: productId }, // Podaci koji se šalju
  1132.                 success: function(response) {
  1133.                     if (response.status === 'success') {
  1134.                         // Update the cart item count in the header
  1135.                         $('#listaZelja').text(response.totalFavorites);
  1137.                         // Show success toast
  1138.                         $.notify({
  1139.                             message: response.message
  1140.                         },{
  1141.                             type: 'success',
  1142.                             delay: 2000
  1143.                         });
  1144.                     } else {
  1145.                         // Show error toast
  1146.                         $.notify({
  1147.                             message: response.message
  1148.                         },{
  1149.                             type: 'danger',
  1150.                             delay: 2000
  1151.                         });
  1152.                     }
  1153.                 }
  1154.             });
  1155.         });
  1156.         function updateFavoriteCount() {
  1157.             $.ajax({
  1158.                 url: '{{ path('app_favorite_count') }}',
  1159.                 method: 'GET',
  1160.                 success: function(response) {
  1161.                     $('#listaZelja').text(response.totalFavorites);
  1162.                 },
  1163.                 error: function() {
  1164.                     console.error('Failed to fetch cart count.');
  1165.                 }
  1166.             });
  1167.         }
  1168.         updateFavoriteCount();
  1169.         {% endif %}
  1170.         $('li.sort_dropdown a').addClass('dropdown-item');
  1171.     });
  1172.     function printPage() {
  1173.         window.print();
  1174.     }
  1175.     {% endblock footerjavascript %}
  1177. </script>
  1178. <script>
  1179.     document.addEventListener('DOMContentLoaded', function() {
  1180.         // Select all <li> elements with class 'submenu-title'
  1181.         var submenuTitles = document.querySelectorAll('li.submenu-title');
  1183.         // Iterate over each <li> element
  1184.         submenuTitles.forEach(function(submenuTitle) {
  1185.             // Find all <span> elements with class 'according-menu' within the current <li>
  1186.             var spans = submenuTitle.querySelectorAll('span.according-menu');
  1188.             // Remove each <span> element with class 'according-menu'
  1189.             spans.forEach(function(span) {
  1190.                 span.remove();
  1191.             });
  1192.         });
  1193.     });
  1194. </script>
  1195. </body>
  1197. </html>