templates/Recipes/reciepedetails.html.twig line 1

Open in your IDE?
  1. {% extends "layout/layout.html.twig" %}
  2. {# {% block title %}GFS::Recipe {{ recipedetails.name}}{% endblock %} #}
  3. {% block content %}
  4.     {% if app.request.locale == 'en' %}
  5.         {% set weblink ='en' %}
  6.     {% else %}
  7.         {% set weblink ='ar' %}
  8.     {% endif %}
  9.     <div>
  10.         <!--Start Recipe Top Download-->
  11.         <section class="info-media media-bg-left recipe-detail-download new-recipe-detail recipe-detail-edited-add">
  12.             <div class="container container-sm">
  13.                 <div class="mobile_flex">
  14.                 <div class="info-section recipe-info__puesdo">
  15.                     {# <h4>The awesome</h4> #}
  16.                     <h1>{{ recipedetails.name}}</h1>
  17.                     {% if recipedetails.Chef %}
  18.                         <h6 class="resource-name">{{'by'|trans}}
  19.                             {{ recipedetails.Chef}}</h6>
  20.                     {% endif %}
  21.                     <ul class="list-unstyled recipe-info">
  22.                         {# <li class="mins">{{ recipedetails.time}} {{"mins"|trans }}</li> #}
  23.                         <li class="orders">{{'No. Of'|trans}}
  24.                             {{'Serving'|trans}}
  25.                             {{ recipedetails.serves}}</li>
  26.                         <li class="time">{{ recipedetails.typeofmeal|trans}}</li>
  27.                         <li class="rating">{{rating}}</li>
  28.                     </ul>
  29.                     <p>{{recipedetails.description}}</p>
  30.                     <p id="content" class="d-none">{{recipedetails.short_description}}</p>
  31.                     <ul class="list-unstyled social-info recipe-info">
  32.                         {% set user = app.session.get('loginUserName') %}
  33.                         {% if user is not null %}
  34.                             {% if Liked|length == 0 %}
  35.                                 <li class="like" onclick="loyaltyProgram(this, {{ recipedetails.id }},'{{ recipedetails.name }}',30,'Recipe','Like' , '{{app.request.locale}}')">{{'Like'|trans}}</li>
  36.                             {% else %}
  37.                                 <li class="liked">{{'Like'|trans}}</li>
  38.                             {% endif %}
  39.                             <li class="share recipeshare" onclick="loyaltyProgram(this,{{ recipedetails.id }},'{{ recipedetails.name }}',50,'Recipe','Share', '{{app.request.locale}}')">
  40.                                 <span onclick="sharemodal('Recipe','{{ app.request.getSchemeAndHttpHost() ~ '/' ~ app.request.locale ~ '/all-recipes/' ~ recipedetails.url}}' , '{{ " share goody recipe with your friends"|trans }}')">{{'Share'|trans}}</span>
  41.                             </li>
  42.                             {# {% if Shared|length == 0 %}
  43.                                 <li class="share recipeshare" onclick = "loyaltyProgram({{ recipedetails.id }},'{{ recipedetails.name }}',50,'Recipe','Share')">Share</li>
  44.                             {% else %}
  45.                                 <li class="share">Shared</li>
  46.                             {% endif %} #}
  47.                             <a class="d-flex directions-link" target="_blank" href ="/{{app.request.locale}}/print/recipe/{{recipedetails.url}}"><li class="download-blue" id="download">{{'Download'|trans}}</li></a>
  48.                             <a class="d-flex directions-link" target="_blank" href ="/{{app.request.locale}}/print/recipe/{{recipedetails.url}}"><li class="print-blue" id="pdfprnt">{{'Print'|trans}}</li></a>
  49.                             <li class="menu-blue d-none">{{'Add To Menu'|trans}}</li>
  50.                         {% else %}
  51.                             <li class="like logged-out">{{'Like'|trans}}</li>
  52.                             <li class="share" onclick="sharemodal('Recipe','{{ app.request.getSchemeAndHttpHost() ~ '/' ~ app.request.locale ~ '/all-recipes/' ~ recipedetails.url}}' , '{{ " share goody recipe with your friends"|trans }}')">{{'Share'|trans}}</li></a>
  53.                             <a class="d-flex directions-link" target="_blank" href ="/{{app.request.locale}}/print/recipe/{{recipedetails.url}}"><li class="download-blue" id="download">{{'Download'|trans}}</li></a>
  54.                             <a class="d-flex directions-link" target="_blank" href ="/{{app.request.locale}}/print/recipe/{{recipedetails.url}}"><li class="print-blue" id="pdfprnt">{{'Print'|trans}}</li></a>
  55.                             <li class="menu-blue d-none">{{'Add To Menu'|trans}}</li>
  56.                         {% endif %}
  57.                     </ul>
  58.                 </div>
  59.                 <div class="media-section media-section-01">
  60.                     {% if recipedetails.banner_video is empty %}
  61.                         {# <img src="{{recipedetails.featured_image}}" alt="{{recipedetails.name}}"> #}
  62.                         {% if recipedetails.featured_image %}
  63.                         {{ recipedetails.featured_image.thumbnail('858x592').getHTML({imgAttributes: {class:'',alt:"Feature Image" }})|raw }}
  64.                         {% endif %}
  65.                     {% else %}
  66.                         <video poster="{{ recipedetails.featured_image }}" playsinline preload="auto" loop="true" autoplay="true" muted="true" controlslist="nodownload">
  67.                             <source src="{{ recipedetails.banner_video.data}}" type="video/mp4">
  68.                             Your browser does not support the video tag.
  69.                         </video>
  70.                         {# <div class="control-options">
  71.                         <i class="fas fa-play-circle"></i>
  72.                         <i class="fas fa-pause-circle"></i>
  73.                         </div> #}
  74.                     {% endif %}
  75.                     {% if recipedetails.detail_video is not empty %}
  76.                         <div class="btn-holder">
  77.                             <a href="javascript:void(0)" class="btn btn-custom btn-primary" data-toggle="modal" data-target="#recipevideomodal">{{'Watch Full Video'|trans}}
  78.                                 <i class="fas fa-play-circle"></i>
  79.                             </a>
  80.                         </div>
  81.                     {% endif %}
  82.                 </div>
  83.             </div>
  84.                 
  85.                 <!--Start Breadcrumbs-->
  86.                 <div class="breadcrumb-holder breadcrumb-fixed">
  87.                     <ol class="breadcrumb">
  88.                         <li class="breadcrumb-item">
  89.                             <a href="/{{app.request.locale}}">{{ "Home"|trans }}</a>
  90.                         </li>
  91.                         <li class="breadcrumb-item">
  92.                             <a href="/{{app.request.locale}}/recipes">{{ "recipes"|trans }}</a>
  93.                         </li>
  94.                         {% if recipedetails.category|length > 0 %}
  95.                             {% for Category in recipedetails.category %}
  96.                                 {# {% set usp = "#{recipedetails.cuisine}"|raw|upper %} #}
  97.                                 <li class="breadcrumb-item">
  98.                                     <a href="/en/recipes/{{Category.cat_url}}">{{Category.recipecategoryname}}</a>
  99.                                 </li>
  100.                             {% endfor %}
  101.                         {% endif %}
  102.                         <li class="breadcrumb-item active" aria-current="page">{{ recipedetails.name}}</li>
  103.                     </ol>
  104.                 </div>
  105.                 <!--End Breadcrumbs-->
  106.             </div>
  107.         </section>
  108.         <!--End Recipe Top Download-->
  109.         <!--Start Ingredients and Instructions-->
  110.         <section class="cooking-tabs">
  111.             <div
  112.                 class="container container-sm">
  113.                 <!--Start Tab Titles-->
  114.                 <ul class="row nav nav-pills" id="cooking-tab" role="tablist">
  115.                     <li class="col-md-6 col-xl-6 nav-item" role="presentation">
  116.                         <a class="nav-link sub-sm-heading active" id="ingredients-tab" data-toggle="pill" href="#ingredients" role="tab" aria-controls="ingredients" aria-selected="true">{{"Ingredients"|trans }}
  117.                             {% if recipedetails.Serving_options.items[0].ingredeints is defined  %}
  118.                             {{ recipedetails.Serving_options.items[0].ingredeints|length }}{% endif %}</a>
  119.                     </li>
  120.                     <li class="col-md-6 col-xl-6 nav-item" role="presentation">
  121.                         <a class="nav-link sub-sm-heading" id="instruction-tab" data-toggle="pill" href="#instruction" role="tab" aria-controls="instruction" aria-selected="false">{{"Instructions"|trans }}</a>
  122.                     </li>
  123.                 </ul>
  124.                 <!--End Tab Titles-->
  125.                 <!--Start Tab Content-->
  126.                 <div class="row tab-content" id="cooking-tabContent">
  127.                             
  128.                     <!--Start Ingredients Tab Content-->
  129.                         <div class="col-md-6 col-xl-6 tab-pane fade show active" id="ingredients" role="tabpanel" aria-labelledby="ingredients-tab"> <div class="order-count">
  130.                             <div class="order-count-title">{{"Order's"|trans}}</div>
  131.                             <div class="order-count-number">
  132.                                 <span class="minus" id="minusx"><img src="/static/assets/images/icon-minus.svg" alt="icon minus"></span>
  133.                                 <input class="count numeric-remove-spiner" onkeypress='return event.charCode >= 48 && event.charCode <= 57' id="valuechange" type="number" value="{{ recipedetails.serves}}"/>
  134.                                 <span class="plus" id="plusx"><img src="/static/assets/images/icon-plus.svg" alt="icon plus"></span>
  135.                             </div>
  136.                             <input class="serving d-none" type="text" value="{{ recipedetails.serves}}"/>
  137.                         </div>
  138.                         <div class="ingredients-holders">
  139.                             
  140.                                     {% for ingrident in recipedetails.serving_options %}
  141.                                     <h4 class="title">{{ (app.request.locale =='en') ? ingrident.serve:ingrident.serve_ar}}</h4>
  142.                                     <ul class="list-unstyled content-list">
  143.                                         
  144.                                         {% for ing in ingrident.ingredeints %}
  145.                                             
  146.                                             <li>
  147.                                                 <span class="name capsfirstleter">{{  (app.request.locale =='en') ? ing.ingredient.data : ing.ingredient_ar.data }}</span>
  148.                                                 {# <span class="measurement">{% if ingredeints[i+1]['ingredeints'][j]['multiply'].data != 0 %} {{ ingredeints[i+1]['ingredeints'][j]['multiply'].data * recipedetails.serves }}{% endif %}{{ (app.request.locale =='en') ? ingredeints[i+1]['ingredeints'][j]['unit'].data : ingredeints[i+1]['ingredeints'][j]['unit_ar'].data }}</span> #}
  149.                                                 <span class="measurement">
  150.                                                     {% if ing.multiply.data != 0 %}
  151.                                                         {{ ing.multiply.data  }}
  152.                                                     {% endif %}
  153.                                                     {{ (app.request.locale =='en') ? ing.unit.data:ing.unit_ar.data }}</span>
  154.                                                 <span class="new d-none">{{ ing.multiply.data}}
  155.                                                 </span>
  156.                                                 <span class="unit d-none">{{ (app.request.locale =='en') ? ing.unit.data:ing.unit_ar.data }}
  157.                                                 </span>
  158.                                             </li>
  159.                                         {% endfor %}
  160.                                     
  161.                                         {% for recipe_feature_product in ingrident.recipe_feature_product %}
  162.                                             {% if recipe_feature_product is defined  %}
  163.                                                 {% if recipe_feature_product.brands.id == 263 %}
  164.                                                     {% set class = "slide-img-bg-brown" %}
  165.                                                 {% elseif recipe_feature_product.brands.id == 262 %}
  166.                                                     {% set class = "slide-img-bg-blue" %}
  167.                                                 {% elseif recipe_feature_product.brands.id == 413 %}
  168.                                                     {% set class = "slide-img-bg-purple" %}
  169.                                                 {% else %}
  170.                                                     {% set class = "slide-img-bg-green" %}
  171.                                                 {% endif %}
  172.                                                 <li class="product-available-box">
  173.                                                     <div class="product-box product-box-horizon">
  174.                                                         {% set user = app.session.get('loginUserName') %}
  175.                                                         {% if user is not null %}
  176.                                                             {% if recipe_feature_product.id in Liked_Recipe_feature_product_Ids %}
  177.                                                                 <div class="like">
  178.                                                                     <a href="javascript:void(0)"><img src="/static/assets/images/Liked-01.svg" alt="Liked"></a>
  179.                                                                 </div>
  180.                                                             {% else %}
  181.                                                                 <div class="like">
  182.                                                                     <a href="javascript:void(0)" onclick="loyaltyProgram(this,{{ recipe_feature_product.id }},'{{ recipe_feature_product.name }}',30,'Product','Like')"><img src="/static/assets/images/like.svg" alt="Like"></a>
  183.                                                                 </div>
  184.                                                             {% endif %}
  185.                                                         {% else %}
  186.                                                             <div class="like logged-out">
  187.                                                                 <a href="javascript:void(0)"><img src="/static/assets/images/like.svg" alt="Like"></a>
  188.                                                             </div>
  189.                                                         {% endif %}
  190.                                                         <figure class="slide-img {{class}}">
  191.                                                             {% if recipe_feature_product.attrimage.Items[0] is defined %}
  192.                                                                 <a href="/{{app.request.locale}}/product/{{recipe_feature_product.url}}">
  193.                                                                     <img src="{{recipe_feature_product.attrimage.Items[0]}}" alt="{{recipe_feature_product.name}}">
  194.                                                                 </a>
  195.                                                             {% endif %}
  196.                                                         </figure>
  197.                                                         <div class="slide-info">
  198.                                                             <a href="/{{app.request.locale}}/product/{{recipe_feature_product.url}}">
  199.                                                                 <h5 class="title">{{recipe_feature_product.name}}</h5>
  200.                                                             </a>
  201.                                                             <div class="kg">{{recipe_feature_product.size}}</div>
  202.                                                             <div class="inline-info">
  203.                                                                 {% if recipe_feature_product.region[0]['price'].data is defined %}
  204.                                                                     <div class="price d-none">{{recipe_feature_product.region[0]['price'].data}}
  205.                                                                         {{recipe_feature_product.region[0]['currency_symbol'].data|trans}}</div>
  206.                                                                     {% set points =   (((recipe_feature_product.region[0]['price'].data)/100)*10)|round %}
  207.                                                                     {# <div class="award">
  208.                                                                         <i class="far fa-star"></i>
  209.                                                                         {{'Earn'|trans}}
  210.                                                                         {{points}}
  211.                                                                         {{'Rewards Points'|trans}}</div> #}
  212.                                                                 {% endif %}
  213.                                                             </div>
  214.                                                             <div class="order-count small-count">
  215.                                                                 <div class="order-count-number">
  216.                                                                     <span class="minus"><img src="/static/assets/images/icon-minus.svg" alt="icon minus"></span>
  217.                                                                     <input class="count" id="fig" type="text" value="1"/>
  218.                                                                     <span class="plus"><img src="/static/assets/images/icon-plus.svg" alt="icon plus"></span>
  219.                                                                 </div>
  220.                                                                 <a href="javascript:void(0)" class="btn btn-custom btn-primary add-to-cart-rcp" onclick="addCart(this, {{recipe_feature_product.id}}, 1)">{{'Add to Cart'|trans}}</a>
  221.                                                             </div>
  222.                                                             {% if app.session.get('loginUserName') is not null %}
  223.                                                                 <div class="btn-holder d-none">
  224.                                                                     <a href="javascript:void(0)" class="btn btn-custom btn-p-outline" onclick="inventoryProgram(this,{{points}},{{recipe_feature_product.id}})">{{'Add to Inventory'|trans}}</a>
  225.                                                                 </div>
  226.                                                             {% else %}
  227.                                                                 <div class="btn-holder d-none">
  228.                                                                     <a href="javascript:void(0)" class="btn btn-custom btn-p-outline recipe-logged-out">{{'Add to Inventory'|trans}}</a>
  229.                                                                 </div>
  230.                                                                 <div class="recipe-inventry-alert"></div>
  231.                                                             {% endif %}
  232.                                                         </div>
  233.                                                     </div>
  234.                                                 </li>
  235.                                             {% endif %}
  236.                                         {% endfor %}
  237.                                     </ul>
  238.                                 {% endfor %}
  239.                         </div>
  240.                     </div>
  241.                     <!--End Ingredients Tab Content-->
  242.                     <!--Start Instruction Tab Content-->
  243.                     <div class="col-md-6 col-xl-6 tab-pane fade" id="instruction" role="tabpanel" aria-labelledby="instruction-tab">
  244.                         <div class="instructions-holder">
  245.                             <h5 class="title">
  246.                                 {{'intruction_desc'|trans}}
  247.                             {# {{'Instructions_desc'|trans}} #}
  248.                                 {# {{recipedetails.instructions}} #}
  249.                             </h5>
  250.                             <ul class="list-unstyled content-list">
  251.                                 {% set step = recipedetails.steps    %}
  252.                                 {% for steps in step   %}
  253.                                     <li>
  254.                                         {{ steps.localizedfields.data.getLocalizedValue('description')}}</li>
  255.                                 {% endfor %}
  256.                             </ul>
  257.                             {# {% if recipedetails.detail_video is not empty %}
  258.                             <div class="btn-holder">
  259.                             <a href="javascript:void(0)" class="btn btn-custom btn-primary" data-toggle="modal" data-target="#recipevideomodal">Watch Video <i
  260.                                 class="fas fa-play-circle"></i></a>
  261.                             </div>
  262.                             {% endif %} #}
  263.                         </div>
  264.                         <div class="special-notes">
  265.                             <h3 class="title">{{'Special Notes:'|trans}}</h3>
  266.                             <ul class="list-unstyled notes-list">
  267.                                 {% for special_notes in recipedetails.note_list   %}
  268.                                     <li>
  269.                                         <strong>{{ special_notes.bold_tag.data}}:</strong>
  270.                                         {{  special_notes.special_note.data}}
  271.                                     </li>
  272.                                 {% endfor %}
  273.                                 {# <li><strong>Bone attachment:</strong> In order for the meat to be fork tender, it needs to be cooked far
  274.                                     enough so that
  275.                                     the connective tissue holding the meat to the bone becomes tender. So the meat is not really attached.
  276.                                     But if you handle it carefully, it stays together.
  277.                                 </li> #}
  278.                             </ul>
  279.                         </div>
  280.                     </div>
  281.                     <!--End Instruction Tab Content-->
  282.                 </div>
  283.                 <!--End Tab Content-->
  284.             </div>
  285.         </section>
  286.     </div>
  287.     {% if recipedetails.detail_video is not empty %}
  288.         <!-- Start video modal -->
  289.         <div class="modal fade video-modal" id="recipevideomodal" tabindex="-1" role="dialog" aria-labelledby="recipevideomodal" aria-hidden="true" data-backdrop="static">
  290.             <div class="modal-dialog modal-dialog-centered" role="document">
  291.                 <div class="modal-content">
  292.                     <div class="video-modal-box">
  293.                         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  294.                             <span aria-hidden="true">&times;</span>
  295.                         </button>
  296.                         <div class="video-modal-box-media">
  297.                             <figure class="video-modal-box-media-figure">
  298.                                 <video poster="{{ recipedetails.featured_image}}" controls playsinline preload="auto" loop="false" controlslist="nodownload" id="videoId">
  299.                                     <source src="{{ recipedetails.detail_video.data}}" type="video/mp4">
  300.                                     Your browser does not support the video tag.
  301.                                 </video>
  302.                                 {# <div class="control-options">
  303.                                     <i class="fas fa-play-circle"></i>
  304.                                     <i class="fas fa-pause-circle"></i>
  305.                                     </div> #}
  306.                             </figure>
  307.                         </div>
  308.                     </div>
  309.                 </div>
  310.             </div>
  311.         </div>
  312.         <!-- End video modal -->
  313.     {% endif %}
  314.     <!--Start Ingredients and Instructions-->
  315.     <!--Start Instagram Section-->
  316.     <section class="social-holder">
  317.         <div class="container container-sm">
  318.             <div class="social-holder-box rcpe-detail">
  319.                 <div class="social-holder-img">
  320.                     <img src="/static/assets/images/insta-pic.jpg" alt="insta pic">
  321.                 </div>
  322.                 <div class="social-holder-info">
  323.                     <h5>{{'DID YOU MAKE THIS RECIPE?'|trans}}</h5>
  324.                     <p>{{'We love hearing how you went with this recipes!'|trans}}</p>
  325.                     <p>{{'Tag us on Instagram at'|trans}}
  326.                         <a href="https://www.instagram.com/goodyculinarysolutions/" target="_blank">@goody_professional_solutions</a>
  327.                     </p>
  328.                 </div>
  329.             </div>
  330.         </div>
  331.     </section>
  332.     <!--End Instagram Section-->
  333.     <!--Start Menu Builder Tool-->
  334.     <section class="info-media loyalty-program menu-builder-tool loyalty-program-inner">
  335.         <div class="container container-sm">
  336.             <div class="info-section">
  337.                 <h5>{{'Tools for you'|trans}}</h5>
  338.                 <h4>{{'Get the right menu'|trans}}</h4>
  339.                 <h3>{{'ideas and right cost'|trans}}</h3>
  340.                 <p>{{'Make your menu options more profitable.'|trans}}</p>
  341.                 <div class="btn-holder">
  342.                     <div class="newsletter-subscribe ">
  343.                         <h4 class="cstsmLP">"{{'Coming Soon'|trans}}"</h4>
  344.                     </div>
  345.                     <div class="btn-border d-none">
  346.                         <a href="javascript:void(0);" class="btn btn-custom btn-lg-o-black">{{'Coming soon'|trans}}</a>
  347.                         {# <a href="/{{app.request.locale}}" class="btn btn-custom btn-lg-o-white">Discover More</a> #}
  348.                     </div>
  349.                 </div>
  350.             </div>
  351.             <div class="media-section media-shadow">
  352.                 <img src="/static/assets/images/Recipe_Menu_Builder_875x550.jpg" alt="Recipe Menu Builder">
  353.             </div>
  354.         </div>
  355.     </section>
  356.     <!--End Menu Builder Tool-->
  357.     <!--Start Similar Recipes Section-->
  358.     {% if similar_recipes|length > 0 %}
  359.         <section class="featured-recipes-section inner-featured-recipe similar-recipes recipe-detail-similer">
  360.             <div class="container container-sm">
  361.                 <h2 class="heading">{{"Similar-Recipes"|trans }}</h2>
  362.                 <div class="featured-recipes">
  363.                     <div class="featured-recipes-slider">
  364.                         {% for Similar_recipes in similar_recipes %}
  365.                             <div class="slide">
  366.                                 <div class="slide-holder">
  367.                                     <a href="{{ Similar_recipes.url}}" tabindex="0">
  368.                                         <figure class="slide-img">
  369.                                             {# <img src="{{Similar_recipes.featured_image}}" alt="{{ Similar_recipes.name }}"> #}
  370.                                             {% if Similar_recipes.featured_image %}
  371.                                             {{ Similar_recipes.featured_image.thumbnail('354x244').getHTML({imgAttributes: {class:'',alt: Similar_recipes.name }})|raw }}
  372.                                             {% endif %}
  373.                                             {% if Similar_recipes.banner_video %}
  374.                                                 <i class="fas fa-play-circle"></i>
  375.                                             {% endif %}
  376.                                         </figure>
  377.                                     </a>
  378.                                     <div class="slide-content">
  379.                                         <a href="{{ Similar_recipes.url}}" tabindex="0">
  380.                                             <h3>{{ Similar_recipes.name }}</h3>
  381.                                         </a>
  382.                                         <p>{{ Similar_recipes.short_description }}</p>
  383.                                         <ul
  384.                                             class="list-unstyled recipe-info">
  385.                                             {# <li class="mins">{{ Similar_recipes.time }} {{"mins"|trans }}</li> #}
  386.                                             <li class="orders">{{'No. Of'|trans}}
  387.                                                 {{'Serving'|trans}}
  388.                                                 {{ Similar_recipes.serves }}</li>
  389.                                             <li class="time">{{ Similar_recipes.typeofmeal|trans }}</li>
  390.                                         </ul>
  391.                                     </div>
  392.                                     <div class="btn-holder">
  393.                                         <a href="{{ Similar_recipes.url}}" class="btn btn-custom btn-primary" tabindex="0">{{'View Recipe'|trans}}</a>
  394.                                     </div>
  395.                                 </div>
  396.                             </div>
  397.                         {% endfor %}
  398.                     </div>
  399.                 </div>
  400.             </div>
  401.         </section>
  402.     {% endif %}
  403.     <!--End Similar Recipes Section-->
  404. {% if recipedetails.tags|length > 0 %}
  405.     <!--Start Tag Section-->
  406.     <section class="tag-section">
  407.         <div class="container container-sm">
  408.             <h2 class="heading">{{'Tags'|trans}}</h2>
  409.             <ul class="list-unstyled tag-list">
  410.                 {% set count = recipedetails.tags %}
  411.                 {% for j in 0..count|length -1 %}
  412.                     {% if count|length > 0 %}
  413.                         <li>
  414.                             <a href="/en/searchrecipe?tag_id={{recipedetails.tags[j].id}}">{{recipedetails.tags[j].tag_name}}</a>
  415.                         </li>
  416.                     {% endif %}
  417.                 {% endfor %}
  418.             </ul>
  419.         </div>
  420.     </section>
  421.     <!--End Tag Section-->
  422.     {% endif %}
  423.     <!--Start Comments Section-->
  424.     <section class="comment-section">
  425.         <div class="container container-sm">
  426.             <div
  427.                 class="comment-section-box">
  428.                 <!--Start Leave Comments-->
  429.                 <div class="leave-comment">
  430.                     <div class="leave-comment-header">
  431.                         <h5>{{'Leave a Comment'|trans}}</h5>
  432.                         <p>{{'Cooked this recipe? Comment and rate this recipe!'|trans}}</p>
  433.                         <p>{{'Earn reward points for your interaction.'|trans}}</p>
  434.                     </div>
  435.                     <form action="/review" method="post" id = "submitFormRecipeComment">
  436.                         <div class="custom-form leave-comment-form">
  437.                             <div class="row">
  438.                                 <div class="col-12 col-md-6">
  439.                                     <div class="form-group">
  440.                                         <label class="custom-label">{{'Name'|trans}}:</label>
  441.                                         <input type="text" class="form-control" name="name" required=""/>
  442.                                     </div>
  443.                                     <div class="form-group">
  444.                                         <label class="custom-label">{{'Email'|trans}}:</label>
  445.                                         <input type="email" class="form-control" name="email" required=""/>
  446.                                         <input type="hidden" class="form-control" name="recipe_id" value="{{ recipedetails.id}}"/>
  447.                                         <input type="hidden" class="form-control" name="recipe_url" value="{{ recipedetails.url}}"/>
  448.                                         <input type="hidden" class="form-control" name="locale" value="{{ app.request.locale}}"/>
  449.                                     </div>
  450.                                 </div>
  451.                                 <div class="col-12 col-md-6">
  452.                                     <div class="form-group form-group-textarea">
  453.                                         <label class="custom-label">{{'Comment'|trans}}:</label>
  454.                                         <textarea class="form-control" name="comment" required=""></textarea>
  455.                                     </div>
  456.                                     <div class="form-group form-inline">
  457.                                         <label class="custom-label">{{'Rating'|trans}}:</label>
  458.                                         <fieldset class="rating rating-md">
  459.                                             <input type="radio" id="addreviewstar5" name="addreviewrating" value="5">
  460.                                             <label class="full" for="addreviewstar5" title="5 stars"></label>
  461.                                             <input type="radio" id="addreviewstar4" name="addreviewrating" value="4">
  462.                                             <label class="full" for="addreviewstar4" title=" 4 stars"></label>
  463.                                             <input type="radio" id="addreviewstar3" name="addreviewrating" value="3">
  464.                                             <label class="full" for="addreviewstar3" title="3 stars"></label>
  465.                                             <input type="radio" id="addreviewstar2" name="addreviewrating" value="2">
  466.                                             <label class="full" for="addreviewstar2" title="2 stars"></label>
  467.                                             <input type="radio" id="addreviewstar1" name="addreviewrating" value="1">
  468.                                             <label class="full" for="addreviewstar1" title="1 star"></label>
  469.                                         </fieldset>
  470.                                     </div>
  471.                                 </div>
  472.                             </div>
  473.                             <div class="mandatory-text">
  474.                                 <p>{{'Your email address will not be published.'|trans}}
  475.                                 </p>
  476.                                 <p>{{'All fields are mandatory.'|trans}}</p>
  477.                             </div>
  478.                             <div class="checkbox-holder d-none">
  479.                                 <input class="styled-checkbox" id="notify" type="checkbox" value="notify" checked>
  480.                                 <label for="notify">{{'Notify me via e-mail if anyone answers my comment.'|trans}}</label>
  481.                             </div>
  482.                             <span class="recaptcha text-danger error-color"></span>
  483.                             {% if app.request.getSchemeAndHttpHost() == "https://goodyculinaire.com" %}
  484.                                 <div class="g-recaptcha" data-sitekey="6LeRqBEeAAAAAPqLUIzSnAM5EmZrgsPgzf4zLI7P" data-theme="light" data-size="normal" data-image="image" id="recaptcha"></div>
  485.                             {% elseif app.request.getSchemeAndHttpHost() == "https://gfs2.centric.ae" %}
  486.                                 <div class="g-recaptcha" data-sitekey="6LdxNsAgAAAAAKdxceNtgNjH6TlrgstHJ-N-zH6C" data-theme="light" data-size="normal" data-image="image" id="recaptcha"></div>
  487.                             {% elseif app.request.getSchemeAndHttpHost() == "https://goodycs.com" %}
  488.                                 <div class="g-recaptcha" data-sitekey="6Le5OcAgAAAAANCPxYj-Tufd8ooE9d92HvhQNyac" data-theme="light" data-size="normal" data-image="image" id="recaptcha"></div>
  489.                             {% endif %}
  490.                             <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  491.                             <div><span class="alert-message text-dark"></span></div>
  492.                             <div class="btn-holder">
  493.                                 <button class="btn btn-custom btn-green">{{'Submit'|trans}}</button>
  494.                             </div>
  495.                         </div>
  496.                     </form>
  497.                 </div>
  498.                 <!--End Leave Comments-->
  499.                 <!--Start Comments List-->
  500.                 <div class="comments-list">
  501.                     <div class="row new_div">
  502.                         {% set ratingcount = 0 %}
  503.                         {% for reviews in review %}
  504.                             <div class="col-12 col-md-6">
  505.                                 <div class="comment-list-box">
  506.                                     <div class="comment-list-box-header">
  507.                                         <figure class="person-img">
  508.                                             <img src="/static/assets/images/user-icon-01.png" alt="user icon">
  509.                                         </figure>
  510.                                         <h5>{{reviews.name}}</h5>
  511.                                         <div class="rating">{{reviews.rating}}</div>
  512.                                     </div>
  513.                                     <p>{{reviews.comment}}</p>
  514.                                     <div class="date">{{reviews.mydate}}</div>
  515.                                 </div>
  516.                             </div>
  517.                             {% if reviews.rating > 0 %}
  518.                                 {% set ratingcount = ratingcount + 1 %}
  519.                             {% endif %}
  520.                         {% endfor %}
  521.                     </div>
  522.                     {% if review|length >= 3 %}
  523.                         <div class="load-more">
  524.                             <a href="javascript:void(0)" class="btn btn-custom btn-outline btn-loadX btn-green" onclick="loadMoreRecipeReviews()" id="load-more">{{'Load more'|trans}}</a>
  525.                             <!-- btn-load >> This is the class for showing loader gif -->
  526.                         </div>
  527.                     {% endif %}
  528.                 </div>
  529.                 <!--End Comments List-->
  530.             </div>
  531.         </div>
  532.     </section>
  533.     <!--Start Wrapper-->
  534.     <!--End Wrapper-->
  535.         <script>
  536.             //console.log(window.location.href)
  537.             $("#submitFormRecipeComment").submit(function (event) {
  538.             event.preventDefault();
  539.             var post_url = $(this).attr("action"); // get form action url
  540.             var request_method = $(this).attr("method"); // get form GET/POST method
  541.             
  542.             form_data = new FormData(this);
  543.             $.ajax({
  544.             url: post_url,
  545.             type: request_method,
  546.             data: form_data,
  547.             contentType: false,
  548.             cache: false,
  549.             processData: false,
  550.             success: function (response) {
  551.             if (response.success == 2) {
  552.                     
  553.             document.getElementById('submitFormRecipeComment').reset();
  554.         
  555.             $('.alert-message').removeClass('text-dark').addClass('text-success').html('{{ "Thank you for your feedback."|trans }}');
  556.             $('#submitForm').trigger("reset");
  557.             $(".alert-message").delay(5000).slideUp(500);
  558.             }else if (response.success == 1){
  559.             document.getElementById('submitFormRecipeComment').reset();
  560.             $('.alert-message').removeClass('text-dark').addClass('text-danger').html('{{ "Please check the the captcha form."|trans }}');
  561.             $('#submitForm').trigger("reset");
  562.             $(".alert-message").delay(5000).slideUp(500);
  563.             } else {
  564.             document.getElementById('submitFormRecipeComment').reset();
  565.             $('.alert-message').html('Oops! Please try again something went wrong');
  566.             }
  567.             }
  568.             });
  569.             });
  570.         // Download and Print Recipe According to serving ingerident quantity srart    
  571.         $(document).ready(function () {
  572.              var serving = parseInt($('.serving').val(), 10);
  573.             $("a.directions-link").each(function() {
  574.                 var $this = $(this);       
  575.                 const _href = $this.attr("href"); 
  576.                  $("#valuechange").on('keyup change', function () {
  577.                   var countTxt = parseInt($('.count').val(), 10);
  578.                 $(".directions-link").attr("href", _href+"~portion="+countTxt);
  579.                 });
  580.                 $(".directions-link").attr("href", _href+"~portion="+serving);
  581.                 console.log(countTxt);
  582.             });
  583.         });
  584.         // Download and Print Recipe According to serving ingerident quantity end    
  585.             
  586.         </script>
  587.     <!-- End Modal Attribute -->
  588.         {% if (app.request.locale =='ar') %}
  589.         {% set topMenu ="/en/all-recipes/" ~ recipedetails.url('en') %}
  590.     {% else %}
  591.         {% set topMenu ="/ar/all-recipes/" ~ recipedetails.url('ar') %}
  592.     {% endif %}
  593.     <!--End Comments Section-->
  594.     
  595.         <script type="text/javascript">
  596.                 var _TopMenuLink = "{{ topMenu }}";
  597.                 let page = 1;
  598.                 function loadMoreRecipeReviews() {
  599.                 let add_query = '&';
  600.                 if (!window.location.search) {
  601.                 add_query = '?';
  602.                 }
  603.                 $.ajax({
  604.                 type: "GET",
  605.                 url: window.location.href + add_query + 'page=' + page,
  606.                 data: '',
  607.                 cache: false,
  608.                 beforeSend: function () {
  609.                 $('.btn-loadX').addClass('btn-load');
  610.                 $('.btn-loadX').html('Loading...');
  611.                 },
  612.                 complete: function () {
  613.                 $('.btn-loadX').removeClass('btn-load');
  614.                 $('.btn-loadX').html('Load more');
  615.                 },
  616.                 success: function (data) {
  617.                 if (data.success) {
  618.                 $('.new_div').append(data.success);
  619.                 page++;
  620.                 }
  621.                 if (data.success == '' || data.total_reviews < 2) {
  622.                 $('.btn-loadX').hide();
  623.                 }
  624.                 // else if(data.success == ''){
  625.                 // $('.btn-loadX').hide();
  626.                 // }
  627.                 }
  628.                 });
  629.                 }
  630.                 // function pausemodal(recipeid) {
  631.                 // console.log(recipeid);
  632.                 // $('#videoId' + recipeid).trigger('pause');
  633.                 // }
  634.                 // function playany(recipeid) {
  635.                 // console.log(recipeid);
  636.                 // $('#videoId' + recipeid).trigger('pause');
  637.                 // $('#videoId'+recipeid).trigger('play');
  638.                 // }
  639.         </script>
  640.     <!-- This section is used for seo purpose please do not remove any line within this commented section -->
  641.     {% set schemasteps = recipedetails.steps    %}
  642.     <script type="application/ld+json">
  643.         {
  644.             "@context": "https://schema.org/", 
  645.             "@type": "Recipe", 
  646.             "name": "{{recipedetails.name}}",
  647.         {% if recipedetails.featured_image is defined  and recipedetails.featured_image.path is defined %}
  648.             "image": "{{app.request.getSchemeAndHttpHost() ~ recipedetails.featured_image.path ~ recipedetails.featured_image.filename}}",
  649.         {% endif %}
  650.         "description": "{{recipedetails.description}}",
  651.         {% if recipedetails.recipes_schema_markup_keywords is not empty %}
  652.             "keywords": "{{recipedetails.recipes_schema_markup_keywords}}",
  653.         {% endif %}
  654.         "author": {
  655.                 "@type": "Person",
  656.                 "name": "{{recipedetails.Chef}}"
  657.                 },
  658.                 "datePublished": "{{recipedetails.modificationDate|date('Y-m-d')}}",
  659.                 "prepTime": "",
  660.                 "cookTime": "PT50M", 
  661.                 "totalTime": "PT50M", 
  662.                 "recipeCategory": "{{recipedetails.typeofmeal}}", 
  663.                 "recipeCuisine": "{{recipedetails.cuisine}}", 
  664.                 "recipeYield": "4", 
  665.             "nutrition": {
  666.                     "@type": "NutritionInformation",
  667.                     "calories": ""
  668.                 }
  669.         {% if recipedetails.serving_options.Items is defined %},
  670.                 "recipeIngredient": [
  671.             {% for i in 0..recipedetails.serving_options.Items|length -1 %}
  672.                 {% for j in 0..recipedetails.serving_options.Items[i].ingredeints|length -1 %}
  673.                     {% if app.request.locale == "en" %}
  674.                         "{{recipedetails.serving_options.Items[i].ingredeints[j]['ingredient'].data}}
  675.                         {{recipedetails.serving_options.Items[i].ingredeints[j]['multiply'].data}}{{recipedetails.serving_options.Items[i].ingredeints[j]['unit'].data}}"
  676.                         {% if j < recipedetails.serving_options.Items[i].ingredeints|length - 1  %},
  677.                         {% endif %}
  678.                     {% else %}
  679.                         "{{recipedetails.serving_options.Items[i].ingredeints[j]['ingredient_ar'].data}}
  680.                         {{recipedetails.serving_options.Items[i].ingredeints[j]['multiply'].data}}{{recipedetails.serving_options.Items[i].ingredeints[j]['unit_ar'].data}}"
  681.                         {% if j < recipedetails.serving_options.Items[i].ingredeints|length - 1  %},
  682.                         {% endif %}
  683.                     {% endif %}
  684.                 {% endfor %}
  685.             {% endfor %}
  686.             ]
  687.         {% endif %}
  688.         {% if recipedetails.steps is defined %},
  689.             "recipeInstructions": [
  690.             {% for i in 0..recipedetails.steps|length -1 %}{
  691.                 {% if recipedetails.steps[i] is defined %}
  692.                     "@type": "HowToStep",
  693.                     "text": "{{ recipedetails.steps[i].localizedfields.data.getLocalizedValue('description')}}"
  694.                     {% endif %}
  695.                     }
  696.                 {% if i < recipedetails.steps|length -1 %},
  697.                 {% endif %}
  698.             {% endfor %}]
  699.         {% endif %},
  700.                 "video": {
  701.                             "@type": "VideoObject",
  702.                             {% if recipedetails is defined %}
  703.                             "name": "{{recipedetails.name}}",
  704.                             "description": "{{recipedetails.description}}",
  705.                             {% if recipedetails.featured_image.path is defined %}
  706.                             "thumbnailUrl": "{{app.request.getSchemeAndHttpHost() ~ recipedetails.featured_image.path ~ recipedetails.featured_image.filename}}",
  707.                             {% endif %}
  708.                             "uploadDate": "{{recipedetails.modificationDate|date('Y-m-d')}}", 
  709.                             "contentUrl": "{{app.request.getSchemeAndHttpHost() ~ "/" ~ app.request.locale ~ "/all-recipes/" ~ recipedetails.url}}",
  710.                             {% endif %}
  711.         {% if recipedetails.detail_video.data is defined  %}
  712.             "embedUrl": "{{app.request.getSchemeAndHttpHost() ~ recipedetails.detail_video.data.path ~ recipedetails.detail_video.data.filename}}"
  713.         {% else %}
  714.             "embedUrl": "Video not available"
  715.         {% endif %}
  716.         }
  717.         {% if review|length > 1 %}
  718.             "aggregateRating": {
  719.                 "@type": "AggregateRating",
  720.                 "ratingValue": "{{rating}}",
  721.                 "bestRating": "5",
  722.                 "worstRating": "1",
  723.                 "ratingCount": "{{ratingcount}}",
  724.                 "reviewCount": "{{review|length}}"
  725.                                 },
  726.             {% for keys , reviews in review %}
  727.                 "review": {
  728.                     "@type": "Review",
  729.                     "name": "{{reviews.name}}",
  730.                     "reviewBody": "{{reviews.comment}}",
  731.                     "reviewRating": {
  732.                         "@type": "Rating",
  733.                         "ratingValue": "{{reviews.rating}}",
  734.                         "bestRating": "5",
  735.                         "worstRating": "1"
  736.                     },
  737.                     "datePublished": "{{reviews.mydate}}",
  738.                     "author": {"@type": "Person", "{{reviews.name}}": "man"},
  739.                     "publisher": {"@type": "Organization", "name": "goody"}}
  740.                 {% if keys < review|length -1 %}
  741.                     ,
  742.                 {% endif %}
  743.             {% endfor %}
  744.         {% endif %}
  745.         }
  746.     </script>
  747.     <!-- This section is used for seo purpose please do not remove any line within this commented section end  -->
  748. {% endblock %}