<!-- $Id: cousins_tools.txt, v7.00 03/04/2018 14:04:31 $ -->
%define;url(vvv,ttt)
  %prefix_base_password_2;
  %foreach;env_binding;
    %if;(env.key="vvv")ttt
    %elseif;(env.val!="")&%env.key;=%env.val;
    %end;
  %end;
  %if;(evar.vvv="")ttt%end;
%end;

%define;url2(vvv,ttt,www,uuu)
  %prefix_base_password_2;
  %foreach;env_binding;
    %if;(env.key="vvv")ttt%nn;
    %elseif;(env.key="www")uuu%nn;
    %elseif;(env.val!="" and env.key!="vvv" and env.key!="www")&%env.key;=%env.val;
    %end;
  %end;
  %( no need to test for ="" %)

%end;
<div class="row">
  <div class="form-inline ml-5 mt-1 mb-2">
    <div class="align-items-center">[*degree of kinship]</div>
    <div class="d-inline-flex flex-column ml-2">
      <div class="form-inline">
        <span>[ancestors]</span><i class="fas fa-level-up-alt ml-3 mb-2"></i>
      </div>
      <div class="form-inline">
        <span>[descendants]</span><i class="fas fa-level-down-alt ml-2 mt-3"></i>
      </div>
    </div>
    <div class="align-items-center ml-1">
      <a href="%apply;url2%with;v1%and;%if;(evar.v1!="" and evar.v1>1)&v1=%expr(evar.v1-1)%end;
                %and;v2%and;
                  %if;(evar.v2!="")
                    %if;(evar.v2>1)&v2=%expr(evar.v2-1)%end;
                  %else;
                    %if;(evar.v1!="" and evar.v1>1)&v2=%expr(evar.v1-1)%end;
                  %end;
                %end;"
         class="btn btn-sm btn-outline-secondary border-0
            %if;(evar.v1!="" and evar.v2!="" and (evar.v1<2 or evar.v2<2)) disabled%end;" title="[both] -1">-</a>
    </div>
    <div class="d-inline-flex flex-column">
      <div class="form-inline">
        <div class="input-group">
          <a href="%apply;url%with;v1%and;%if;(evar.v1!="" and evar.v1>=1)&v1=%expr(evar.v1-1)%end;%end;"
            class="btn btn-sm btn-outline-secondary border-0 input-group-prepend%if;(evar.v1!="" and evar.v1<1) disabled%end;">-</a>
          <div class="align-self-center">%if;(evar.v1!="")%evar.v1;%end;</div>
          <a href="%apply;url%with;v1%and;&v1=%expr(evar.v1+1)%end;"
            class="btn btn-sm btn-outline-secondary border-0 input-group-append%if;(evar.v1!="" and evar.v1=bvar.max_cousins_level) disabled%end;">+</a>
        </div>
      </div>
      <div class="form-inline">
        <div class="input-group">
          <a href="%apply;url%with;v2%and;
                      %if;(evar.v2!="")
                        %if;(evar.v2>=1)&v2=%expr(evar.v2-1)%end;
                      %else;
                        %if;(evar.v1!="" and evar.v1>=1)&v2=%expr(evar.v1-1)%end;
                      %end;
                    %end;"
            class="btn btn-sm btn-outline-secondary border-0 input-group-prepend%if;(evar.v2!="" and evar.v2<1) disabled%end;">-</a>
          <span class="align-self-center">%if;(evar.v2!="")%evar.v2;%else;%evar.v1;%end;</span>
          <a href="%apply;url%with;v2%and;
                      %if;(evar.v2!="")&v2=%expr(evar.v2+1)
                      %else;&v2=%expr(evar.v1+1)%end;
                    %end;"
            class="btn btn-sm btn-outline-secondary border-0 input-group-append%if;(evar.v2!="" and evar.v2=bvar.max_cousins_level) disabled%end;">+</a>
        </div>
      </div>
    </div>
    <div class="align-items-center">
      <a href="%apply;url2%with;v1%and;&v1=%expr(evar.v1+1)
                %and;v2%and;
                  %if;(evar.v2!="")&v2=%expr(evar.v2+1)
                  %else;&v2=%expr(evar.v1+1)
                  %end;
                %end;"
         class="btn btn-sm btn-outline-secondary border-0
            %if;((evar.v1!="" and evar.v1=bvar.max_cousins_level) or (evar.v2!="" and evar.v2=bvar.max_cousins_level)) disabled%end;"
            title="[both] +1">+</a>
    </div>
    <div class="mx-2">
      <a href="%apply;url%with;image%and;%if;(evar.image!="off")&image=off%end;%end;"
        class="btn btn-outline-secondary btn-sm border-0 px-0"
        title="%if;(evar.image!="off")[*visualize/show/hide/summary]2%else;%nn;
          [*visualize/show/hide/summary]1%end; [image/images]1">
        <i class="fa fa-image fa-fw"></i>
        <i class="fa fa-toggle-%if;(evar.image!="off")on%else;off%end; text-muted"></i>
      </a>
    </div>
    <div class="mx-2">
      <a href="%apply;url%with;spouse%and;%if;(evar.spouse!="on")&spouse=on%end;%end;"
        class="btn btn-outline-secondary btn-sm border-0 px-0"
        title="%if;(evar.spouse!="on")[*visualize/show/hide/summary]1%else;%nn;
           [*visualize/show/hide/summary]2%end; [spouse/spouses]1">
        <span class="mx-1">
          <span class="fa fa-user-plus"></span><span class="fa fa-user"></span>
        </span>
        <i class="fa fa-toggle-%if;(evar.spouse!="on")off%else;on%end; text-muted"></i>
      </a>
    </div>
  </div>
</div>