{% extends "website/base/base_paroquias.html" %}
{% load tags_conteudos %}
{% load thumbnail %}


{% block principal %}
    {% if website.websiteprofile.home_noticia %}
        {% get_latest_contents website=website cod=website.websiteprofile.home_noticia.pk content_type=1 elements=1 as bemvindo %}
    {% endif %}
    {% if website.websiteprofile.home_noticias %}
        {% get_latest_contents website=website sections=website.websiteprofile.home_noticias.pk content_type=1 elements=3 as noticias %}
    {% endif %}
    {% if website.websiteprofile.fotogaleria_seccao %}
        {% get_latest_contents website=website sections=website.websiteprofile.fotogaleria_seccao.pk content_type=2 elements=1 as fotogaleria %}
    {% endif %}

               {% if bemvindo %}
                  <!--boas vindas-->
                  <div>
                      <div class="titulos">{{ bemvindo.0.titulo }}</div>
                      <div class="noticia_conteudo">
                          {% if bemvindo.0.resumo %}<b>{{ bemvindo.0.resumo|linebreaksbr }}</b>{% endif %}.
                          {{ bemvindo.0.noticia|safe }}
                      </div>
                  </div>
                 <!-- fim de boas vindas-->
              {% endif %}
              {% if noticias %}
                  <!--noticias-->
                  <div>
                      <div class="titulos"><a href="{% url paroquia_noticias-view paroquia=paroquia pk=website.websiteprofile.home_noticias.pk %}">{{ website.websiteprofile.home_noticias.title }}</a></div>
                      <div align="left">

                        {% for noticia in noticias %}
                        <div class="noticia_home">
                            {% if noticia.capa %}
                              <div class="left">
                                    {% with x=MEDIA_ROOT|add:noticia.capa %}
                                    {% thumbnail x "65x65" crop="center" as im %}
                                        <img src="{{ im.url }}" width="65" height="65" />
                                    {% endthumbnail %}
                                    {% endwith %}
                              </div>
                            {% endif %}
                          <div class="left {% if noticia.capa %}texto_noticias_home{% endif %}">
                            <div class="titulo_noticia_home"><a href="{% url paroquia_noticia-view pk=noticia.pk paroquia=paroquia %}">{{ noticia.titulo }}</a> <span style=""><em>- {{ noticia.publicada_inicio|date:"d \d\e F"}}</em></span></div>
                            {% if noticia.resumo %}<div>
                                {{ noticia.resumo|linebreaks }}
                            </div>{% endif %}
                          </div>
                          <div class="clear"></div>
                        </div>
                        {% if not forloop.last %}
                            <div><img src="{{ STATIC_URL }}images/corpo_site/noticias/separador_noticia.png" width="517" height="1" /></div>
                        {% endif %}
                        {% endfor %}

                      </div>
                </div>
                <!--fim das noticias-->
              {% endif %}
                {% if fotogaleria %}
                {% with fotos=fotogaleria.0.conteudos_fotogaleriaimagem_fotogaleria_imagem.all %}
                <!-- galeria-->
                <div align="left">
                    <div class="titulos"><a href="{% url paroquia_fotogaleria-view sec=website.websiteprofile.fotogaleria_seccao.pk paroquia=paroquia pk=fotogaleria.0.pk %}">Fotogaleria</a></div>
                    <div class="imagem_fotogaleria_home" align="left">
                        <div class="images">
                            {% for foto in fotos %}
                            {% with x=MEDIA_ROOT|add:foto.imagem %}
                                {% thumbnail x "565x378" crop="center" as im %}
                                    <img src="{{ im.url }}" class="{% if forloop.first %}activa{% endif %}" width="565" height="378" >
                                {% endthumbnail %}
                            {% endwith %}
                            {% endfor %}
                        </div>
                        <div class="titulo_fotogaleria_home">{{ fotogaleria.0.titulo }}</div>
                        <div class="navegacao_fotogaleria_home">
                            {% for foto in fotos %}
                            <div class="{% if forloop.first %}activa{% else %}desactiva{% endif %}" onclick="javascript:slideOnH({{ forloop.counter0 }});"></div>
                            {% endfor %}
                            <div class="clear"></div>
                        </div>
                    </div>
                </div>
                {% endwith %}
                <!-- fim da galeria-->


                <style>
                .imagem_fotogaleria_home .images img.activa{
                    display: block !important;
                }
                .imagem_fotogaleria_home .images img{
                    display: none;
                }
                .navegacao_fotogaleria_home .navegacao_fotogaleria_home div{
                    cursor:pointer;
                }
                </style>

                <script>
                function slideButtonsH(index){
                    /*
                    $('.imagem_fotogaleria_home .navegacao_fotogaleria_home div').not('.clear').removeClass('activa').removeClass('desactiva').addClass('desactiva');
                    $('.imagem_fotogaleria_home .navegacao_fotogaleria_home div').not('.clear').eq(index).removeClass('desactiva').addClass('activa');
                    */
                    $('.imagem_fotogaleria_home .navegacao_fotogaleria_home div.activa').removeClass('activa').addClass('desactiva');
                    $('.imagem_fotogaleria_home .navegacao_fotogaleria_home div').not('.clear').eq(index).removeClass('desactiva').addClass('activa');
                }
                function slideSwitchH() {
                    var $active = $('.imagem_fotogaleria_home .images img.activa');
                    var $next =  $active.next().length ? $active.next():$('.imagem_fotogaleria_home .images img:first');

                    $next.addClass('activa').animate({}, 1000, function() {
                        $active.removeClass('activa');
                        slideButtonsH($(this).index());
                    });
                }
                function slideOnH(index){
                    $('.imagem_fotogaleria_home .images img').removeClass('activa');
                    $('.imagem_fotogaleria_home .images img').eq(index).addClass('activa');
                    slideButtonsH(index);
                }
                $(function() {
                    var playSlideshowH = setInterval( "slideSwitchH()", 5000 );
                });
                </script>
                {% endif %}


              {% if not bemvindo and not noticias and not fotogaleria %}
                  <br><br>
              {% endif %}
{% endblock principal %}