{# empty Twig template #}
{% extends 'frontend.html.twig' %}
{#% set esHome=true %#}
{% block fondo_slider %}
{% endblock %}
{% block textosmov %}
<div class="wide no-movil avisos-text">
{% if attribute(general2, 'textestatic'~(app.request.locale|capitalize)) !='' %}
<div class="text-fix">{{attribute(general2, 'textestatic'~(app.request.locale|capitalize))|raw}}</div>
{% endif %}
{% if attribute(general2, 'textmoviment'~(app.request.locale|capitalize)) !='' %}
<marquee behavior="scroll" direction="left" scrolldelay="5" scrollamount="5" class="large-12 cell">
{{attribute(general2, 'textmoviment'~(app.request.locale|capitalize))|raw}}
</marquee>
{% endif %}
</div>
{% endblock %}
{% block caixa_movil %}
<div style="position:relative;">
<style>
body{background: #fff;}
.grid-container.general{margin-top:0; padding-top:1rem;}
</style>
<!--<script>
$(document).scroll(function () {
var y = $(this).scrollTop();
if (y > 200) {
$('#logo-top').fadeIn();
} else {
$('#logo-top').fadeOut();
}
});
</script>-->
<!--
{% if videoYoutubeDestacatCentral.youtubeId is defined and videoYoutubeDestacatCentral.youtubeId !='' %}
{% set youtube = videoYoutubeDestacatCentral.youtubeIdResponsive|split('/embed/') %}
{% else %}
<div class="grid-x grid-padding-x wide" {% if videoYoutubeDestacatCentral.youtubeId is defined and videoYoutubeDestacatCentral.youtubeId !='' %} style="background: #5cb6ff;" {% endif %}>
<div class="large-2 medium-2 small-6 cell left-home">
<div class="grid-x grid-padding-x">
<div class="large-12 medium-12 small-3 cell">
<div class="button-home">
<a href="{{path('webcam')}}"><i class="fas fa-video"></i><h6><span>{{ "Webcam" | trans }}</h6></a>
</div>
</div>
<div class="large-12 medium-12 small-3 cell">
<div class="button-home">
<a href="{{path('frontoffice_videos_youtube2')}}"><i class="fab fa-tv-masella"></i><h6>{{ "Masella TV" | trans }}</h6></a>
</div>
</div>
<div class="large-12 medium-12 small-3 cell">
<div class="button-home">
<a href="{{path('frontoffice_fotos')}}"><i class="far fa-image"></i><h6>{{ "Fotos" | trans }}</h6></a>
</div>
</div>
<div class="large-12 medium-12 small-3 cell">
<div class="button-home">
<a href="http://www.masella.com/blog/{{app.request.locale}}"><i class="fab fa-wordpress"></i><h6>{{ "Blog" | trans }}</h6></a>
</div>
</div>
</div>
</div>
<div class="large-8 medium-8 cell no-movil">
</div>
<div class="large-2 medium-2 small-6 cell right-home">
<div class="grid-x grid-padding-x">
<div class="large-12 medium-12 small-3 cell">
<div class="button-home">
<a href="{{path("paginas",{'_slug':render(controller("App\\Controller\\DefaultController::getAppSlugAction"))})}}"><i class="fas fa-mobile-alt"></i><h6>{{ "App Masella" | trans }}</h6></a>
</div>
</div>
</div>
</div>
</div>
{% endif %}
-->
<div id="box-slide">
<div class="wide">
<div class="slide-home">
<div class="orbit" role="region" data-orbit>
<div class="orbit-wrapper">
<div class="orbit-controls">
<button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>◀︎</button>
<button class="orbit-next"><span class="show-for-sr">Next Slide</span>▶︎</button>
</div>
<ul class="orbit-container">
{% for foto in fotos %}
<li class="is-active orbit-slide">
<figure class="orbit-figure">
<img class="orbit-image" src="{{ asset('uploads/fotos/'~foto.rutaImagen)}}" title="{{ attribute(foto, 'titol'~app.request.locale) }}" />
<figcaption class="orbit-caption">{{ attribute(foto, 'titol'~app.request.locale) }}</figcaption>
</figure>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block caixa %}
<div style="position:relative;">
<style>
body{background: #fff;}
.grid-container.general{margin-top:0; padding-top:1rem;}
</style>
<!--<script>
$(document).scroll(function () {
var y = $(this).scrollTop();
if (y > 200) {
$('#logo-top').fadeIn();
} else {
$('#logo-top').fadeOut();
}
});
</script>-->
<div class="large-12 cell video-pc no-movil">
{% if general.getVideoSliderHome() == 'video' %}
{% if videoYoutubeDestacatCentral.youtubeId is defined and videoYoutubeDestacatCentral.youtubeId !='' %}
{% set youtube = videoYoutubeDestacatCentral.youtubeId|split('/embed/') %}
<div class="responsive-embed widescreen" style="margin-bottom:0; position:relative; overflow: hidden;">
<iframe class="mfp-iframe" src="{{videoYoutubeDestacatCentral.youtubeId}}?autoplay=1&mute=1&controls=0&loop=1&playlist={{youtube[1]}}&rel=0&modestbranding=0?showinfo=1" frameborder="0" allowfullscreen="" style="width:100%; height:100%; position:absolute; top:-60px; bottom:-60px;" scrolling="no"></iframe>
</div>
{% endif %}
{% else %}
<div class="slide-home">
<div class="orbit" role="region" data-orbit>
<div class="orbit-wrapper">
<div class="orbit-controls">
<button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>◀︎</button>
<button class="orbit-next"><span class="show-for-sr">Next Slide</span>▶︎</button>
</div>
<ul class="orbit-container">
{% for entity in enFotosHome %}
<li class="is-active orbit-slide">
<figure class="orbit-figure">
<img class="orbit-image" src="{{ asset('uploads/fotoshome/' ~ entity.rutaImagen)}}" title="{{ attribute(entity, 'titol'~app.request.locale) }}" />
<figcaption class="orbit-caption">{{ attribute(entity, 'titol'~app.request.locale) }}</figcaption>
</figure>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
{% endif %}
<script>
function closeApp() {
var v = document.getElementById("app-up");
if (v.style.display === "none") {
v.style.display = "block";
} else {
v.style.display = "none";
}
}
</script>
<script>
function closeUp() {
var v = document.getElementById("compra-up");
if (v.style.display === "none") {
v.style.display = "block";
} else {
v.style.display = "none";
}
}
</script>
{% if general.getComprarVisible() %}
<div id="compra-up">
<h5>{{ "Compra a Masella" | trans }}</h5>
<select name="compra" id="compra">
{% if general.getBotigaAbonament() == 1 %}
{% if app.request.locale == 'en' or app.request.locale == 'fr' %}
<option value="{{path('abonaments_temporada_front', {'_locale':'ca'})}}" data_target="" selected="selected">{{ "Abonaments temporada" | trans }}</option>
{% else %}
<option value="{{path('abonaments_temporada_front')}}#content-page" data_target="" selected="selected">{{ "Abonaments temporada" | trans }}</option>
{% endif %}
{% endif %}
{% if general.getBotigaForfets() == 1 %}
{% if app.request.locale == 'en' %}
<option value="https://masella.axess.shop/es/Tickets/Index" data_target="_blank">{{ "Forfets dia i nit" | trans }}</option>
{% else %}
{% if app.request.locale == 'fr' %}
<option value="https://masella.axess.shop/fr/Products/Tickets/" data_target="_blank">{{ "Forfets dia i nit" | trans }}</option>
{% else %}
<option value="https://masella.axess.shop/{{app.request.locale}}/Tickets/Index" data_target="_blank">{{ "Forfets dia i nit" | trans }}</option>
{% endif %}
{% endif %}
{% endif %}
{% if general.getBotigaPromocions() == 1 %}
<option value="https://masella.axess.shop/{{app.request.locale}}/Tickets#pg1001" data_target="_blank">{{ "Forfets promocions i varis dies" | trans }}</option>
{% endif %}
{% if general.getBotigaRecarrega() == 1 %}
<option value="https://masella.axess.shop/{{app.request.locale}}" data_target="_blank">{{ "Recàrrega forfets" | trans }}</option>
{% endif %}
{% if general.getBotigaClasses() == 1 %}
<option value="{{path('abonaments_temporada_classes')}}" data_target="">{{ "Classes d'esquí i snowboard" | trans }}</option>
{% endif %}
{% if general.getBotigaLloguer() == 1 %}
<option value="{{path('abonaments_temporada_botiga')}}" data_target="">{{ "Lloguer i guardaesquís" | trans }}</option>
{% endif %}
</select>
{% if app.request.locale == 'en' or app.request.locale == 'fr' %}
<a id="btnCompra" class="button expanded" href="{{path('abonaments_temporada_front', {'_locale':'ca'})}}">{{ "Compra ara" | trans }}</a>
{% else %}
<a id="btnCompra" class="button expanded" href="{{path('abonaments_temporada_front')}}">{{ "Compra ara" | trans }}</a>
{% endif %}
<strong>{{ "Atenció al client" | trans }}</strong>: <a href="tel:972144000"><i class="fas fa-phone"></i> 972 144 000</a>
<a class="close-button" onclick="closeUp()"><span aria-hidden="true">×</span></a>
</div>
{% endif %}
</div>
</div>
{% endblock %}
{% block Webcam360_movil %}
<div style="position:relative; background:#fff; padding-top:0; margin-top: 4%;">
<div class="grid-container padding-mobile">
<div class="large-12 cell">
<div class="grid-x grid-padding-x align-middle" style="background:#fff;">
<div class="large-12 cell text-center" style="background: #6B9E9A; padding-top:10px; margin-bottom: 0px; margin-top: 10px;">
<h2 class="main-heading" style="margin-bottom: 0;"><strong>LiveCam 360°</strong></h2>
<h5 class="main-heading">{{"Jumbo Tosa" | trans }}</h5>
</div>
<div class="large-12 medium-12" style="overflow: hidden;">
<!--vertical--> <div id="roundshot-thumbnail-54e8157b35bf33b39791639580461ee72" class="cam360 si-movil" style="border: 0px solid rgba(10, 10, 10, 0); overflow:hidden;"></div><script src="https://backend.roundshot.com/js/roundshot_animated_thumbnail.js" type="text/javascript"></script><script type="text/javascript"> roundshot.animate({id: "54e8157b35bf33b39791639580461ee72", picture: "https://backend.roundshot.com/cams/54e8157b35bf33b39791639580461ee7/thumbnail", link: "https://masella.roundshot.com/", angle: 360, width: 600, height: 160, bounce: false, open_in_new_tab: true, speed: 20});</script>
</div>
<div class="large-12 cell text-center">
<a href="{{path('webcam')}}" class="button large" style="background:#fff; color:#6B9E9A; padding:0.2rem 1rem 1rem 1rem; font-size: 1.8rem; border-bottom: solid 2px #6B9E9A;"><img src="{{asset('frontoffice/images/webcam-green.svg')}}"/> <strong>{{ "Webcams" | trans }}</strong></a>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block Webcam360 %}
<div style="position:relative; background:#fff; padding-top:1rem;">
<div class="grid-container padding-mobile">
{% if general.getWebcam360CapBoscVisible() %}
<div class="large-12 cell">
<div class="grid-x grid-padding-x align-middle mobile-wide">
<div class="large-6 medium-6 small-6 cell">
<h3 class="main-heading">LiveCam 360°</h3>
<h5 class="main-heading">{{"Jumbo Tosa" | trans }}</h5>
</div>
<div class="large-6 medium-6 small-6 cell">
<a href="{{path('webcam')}}" class="button large"><img src="{{asset('frontoffice/images/webcam.svg')}}"/> {{ "Webcams" | trans }}</a>
</div>
<div class="large-12 medium-12 cell" style="overflow: hidden;">
<!--horizontal--><div id="roundshot-thumbnail-54e8157b35bf33b39791639580461ee7" class="cam360 no-movil" style="border: 1px solid rgba(10, 10, 10, 0.25);"></div><script src="https://backend.roundshot.com/js/roundshot_animated_thumbnail.js" type="text/javascript"></script><script type="text/javascript"> roundshot.animate({id: "54e8157b35bf33b39791639580461ee7", picture: "https://backend.roundshot.com/cams/54e8157b35bf33b39791639580461ee7/thumbnail", link: "https://masella.roundshot.com/", angle: 360, width: 1174, height: 449, bounce: false, open_in_new_tab: true, speed: 20});</script>
<p class="no-movil" style="text-align: center; margin-bottom: 2rem;">{{"Clicar la imatge" | trans }}</p>
</div>
</div>
</div>
{% endif %}
</div>
</div>
{% endblock %}
{% block article_movil %}
<div style="position:relative; background:#fff;">
<div class="grid-x grid-padding-x" data-equalizer="foo">
<!-- Slider main container -->
<!--
<div class="swiper" style="width:100%;height: 700px; padding-top:0;">
-->
<div class="swiper" style="width:100%; padding-top:0;">
<!-- Additional required wrapper -->
<div class="swiper-wrapper">
{% for pestanya in enPestanyes %}
<div class="small-12 pestanya swiper-slide">
{% if attribute(pestanya, 'link'~(app.request.locale|capitalize)) !='' %}
<a href="{{attribute(pestanya, 'link'~(app.request.locale|capitalize))}}" target="_blank">
{% endif %}
<div class="callout" style="position:relative; padding: 0;">
<div class="top-pestanya">
<h2 class="text-left"><strong>{{ "Descobreix Masella" | trans }}</strong></h2>
<h4 class="text-left">{{attribute(pestanya, 'titol'~(app.request.locale|capitalize))}}</h4>
{{attribute(pestanya, 'text'~(app.request.locale|capitalize))|raw}}
</div>
{% if pestanya.imatge != '' %}
<div class="img-pestanya" style="background-image: url('{{ asset('uploads/pestanyes/'~pestanya.imatge) }}');">
<img class="img-pestanya_int"src="{{asset('frontoffice/images/mobile-vertical.gif')}}" />
</div>
{% endif %}
</div>
{% if attribute(pestanya, 'link'~(app.request.locale|capitalize)) !='' %}
</a>
{% endif %}
</div>
{% endfor %}
</div>
<!-- If we need pagination -->
<div class="swiper-pagination" style="top:80%;"></div>
<!-- If we need navigation buttons -->
<!--
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
-->
<!-- If we need scrollbar
<div class="swiper-scrollbar"></div> -->
</div>
</div>
</div>
{% endblock %}
{% block article %}
<div style="position:relative; background:#fff;">
<div class="grid-container padding-mobile">
{% set col=0%}
{#% if videoDestacat.codi is defined and videoDestacat.codi !='' %} {% set col=col+1 %} {% endif %#}
{#% if general.pestanya1Visible %} {% set col=col+1 %} {% endif %}
{% if general.pestanya2Visible %} {% set col=col+1 %} {% endif %}
{% if general.pestanya3Visible %} {% set col=col+1 %} {% endif %}
{% if general.pestanya4Visible %} {% set col=col+1 %} {% endif %#}
{% if sFotoDelDia is not empty %} {% set col=col+1 %} {% endif %}
<h3 class="text-center">{{ "Descobreix Masella" | trans }}</h3>
<div class="slide-home">
<div class="orbit" role="region" data-orbit>
<div class="orbit-wrapper">
<div class="orbit-controls">
<button class="orbit-previous"><span class="show-for-sr">Previous Slide</span>◀︎</button>
<button class="orbit-next"><span class="show-for-sr">Next Slide</span>▶︎</button>
</div>
<ul class="orbit-container bloques">
{% set iIcon = 0 %}
{% for pestanya in enPestanyes %}
{% set iIcon=iIcon+1 %}
{% if (iIcon == 1) %}
<li class="is-active orbit-slide">
<div class="grid-x grid-padding-x" data-equalizer="foo">
{% endif %}
<div class="large-4 medium-4 pestanya" style="min-height: 286px!important;">
{% if attribute(pestanya, 'link'~(app.request.locale|capitalize)) !='' %}
<a href="{{attribute(pestanya, 'link'~(app.request.locale|capitalize))}}" target="_blank">
{% endif %}
<div class="callout" data-equalizer-watch="foo" style="position:relative; min-height: 286px!important;">
<h5>{{attribute(pestanya, 'titol'~(app.request.locale|capitalize))}}</h5>
{{attribute(pestanya, 'text'~(app.request.locale|capitalize))|raw}}
{% if pestanya.imatge != '' %}
<div class="img-pestanya" style="background-image: url('{{ asset('uploads/pestanyes/'~pestanya.imatge) }}');">
<img src="{{asset('frontoffice/images/pc-vertical.gif')}}" />
</div>
{% endif %}
</div>
{% if attribute(pestanya, 'link'~(app.request.locale|capitalize)) !='' %}
</a>
{% endif %}
</div>
{% if (iIcon == 3) %}
{% set iIcon = 0%}
</div>
</li>
{% endif %}
{% endfor %}
{% if (iIcon != 0) %}
</div>
</li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
{#% include 'App::foot.html.twig' %#}
{% endblock %}
{% block javascripts %}
{{parent()}}
<script type="text/javascript">
{%if errors is defined and errors|length>0%}
alert("hay errores")
{%endif%}
$(function () {
$(".swiper").css('height', $(window).height() + 'px');
$(".img-pestanya_int").css('height', ($(window).height() - 220) + 'px');
$('#compra').on('change', function (e) {
$('#btnCompra').attr('href', $(this).val()).attr('target', $('option:selected', this).attr('data_target'));
})
})
var swiper = new Swiper('.swiper', {
// Optional parameters
direction: 'horizontal',
loop: true,
// If we need pagination
pagination: {
el: '.swiper-pagination',
},
// Navigation arrows
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
// And if we need scrollbar
scrollbar: {
el: '.swiper-scrollbar',
},
});
</script>
{% endblock%}