Koha/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt
Owen Leonard 9cb89b4639 Bug 20168: Update of the OPAC bootstrap template to bootstrap v4
This patch updates the version of Bootstrap in the OPAC from 2.3.1 to
4.5.0. The Bootstrap JavaScript files have been replaced with custom
builds of the 4.5.0 JavaScript source files. The Bootstrap CSS is now
built into the OPAC CSS by loading the required Bootstrap 4.5.0 SCSS
files in node_modules.

OPAC SCSS now starts with Bootstrap customizations:

/* Bootstrap variable customizations */
$headings-color: #727272;
...

Followed by loading the necessary Bootstrap SCSS files:

/* Bootstrap imports */
@import "../../../../../node_modules/bootstrap/scss/functions";
@import "../../../../../node_modules/bootstrap/scss/variables";
...

Followed by our CSS. The build process for generating compiled CSS now
creates a file which bundles Bootstrap CSS and ours. Removed from the
Koha source: Bootstrap CSS files, Bootstrap "glyphicons" images.

The upgrade to Bootstrap 4 involved a lot of markup changes to conform
with new Bootstrap classes, especially in classes related to the grid.
Besides duplicating the grid we used before, this upgrade adds some new
features made possible by Bootstrap 4.5's use of flexbox as a layout
tool. This includes custom ordering of columns based on class names:
https://getbootstrap.com/docs/4.5/layout/grid/#order-classes.

Other areas where the most changes have been made: Navigation menus,
breadcrumb menus, buttons, dropdowns.

Bootstrap's JavaScript file is now "bootstrap.bundle.min.js" to reflect
the fact that a required JavaScript asset is now distributed separately
in Bootstrap 4. The "bundle" version includes Popper.js.

Unrelated changes: Indentation corrections, removal of invalid
"//<![CDATA[" markers, removal of invalid script type attributes.

To test, apply the patch and run 'yarn install' to install Bootstrap as
an npm module. Run 'yarn build --view opac' to regenerate the OPAC CSS.

Test as many aspect of the OPAC as possible, viewing pages at various
browser widths to confirm that everything adjusts well. Test with
various OPAC interface system preferences enabled and disabled.

Test self checkout and self checkin.

Known issues: RTL support has not been updated.

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
2020-09-09 14:13:03 +02:00

516 lines
33 KiB
Text

