{% extends "layout.jinja2" %}

{% block content %}

  <div id="myCarousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
      <li data-target="#myCarousel" data-slide-to="3"></li>
      <li data-target="#myCarousel" data-slide-to="4"></li>
      <li data-target="#myCarousel" data-slide-to="5"></li>
      <li data-target="#myCarousel" data-slide-to="6"></li>
      <li data-target="#myCarousel" data-slide-to="7"></li>
      <li data-target="#myCarousel" data-slide-to="8"></li>
      <li data-target="#myCarousel" data-slide-to="9"></li>
    </ol>
  
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox">
      <div class="item active">
        <img src="{{ car_images[0] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[1] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[2] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[3] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[4] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[5] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[6] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[7] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[8] }}" />
      </div>
      <div class="item">
        <img src="{{ car_images[9] }}" />
      </div>
    </div>
  
    <!-- Left and right controls -->
    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>


  <!-- Container (Méditation SUNYATA Section) -->
  <div id="about" class="text-center">
    <h5>LA MEDITATION SUNYATA</h5>
    <p>Le centre de Méditation SUNYATA Paris est une branche du <a href="http://www.sunyatameditation.org/">SUNYATA Méditation Center</a> dont le siège est à Perris, CA, Etats-Unis.
      Notre but est de promouvoir la pratique de la méditation et du QiGong SUNYATA à Paris.
    </p>
    <br>
    <div class="row">
      <div class="col-sm-4">
        <p>
          <a href="{{ request.route_url('blog', id=10, slug='la-meditation-sunyata-%253A-un-apercu') }}">
            <img src="{{ request.static_url('cao_blogr:static/ni-su.jpg') }}" class="img-circle person" alt="Médiation Sunyata" width="255" height="255">
            <br /><b>La Méditation SUNYATA</b>
          </a>
        </p>
        <p>développée par le maître zen Thích Thông Triệt, combine les enseignements essentiels du <b>processus de réalisation et d'éveil du Bouddha</b>, les <b>pratiques des 3 traditions du bouddhisme</b> (Theravāda, Mahayana et Zen) et les <b>découvertes de la neuro-sciences</b>.</p>
      </div>
      <div class="col-sm-4">
        <p>
          <a href="{{ request.route_url('blog', id=2, slug='biographie-du-maitre-thich-thong-triet-%25281929-2019%2529') }}">
            <img src="{{ request.static_url('cao_blogr:static/img/thong-triet.jpg') }}" class="img-circle person" alt="Maître Thông Triêt" width="255" height="255">
            <br /><b>Le Maître Fondateur</b>
          </a>
        </p>
        <p><b>Le Vénérable Maître Thích Thông Triệt</b> a été ordonné par le Vénérable Maître Zen Thích Thanh Từ en 1974 et a eu sa réalisation spirituelle majeure en 1989 au Vietnam. 
          Il s'est ensuite établi aux Etats Unis et a commencé à enseigner en 1995 dans l'Oregon. </p>
      </div>
      <div class="col-sm-4">
        <p>
          <a href="{{ request.route_url('blog', id=22, slug='atteindre-le-samadhi-avec-les-mots-%253E') }}">
          <img src="{{ request.static_url('cao_blogr:static/khong-noi.jpg') }}" class="img-circle person" alt="Khong Noi" width="255" height="255">
          <br /><b>La technique « PARLE PAS »</b>
        </a>
        <p>Depuis 2016, la technique <b>PARLE PAS</b> (ou KHÔNG NÓI) est devenu la pierre angulaire de la pratique de la méditation SUNYATA. Cette technique conduit le méditant vers la maîtrise de ses pensées à travers un processus graduel d'extinction des murmures mentaux.</p>
      </div>
    </div>
  </div>

  <!-- Container (ACTIVITES Section) -->
  {{ activities | safe }}
  {% if request.authenticated_userid %}
    <div class="text-center"><a href="/topic/_admin">Modifier les activités</a></div>
  {% endif %}

  <!-- Container (POSTS Section) -->
  <div id="posts">
    <br>
    <h5 class="text-center">PAGES RECENTES - CÁC BÀI MỚI</h5>

    <table id="users_list" class="table table-condensed">
      {% for entry in last_ten %}
        <tr>
          <td>{{ entry.created.strftime("%d.%m.%Y") }}</td>
          <td>
            <a href="{{ request.route_url('blog', id=entry.id, slug=entry.slug) }}">{{ entry.title }}</a>
          </td>
          <td>{{ entry.author }}</td>
          {% if entry.status == 'brouillon' %}
            <td><span class="label label-danger">{{ entry.status }}</span></td>
          {% else %}
            <td> </td>
          {% endif %}
          </td>
        </tr>
      {% endfor %}
    </table>
  </div>


  <!-- Container (Contact Section) -->
  <div id="contact">
    <br >
    <h5 class="text-center">CONTACT - LIÊN HỆ</h5>

    <p align="center"><em>Laissez nous un message! Mong nhận được góp ý của bạn!</em></p>
    <form action="{{ request.route_url('home') }}" method="POST" class="form">
      <div class="col-sm-6 form-group">
        <input class="form-control" id="name" name="name" placeholder="Nom et prénom - Tên họ" required 
              type="text" value="{{name}}">
      </div>
      <div class="col-sm-6 form-group">
        <input class="form-control" id="email" name="email" placeholder="Email" required 
              type="email" value="{{email}} ">
      </div>
      <div class="col-sm-12 form-group">
                <textarea class="form-control" id="comments" name="comments" placeholder="Message - Tin nhắn" required rows="5"></textarea>
      <br>
      <div class="g-recaptcha" data-sitekey="{{ site_key }}" data-callback='recaptchaCallback'></div>
      <input type="hidden"  id="response" name="response" value="" />
      <br>
      <button class="btn btn-primary hidden" id="btnSubmit" type="submit" name="form.submitted">Envoyer</button>
      </div>
    </form>
    </div>
  </div>

  <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  <script>
    function recaptchaCallback() {
      var btnSubmit = document.getElementById("btnSubmit");
      var response = grecaptcha.getResponse();

      document.getElementById("response").value = response;
      if ( btnSubmit.classList.contains("hidden") ) {
          btnSubmit.classList.remove("hidden");
          btnSubmit.classList.add("show");
      }
    }

  </script>
    
{% endblock %}