| @@ -3,7 +3,11 @@ | |||||
| <head> | <head> | ||||
| <meta charset="UTF-8" /> | <meta charset="UTF-8" /> | ||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||||
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous" /> | |||||
| <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> | |||||
| <script src="//code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script> | |||||
| <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script> | |||||
| <link href="//cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous" /> | |||||
| <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.min.css" /> | |||||
| <link href="./style.css" rel="stylesheet" /> | <link href="./style.css" rel="stylesheet" /> | ||||
| <title>伊地知ニジカ放送局 - ニジカ返答ログ</title> | <title>伊地知ニジカ放送局 - ニジカ返答ログ</title> | ||||
| </head> | </head> | ||||
| @@ -43,6 +47,20 @@ | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="row d-flex align-items-center my-2"> | |||||
| <div class="col-4 fw-bold"> | |||||
| 日時ニジカ | |||||
| </div> | |||||
| <div class="col input-group"> | |||||
| <input type="text" class="form-control" placeholder="YYYY-MM-DD" id="filter-date-start" | |||||
| value="<?= $date_start ?>" /> | |||||
| <span class="input-group-text">〜</span> | |||||
| <input type="text" class="form-control" placeholder="YYYY-MM-DD" id="filter-date-end" | |||||
| value="<?= $date_end ?>" /> | |||||
| </div> | |||||
| </div> | |||||
| <div class="row d-flex align-items-center my-2"> | <div class="row d-flex align-items-center my-2"> | ||||
| <div class="col-4 fw-bold"> | <div class="col-4 fw-bold"> | ||||
| フリーワード | フリーワード | ||||
| @@ -55,8 +73,14 @@ | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| <div class="d-grid gap-2 mt-3"> | |||||
| <button type="button" class="btn btn-primary" id="btn-filter">絞り込む</button> | |||||
| <div class="mt-3 row"> | |||||
| <div class="col gap-2 d-grid"> | |||||
| <button type="button" class="btn btn-secondary" id="btn-reset">元に戻す</button> | |||||
| </div> | |||||
| <div class="col gap-2 d-grid"> | |||||
| <button type="button" class="btn btn-primary" id="btn-filter">絞り込む</button> | |||||
| </div> | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| @@ -102,7 +126,7 @@ | |||||
| <?php endif ?> | <?php endif ?> | ||||
| </div> | </div> | ||||
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> | |||||
| <script src="//cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script> | |||||
| <script src="./script.js" type="text/javascript"></script> | <script src="./script.js" type="text/javascript"></script> | ||||
| </body> | </body> | ||||
| </html> | </html> | ||||
| @@ -13,6 +13,9 @@ $asc = ($_GET['asc'] ?? 0) != 0; | |||||
| $keyword = trim ($_GET['q'] ?? ''); | $keyword = trim ($_GET['q'] ?? ''); | ||||
| $escaped = ($_GET['escaped'] ?? 0) != 0; | $escaped = ($_GET['escaped'] ?? 0) != 0; | ||||
| $date_start = ($_GET['start'] ?? null) ?: null; | |||||
| $date_end = ($_GET['end'] ?? null) ?: null; | |||||
| $f = fopen (LOG_PATH, 'r'); | $f = fopen (LOG_PATH, 'r'); | ||||
| if ($f !== false) | if ($f !== false) | ||||
| @@ -41,6 +44,18 @@ if ($keyword != '') | |||||
| !== false)); | !== false)); | ||||
| } | } | ||||
| if ($date_start) | |||||
| { | |||||
| $log_data = array_filter ($log_data, fn ($row) => ( | |||||
| substr ($row['date_time'], 0, 10) >= $date_start)); | |||||
| } | |||||
| if ($date_end) | |||||
| { | |||||
| $log_data = array_filter ($log_data, fn ($row) => ( | |||||
| substr ($row['date_time'], 0, 10) <= $date_end)); | |||||
| } | |||||
| $pages_max = (int) ((count ($log_data) - 1) / $length) + 1; | $pages_max = (int) ((count ($log_data) - 1) / $length) + 1; | ||||
| if (!($asc)) | if (!($asc)) | ||||
| @@ -4,6 +4,12 @@ Script | |||||
| static | static | ||||
| main () | 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 url = new URL (window.location.href); | ||||
| const orderAsc = document.getElementById ('order-asc'); | const orderAsc = document.getElementById ('order-asc'); | ||||
| @@ -14,6 +20,14 @@ Script | |||||
| const filter = ( | const filter = ( | ||||
| function (e) | 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 ('p'); | ||||
| url.searchParams.delete ('asc'); | url.searchParams.delete ('asc'); | ||||
| @@ -22,9 +36,24 @@ Script | |||||
| url.searchParams.delete ('q'); | url.searchParams.delete ('q'); | ||||
| url.searchParams.append ('q', filterKeyword.value); | 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; | window.location.href = url; | ||||
| }); | }); | ||||
| const resetFilter = ( | |||||
| function () | |||||
| { | |||||
| window.location.href = '/'; | |||||
| }); | |||||
| filterKeyword.addEventListener ('keydown', | filterKeyword.addEventListener ('keydown', | ||||
| function (e) | function (e) | ||||
| { | { | ||||
| @@ -33,6 +62,7 @@ Script | |||||
| }); | }); | ||||
| btnFilter.addEventListener ('click', filter); | btnFilter.addEventListener ('click', filter); | ||||
| $ ('#btn-reset').on ('click', resetFilter); | |||||
| } | } | ||||
| static | static | ||||