[% USE raw %]
[% USE Asset %]
[% USE Koha %]
[% USE Branches %]
[% INCLUDE 'doc-head-open.inc' %]
<title>[% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog &rsaquo; Advanced search</title>
[% INCLUDE 'doc-head-close.inc' %]
[% BLOCK cssinclude %][% END %]
</head>
[% INCLUDE 'bodytag.inc' bodyid='advsearch' bodyclass='scrollto' %]
[% INCLUDE 'masthead.inc' %]
<form action="/cgi-bin/koha/opac-search.pl" method="get">
<input type="hidden" name="advsearch" value="1"/>
<div class="main">
<nav aria-label="breadcrumb">
<ul class="breadcrumb">
<li class="breadcrumb-item">
<a href="/cgi-bin/koha/opac-main.pl">Home</a>
</li>
<li class="breadcrumb-item active" aria-current="page">
<a href="#">Advanced search</a>
</li>
</ul>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col order-first order-md-first order-lg-2">
<!-- BOOLEAN SEARCH OPTIONS -->
<div id="booleansearch" class="maincontent">
<fieldset>
<legend>Search for:</legend>
[% IF ( expanded_options ) %]
<div class="advanced-search-terms extended">
[% ELSE %]
<div class="advanced-search-terms">
[% END # /IF ( expanded_options ) %]
[% FOREACH search_box IN search_boxes_loop %]
<div class="search-term-row">
<div class="search-term-input">
[% IF ( expanded_options ) %]
[% IF ( search_box.boolean ) %]
<select name="op" class="form-control">
<option value="and" selected="selected">and</option>
<option value="or">or</option>
<option value="not">not</option>
</select>
[% END %]
[% ELSE %]
<label for="search-field_[% loop.index | html %]">
[% IF loop.index == 0 %]
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
[% ELSE %]
and
[% END %]
</label>
[% END # /IF ( expanded_options ) %]
</div> <!-- .search-term-input -->
<div class="search-term-input">
<select class="form-control" name="idx" id="search-field_[% loop.index | html %]">
<option value="kw">Keyword</option>
[% IF ( expanded_options ) %]
<option value="kw,phr">&nbsp;&nbsp;&nbsp;&nbsp; Keyword phrase</option>
[% END %]
<option value="su,wrdl">Subject</option>
[% IF ( expanded_options ) %]
<option value="su,phr">&nbsp;&nbsp;&nbsp;&nbsp; Subject phrase</option>
<option value="su-br">&nbsp;&nbsp;&nbsp;&nbsp; Subject and broader terms</option>
<option value="su-na">&nbsp;&nbsp;&nbsp;&nbsp; Subject and narrower terms</option>
<option value="su-rl">&nbsp;&nbsp;&nbsp;&nbsp; Subject and related terms</option>
[% END %]
<option value="ti">Title</option>
[% IF ( expanded_options ) %]
<option value="ti,phr">&nbsp;&nbsp;&nbsp;&nbsp; Title phrase</option>
<option value="se,wrdl">Series title</option>
[% IF ( Koha.Preference('OPACNumbersPreferPhrase') ) %]
<option value="callnum,phr">Call number</option>
[% ELSE %]
<option value="callnum">Call number</option>
[% END %]
[% END %]
<option value="au,wrdl">Author</option>
[% IF ( expanded_options ) %]
<option value="au,phr">&nbsp;&nbsp;&nbsp;&nbsp; Author phrase</option>
<option value="cpn,wrdl">&nbsp;&nbsp;&nbsp;&nbsp; Corporate name</option>
<option value="cfn,wrdl">&nbsp;&nbsp;&nbsp;&nbsp; Conference name</option>
<option value="cfn,phr">&nbsp;&nbsp;&nbsp;&nbsp; Conference name phrase</option>
<option value="pn,wrdl">&nbsp;&nbsp;&nbsp;&nbsp; Personal name</option>
<option value="pn,phr">&nbsp;&nbsp;&nbsp;&nbsp; Personal name phrase</option>
[% END %]
[% IF ( expanded_options ) %]
<option value="nt">Notes/Comments</option>
[% IF (marcflavour != 'UNIMARC') %]
<option value="curriculum">Curriculum</option>
[% END %]
[% END %]
<option value="pb,wrdl">Publisher</option>
<option value="pl,wrdl">Publisher location</option>
[% IF ( expanded_options ) %]
[% IF ( Koha.Preference('OPACNumbersPreferPhrase') ) %]
<option value="ident,phr">Standard number</option>
[% ELSE %]
<option value="ident">Standard number</option>
[% END %]
<option value="nb">&nbsp;&nbsp;&nbsp;&nbsp; ISBN</option>
<option value="ns">&nbsp;&nbsp;&nbsp;&nbsp; ISSN</option>
[% ELSE %]
<option value="nb">ISBN</option>
[% END %]
<option value="bc">Barcode</option>
</select> <!-- /#search-field_[% loop.index | html %] -->
</div> <!-- .search-term-input -->
<div class="search-term-input">
<input class="form-control" type="text" size="30" name="q" title="Enter search terms" value="" />
</div> <!-- .search-term-input -->
[% IF ( expanded_options ) %]
<div class="search-term-input">
[% IF ( !loop.first ) %]
<a class="ButtonPlus" title="Add another field" href="#">
<i class="fa fa-plus-square" aria-hidden="true"></i>
</a>
<a class="ButtonLess" title="Remove field" href="#">
<i class="fa fa-minus-square" aria-hidden="true"></i>
</a>
[% END %]
</div> <!-- .search-term-input -->
[% END %]
</div> <!-- /.search-term-row -->
[% END # FOREACH search_box %]
</div> <!-- /.search-terms -->
</fieldset>
</div> <!-- /#booleansearch -->
</div> <!-- / .col -->
</div> <!-- / .row -->
<div class="text-center">
<!-- SEARCH BUTTONS -->
<fieldset class="action">
[% PROCESS searchbuttons %]
</fieldset>
<!-- /SEARCH BUTTONS -->
</div>
<div class="row">
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('itemtype').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('itemtype').size > 0 and expanded_options ) ) %]
<div class="col order-first order-md-first order-lg-2">
<div id="advsearches" class="toptabs">
<ul>
[% FOREACH advsearchloo IN advancedsearchesloop %]
<li id="advsearch-tab-[% advsearchloo.advanced_search_type | html %]">
<a href="#advsearch-[% advsearchloo.advanced_search_type | uri %]">
[% IF ( advsearchloo.advanced_search_type == 'itemtypes' ) %]Item type
[% ELSIF ( advsearchloo.advanced_search_type == 'ccode' ) %]Collection
[% ELSIF ( advsearchloo.advanced_search_type == 'loc' ) %]Shelving location
[% ELSE %]Something else
[% END %]
</a></li>
[% END %]
</ul>
[% FOREACH advsearchloo IN advancedsearchesloop %]
<div id="advsearch-[% advsearchloo.advanced_search_type | html %]" class="advsearch">
<fieldset>
<legend>Limit to any of the following:</legend>
<div class="row">
[% FOREACH itemtypeloo IN advsearchloo.code_loop %]
[% IF (advsearchloo.advanced_search_type != 'itemtypes') OR (((!itemtypeloo.searchcategory) AND (itemtypeloo.cat == 0)) OR (itemtypeloo.cat == 1)) %]
<div class="col-sm-6 col-lg-3">
<input type="checkbox"
id="[% itemtypeloo.ccl FILTER remove(',') | html %]-[% itemtypeloo.number | html %]"
name="[% IF ( itemtypeloo.cat == 1 ) %]searchcat[% ELSE %]limit[% END %]"
value="[% IF ( itemtypeloo.cat == 1 ) %][% itemtypeloo.code | html %][% ELSE %]mc-[% itemtypeloo.ccl | html %]:[% itemtypeloo.code | html %][% END %]"
/>
<label for="[% itemtypeloo.ccl FILTER remove(',') | html %]-[% itemtypeloo.number | html %]">
[% UNLESS ( Koha.Preference('OpacNoItemTypeImages')) %]
[% IF ( itemtypeloo.imageurl ) %]
<img src="[% itemtypeloo.imageurl | html %]" alt="[% itemtypeloo.description | html %]" />
[% END %]
&nbsp;
[% END %]
[% itemtypeloo.description | html %]
</label>
</div>
[% IF ( loop.last ) %]</div>[% ELSE %][% UNLESS ( loop.count % 4 ) %]</div><div class="row">[% END %][% END %]
[% END %]
[% END %]
</fieldset>
</div> <!-- / #advsearch-[% advsearchloo.advanced_search_type | html %] -->
[% END # / FOREACH advancedsearchesloop %]
</div> <!-- / #advsearches -->
</div> <!-- / .col -->
[% END # /IF OpacAdvSearchOptions %]
</div>
<div id="advsearch_limits" class="row">
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('location').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('location').size > 0 and expanded_options ) ) %]
[% IF ( singleBranchMode ) %]
<div class="col-sm-6 col-lg-3">
<!-- AVAILABILITY LIMITS -->
<div id="location" class="advsearch_limit">
<fieldset>
<legend>Availability: </legend>
<div style="margin-top:.4em">
<label for="available-items"><input type="checkbox" id="available-items" name="limit" value="available" /> Only items currently available for loan or reference</label>
</div>
</fieldset>
</div> <!-- / #location -->
<!-- /AVAILABILITY LIMITS -->
</div> <!-- / .col -->
[% ELSE %]
<div class="col-sm-6 col-lg-3">
<!-- AVAILABILITY LIMITS -->
<div id="location" class="advsearch_limit">
<fieldset>
<label for="branchloop">Location and availability:</label>
<select name="limit" id="branchloop">
<option value="">All libraries</option>
[% FOREACH BranchesLoo IN Branches.all( selected => opac_name ) %]
[% IF BranchesLoo.selected %]
<option value="branch:[% BranchesLoo.branchcode | html %]" selected="selected">[% BranchesLoo.branchname | html %]</option>
[% ELSE %]
<option value="branch:[% BranchesLoo.branchcode | html %]">[% BranchesLoo.branchname | html %]</option>
[% END %]
[% END %]
</select>
[% IF search_groups %]
<p>OR</p>
<label for="categoryloop">Groups of libraries</label>
<select name="multibranchlimit" id="categoryloop">
<option value=""> -- none -- </option>
[% FOREACH sg IN search_groups %]
<option value="[% sg.id | html %]">[% sg.title | html %]</option>
[% END %]
</select>
[% END %]
<div style="margin-top:.4em">
<label for="available-items"><input type="checkbox" id="available-items" name="limit" value="available" /> Only items currently available for loan or reference</label>
</div>
</fieldset>
</div> <!-- / #location -->
<!-- /AVAILABILITY LIMITS -->
</div> <!-- / .col -->
[% END # / IF singleBranchMode %]
[% END %]
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('sorting').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('sorting').size > 0 and expanded_options ) ) %]
<div class="col-sm-6 col-lg-3">
<!-- RANK LIMITS -->
<div id="sortby" class="advsearch_limit">
<fieldset>
<label for="sort_by">Sort by:</label>
<select id="sort_by" name="sort_by">
[% INCLUDE 'resort_form.inc' %]
</select>
</fieldset>
</div>
<!-- RANK LIMITS -->
</div> <!-- / .col -->
[% END %]
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('pubdate').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('pubdate').size > 0 and expanded_options ) ) %]
<div class="col-sm-6 col-lg-3">
<div id="pubrange" class="advsearch_limit">
<!-- PUB RANGE OPTION -->
<fieldset>
<label for="limit-yr">Publication date range</label>
<input type="text" size="30" id="limit-yr" name="limit-yr" title="Enter search terms" value="" />
<div class="hint">For example: 1999-2001. You could also use "-1987" for everything published in and before 1987 or "2008-" for everything published in 2008 and after.</div>
</fieldset>
<!-- /PUB RANGE OPTION -->
</div>
</div>
[% END %]
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('language').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('language').size > 0 and expanded_options ) ) %]
<div class="col-sm-6 col-lg-3">
<div id="langfilter" class="advsearch_limit">
<fieldset>
<!-- LANGUAGE LIMIT -->
<label for="language-limit">Language</label>
<select id="language-limit" name="limit">
<option value="">No limit</option>
[% FOREACH search_languages_loo IN search_languages_loop %]
[% IF ( search_languages_loo.selected ) %]
<option value="ln,rtrn:[% search_languages_loo.iso639_2_code | html %]" selected="selected">[% search_languages_loo.language_description | html %]</option>
[% ELSE %]
<option value="ln,rtrn:[% search_languages_loo.iso639_2_code | html %]">[% search_languages_loo.language_description | html %]</option>
[% END %]
[% END %]
</select>
<!-- /LANGUAGE LIMIT -->
</fieldset>
</div> <!-- / #langfilter -->
</div> <!-- / .col -->
[% END %]
</div> <!-- / .row -->
[%# Following on one line for translatability %]
[% IF ( ( OpacAdvSearchOptions and OpacAdvSearchOptions.grep('subtype').size > 0 and not expanded_options ) or ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.grep('subtype').size > 0 and expanded_options ) ) %]
[% IF ( usmarc ) %]
<div id="subtypes" class="row">
<!-- SUBTYPE LIMITS -->
<div class="col-sm-6 col-lg-3">
<div class="advsearch_limit">
<fieldset>
<label for="subtype_audience">Audience</label>
<select id="subtype_audience" name="limit" class="subtype">
<option value="" selected="selected" class="menuheader">Any audience</option>
<option value="aud:a">Preschool</option>
<option value="aud:b">Primary</option>
<option value="aud:c">Pre-adolescent</option>
<option value="aud:d">Adolescent</option>
<option value="aud:e">Adult</option>
<option value="aud:f">Specialized</option>
<option value="aud:g">General</option>
<option value="aud:j">Juvenile</option>
</select>
</fieldset>
</div> <!-- /.advsearch_limit -->
</div> <!-- / .col-sm-6 col-lg-3 -->
<div class="col-sm-6 col-lg-3">
<div class="advsearch_limit">
<fieldset>
<label for="subtype_content">Content</label>
<select id="subtype_content" name="limit" class="subtype">
<option value="" selected="selected" class="menuheader">Any content</option>
<option value="fic:1">Fiction</option>
<option value="fic:0">Non-fiction</option>
<option value="bio:b">Biography</option>
<option value="mus:j">Musical recording</option>
<option value="mus:i">Non-musical recording</option>
</select>
</fieldset>
</div> <!-- /.advsearch_limit -->
</div>
<div class="col-sm-6 col-lg-3">
<div class="advsearch_limit">
<fieldset>
<label for="subtype_format">Format</label>
<select id="subtype_format" name="limit" class="subtype">
<option value="" selected="selected" class="menuheader">Any format</option>
<option value="l-format:ta">Regular print</option>
<option value="l-format:tb">Large print</option>
<option value="l-format:tc or l-format:fb">Braille</option>
<option value="">-----------</option>
<option value="l-format:sd">CD audio</option>
<option value="l-format:ss">Cassette recording</option>
<option value="l-format:vf">VHS tape / Videocassette</option>
<option value="l-format:vd">DVD video / Videodisc</option>
<option value="l-format:co">CD software</option>
<option value="l-format:cr">Website</option>
</select>
</fieldset>
</div> <!-- /.advsearch_limit -->
</div> <!-- / .col-sm-6 col-lg-3 -->
<div class="col-sm-6 col-lg-3">
<div class="advsearch_limit">
<fieldset>
<label for="subtype_additional">Additional content types for books/printed materials</label>
<select id="subtype_additional" name="limit" class="subtype">
<option value="">Any</option>
<option value="ctype:a">Abstracts/summaries</option>
<option value="ctype:b">Bibliographies</option>
<option value="ctype:c">Catalogs</option>
<option value="ctype:d">Dictionaries</option>
<option value="ctype:e">Encyclopedias </option>
<option value="ctype:f">Handbooks</option>
<option value="ctype:g">Legal articles</option>
<option value="ctype:i">Indexes</option>
<option value="ctype:j">Patent document</option>
<option value="ctype:k">Discographies</option>
<option value="ctype:l">Legislation</option>
<option value="ctype:m">Theses</option>
<option value="ctype:n">Surveys</option>
<option value="ctype:o">Reviews</option>
<option value="ctype:p">Programmed texts</option>
<option value="ctype:q">Filmographies</option>
<option value="ctype:r">Directories</option>
<option value="ctype:s">Statistics</option>
<option value="ctype:t">Technical reports</option>
<option value="ctype:v">Legal cases and case notes</option>
<option value="ctype:w">Law reports and digests</option>
<option value="ctype:z">Treaties </option>
</select>
</fieldset>
</div> <!-- /.advsearch_limit -->
</div> <!-- / .col-sm-6 col-lg-3 -->
</div> <!-- / #subtypes.row -->
<!-- SUBTYPE LIMITS -->
[% END # / IF usmarc %]
[% IF ( UNIMARC ) %]
<div id="subtypes_unimarc" class="row">
<!-- SUBTYPE LIMITS -->
[% INCLUDE 'subtypes_unimarc.inc' %]
</div>
[% END %]
[% END # / IF expanded_options %]
[% IF ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.size > 0 and expanded_options ) or
( OpacAdvSearchOptions and OpacAdvSearchOptions.size > 0 and not expanded_options ) %]
<div class="text-center">
<fieldset class="action">
<!-- SEARCH BUTTONS -->
[% PROCESS searchbuttons %]
<!-- /SEARCH BUTTONS -->
</fieldset>
</div>
[% END %]
</div> <!-- / .container-fluid -->
</div> <!-- / .main -->
</form>
[% INCLUDE 'opac-bottom.inc' %]
[% BLOCK searchbuttons %]
<p>
<input class="btn btn-primary" type="submit" accesskey="s" name="do" title="Search" value="Search" />
[% IF ( OpacAdvSearchMoreOptions and OpacAdvSearchMoreOptions.size > 0 ) %]
[% IF expanded_options %]
<a href="/cgi-bin/koha/opac-search.pl?expanded_options=0" class="btn btn-default more-less-options">Fewer options</a>
[% ELSIF not expanded_options %]
<a href="/cgi-bin/koha/opac-search.pl?expanded_options=1" class="btn btn-default more-less-options">More options</a>
[% END %]
[% END %]
<a href="/cgi-bin/koha/opac-search.pl?do=Clear" class="btn btn-default new-search">New search</a>
</p>
[% END %]
[% BLOCK jsinclude %]
[% Asset.js("lib/jquery/plugins/jquery.deserialize.min.js") | $raw %]
[% Asset.js("lib/jquery/plugins/jquery.cookie.min.js") | $raw %]
<script>
$(document).ready(function() {
$('#advsearches').tabs();
jQuery.cookie.json = true;
//$('#advsearches > ul').tabs();
[% IF ( ReturnToSearch ) %]
if (form_serialized = jQuery.cookie("form_serialized")) {
$('#advsearch form').deserialize(form_serialized);
}
if (form_serialized_limits = jQuery.cookie("form_serialized_limits")) {
$('#language-limit') .val(form_serialized_limits[0]);
$('#branchloop') .val(form_serialized_limits[1]);
$('#subtype_audience') .val(form_serialized_limits[2]);
$('#subtype_content') .val(form_serialized_limits[3]);
$('#subtype_format') .val(form_serialized_limits[4]);
$('#subtype_additional') .val(form_serialized_limits[5]);
$('#locloop') .val(form_serialized_limits[6]);
}
[% ELSE %]
//Clear all form cookies
jQuery.removeCookie("form_serialized", { path: '/'});
jQuery.removeCookie("form_serialized_limits", { path: '/'});
jQuery.removeCookie("num_paragraph", { path: '/'});
jQuery.removeCookie("search_path_code", { path: '/'});
[% END %]
$('#advsearch form').submit(function() {
form_serialized = $(this).serialize();
jQuery.cookie("form_serialized", form_serialized,{ path: '/'});
form_serialized_limits = [
$('#language-limit').val(), $('#branchloop').val(),
$('#subtype_audience').val(), $('#subtype_content').val(),
$('#subtype_format').val(), $('#subtype_additional').val(),
$('#locloop').val()
];
jQuery.cookie("form_serialized_limits", form_serialized_limits,{ path: '/'});
[% IF ( expanded_options ) %]
var numPar = $("#booleansearch fieldset p").size();
if (numPar > [% search_boxes_count | html %]){
jQuery.cookie("num_paragraph", numPar,{ path: '/'});
}else{
jQuery.removeCookie("num_paragraph", { path: '/'});
}
jQuery.cookie("search_path_code", 'exs',{ path: '/'});
[% ELSE %]
jQuery.cookie("search_path_code", 'ads',{ path: '/'});
jQuery.removeCookie("num_paragraph", { path: '/'});
[% END %]
});
});
/* This function allows to display a new field to search.
*/
$(document).on("click", '.ButtonPlus', function(e) {
e.preventDefault();
$('.ButtonLess').show();
var thisLine = $(this).parent().parent();
var newLine = thisLine.clone();
newLine.find('input').val('');
thisLine.after(newLine);
});
$(document).on("click", '.ButtonLess', function(e) {
e.preventDefault();
if($(this).parent().parent().siblings().length <= 3 ) {
$('.ButtonLess').hide();
}
$(this).parent().parent().remove();
});
</script>
[% END %]