<!DOCTYPE html>
<html lang="%lang;">
<head>
  <!-- $Id: cousmenu.txt v7.1 25/09/2023 14:33:38 $ -->
  <!-- Copyright (c) 1998-2007 INRIA -->
  <title>%nn;
    [*relationship link between]%sp;
    %if;(public_name != "")%public_name;%else;%first_name;%end;
    %if;(qualifier != "") %qualifier;%end;
    %sp;%surname;
  </title>
  <meta name="robots" content="none">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  %include;favicon
  %include;css
</head>
%(TODO :
* highlight/filter by nbr
* RLM par chemin vers les mêmes ancêtres / need to fix RLM spouses isolated)
* discuter quoi afficher comme « comptage des chemins »
* highlight sur les cases avec des individus vivants + counts
%)
<body%body_prop;>
%include;hed
%message_to_wizard;
%let;e_v;%if;(e.v!="")%e.v;%else;4%end;%in;
<div class="container%if;(e_v>6)-fluid%end;">
  <div class="d-flex flex-column justify-content-center">
%include;perso_utils
%include;menubar
%let;min;%if;(not has_children)1%else;0%end;%in;
%let;max;%if;(bvar.max_anc_level!="" and bvar.max_anc_level<max_anc_level)%bvar.max_anc_level;%elseif;(static_max_anc_level!="")%static_max_anc_level;%end;%in;
%define;picklvl(vvv)
  <a role="button" class="btn btn-sm btn-light %if;(e_v=vvv) disabled font-weight-bold text-white bg-dark%else; %end; p-1%if;(vvv<10) px-2%end;" href="%url_set.v.vvv;"%sp;
  title="[*ascending/descending (degree)]0 vvv%if;(vvv=0)[:] [person/persons]0 [and] [descendants]%end;">vvv</a>%nn;
%end;
    <div class="d-flex flex-column align-self-center order-1">
      <div class="btn-group py-0" role="group" aria-label="buttons to select max ascending level v">
        <div class="py-0 btn-group d-flex flex-wrap" role="group" aria-label="button v from 0 to max">
          %for;i;min;max;%apply;picklvl(i)%end;
        </div>
      </div>
    </div>
