Symfony Profiler

{% extends "layout/layout.html.twig" %}
{% block content %}
{% set locale = app.request.locale %}
{% if locale == 'en_GB' %}
{% set locale = 'en' %}
{% endif %}

<span class = "pagetype d-none" >Deafult Home Screen</span>
<div id="section01" class="home-banner">
<div class="custom-slider home-slider ht-slides home-web-slider">
{% for homebanner in homebanners %}
{% set video = homebanner.video %}
{% if homebanner.video %}
{% set video = video.data %}
<div class="slide ">
<video id="home-video" class="video-js" muted autoplay loop preload="auto" poster="{{ homebanner.image }}" data-setup="{}" height="902">
<source src="{{ video }}" type="video/mp4">
</video>
</div>

{% else %}
<div class="slide"><img src="{{ homebanner.image }}" alt="" /></div>

{% endif %}
{% endfor %}
</div>
<div class="custom-slider home-slider ht-slides home-mobile-slider">
{% for homebanner in homebanners %}
{% set video = homebanner.video_mobile %}
{% if homebanner.video_mobile %}
{% set video = video.data %}
<div class="slide ">
<video id="home-video" class="video-js" muted autoplay playsinline loop preload="auto" poster="{{ homebanner.image_mobile }}" data-setup="{}" height="902">
<source src="{{ video }}" type="video/mp4">
</video>
</div>

{% else %}
<div class="slide"><img src="{{ homebanner.image_mobile }}" alt="{{"KarakServingtheoriginaltastesince1955"|trans }}" /></div>

{% endif %}
{% endfor %}
</div>

<div class="banner-mask">
{% if locale == 'ar' %}

<img src="/static/assets/images/home_page_mask_images/mask_image_web_ar.png" alt="Rainbow AMM Footer English 1920">
{% else %}

<img src="/static/assets/images/home_page_mask_images/mask_image_web_en.png" alt="Rainbow AMM Footer English 1920">
{% endif %}
</div>
</div>
<div class="banner-mask-mbl">
{% if locale == 'ar' %}

<img src="/static/assets/images/home_page_mask_images/mask_image_mobile_ar.png" alt="Rainbow AMM Footer English 1920">
{% else %}

<img src="/static/assets/images/home_page_mask_images/mask_image_mobile_en.png" alt="Rainbow AMM Footer English 1920">
{% endif %}
</div>
<a href="#section02" class="scrolldown"><span></span></a>



