Symfony Profiler

{% extends "front/_common/_base.html.twig" %}
{% block linkcanonical %}
<link rel="canonical" href="{{ absolute_url(path('model_detail', {'slug': truck.slug})) }}">
{% endblock %}
{% block cssadicional %}
<link rel="stylesheet" href="{{ asset('static/js/slick/slick.css') }}">
<link rel="stylesheet" href="{{ asset('static/js/slick/slick-theme.css') }}">
<link rel="stylesheet" href="{{ asset('static/js/lightgallery/lightgallery.css') }}">
<link rel="stylesheet" href="{{ asset('static/js/lightgallery/lg-transitions.min.css') }}">
<link rel="stylesheet" href="{{ asset('static/js/lightgallery/lg-fb-comment-box.min.css') }}">
<link rel="stylesheet" href="{{ asset('static/js/validationform/validationEngine.jquery.css') }}">
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"/>
{% endblock %}
{% block classbody %}detalle_listado_header_none{% endblock %}
{% block content %}
<div class="detalle_parent_header">
<div class="detalle_listado_header">
<a href="{{ path('model_list') }}" class="detalle_listado_icono_header icon-arrow_back_ios"></a>
<div class="detalle_listado_wrap_header_links">
<div class="detalle_listado_header_envolve">
<a class="detalle_listado_header_img" href="{{ sd.returnLink ? sd.returnLink : back_url }}" target="{{ (sd.returnTarget and sd.returnLink)|url_target }}">
<img src="{{ asset(info.headerLogoColor|image_path) }}" width="185" alt="{{ info.seoTitle }}">
</a>
<p>{{ truck.title }}</p>
</div>
<div class="detalle_listado_header_row">
<div class="detalle_listado_header_btn_cotiza">
<a class="btn btn_lightblue" href="">Cotizar</a>
</div>
<ul class="headerdetailListJs">
{% if truck.characteristicsShow %}
<li><a class="active header_detalle_link" href="#caracteristicas" data-href="#caracteristicas">Características</a></li>
{% endif %}
{% if truck.descriptionShow %}
<li><a class="header_detalle_link" href="#description" data-href="#description">Descripción</a></li>
{% endif %}
{% if truck.applicationsShow %}
<li><a class="header_detalle_link" href="#aplicaciones" data-href="#aplicaciones">Aplicaciones</a></li>
{% endif %}
{% if truck.attributesShow %}
<li><a class="header_detalle_link" href="#atributos" data-href="#atributos">Atributos</a></li>
{% endif %}
{% if truck.technicalDatasheetShow %}
<li><a class="header_detalle_link" href="#fichatecnica" data-href="#fichatecnica">Ficha Técnica</a></li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
<section class="detalle_listado_container">
<div class="detalle_scroll_listado">
<img src="{{ STATIC_URL }}img/scroll.svg" width="" height="" alt="">
<span>Scroll</span>
</div>
<div class="detalle_listado_container_center ww_center" data-sticky-container="data-sticky-container">
<div class="detalle_listado_container_left">
<div class="detalle_listado_links">
<ul>
<li><a href="{{ path('home') }}">Inicio</a></li>
<li><span>/</span></li>
<li><a href="{{ path('model_list') }}">VW Camiones y Buses</a></li>
<li><span>/</span></li>
<li><a href="{{ path('model_trucks') }}">Camiones</a></li>
<li><span>/</span></li>
<li><a class="active">{{ truck.title }}</a></li>
</ul>
</div>
<div class="b1detalle">
<div class="b1detalle_content ww_center">
<h1 class="b1detalle_title">{{ truck.title }}</h1>
<div class="b1detalle_block">
<div class="b1detalle_bigslider">
<ul class="b1detalleSliderBig">
<li>
<figure class="b1detalle_imgbig">
<img src="{{ asset(truck.image|image_path) }}" width="616" height="88" alt="{{ truck.title }}">
</figure>
</li>
{% for item in truck.galleryItems %}
<li>
<figure class="b1detalle_imgbig">
<img src="{{ asset(item.image|image_path) }}" width="616" height="88" alt="{{ truck.title }}">
</figure>
</li>
{% endfor %}
</ul>
</div>
<div class="b1detalle_minislider">
<ul class="b1detalleSliderMini">
<li>
<figure class="b1detalle_imgmini">
<img src="{{ asset(truck.image|image_path) }}" width="150" height="88" alt="{{ truck.title }}">
</figure>
</li>
{% for item in truck.galleryItems %}
<li>
<figure class="b1detalle_imgmini">
<img src="{{ asset(item.image|image_path) }}" width="150" height="88" alt="{{ truck.title }}">
</figure>
</li>
{% endfor %}
</ul>
<div class="b1detalle_controls">
<span class="b1detalle_arrow b1detalle_mini_prev icon-arrow_back_ios"></span>
<span class="b1detalle_arrow b1detalle_mini_next icon-arrow_forward_ios"></span>
</div>
</div>
</div>
{% if truck.characteristicsShow or truck.descriptionShow %}
<div class="b1detalle_info">
{% if truck.characteristicsShow %}
<div class="b1detalle_item" id="caracteristicas">
<h2 class="b1detalle_subtitle">Características</h2>
<div class="b1detalle_group">
{% for item in truck.characteristicsItems %}
<div class="b1detalle_box">
<p>{{ item.title }}</p>
<p><strong>{{ item.description }}</strong></p>
</div>
{% endfor %}
</div>
</div>
{% endif %}
<div class="b1detalle_listado_form"></div>
{% if truck.descriptionShow %}
<div class="b1detalle_item" id="description">
{% if truck.descriptionTitle %}
<h2 class="b1detalle_subtitle">{{ truck.descriptionTitle }}</h2>
{% endif %}
{% if truck.descriptionText %}
<div class="b1detalle_description">
<p>{{ truck.descriptionText|nl2br }}</p>
</div>
{% endif %}
</div>
{% endif %}
</div>
{% endif %}
</div>
</div>
{% if truck.applicationsShow %}
<div class="detalle_bloque2" id="aplicaciones">
<h2>Aplicaciones</h2>
<p>{{ truck.applicationsText|markdown_only_strong }}</p>
<div class="detalle_bloque2_wrap">
{% for item in truck.applicationsItems %}
<div class="detalle_bloque2_item">
<figure>
<img src="{{ asset(item.image|image_path) }}" width="" height="" alt="{{ item.image|split_alt }}">
</figure>
<h3>{{ item.title }}</h3>
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% if truck.attributesShow %}
<div class="detalle_bloque3" id="atributos">
<h2>Atributos</h2>
<div class="detalle_bloque3_nav">
<div class="detalleSliderListadoJs">
<ul class="swiper-wrapper">
{% for item in truck.attributesItems %}
<li class="swiper-slide"><a class="detalle_bloque3_tab_nav" onclick="tabContent(event, 'detalle_bloque3_tab_content-{{ loop.index }}')" href="">{{ item.attribute }}</a></li>
{% endfor %}
</ul>
<div class="swiper-scrollbar"></div>
<div class="detalle_listado_controls">
<div class="detalle_listado_prev icon-arrow_back_ios"></div>
<div class="detalle_listado_next icon-arrow_forward_ios"></div>
</div>
</div>
</div>
<div class="detalle_bloque3_info">
{% for item in truck.attributesItems %}
<div class="detalle_bloque3_tab_content" id="detalle_bloque3_tab_content-{{ loop.index }}">
<div class="detalle_bloque3_txt">
<h3>{{ item.title }}</h3>
<p>{{ item.text|nl2br }}</p>
</div>
<figure class="detalle_bloque3_fig">
<img src="{{ asset(item.image|image_path) }}" width="" height="" alt="{{ item.image|split_alt }}">
</figure>
{% if item.source %}
<div class="detalle_bloque3_fuente">
<p>Fuente: <a href="{{ item.source|external_url }}" target="_blank">{{ item.source|external_url }}</a></p>
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
{% endif %}
{% if truck.technicalDatasheetShow %}
<div class="detalle_bloque4" id="fichatecnica">
<h2>Ficha Técnica</h2>
<div class="detalle_bloque4_select">
<select name="" id="">
{% for item in truck.technicalDatasheetItems %}
<option value="{{ loop.index - 1 }}">{{ item.title }}</option>
{% endfor %}
</select>
<span class="icon-arrow_drop_down"></span>
</div>
<div class="detalle_bloque4_table">
{% for item in truck.technicalDatasheetItems %}
<div class="detalle_bloque4_row_table" style="display:none;">
{{ item.text|only_table }}
</div>
{% endfor %}
{% if truck.technicalDatasheetFile|image_path %}
<div class="detalle_bloque4_btn">
<a href="{{ asset(truck.technicalDatasheetFile|image_path) }}" download>Descargar Ficha <span class="icon-download"></span></a>
</div>
{% endif %}
</div>
</div>
{% endif %}
</div>