%define;cousin_lex_tt(vvv,www)
  %( condition pour garder la tooltip (title="") vide si elle n'est pas définie pour la langue en cours %)
  %if;([cousins.vvv.www tt]!="[cousins.vvv.www tt]")[cousins.vvv.www tt]1%else;%end;
%end;
%define;cousin_lex(vvv,www)
  [cousins.vvv.www]1
%end;
%( p_of_index gives variable x of person of index i in the database, first individual has index 0 %)
%define;pindex(iii,xxx)
  %p_of_index.iii.xxx;
%end;
%define;cous_paths_cnt(vvv,www)
  %cous_paths_cnt.vvv.www;
%end;
%define;cousins_cnt(vvv,www)
  %cousins_cnt.vvv.www;
%end;
%define;cous_paths_min_date(vvv,www)
  %cous_paths_min_date.vvv.www;
%end;
%define;cous_paths_max_date(vvv,www)
  %cous_paths_max_date.vvv.www;
%end;
%empty_sorted_list;%empty_sorted_listb;%empty_sorted_listc;%reset_count3;
%define;cous_mod(vvv,www)
  %empty_sorted_list;%empty_sorted_listb;
  %( min/max = extremum dates for all individuals at v1/v2 | span = period of the generation %)
  %let;min_date_vvv_www;%cous_paths_min_date.vvv.www;%in;
  %let;max_date_vvv_www;%cous_paths_max_date.vvv.www;%in;
  %foreach;cous_path(vvv,www)
    %let;cous_isdead;%apply;pindex(path_end.index,"is_dead")%in;
    %let;cous_nodesc;%apply;pindex(path_end.index,"has_children")%in;
    %let;cous_sex;%apply;pindex(path_end.index,"sex")%in;
    %let;birth_prec;%if;(path_end.birth_date.prec="&#60;")1%end;%in;
    %let;death_prec;%if;(path_end.death_date.prec="&#62;")1%end;%in;
    %( percent of birth/death into a linear bicolor gradient %)
    %let;birth_age;%if;((path_end.birth_date.prec="" or path_end.birth_date.prec="<") and path_end.birth_date.year!="" and max_date_vvv_www>min_date_vvv_www)%expr(100-(100*(max_date_vvv_www-path_end.birth_date.year)/(max_date_vvv_www-min_date_vvv_www)))%end;%in;
    %let;death_age_;%if;((path_end.death_date.prec="" or path_end.death_date.prec=">") and path_end.death_date.year!="" and max_date_vvv_www>min_date_vvv_www)%expr(100-(100*(max_date_vvv_www-path_end.death_date.year)/(max_date_vvv_www-min_date_vvv_www)))%end;%in;
    %( fix gradient for individual who are dead < 1 year old by forcing a 1% white space %)
    %let;death_age;%if;(death_age_!="" and birth_age!= "" and death_age_=birth_age and birth_age>0)%expr(birth_age+1)%else;%death_age_;%end;%in;
    %let;white;%if;(cous_isdead=1)rgba(245,245,235,1)%else;rgba(255,255,255,1)%end;%in;%let;brown;rgba(245,231,216,1)%in;%let;yellow;rgba(255,235,210,1)%in;
    %if;(path_end.surname="?" and path_end.first_name="?")%incr_count3;
    %else;
      %( store all cous_paths individual list item with their 5 buttons in a sorted_list %)
      %let;name_;%path_end.surname_key;%path_end.first_name_key;%in;
      %let;date_;%path_end.birth_date.year;%path_end.birth_date.month;%path_end.birth_date.day;%path_end.birth_date.prec;%in;
      %apply;add_in_sorted_list%with;%path_end.dates; %path_end.surname; %path_end.first_name; %path_end.occ;%and;%nn;
      <li class="card text-small nbr_%path_end.nbr; rounded-lg border-top-0 border-bottom-0 mr-2 border-%if;(path_end.sex=0)primary%elseif;(path_end.sex=1)danger%else;dark%end;"
        style="border-left-width:5px;%nn;
          %if;(cous_isdead=1)border-right-width:5px;border-right-color:black;%if;not (death_age="" and birth_age="")%if;((death_age="" and birth_age!="" and birth_age>0) or (birth_age="" and death_age!="" and death_age>0))background:linear-gradient(90deg,%sp;
            %if;(birth_age="" and death_age!="" and death_age>0)%yellow; 0%%%else;%brown; %if;(birth_prec=1)0%else;%birth_age;%end;%%, %white; %birth_age;%%%end;,%nn;
            %if;(death_age="" and birth_age!="" and birth_age>0)%yellow; 100%%%else;%white; %death_age;%%, %brown; %if;(death_prec=1)100%else;%death_age;%end;%%%end;);%nn;
          %else;background:linear-gradient(90deg, %brown; %birth_age;%%, %white; %birth_age;%%);%end;%end;%end;%if;(cous_nodesc!=1) border-style:double;%end;"
          data-surname="%name_;%date_;" data-birth_year="%date_;%name_;"
        %( TODO: toggle between 3 functions in jQuery script to sort by age!
         data-age="%if;((path_end.death_date.year-path_end.birth_date.year<10 and cous_isdead=1) or (today.year-path_end.birth_date.year<10 and cous_isdead=0))0%end;%if;(cous_isdead=1)%expr(path_end.death_date.year-path_end.birth_date.year)%else;%expr(today.year-path_end.birth_date.year)%end;%path_end.surname_key;%path_end.first_name_key;%path_end.birth_date.year;"%)>%nn;
        <div class="d-flex justify-content-between align-items-start ml-n2">
          <div class="d-block pl-n2 pr-2 align-self-center order-1 position-relative">
            <a role="button" href="%prefix;%path_end.access;&m=C&v=%e_v;" title="[navigation] [with]…"
              class="stretched-link py-3"> </a>
          </div>
          <div class="d-flex flex-column align-self-center order-3 m-0 mr-1">
            <a href="%prefix;em=R&et=A&ei=%self.index;&i=%path_end.index;"><i class="fa-solid fa-link fa-sm"></i></a>
          %if;(www!=0)
              <a href="%prefix;m=RL&i=%if;(vvv=0)%self.index;
                %else;%path_end.anc1.index;%end;&l1=vvv&i1=%self.index;&l2=www&i2=%path_end.index;%nn;
                %if;(path_end.nbr>1)&dag=on%end;"%sp;
                title="%apply;a_of_b%with;%if;(path_end.sex=0)[cousin.0.www]0%else;[cousin.0.www]1%end;%and;%path_end.anc1.first_name; %path_end.anc1.surname;%( %path_end.anc1.dates;%)
                %if;(path_end.anc2!=".....") [and] %path_end.anc2;%end;%end;">
                %if;(path_end.nbr %2 = 0)<i class="fa-solid fa-user-group fa-fw fa-sm"></i>%else;<i class="fa-solid fa-user fa-fw fa-sm text-%if;(path_end.anc2!=".....")info%else;%if;(path_end.anc1.sex=0)primary%elseif;(path_end.anc1.sex=1)danger%else;muted%end;%end;"></i>%end;%nn;
                %(TODO NBR <span class="small%if;(path_end.nbr>2)mr-1%end;"><sup>%if;(path_end.nbr>2)%path_end.nbr;%else; %end;</sup></span>%)
              </a>
          %end;
          </div>
          <div class="d-block flex-grow-1 justify-content-start align-self-center order-2 text-truncate text-nowrap px-0">
            <a href="%prefix;%path_end.access;"%if;(path_end.occ!="0") title="occ %path_end.occ;"%end;%sp;
              style="line-height:2rem;"
              %(data-anclist="%path_end.anc_f_list;"%)>%( %cous_isdead; | %birth_age;-%death_age_; | %path_end.birth_date.year; %path_end.death_date.year; || %path_end.nbr; | %path_end.lev_cnt; | %path_end.anc_level; DEBUG %)%path_end.surname; %path_end.first_name;%nn;
            </a>
            %if;wizard;<a href="%prefix;&m=MOD_IND&i=%path_end.index;">%end;
              %if;(path_end.dates!="")%path_end.dates;
              %else;%if;(cous_isdead=1)†%else;°%end;
              %end;
            %if;wizard;</a>%end;
          </div>
        </div>
       </li>%and;%path_end.cnt;%and;%path_end.index;%end;
      %apply;add_in_sorted_listb%with;%path_end.index;%and;%cous_isdead;%and;%cous_nodesc;%end;
      %apply;add_in_sorted_listc%with;%path_end.index;%and;%cous_isdead;%and;%cous_nodesc;%end;
    %end;
  %end;
  %reset_count;%reset_count2;
  %foreach;sorted_listb_item;
    %if;(item.2=0)%incr_count;%end;
    %if;(item.3=0)%incr_count2;%end;
  %end;
  <div class="modal fade px-4" id="modal_vvv_www" tabindex="-1" aria-hidden="true" style="overflow-y:scroll;">%(tofix : quick hack to allow scrolling on next modal and not body after dismissing a first modal%)
    <div class="modal-dialog modal-xl%( modal-dialog-centered%)" style="width:100%%;max-width:1500px;
      %(%if;(listb_size>127)1600%elseif;(listb_size>31)1200%elseif;(listb_size>9)992%else;600%end;px;%)">
      <div class="modal-content bg-transparent border-0">
        <div class="%(modal-header %)position-relative p-2 pb-1 rounded-lg%if;(count!=0) bg-white"%else;" style="background-color:linen"%end;>
          %let;extrapaths;%expr(cous_paths_cnt.vvv.www-listb_size)%in;
          <div class="modal-title bg-transparent">
            <div class="d-flex justify-content-around align-items-center">
              <div class="d-inline-flex flex-column justify-content-around align-self-center text-left ml-4%if;(www=0) mr-5%end;">
                <div>%listb_size %if;(cousins_cnt.vvv.www=1)[person/persons]0%else;[person/persons]1%end;
                %if;(count!=0 and count!=cousins_cnt.vvv.www)
                  <div>
                    %if;(2*count<=cousins_cnt.vvv.www)%count; [alive]3
                    %else;%expr(cousins_cnt.vvv.www-count) [died]3 <span style="background-color: rgba(245,231,216,.7);">  </span>
                    %end;
                  </div>
                %end;
                </div>
                %if;(count2>0)
                  <div>%count2; [no descendants] ║</div>
                %end;
                %if;(count3>0)
                  <div>%count3; [unknown spouse] ? ?</div>
                %end;
              </div>
              <div class="d-flex flex-column mx-auto text-center align-items-center">
                <a role="button" class="h2 display-4 stretched-link ml-2"
                  style="font-size:2rem;font-weight:300;" data-toggle="tooltip" data-html="true" 
                  href="%prefix;m=RLM%foreach;sorted_list_item;&i1=%self.index;&i%expr(item.3+1)=%item.4;%end;%if;(vvv+www!=0)&t1=%apply;uri_encode%with;%apply;clean_html_tags([cousins.vvv.www])%end;%end;" title="Graphe RLM c(vvv,www)">%nn;
                  %if;(vvv+www=0)
                    %if;(sex=1)[him/her]0%else;[him*her]1%end;
                  %else;
                   %if;(cousins_cnt.vvv.www=1)[cousins.vvv.www]0%else;[cousins.vvv.www]1%end;%nn;
                   %end;
                </a>%nn;
                <small class="text-muted">%if;(extrapaths!=0) (+ %extrapaths;)%end;</small>
                %let;span;%min_date_vvv_www;-%max_date_vvv_www;%in;
                <span class="h4">%if;not (10000 in span);%if;(min_date_vvv_www=max_date_vvv_www)%min_date_vvv_www;%else;%span;%end;%end;</span>
              </div>
              %(<div class="flex-grow-1 bg-transparent"> </div>%)
              %let;cousdown;%apply;cousins_cnt%with;vvv%and;%expr(www+1)%end;%in;
              <div class="d-flex justify-content-end align-items-end ml-2" style="z-index:1">
                <div class="d-inline-flex align-self-center">
                  <div class="d-flex align-items-end">
                    %if;(vvv>0 and www=0)
                      <button type="button" class="btn btn-sm py-0 mb-1 btn-light" data-dismiss="modal" data-toggle="modal" data-target="#modal_%expr(vvv-1)_www"><i class="fa-solid fa-arrow-down-long fa-fw fa-rotate-by" style="--fa-rotate-angle: 45deg;" title="%expr(vvv-1)/0 ancestors at g-1" data-toggle="tooltip"></i></button>
                    %end;
                  </div>
                  <div class="d-inline-flex flex-column ml-2">
                    <div>
                      <button type="button" class="btn btn-sm py-0 mt-2 btn-light%if;(vvv=e_v and www=0) disabled%end;" data-dismiss="modal" data-toggle="modal" data-target="#modal_%if;(www=0)%expr(vvv+1)_0%else;vvv_%expr(www-1)%end;"><span title="%if;(www=0)%expr(vvv+1)/0%else;vvv/%expr(www-1)%end;" data-toggle="tooltip" data-html="true"><i class="fa-solid fa-arrow-up-%if;(www=0)right-dots%else;long%end; fa-fw"></i>vvv</span></button>
                    </div>
                    <div>
                      <button type="button" class="btn btn-sm py-0 mt-1 btn-light%if;(cousdown=0) disabled%end;" data-dismiss="modal" data-toggle="modal" data-target="#modal_vvv_%expr(www+1)"><span title="vvv/%expr(www+1)" data-toggle="tooltip" data-html="true"><i class="fa-solid fa-arrow-down-long fa-fw"></i>www</span></button>
                    </div>
                  </div>
                  <a role="button" href="%prefix;%access;&m=C&v1=vvv&v2=www" 
                    class="btn btn-lg btn-light mx-3 my-2">
                      <span data-toggle="tooltip" data-html="true" title="%expr(vvv+www) %if;(vvv+www<2)[degree of kinship]0%else;[degree of kinship]1%end; [show all] [relationship link/relationship links]1)">
                        <i class="fa-solid fa-person-arrow-up-from-line"></i>
                        <i class="fa-solid fa-person-arrow-down-to-line fa-fw fa-flip-horizontal"></i>
                      </span>
                  </a>
                  <button type="button" class="btn btn-light sortbtn flex-shrink-1"><i class="fa-solid fa-user fa-fw mr-1 sorticon"></i>[sort by/branch/alphabetic order]0<br><span class="sorttype">[surname/surnames]0</span></button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="modal-body">
          <div class="card-columns"%( style="column-count:
            %if;(cous_paths_cnt.vvv.www>511)5%nn;
            %elseif;(cous_paths_cnt.vvv.www>127)4%nn;
            %elseif;(cous_paths_cnt.vvv.www>31)3
            %elseif;(cous_paths_cnt.vvv.www>9)2%else;1%end;"%)>
            <ul class="list-group bg-transparent listitems">
              %foreach;sorted_list_item;%item.2;%end;
            </ul>
          </div>
        </div>
      %(<div class="modal-footer">
          %( TODO extraire les nbr des filtres js par nbr %)
            %for;i;0;nbr;<a role="button" class="btn btn-light" title="filter by nbr = i">i</a>%end;
        </div>%)
      </div>
    </div>
  </div>
%end;
%define;link_cousin(vvv,www)
  %let;extra_paths_vvv_www;%expr(cous_paths_cnt.vvv.www-cousins_cnt.vvv.www)%in;
  %let;width;%expr((100/(e_v+1))*vvv)%in;
  %let;percent_vvv_www;%expr(100-count*100/cousins_cnt.vvv.www)%in;
  <button type="button" data-toggle="tooltip" data-html="true"
    class="p-1 mx-1 btn-light position-relative%if;(vvv+www=0) disabled%end; %if;(percent_vvv_www=0)border-0%end;"
    style="height:5rem;%if;(percent_vvv_www=100)background-color: rgba(245,231,216,0.9);%end;"
    title="<span class='h5 pt-2 px-2'>%apply;cousin_lex(i,k)</span><hr class='bg-light text-white my-2 mx-4'>
    <div class='d-flex justify-content-center mt-1'>
      <div class='mr-4 h5'>
        <i class='fa-solid fa-arrow-up-right-dots fa-fw'></i>
        <span class='font-weight-heavy'>vvv</span>
        <i class='fa-solid fa-arrow-down-long'></i>
        <span class='font-weight-heavy ml-1'>www</span>
      </div>
      <div class='ml-4 h5'>
        <i class='fa-solid fa-dna fa-fw'></i>
        %if;(vvv=0 or www=0)%expr((100/.(2^(vvv+www))))%else;%expr((100/.(2^(vvv+www-1))))%end; %%
      </div>
    </div><hr class='bg-light text-white mt-0 mb-1'>%apply;cousin_lex_tt(i,k)">
    <div class="d-flex justify-content-around stretched-link h-100"%sp;
      data-toggle="modal" data-target="#modal_vvv_www"%if;(percent_vvv_www!=0 and percent_vvv_www!=100)%sp;
      style="background: linear-gradient(270deg, rgba(245,231,216,0.9) %if;(percent_vvv_www>1)%expr(percent_vvv_www-1)%else;1%end;%%, rgba(248,249,250,0) %if;(percent_vvv_www<99)%expr(percent_vvv_www+1)%else;100%end;%%)"%end;>
      <div class="order-2 w-75 align-self-center text-bottom ml-1">
        %if;(i=0 and k=0)%if;is_male;[him/her]0%elseif;is_female;[him/her]1%end;%else;%apply;cousin_lex(i,k)%end;
      </div>
      <div class="d-flex justify-content-end align-self-center text-right">
        <div class="h5 mt-2 py-0 pr-0
          text-%if;(vvv=0)info%elseif;(vvv%2=1)primary%else;danger%end;">%cousins_cnt.vvv.www;
          </div>
          %(%if;(extra_paths_vvv_www!=0)*
            %(<div class="badge badge-xl badge-info">%extra_paths_vvv_www;</div>%)
          %end;%)
      </div>
    </div>
  </button>
%end;
%( table of cousins.j-vvv+i.i c(k,i) | table size = v × (v+%cousins.max_d;)
    == l1 asc./l2 = max_desc (plus longue colonne v2) %)
%define;table(xxx)
  %let;maxanc;%cousins.max_a;%in;
  %let;maxdesc;%expr(cousins.max_d+xxx)%in;
  <table id="quickrel" class="table table-responsive-sm mb-0 mt-1 order-3 col-%if;(e.v=1)8%elseif;(e.v=0)4%end;">
    %for;j;1;maxdesc;
      <tr style="height:2rem">%nn;
        %for;i;0;xxx;
          %let;k;%expr(j+i-xxx)%in;
          %if;(k>=0 and i<maxanc)
              %let;tot;%apply;cous_paths_cnt%with;%i;%and;%k;%end;%in;
              %let;tot_next;%apply;cous_paths_cnt%with;%i;%and;%expr(k+1)%end;%in;
              %if;(i>1 and k=0)
               <td class="h4 font-weight-light user-select-none text-left align-middle border-top-0 pb-3">%nn;
                 %expr(xxx-j)%nn;
               </td>
               %if;(i>2)<td colspan="%expr(i-2)" class="border-0"></td>%end;
              %end;
              <td%if;(j=xxx) style="width:%expr(100/xxx)%%"%end;%if;(i>0 and k=0) colspan="2"%end;%sp;
                class="border-0 border-top-0 border-bottom-0 border-right-0">
                %if;(tot!=0)
                  <div class="d-flex flex-column justify-content-center border-0 py-0">
                    %apply;cous_mod(i,k)
                    %apply;link_cousin(i,k)
                    <div class="d-inline-flex py-0">
                      %if;(i!=0 and k=0)
                      %( for ancestors c(i,0) border links | self has 2×col-6 and his ancestors 4×col-3
            prints — only first cell border if c(i-1,0) have no siblings [cousins_cnt.i.1=0] |
                   — two first even cells borders overwise | |
                   — nothing if self has no children %)
                        %let;mx;%if;(i=0)1%else;3%end;%in;
                        %for;z;0;mx;
                          %(%let;couscntk1;%apply;cousins_cnt%with;%i%and;1%end;%in;%)
                         <div style="height:15px" class="col-%if;(i=0)6%else;3%end;
                           %if;(((tot_next=0 and z=0) or (tot_next!=0 and z%2=0))
                             and not (i=0 and not has_children)) border-dark border-right%end;"> </div>
                        %end;
                      %else;
                        <div class="col-6 border-dark%if;(tot_next!=0) border-right
                          border-top-0 border-left-0 border-bottom-0%else; border-0%end;" style="height:15px"></div>
                        <div class="col-6 border-0"></div>
                      %end;
                    </div>
                  </div>
                %end;
              </td>
          %end;
        %end;
        %(<td class="h3 align-top border-0">%if;(j>1)%expr(j-1)%else; %end;</td>%)
      </tr>
    %end;
  </table>
  <div class="d-flex flex-column justify-items-center order-4 mt-2">
    <span><i class="fa-solid fa-dna fa-sm mr-1"></i>[coefficient of relationship]</span>
    <span><i class="fa-solid fa-user fa-sm mr-1"></i>[one ancestor counted]</span>
    <span><i class="fa-solid fa-triangle-exclamation fa-sm text-danger mr-1"></i>[multiple relations]</span>
  </div>
%end;

%apply;table(e_v+1)

%( page title + counts shown at top of page using flex order %)
    <div class="d-flex justify-content-between order-2 mt-1">%nn;
      <h3 class="">[*link between]
        %let;max;%if;(cousins.max_a < e_v)%cousins.max_a;%else;%e_v;%end;%in;
        %if;(public_name != "")%public_name;%else;%first_name;%end;
        %if;(qualifier != "") <em>%qualifier;</em>%end; %surname;%sp;
        %(%if;(alias != "") <em>(%alias;)</em>%end;%)
        %if;(e.v=0)[and] [a descendant]0%else;[and] [close family] [up to] %max; [generation/generations]1%end;%( montantes [and] %expr(e_v+cousins.max_d) descendantes…%)
      </h3>
      <div class="d-flex flex-column justify-content-end text-right">
        %( quick count ascendants | TODO : filter by index to reduce asc./desc. implexes %)
        %reset_count;
        %if;has_parents;
          %for;i;0;e_v;
            %let;tt;%apply;cousins_cnt%with;%expr(i+1)%and;0%end;%in;
            %for;j;0;tt;%incr_count;%end;
          %end;
        %end;
        <span class="text-muted" title="Ancestor/Descendant&#10;Persons/Living">%count;A%nn;
        %reset_count;
        %if;has_children;
          %for;i;1;cousins.max_d;
            %let;tt;%apply;cousins_cnt%with;0%and;%i%end;%in;
            %for;j;0;tt;%incr_count;%end;
          %end;
        %end;
        /%count;D
        %reset_count;%foreach;sorted_listc_item;%if;(item.2=0)%incr_count;%end;%end;%nn;
        %listc_size;P/%count;L</span>
      </div>
    </div>
  </div>
%base_trailer;
%include;copyr
</div>
%include;js
<script>
$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})
$(function () {
  $('[data-toggle="popover"]').popover()
})
function sort1() {
  $(".listitems").each(function(){
    $(this).html($(this).children('li').sort(function(a, b){
    return ($(b).data('surname')) < ($(a).data('surname')) ? 1 : -1;
    }));
    $('.sorticon').removeClass('fa-user').addClass('fa-cake-candles');
    $('.sorttype').text('[birth]');
  });
}
function sort2() {
  $(".listitems").each(function(){
    $(this).html($(this).children('li').sort(function(a, b){
    return ($(b).data('birth_year')) < ($(a).data('birth_year')) ? 1 : -1;
    }));
    $('.sorticon').removeClass('fa-cake-candles').addClass('fa-user');
    $('.sorttype').text('[surname/surnames]0');
  });
}
$(document).on('click', '.sortbtn', function() {
  var el = this;
  return (el.tog^=1) ? sort1() : sort2();
});
</script>
</body>
</html>