<section id="section02" class="home-section karak-section">
<div class="karak-section-holder">
<div class="section-heading">
<h2 class="sub-xl-heading gtm-contentval">{{ pimcore_input("karakheadline") }}</h2>
<a href="#section03" class="scrolldown"><span></span></a>
</div>
<div class="karak-slider-holder">
<div class="container custom-container">
<div class="row">
<div class="col-xl-9">
<h3 class="main-xl-heading gtm-contentval">{{ pimcore_input("Enjoytherichcreamytaste") }}</h3>
</div>
<div class="karak-mobile-image">
<img src="/static/assets/images/karakproducts1.png" alt="karakproducts">
</div>
<div class="col-xl-9 karak-slider-box">
<div class="custom-slider fill-slider karak-slider">
{% set count = 1 %}
{% for product in products %}
{% set regions = product.getRegions() %}
{% set show = false %}
{% if regions %}
{% for region in regions %}
{% if region in groupids %}
{% set show = true %}
{% endif %}
{% endfor %}
{% endif %}
{% if show %}
{% set count = count + 1 %}
{% if count <= 4 %}
<div class="slide" data-aos="zoom-in-up">
<div class="karak-box">
<div class="row">
<div class="col-md-5 col-xl-5 karak-img">
{% if product.attributes %}
<a href="/{{locale}}/{{"products"|trans }}/{{product.attributes[0].url}}">
<img class="img-fluid" src="{{product.attributes[0].images[0].getFullPath() }}" xoriginal="{{product.attributes[0].images[0].path ~ product.attributes[0].images[0].filename }}" alt ="{{product.name}}" /></a>
{% endif %}
</div>
<div class="col-md-7 col-xl-7 slide-product-info">
{% if product.attributes %}
<a class="remove-anchor-style1" href="/{{locale}}/{{"products"|trans }}/{{product.attributes[0].url}}">
<h5>{{product.name}}</h5>
</a>
{% endif %}
<ul class="list-unstyled con-list">
{% for key , productattr in product.attributes %}
{% if key < 3 %}
<li class="{{ key == 0 ? 'variantsbold' : '' }}"><a class="remove-anchor-style1 " href="/{{locale}}/{{"products"|trans }}/{{productattr.url}}">{{productattr.size}}</a></li>
{% endif %}
{% endfor %}
{% if product.attributes %}
{% set regionslinks = product.attributes[0].buttonlinks %}
{% set rlink = [] %}
{% for key ,link in regionslinks %}
{% if link['country'].data == country %}
{% set rlink = link %}
{% endif %}
{% endfor %}
{% if not rlink %}
{% for key ,link in regionslinks %}
{% if link['country'].data == 'AE' %}
{% set rlink = link %}
{% endif %}
{% endfor %}
{% endif %}
{% if not rlink %}
{% set rlink = {
'lulu': { 'data': product.lulu },
'unioncool': { 'data': product.unioncool },
'amazon': { 'data': product.amazon },
'carrefour': { 'data': product.carrefour },
'c4': { 'data': '' },
'noon': { 'data': '' },
'danube': { 'data':'' },
'sultancenter': { 'data': '' },
'tawseel': { 'data': ''},
} %}
{% endif %}
{% endif %}
</ul>
<div class="link-holder">
<button class="btn btn-primary ico-btn productbuynow mybutton"
data-lulu="{{ (rlink['lulu']) ? rlink['lulu'].data : '' }}"
data-union="{{ (rlink['unioncool']) ? rlink['unioncool'].data : '' }}"
data-amazon="{{ (rlink['amazon']) ? rlink['amazon'].data : '' }}"
data-carrefour="{{ (rlink['carrefour']) ? rlink['carrefour'].data : '' }}"
data-c4="{{ (rlink['c4']) ? rlink['c4'].data : '' }}"
data-noon="{{ (rlink['noon']) ? rlink['noon'].data : '' }}"
data-danube="{{ (rlink['danube']) ? rlink['danube'].data : '' }}"
data-tawseel="{{ (rlink['tawseel']) ? rlink['tawseel'].data : '' }}"
data-sultancenter="{{ (rlink['sultancenter']) ? rlink['sultancenter'].data : '' }}" onclick="showModal()" value="Open Model">
<i><img src="/static/assets/images/shopping-cart.svg" alt="shopping-cart"></i>
<span>{{"buyNow"|trans }}</span>
</button>
</div>
</div>
</div>
</div>
</div>
{% endif %}
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
</div>
<div class="karaktea-img" data-aos="fade-left" data-aos-delay="400">
{% if locale == 'ar' %}
<div class="m-image-sections">
<div class="image-container">
<img src="/static/assets/images/design-one.webp" alt="Rainbow Condensed Full Milk Cream" />
<img src="/static/assets/images/design-two.webp" alt="Rainbow Evaporated Milk - Lite" />
<img src="/static/assets/images/design-three.png" alt="Rainbow Milk - Lite" />
<img src="/static/assets/images/design-four.png" alt="Rainbow Milk - Original" />
<img src="/static/assets/images/design-five.png" alt="Rainbow Evaporated Milk - Original" />
<img src="/static/assets/images/design-six.webp" alt="Rainbow Milk - Original Quality Milk" />
</div>
<p class="text-center karak-serving-text">في خدمتك منذ عام 1955</p>
</div>
{% else %}
<div class="m-image-sections">
<div class="image-container">
<img src="/static/assets/images/design-one.webp" alt="Rainbow Condensed Full Milk Cream" />
<img src="/static/assets/images/design-two.webp" alt="Rainbow Evaporated Milk - Lite" />
<img src="/static/assets/images/design-three.png" alt="Rainbow Milk - Lite" />
<img src="/static/assets/images/design-four.png" alt="Rainbow Milk - Original" />
<img src="/static/assets/images/design-five.png" alt="Rainbow Evaporated Milk - Original" />
<img src="/static/assets/images/design-six.webp" alt="Rainbow Milk - Original Quality Milk" />
</div>
<p class="text-center karak-serving-text">Serving you since 1955</p>
</div>
{% endif %}
</div>
</section>


