{% extends 'App::layout_profile.html.twig' %}

{% block title %}Cours particuliers {% if profileItem.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}{{ profileItem.category.name }}{% if profileItem.profile and profileItem.profile.city  %} à {{ profileItem.profile.city }} {% if profileItem.profile and profileItem.profile.department  %}({{ profileItem.profile.department }}){% endif %} {% endif %}{% if profileItem.profile and profileItem.profile.firstname and profileItem.profile.lastname  %}avec {{ profileItem.profile.firstname }} {{ profileItem.profile.lastname|first }}{% endif %}{% endblock %}
{% block og_title %}Cours particuliers {% if profileItem.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}{{ profileItem.category.name }}{% if profileItem.profile and profileItem.profile.city  %} à {{ profileItem.profile.city }} {% if profileItem.profile and profileItem.profile.department  %}({{ profileItem.profile.department }}){% endif %} {% endif %}{% if profileItem.profile and profileItem.profile.firstname and profileItem.profile.lastname  %}avec {{ profileItem.profile.firstname }} {{ profileItem.profile.lastname|first }}{% endif %}{% endblock %}
{% block description %}{% if item.content %}{{ item.content|length > 350 ? item.content|slice(0, 350) ~ '...' : item.content   }}{% elseif item.profile.content %}{{ item.profile.content|length > 350 ? item.profile.content|slice(0, 350) ~ '...' : item.profile.content   }}{% endif %}{% endblock %}
{% block og_description %}{% if item.content %}{{ item.content|length > 350 ? item.content|slice(0, 350) ~ '...' : item.content   }}{% elseif item.profile.content %}{{ item.profile.content|length > 350 ? item.profile.content|slice(0, 350) ~ '...' : item.profile.content   }}{% endif %}{% endblock %}

{% block og_url %}https://www.rueduprof.com/{{ profileItem.profile.id }}/professeur-{{ item.profile.department }}-{{ profileItem.profile.firstname| myslugify }}-{{ profileItem.profile.lastname|first| myslugify }}/{% endblock %}

{% block canonical_url %}https://www.rueduprof.com/{{ profileItem.profile.id }}/professeur-{{ item.profile.department }}-{{ profileItem.profile.firstname | myslugify }}-{{ profileItem.profile.lastname|first| myslugify }}/{% endblock %}

{% block snippet_json %}
    {% include 'App::schema/profile_category_show.html.twig' with {
        location: location,
        profileItem: profileItem,
        item: item
    } only %}
{% endblock %}

{% block stylesheet %}

<style>
.circle-avatar{
/* make it responsive */
max-width: 100%;
width:100%;
height:220px;
display:block;
/* div height to be the same as width*/
padding-top:100%;

/* make it a cirkle */
border-radius:50%;

/* Centering on image`s center*/
background-position-y: center;
background-position-x: center;
background-repeat: no-repeat;

/* it makes the clue thing, takes smaller dimention to fill div */
background-size: cover;

/* it is optional, for making this div centered in parent*/
margin: 0 auto;
top: 0;
left: 0;
right: 0;
bottom: 0;
}



.vertical-center {
  min-height: 200px;  /* Fallback for vh unit */


  /* Make it a flex container */
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; 
  
  /* Align the bootstrap's container vertically */
    -webkit-box-align : center;
  -webkit-align-items : center;
       -moz-box-align : center;
       -ms-flex-align : center;
          align-items : center;
  
  /* In legacy web browsers such as Firefox 9
     we need to specify the width of the flex container */
  
  /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers
     hence the bootstrap's container won't be aligned to the center anymore.
  
     Therefore, we should use the following declarations to get it centered again */
         -webkit-box-pack : center;
            -moz-box-pack : center;
            -ms-flex-pack : center;
  -webkit-justify-content : center;
          justify-content : center;
}
.box-shadow{
    -moz-box-shadow: 0px 0px 0px 5px #e8e6e6; /* Firefox */

    -webkit-box-shadow: 0px 0px 0px 5px #e8e6e6; /* Safari, Chrome */

    box-shadow: 0px 0px 0px 5px #e8e6e6; /* CSS3 */
}
</style>
{% endblock %}

