class Script { static main () { const dateOptions = {dateFormat: 'yy-mm-dd', firstDay: 6}; $ ('#filter-date-start').datepicker (dateOptions); $ ('#filter-date-end').datepicker (dateOptions); const url = new URL (window.location.href); const orderAsc = document.getElementById ('order-asc'); const filterKeyword = document.getElementById ('filter-keyword'); const btnFilter = document.getElementById ('btn-filter'); const filter = ( function (e) { let dateStart = $ ('#filter-date-start').val (); let dateEnd = $ ('#filter-date-end').val (); if ((dateStart !== '') && (dateEnd !== '') && (dateStart > dateEnd)) [dateStart, dateEnd] = [dateEnd, dateStart]; url.searchParams.delete ('p'); url.searchParams.delete ('asc'); url.searchParams.append ('asc', orderAsc.checked ? '1' : '0'); url.searchParams.delete ('q'); url.searchParams.append ('q', filterKeyword.value); url.searchParams.delete ('start'); url.searchParams.delete ('end'); if (dateStart !== '') url.searchParams.append ('start', dateStart); if (dateEnd !== '') url.searchParams.append ('end', dateEnd); window.location.href = url; }); filterKeyword.addEventListener ('keydown', function (e) { if (e.key === 'Enter') filter (e); }); btnFilter.addEventListener ('click', filter); } static jumpTo (page) { const url = new URL (window.location.href); url.searchParams.delete ('p'); url.searchParams.append ('p', page); window.location.href = url; } } Script.main ();