<section class="home-section karak-section trending-recipe">
<div class="karak-section-holder">
<div class="section-heading">
<h1 class="sub-xl-heading">{{ pimcore_input("AddMagictoYourHomeCookingwithRainbow") }}</h1>
<p class="para">{{ pimcore_input("WhetheritsBreakfastLunchDinnerorSpecialOccasionfindarecipereadyforyoutotryDiscoverdeliciousnesswitheveryRainbowproduct") }}</p>
</div>
<div class="karak-slider-holder">
<div class="container custom-container">
<div class="row">
<div class="karak-mobile-image">
<img src="/static/assets/images/karakproducts.png" alt="{{ locale == 'ar' ? 'اشتروا حليب أبو قوس الأصلي بأفضل سعر في الإمارات العربية المتحدة والمملكة العربية السعودية' : 'Buy Rainbow Quality Milk Original at Best Price in UAE & Saudi Arabia' }}">
</div>
</div>
</div>
</div>
</div>
<div class="karaktea-img add-magic-to-home-edited" data-aos="fade-left" data-aos-delay="400">
<img src="/static/assets/images/cullinary-products.png" alt="cullinary products">
</div>
</section>


<section id="section06" class="home-section similar-recipes featured-recipes portalnew" >
<div class="container-xl custom-container-xl">
<div class="section-heading">

<a href="#section07" class="scrolldown"><span></span></a>
</div>

<div class="row custom-slider fill-dots similar-slider">
{% for key , featured in recipe %}
<div class="col-xl-3 slide p-slide-wrap " data-aos="zoom-in-up">
<div class="slide-box p-slide-wrap">
<figure class="similar-img home-img-slider">
<a class="" href="/{{locale}}/{{"all-recipes-link"|trans }}/{{featured.url}}">
<img src="{{featured.featured_image}}" alt="{{featured.name}} {{"Recipe"|trans }}" class="img-fluid ">
</a>
</figure>
<a class="remove-anchor-style1" href="/{{locale}}/{{"all-recipes-link"|trans }}/{{featured.url}}">
<h3 class="similar-title">{{featured.name}}</h3>
</a>
{% set rating = getmyavghome(featured.getId() ) %}

<div class="rating-holder">
<fieldset class="ratings rating-sm">
{% if rating == '5' %}
<input type="radio" value="5" checked>
{% else %}
<input type="radio" value="5" >
{% endif %}
<label class="full" for="1rviewar5" title="5 stars"></label>
{% if rating == '4' %}
<input type="radio" value="4" checked>
{% else %}
<input type="radio" value="4" >
{% endif %}
<label class="full" for="1reviwstar4" title=" 4 stars"></label>
{% if rating == '3' %}
<input type="radio" value="3" checked>
{% else %}
<input type="radio" value="3" >
{% endif %}
<label class="full" for="1reviewsar3" title="3 stars"></label>
{% if rating == '2' %}
<input type="radio" value="2" checked>
{% else %}
<input type="radio" value="2" >
{% endif %}
<label class="full" for="1reviestar2" title="2 stars"></label>
{% if rating == '1' %}
<input type="radio" value="1" checked>
{% else %}
<input type="radio" value="1">
{% endif %}
<label class="full" for="1reviewar1" title="1 star"></label>
</fieldset>
</div>