{% block body %}

  

  <div class="img-cover img-cover-purple" data-parallax="scroll" data-image-src="/img/background_blue_v0011.jpg">
    <div class="container m-t-0">
      <div class="row text-center">
        <div class="col-md-12 p-t-20 p-b-10">              
          {% if item.profile and item.profile.avatar and item.profile.avatar.path %}
            <img class="img-circle-premium pull-center avatar-fix-premium" src="https://www.rueduprof.com/uploads/avatar/{{ item.profile.avatar.path }}" data-src="https://www.rueduprof.com/uploads/avatar/{{ item.profile.avatar.path }}" style="width:120px;" alt="{{ item.profile.firstname }} {{ item.profile.lastname }}">
          {% endif %}
          <h1 style="color: white; font-size: 22px;font-weight:700;">
            Cours particuliers avec {% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}{{ item.profile.firstname }} {{ item.profile.lastname|first }}{% else %}{{ item.profile.lastname }} {{ item.profile.firstname|first }}{% endif %}
            {% if item.profile.city %}({{ item.profile.city }} {% if item.profile.department %}- {{ item.profile.department }}{% endif %}){% endif %}
          </h1>
        </div>
      </div>
    </div>
  </div>         
         


  <div class="p-t-b-10 b-b-b-l">
    <div class="container">
      <div class="row">
        <div class="col-sm-6 m-t-b-10">
          <ol class="breadcrumb no-p-r-l no-m no-bg no-p">
            <li><a href="/">Cours particuliers</a></li>
            <li class="active"><a href="{{ path('app_profile_user_show', { 'id': item.profile.id, 'slug':  'professeur-'~item.profile.department ~'-'~ item.profile.firstname| myslugify ~'-'~ item.profile.lastname|first| myslugify }) }}">{% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                {{ item.profile.firstname }} {{ item.profile.lastname|first }}
                              {% else %} 
                                {{ item.profile.lastname }} {{ item.profile.firstname|first }}
                              {% endif %}.</a></li>
            {% if item %}
            <li>{{ item.category.name }}</li>
            {% endif %}
          </ol>



        </div>
        <div class="col-sm-6 text-right m-t-b-10">


        </div>
      </div>
    </div>
  </div>
  <div class="content-padding p-t-20">
    <div class="container">
      <div class="row">

                  <div class="text-center">
              {% if app.user %}

         


                <a class="btn btn-md btn-success" href="{{ path('search_booking', { 'id': item.id, 'from': app.request.query.get('from') }) }}"><i class="fa fa-envelope" aria-hidden="true">
                  </i> Faire une demande de <br /> {% if item.category.type and item.category.type == 'formations' %}formation{% elseif item.category.slug == "coach-sportif" %}Séance{% else %}cours particuliers{% endif %} {% if item.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}<strong>{{ item.category.name }}</strong>
                </a>

                <hr />
              {% else %}


                <a class="btn btn-md btn-success" href="{{ path('search_booking', { 'id': item.id, 'from': app.request.query.get('from') }) }}"><i class="fa fa-envelope" aria-hidden="true">
                  </i> Faire une demande de<br /> {% if item.category.type and item.category.type == 'formations' %}formation{% elseif item.category.slug == "coach-sportif" %}Séance{% else %}cours particuliers{% endif %} {% if item.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}<strong>{{ item.category.name }}</strong>
                </a>

                 <hr />



              {% endif %}
 </div>

        <div class="col-lg-12">
          <div class="ibox float-e-margins">

            <div class="ibox-content">


            	<div class="row">


              <div class="col-md-10">




            <!-- START: Ticket item -->
            <div class="panel panel-default">
                <div class="panel-body p-30">
                    <div class="row r-sm-table bg-white">
                        <div class="col-md-2 col-sm-cell">
                            <div class="m-b-10">
                                <span class="label label-primary b-rad-100 label-line inline-block"><time class="timeago" datetime="{{ item.profile.user.lastLogin|date }}"></time></span>
                            </div>
                  
                            <div>
                                <a>

                                     <table>
                                  <tr>

                                   {% if item.profile.avatar and item.profile.avatar.path %}
                                      <td><img  class="img-circle pull-left avatar-fix" alt="{{ item.profile.firstname }} {{ item.profile.lastname }}"src="/uploads/avatar/{{ item.profile.avatar.path }}"/></td>
                                      {% else %}
                                      <td><img  class="img-circle pull-left avatar-fix" alt="avatar" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcTrxwZhuShcQieycZ7U7thuj9cmUESbEffhVLc_EsxRJCLPDr7NUA"/></td>
                                    {% endif %}

                                   


                                        <td><div class="font-normal">{% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                <b style="margin-top:5px;">{{ item.profile.firstname }} {{ item.profile.lastname|first }}.</b>
                              {% else %} 
                                <b style="margin-top:5px;">{{ item.profile.lastname }} {{ item.profile.firstname|first }}.</b>
                              {% endif %}</div></td>


                                   

                                  </tr>
                                </table>
                                </a>
                            </div>
                            <br />

                            {% if item.webcam %}<br /><div style="font-size:12px;font-weight:700;color:#2980b9;"><i class="fa fa-video-camera"></i> Webcam</div>{% endif %}
                            {% if item.inPlace %}<div style="font-size:11px;font-weight:700;color:#8e44ad;"><i class="fa fa-angle-double-left"></i>  Je peux recevoir mes élèves</div>{% endif %}
                            {% if item.outPlace %}<div style="font-size:11px;font-weight:700;color:#e67e22;"><i class="fa fa-angle-double-right"></i>  Je peux me déplacer</div>{% endif %}

                        </div>
                        <div class="col-md-7 col-sm-cell">
                            <h1 class="h2_title" style="line-height:20px;"><a href="{{ path('app_profileCategory_show', { 'profile': item.profile.id, 'slug':  'professeur-'~item.profile.department ~'-'~ item.profile.firstname| myslugify ~'-'~ item.profile.lastname|first| myslugify, 'skill': item.category.slug, 'id': item.id, 'from': app.request.query.get('from') }) }}" class="font-normal no-m m-b-10" style="font-size:16px;font-weight:500;">
                              {% if item.category.type and item.category.type == 'formations' %}Formation{% elseif item.category.slug == "coach-sportif" %}Séance Haut de gamme {% else %}Cours particuliers{% endif %} {% if item.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}<strong>{{ item.category.name }}</strong>
                              {% if item.profile and item.profile.city  %} à <strong>{{ item.profile.city }} {% if item.profile and item.profile.department  %} ({{ item.profile.department }}) {% endif %} </strong>{% endif %}
                              {% if item.profile and item.profile.firstname and item.profile.lastname  %}avec <b>{% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                {{ item.profile.firstname }} {{ item.profile.lastname|first }}
                              {% else %} 
                                {{ item.profile.lastname }} {{ item.profile.firstname|first }}
                              {% endif %}.</b>{% endif %} 
                             

                                </a></h1>




                            <div class="m-b-10">
                                {% if item.primaire %}<span class="label label-success">Primaire</span>{% endif %}
                                {% if item.college %}<span class="label label-info">Collége</span>{% endif %}
                                {% if item.lycee %}<span class="label label-primary">Lycée</span>{% endif %}
                                {% if item.superieur %}<span class="label label-danger">Supérieur</span>{% endif %}
                            </div>

                            
                                





                        </div>
                     
                        <div class="col-sm-3 col-sm-cell text-center">

                            {% if item.pricePerHour %}
                            <div style="font-weight:800; font-size:24px;">
                            {{ item.pricePerHour }}<sup>€ / h</sup>
                            </div>
                            {% endif %}

                            {% if item.firstHour %}
                              <div style="font-size:12px;font-weight:700;color:#27ae60;">
                                <i class="fa fa-money"></i>  1ère heure gratuite
                              </div>
                            {% endif %}
                            <div><a style="margin-top:10px;" class="btn btn-sm btn-primary btn-call-to-action" href="{{ path('search_booking', { 'id': item.id }) }}" ><i class="fa fa-comments-o"></i> Contacter ce professeur gratuitement</a></div>
                        </div>
                       

                    </div>
                </div>
            </div>
            <!-- End: Ticket item -->


              {% autoescape %}
                {{ profileItem.content | raw  | nl2br }}
              {% endautoescape %}
              <hr />

              {% if profileItem.profile.content  %}
				        <h5 style="font-weight:500;">Ma description :</h5>
              {% autoescape %}
                {{ profileItem.profile.content | raw  | nl2br }}
              {% endautoescape %}
              <hr />
              {% endif %}


              {% if profileItem.profile.categories|length > 1 %}
                <h5 style="font-weight:500;">Autres matières de {% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                {{ item.profile.firstname }} {{ item.profile.lastname|first }}
                              {% else %} 
                                {{ item.profile.lastname }} {{ item.profile.firstname|first }}
                              {% endif %}. :</h5>
              {% endif %}            

                              {% for item in profileItem.profile.categories  %}

                              {% if item.lang == 'fr' %}

                              	 {% if item.id !=  profileItem.id %}
                                
            <!-- START: Ticket item -->
            <div class="panel panel-default">
                <div class="panel-body p-30">
                    <div class="row r-sm-table bg-white">
                        <div class="col-md-2 col-sm-cell">
                            <div class="m-b-10">
                                <span class="label label-primary b-rad-100 label-line inline-block"><time class="timeago" datetime="{{ item.profile.user.modified|date }}"></time></span>
                            </div>
   
                            <div>
                               <a>

                                     <table>
                                  <tr>

                                   {% if item.profile.avatar and item.profile.avatar.path %}
                                      <td><img  class="img-circle pull-left avatar-fix" alt="{{ item.profile.firstname }} {{ item.profile.lastname }}"src="/uploads/avatar/{{ item.profile.avatar.path }}"/></td>
                                      {% else %}
                                      <td><img  class="img-circle pull-left avatar-fix" alt="avatar" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcTrxwZhuShcQieycZ7U7thuj9cmUESbEffhVLc_EsxRJCLPDr7NUA"/></td>
                                    {% endif %}

                                   


                                        <td><div class="font-normal">{% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                <b style="margin-top:5px;">{{ item.profile.firstname }} {{ item.profile.lastname|first }}.</b>
                              {% else %} 
                                <b style="margin-top:5px;">{{ item.profile.lastname }} {{ item.profile.firstname|first }}.</b>
                              {% endif %}</div></td>


                                   

                                  </tr>
                                </table>
                                </a>
                            </div>
                            <br />

                            {% if item.webcam %}<br /><div style="font-size:12px;font-weight:700;color:#2980b9;"><i class="fa fa-video-camera"></i> Webcam</div>{% endif %}
                            {% if item.inPlace %}<div style="font-size:11px;font-weight:700;color:#8e44ad;"><i class="fa fa-angle-double-left"></i>  Je peux recevoir mes élèves</div>{% endif %}
                            {% if item.outPlace %}<div style="font-size:11px;font-weight:700;color:#e67e22;"><i class="fa fa-angle-double-right"></i>  Je peux me déplacer</div>{% endif %}

                        </div>
                        <div class="col-md-7 col-sm-cell">
                            <a href="{{ path('app_profileCategory_show', { 'profile': item.profile.id, 'slug':  'professeur-'~item.profile.department ~'-'~ item.profile.firstname| myslugify ~'-'~ item.profile.lastname|first| myslugify, 'skill': item.category.slug, 'id': item.id, 'from': app.request.query.get('from') }) }}" class="font-normal no-m m-b-10" style="font-size:16px;font-weight:500;">
                              {% if item.category.type and item.category.type == 'formations' %}Formation{% elseif item.category.slug == "coach-sportif" %}Séance Haut de gamme {% else %}Cours particuliers{% endif %} {% if item.category.name|first|lower in ['a','e','i','o','u'] %}d'{% else %}de {% endif %}<strong>{{ item.category.name }}</strong>
                              {% if item.profile and item.profile.city  %} à <strong>{{ item.profile.city }} {% if item.profile and item.profile.department  %}({{ item.profile.department }}){% endif %} </strong>{% endif %}
                              {% if item.profile and item.profile.firstname and item.profile.lastname  %}avec <b>{% if item.profile and item.profile.firstname and item.profile.lastname  and item.profile.user.device != 'ANDROID' %}
                                {{ item.profile.firstname }} {{ item.profile.lastname|first }}
                              {% else %} 
                                {{ item.profile.lastname }} {{ item.profile.firstname|first }}
                              {% endif %}.</b>{% endif %} 
                             

                                </a>
                            <p>
                              {% if item.content %}
                                {{ item.content|length > 350 ? item.content|slice(0, 350) ~ '...' : item.content   }}
                              {% elseif item.profile.content %}
                                {{ item.profile.content|length > 350 ? item.profile.content|slice(0, 350) ~ '...' : item.profile.content   }}
                              {% endif %}
                            </p>



                            <div class="m-b-10">
                                {% if item.primaire %}<span class="label label-success">Primaire</span>{% endif %}
                                {% if item.college %}<span class="label label-info">Collége</span>{% endif %}
                                {% if item.lycee %}<span class="label label-primary">Lycée</span>{% endif %}
                                {% if item.superieur %}<span class="label label-danger">Supérieur</span>{% endif %}
                            </div>
                                
                       

                            <ul class="list-unstyled tag-list inline-block no-m">

                              {% for itemCategory in item.profile.categories  %}
                                
                                  {% if itemCategory.lang == 'fr' %}
                                {% if location %}

                                  {% if itemCategory.category.type and itemCategory.category.type == 'formations' %}
                                    <li><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': itemCategory.category.slug, 'location': location.slug }) }}">#{{ itemCategory.category.name }} </a></li>
                                  {% else %}
                                    <li><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_category_show', {'slug': itemCategory.category.slug, 'location': location.slug }) }}">#{{ itemCategory.category.name }} </a></li>                      
                                  {% endif %}

                                {% else %}

                                  {% if itemCategory.category.type and itemCategory.category.type == 'formations' %}
                                    <li><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': itemCategory.category.slug, 'location': 'paris'}) }}">#{{ itemCategory.category.name }} </a></li>
                                  {% else %}
                                    <li><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_category_show', {'slug': itemCategory.category.slug, 'location': 'paris' }) }}">#{{ itemCategory.category.name }} </a></li>                     
                                  {% endif %}

                                {% endif %}
                                {% endif %}
 
                              {% endfor %}
                                
                            </ul>
                        </div>
                        <div class="col-sm-3 col-sm-cell text-center">

                            {% if item.pricePerHour %}
                            <div style="font-weight:800; font-size:24px;">
                            {{ item.pricePerHour }}<sup>€ / h</sup>
                            </div>
                            {% endif %}

                            {% if item.firstHour %}
                              <div style="font-size:12px;font-weight:700;color:#27ae60;">
                                <i class="fa fa-money"></i>  1ère heure gratuite
                              </div>
                            {% endif %}
                            <div><a style="margin-top:10px;" class="btn btn-sm btn-primary btn-call-to-action" href="{{ path('search_booking', { 'id': item.id }) }}" ><i class="fa fa-comments-o"></i> Contacter ce professeur gratuitement</a></div>
                        </div>

                    </div>
                </div>
            </div>
            <!-- End: Ticket item -->
{% endif %}
{% endif %}
                              {% endfor %}
                                
                     







              </div>

            <div class="col-md-2">
     <div class="panel panel-default">
                  <div class="p-30-i text-center">
                      <h2  style="font-weight:800;font-size:16px;">
                        Cours particuliers à domicile 
                        ({% if location  and location.city != NULL %}{{ location.zipcode }}{% else %}75{% endif %})
                      </h2>
                      {% for itemCategory in item.profile.categories  %}

                       {% if itemCategory.lang == 'fr' %}

                        {% if location %}

                          {% if itemCategory.category.type and itemCategory.category.type == 'formations' %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': itemCategory.category.slug, 'location': location.slug }) }}">{{ itemCategory.category.name }}</a></div>
                          {% else %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_category_show', {'slug': itemCategory.category.slug, 'location': location.slug }) }}">{{ itemCategory.category.name }}</a></div>                       
                          {% endif %}

                        {% else %}

                          {% if itemCategory.category.type and itemCategory.category.type == 'formations' %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': itemCategory.category.slug, 'location': 'paris'}) }}">{{ itemCategory.category.name }}</a></div>
                          {% else %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_category_show', {'slug': itemCategory.category.slug, 'location': 'paris' }) }}">{{ itemCategory.category.name }}</a></div>                       
                          {% endif %}

                        {% endif %}

                        {% endif %}

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


               <div class="panel panel-default">
                  <div class="p-30-i text-center">
                      <h2 style="font-weight:800;font-size:16px;">Cours particuliers en ligne</h2>
                      {% for itemCategory in item.profile.categories  %}
                         {% if itemCategory.lang == 'fr' %}
                          {% if itemCategory.category.type and itemCategory.category.type == 'formations' %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_formations_show', {'slug': itemCategory.category.slug, 'location': 'en-ligne' }) }}">{{ itemCategory.category.name }}</a></div>
                          {% else %}
                            <div class="text-muted m-b-10" ><a href="{{ app.request.getSchemeAndHttpHost() ~ path('app_category_show', {'slug': itemCategory.category.slug, 'location': 'en-ligne' }) }}">{{ itemCategory.category.name }}</a></div>                       
                          {% endif %}
                        {% endif %}
                      {% endfor %}
                </div>
              </div>
            </div> 




              </div> 

            </div>

          </div>
        </div>





      </div>

    </div>

  </div>

{% endblock body %}

{% block javascripts %}
  <script src="/js/parallax.js-1.4.2/parallax.min.js"></script>
  <script>
jQuery(document).ready(function() {
  jQuery(".timeago").timeago();
});

  </script>
{% endblock %}