<div class="detalle_listado_container_rigth sticky" data-margin-top="70" data-sticky-for="1025">
<h2>Me interesa</h2>
{{ form_start(form, {'attr': {'id': 'formDetalle'}}) }}
{% include 'front/templates/form_utm_fields.html.twig' %}
{{ form_widget(form.typePerson) }}
{{ form_widget(form.documentType) }}
{{ form_widget(form.documentNumber) }}
{{ form_widget(form.model) }}
<ul>
<li class="detalle_listado_form_head">
<div class="detalle_listado_check_radio">
<div class="contacto_tab_radio">
<input checked type="radio" name="form_type" class="checkedInput" value="Empresa" id="form_truck_legal_person">
<label for="form_truck_legal_person">Soy empresa</label>
</div>
<div class="contacto_tab_radio" style="margin-right:0px;">
<input type="radio" name="form_type" class="checkedInput" value="Persona natural" id="form_truck_natural_person">
<label for="form_truck_natural_person">Soy Persona Natural</label>
</div>
</div>
</li>
<li class="noneInputsEmpresa">
<div class="detalle_listado_inputs">
<div class="detalle_input_box">
<input type="text" class="form_notActive inputEffect form_notActive validate[required] form_truck_document_number soloNumber" id="form_truck_document_number_legal_person">
<label for="form_truck_document_number_legal_person">RUC *</label>
</div>
<div class="detalle_input_box">
{{ form_widget(form.company, {'attr': {'class': 'form_notActive inputEffect form_notActive validate[required]'}}) }}
<label for="form_truck_company">Empresa *</label>
</div>
</div>
</li>
<li class="noneInputs">
<div class="detalle_listado_inputs">
<div class="detalle_input_box">
<select id="form_truck_document_types" class="inputEffect validate[required]">
<option value="" disabled selected></option>
{% for item in forms.documentTypes %}
<option value="{{ item.title }}">{{ item.title }}</option>
{% endfor %}
</select>
<label for="form_truck_document_types">Tipo de documento *<span class="icon-arrow_drop_down"></span></label>
</div>
<div class="detalle_input_box">
<input type="text" id="form_truck_document_number_natural_person" class="form_isActive inputEffect soloNumber form_isActive validate[required] form_truck_document_number">
<label for="form_truck_document_number_natural_person">Número de documento *</label>
</div>
</div>
</li>
<li>
<div class="detalle_listado_inputs">
<div class="detalle_input_box">
{{ form_widget(form.name, {'attr': {'class': 'inputEffect validate[required]'}}) }}
<label for="form_truck_name">Nombres *</label>
</div>
<div class="detalle_input_box">
{{ form_widget(form.lastname, {'attr': {'class': 'inputEffect validate[required]'}}) }}
<label for="form_truck_lastname">Apellidos *</label>
</div>
</div>
</li>
<li>
<div class="detalle_listado_inputs">
<div class="detalle_input_box">
{{ form_widget(form.department, {'attr': {'class': 'inputEffect validate[required]'}}) }}
<label for="form_truck_department">Departamento *</label>
</div>
<div class="detalle_input_box">
{{ form_widget(form.phone, {'attr': {'class': 'inputEffect soloNumber validate[required, custom[phone]]'}}) }}
<label for="form_truck_phone">Teléfono *</label>
</div>
</div>
</li>
<li>
<div class="detalle_listado_inputs">
<div class="detalle_input_box">
{{ form_widget(form.email, {'attr': {'class': 'inputEffect validate[required, custom[email]]'}}) }}
<label for="form_truck_email">Correo Electrónico *</label>
</div>
</div>
</li>
</ul>
<div class="detalle_listado_obligatorio">
<p>* Campos obligatorios</p>
</div>
<div class="detalle_listado_check_input">
<input type="checkbox" id="inputCheckDetalle" class="validate[required]" name="">
<label for="inputCheckDetalle">
<span></span>
<p>He leído y acepto las <a href="{{ path('data_protection_policies') }}">Políticas de privacidad</a></p>
</label>
</div>
<div class="detalle_listado_button">
<button id="btnFormCamiones" class="btn btn_lightblue" href="">Enviar</button>
</div>
{{ form_end(form) }}
</div>
</div>
{% if truck.additionalShow %}
<div class="detalle_listado_videos ww_center">
{% if truck.additionalTitle %}
<h2>{{ truck.additionalTitle }}</h2>
{% endif %}
<ul class="" id="galleryVideos">
{% for item in truck.additionalItems %}
{% if item.video|youtube_id %}
<li>
<a href="https://www.youtube.com/watch?v={{ item.video|youtube_id }}" class="detalle_listado_video_itm">
<figure>
<img src="{{ asset(item.image|image_path) }}" width="" height="" alt="{{ item.image|split_alt }}">
</figure>
</a>
</li>
{% endif %}
{% endfor %}
</ul>
</div>
{% endif %}
</section>
{% endblock %}
{% block jsfinal %}
<script src="{{ asset('static/js/sticky.js') }}"></script>
<script src="{{ asset('static/js/slick/slick.min.js') }}"></script>
<script src="{{ asset('static/js/lightgallery/lightgallery.js') }}"></script>
<script src="{{ asset('static/js/lightgallery/lg-video.js') }}"></script>
<script src="{{ asset('static/js/lightgallery/lg-autoplay.js') }}"></script>
<script src="{{ asset('static/js/lightgallery/jquery.mousewheel.min.js') }}"></script>
<script src="{{ asset('static/js/validationform/jquery.validationEngine-es.js') }}"></script>
<script src="{{ asset('static/js/validationform/staff.validationEngine.js') }}"></script>
<script src="{{ asset('static/js/navHeader.js') }}"></script>
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
<script type="text/javascript">
var swiper = new Swiper(".detalleSliderListadoJs", {
slidesPerView: 4,
scrollbar: {
el: ".swiper-scrollbar",
hide: true,
},
navigation: {
nextEl: ".detalle_listado_next",
prevEl: ".detalle_listado_prev",
},
breakpoints: {
320: {
slidesPerView: 2,
spaceBetween: 0,
},
768: {
slidesPerView: 4,
spaceBetween: 0,
},
960: {
slidesPerView: 5,
spaceBetween: 0,
},
},
});
var sticky = new Sticky('.sticky');
let InputChecked = document.querySelectorAll('.checkedInput');
let elementDivHidden = document.querySelectorAll('.form_isActive');
let elementDivVisible = document.querySelectorAll('.form_notActive');
InputChecked.forEach((item) => {
item.addEventListener('change', () => {
if (item.value === 'Empresa') {
elementDivHidden.forEach((el) => {
el.disabled = true
el.closest('.noneInputs').style.display = 'none'
})
elementDivVisible.forEach((el) => {
el.disabled = false
el.closest('.noneInputsEmpresa').style.display = 'block'
})
} else {
elementDivHidden.forEach((el) => {
el.disabled = false
el.closest('.noneInputs').style.display = 'block'
})
elementDivVisible.forEach((el) => {
el.disabled = true
el.closest('.noneInputsEmpresa').style.display = 'none'
})
}
})
})
{# $("#galleryVideos").lightGallery(); #}
$('#galleryVideos').lightGallery({
selector: 'a',
videoMaxWidth: '90%',
thumbnail: false,
fullScreen: true,
download: false,
counter: false,
zoom: false
});
function tabContent(evt, content) {
var i, tabcontent, tablinks;
evt.preventDefault();
tabcontent = document.getElementsByClassName("detalle_bloque3_tab_content");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].classList.remove('active')
}
tablinks = document.getElementsByClassName("detalle_bloque3_tab_nav");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(content).classList.add('active')
evt.currentTarget.className += " active";
}
var tabs = document.querySelectorAll('.detalle_bloque3_tab_nav')
if( tabs.length > 0 ) {
tabs[0].click();
}
//+++ INICIO B1DETALLE +++
$('.b1detalleSliderBig').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
fade: true,
dots: false,
asNavFor: '.b1detalleSliderMini',
responsive: [
{
breakpoint: 768,
settings: {
arrows: true,
prevArrow: '.b1detalle_big_prev',
nextArrow: '.b1detalle_big_next'
}
}
]
});
$('.b1detalleSliderMini').slick({
vertical: true,
slidesToShow: 3,
slidesToScroll: 1,
asNavFor: '.b1detalleSliderBig',
dots: false,
centerMode: false,
focusOnSelect: true,
arrows: true,
prevArrow: '.b1detalle_mini_prev',
nextArrow: '.b1detalle_mini_next',
responsive: [
{
breakpoint: 961,
settings: {
vertical: false,
slidesToShow: 3,
slidesToScroll: 1,
//- dots: false,
//- centerMode: false,
//- focusOnSelect: true,
}
},
{
breakpoint: 768,
settings: {
vertical: false,
slidesToShow: 3,
slidesToScroll: 1,
arrows: true
}
}
]
});
//<<< FIN B1DETALLE >>>
{# SELECT FICHA TECNICA #}
$('.detalle_bloque4_row_table').eq(0).show();
$('.detalle_bloque4_select select').change(function(e){
var dataValue = $(this).val();
$('.detalle_bloque4_row_table').hide();
$('.detalle_bloque4_row_table').eq(dataValue).show();
})
{# END #}
{# +++ CAMPOS FORM +++ #}
const detailFields = $(".detalle_input_box input, .detalle_input_box select");
$(detailFields).focusin(function() {
$(this).addClass('border');
});
$(detailFields).focusout(function() {
if ($(this).val() === "") {
$(this).removeClass('border');
}
});
$(detailFields).each(function() {
if ($(this).val()) {
$(this).addClass('border');
}
});
$('.soloNumber').keypress(validateNumber);
function validateNumber(event) {
const key = window.event ? event.keyCode : event.which;
if (event.keyCode === 8 || event.keyCode === 46) {
return true;
} else return !(key < 48 || key > 57);
}
{# END #}
$('#form_truck_legal_person').on('change', function () {
$('#form_truck_typePerson').val($(this).val());
$('#form_truck_document_types').val('');
$('#form_truck_document_number_natural_person').val('');
$('#form_truck_document_number_legal_person').val('');
$('#form_truck_documentType').val('RUC');
$('#form_truck_documentNumber').val('');
$('#form_truck_company').val('');
})
$('#form_truck_natural_person').on('change', function () {
$('#form_truck_typePerson').val($(this).val());
$('#form_truck_document_types').val('');
$('#form_truck_document_number_natural_person').val('');
$('#form_truck_document_number_legal_person').val('');
$('#form_truck_documentType').val('');
$('#form_truck_documentNumber').val('');
})
$('#form_truck_legal_person').trigger('change');
$('.form_truck_document_number').on('keyup', function () {
$('#form_truck_documentNumber').val($(this).val());
})
$('#form_truck_document_types').on('change', function () {
$('#form_truck_documentType').val($(this).val());
})
$('#form_truck_models').on('change', function () {
$('#form_truck_model').val($(this).find('option:selected').data('value'));
})
$('#form_truck_model').val('{{ truck.title }}');
const form_truck = $('#formDetalle');
const form_truck_button = $('#btnFormCamiones');
form_truck.validationEngine('attach', {
promptPosition: "topLeft",
autoHidePrompt: true,
autoHideDelay: 3000,
binded: false,
scroll: false
});
form_truck_button.on('click', function (event) {
event.preventDefault();
const valid = form_truck.validationEngine('validate');
if (valid) {
form_truck.submit();
}
});
let div = document.querySelector('.detalle_listado_container_rigth');
function myFunction(x) {
if (x.matches) {
document.querySelector('.b1detalle_listado_form').appendChild(div)
} else {
document.querySelector('.detalle_listado_container_center').appendChild(div)
}
}
var x = window.matchMedia("(max-width: 1024px)")
myFunction(x)
x.addListener(myFunction)
</script>
{% endblock %}

templates/front/models/detail_truck.html.twig line 1