<div class="serving-info">
<ul class="list-unstyled">
<li class="time">{{featured.time}} {{"mins"|trans }}</li>
{% if featured.serving_options.Items[0].serving == '1' %}
<li class="serve">{{featured.serving_options.Items[0].serving}} {{ featured.serving_options.Items[0].serving2 ? '- ' ~ featured.serving_options.Items[0].serving2 : '' }}{{"Serving"|trans }}</li>
{% else %}
<li class="serve">{{featured.serving_options.Items[0].serving}} {{ featured.serving_options.Items[0].serving2 ? '- ' ~ featured.serving_options.Items[0].serving2 : '' }}{{"Servings"|trans }}</li>
{% endif %}
</ul>
</div>
<div>
<p>{{featured.short_description|striptags}}</p>
</div>
</div>
</div>
{% endfor %}
</div>

<div class="btn-holder view-recieps-btn">
<a href="/{{locale}}/{{"all-recipes"|trans }}" class="btn btn-primary ico-btn" data-aos="zoom-in-up">
<i class="icon-dish"></i>
<span>{{"ViewallRecipes"|trans }}</span>
</a>
</div>
</div>
</section>



<section id="section04cat" class="home-section our-products">
<div class="products-header">
<h2 class="sub-xl-heading">{{"OurProducts"|trans }}</h2>
<span class="custom-dropdown">
<select class="getcat" @change="updateMe">
<option value="all">{{"AllCategories"|trans }}</option>
<template v-for="(product,index) in our_products">
<option :alt ="index">{{"{{index}}"}} </option>
</template>
</select>
</span>
<a href="#section05" class="scrolldown"><span></span></a>
</div>
<template v-if="isLoading">
<div style="text-align:center">
<svg style="width: 100px;
height: 100px;
margin: 20px;
display:inline-block;" version="1.1" id="L9" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 0 0" xml:space="preserve">
<path fill="#000" d="M73,50c0-12.7-10.3-23-23-23S27,37.3,27,50 M30.9,50c0-10.5,8.5-19.1,19.1-19.1S69.1,39.5,69.1,50">
<animateTransform attributeName="transform" attributeType="XML" type="rotate" dur="1s" from="0 50 50" to="360 50 50" repeatCount="indefinite" />
</path>
</svg>
</div>
</template>
<template v-else>

<div class="product-sliderbox">
<div class="container-xl custom-container-xl">
<div class="custom-slider fill-slider product-slider getcatdata">
<template v-for="(product,index) in listProducts">
<div v-if='typeof product === "object"' class="slide" data-aos="zoom-in-up">
<div class="slide-product-holder">
<div class="slide-product-img" :class="`${product[2].length > 0 ? 'img'+ product[2][0] : ''}`">
<a :href="`/{{locale}}/{{"products"|trans }}/${product[13]}`"> <img class="img-fluid" :src="product[1]" :xoriginal="product[1]" :alt ="product[0]"/></a>
</div>
<div class="slide-product-info custom-slide-product-info">
<a class="remove-anchor-style1" :href="`/{{locale}}/{{"products"|trans }}/${product[13]}`">
<h5>{{"{{product[0]}}"}} </h5>
</a>
<ul class="list-unstyled con-list">
<li :class="`${index == 0 ? 'variantsbold' : ''} `" v-for="(list,index) in product[2]">
<a class="remove-anchor-style1" :href="`/{{locale}}/{{"products"|trans }}/${product[14][index]}`">{{"{{list}}"}}</a></li>
</ul>
<div class="link-holder">
<a class="btn btn-secondary ico-btn" :href="`/{{locale}}/{{"products"|trans }}/${product[13]}`">
<i class="fa fa-search"></i>
<span>{{"KnowMore"|trans }}</span>
</a>
<a class="btn btn-primary ico-btn productbuynow mybutton"
:data-lulu="`${product[4]}`"
:data-union="`${product[5]}`"
:data-amazon="`${product[6]}`"
:data-carrefour="`${product[7]}`"
:data-c4="`${product[8]}`"
:data-noon="`${product[9]}`"
:data-danube="`${product[10]}`"
:data-tawseel="`${product[11]}`"
:data-sultancenter="`${product[12]}`"
>
<i><img src="/static/assets/images/shopping-cart.svg" alt="shopping-cart"></i>
<span>{{"Buy Now!"|trans }}</span>
</a>
</div>
</div>
</div>
</div>
</template>
</div>
</div>
</div>


</template>
</section>

<section id="section07" class="home-section know-more">
{% for footervideo in footervideo %}
<div class="d-none d-sm-block">
<img src="{{footervideo.footer_image}}" alt="footer image" class="video-js" id="landscape-video">
<!-- <video id="landscape-video" class="video-js" playsinline autoplay loop muted poster="/static/assets/images/account-bg.jpg" data-setup="{}" width="100%" height="400" poster = "<php echo $footervideo->getFooter_image(); ?>" >
<source src="<php echo $video->getPath() . $video->getFilename(); ?>" type="video/mp4">
</video> -->
</div>
{% endfor %}
{% for footervideo in footervideo %}
<div class="d-block d-sm-none">
<!-- <video id="landscape-video" class="video-js" playsinline autoplay loop muted data-setup="{}" preload="auto" width="100%" height="400" poster = "<php echo $footervideo->getFooter_image_mobile(); ?>">
<source src="<php echo $video1->getPath() . $video1->getFilename(); ?>" type="video/mp4">
</video> -->
<img src="{{footervideo.footer_image_mobile}}" alt="footer image mobile" class="video-js" id="landscape-video">
</div>
{% endfor %}
<div class="know-more-holder footer-up-section-home">


<div class="btn-holder">
<a class="btn btn-info ico-btn" href="/{{locale}}/{{"about-us-link"|trans }}" tabindex="0" data-aos="zoom-in-up">
<i class="fa fa-search"></i>
<span>{{"knowMore"|trans }}</span>
</a>
</div>
</div>
</section>

{# <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> #}
<script src="/static/assets/js/vue.js"></script>

<script src="/static/assets/js/aos.js"></script>

<script type="text/javascript">
{# window.our_product_homepage = new Vue({
el: "#section04cat",
data: {
altVal: '',
selectCat: 'all',
our_products: {{ categorydata| raw }},
isLoading: false
},
methods: {
updateMe(i) {
// $('.product-slider').slick('unslick');
this.selectCat = i.target.value;
this.isLoading = true;
// console.log("Loading", this.isLoading)
setTimeout(() => {
this.isLoading = false;
// console.log("Loading Inside ", this.listProducts)
// console.log("Loading Inside Timeout", this.isLoading,this.listProducts.length)
if (!this.isLoading && this.listProducts.length > 0) {
setTimeout(()=>{
console.log('start prodSlider');
prodSlider();
ShowBuyNowModel();
console.log('end prodSlider');
// $('.product-slider').slick({
// slidesToShow: 4,
// arrows: true,
// dots: false,
// infinite: false,
// responsive: [{
// breakpoint: 1159,
// settings: {
// arrows: false,
// slidesToShow: 2,
// dots: true
// }
// }, {
// breakpoint: 767,
// settings: {
// arrows: true,
// slidesToShow: 1,
// dots: false
// }
// }]
// });
},1);
}
}, 5);
}
},
computed: {
listProducts() {
// console.log(this.selectCat)
let products = [];
if (this.selectCat !== 'all') {
// console.log('our listProducts',this.our_products);
// console.log(this.selectCat);
products = this.our_products[this.selectCat];
console.log('Categorized filtered prod data', products);
// return this.our_products[this.selectCat];
// ;
}else{
for (index in this.our_products) {
products = [...products, ...this.our_products[index]]
}
// console.log("After for loop", products);
}
// let products = [];
// for (index in this.our_products) {
// products = [...products, ...this.our_products[index]]
// }
if(document.documentElement.lang == "ar"){
products = products.reverse();
// console.log("initial Prod Data After Reverse",products);
}
return products;
}
}
}); #}
</script>

{% if (locale =='ar') %}
{% set topMenu ="/en" %}
{% else %}
{% set topMenu ="/ar" %}
{% endif %}
<script type="text/javascript">
var _TopMenuLink = "{{topMenu }}"
var vuejsresponse = {{ categorydata| raw }}
$(document).ready(function(){
ShowBuyNowModel();
});
</script>
{% endblock %}

templates/content/Portal.html.twig line 1