@@ -2,4 +2,5 @@ | |||
/nizika_nizika | |||
/nml | |||
/nizika_nml | |||
/log.txt | |||
@@ -0,0 +1,3 @@ | |||
/log.txt | |||
/log2.txt | |||
@@ -0,0 +1,138 @@ | |||
<!DOCTYPE html> | |||
<html lang="ja"> | |||
<head> | |||
<meta charset="UTF-8" /> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
<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="/modules/jquery.cookie-1.4.1.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" /> | |||
<title>伊地知ニジカ放送局 - ニジカ返答ログ</title> | |||
</head> | |||
<body> | |||
<div class="container my-5"> | |||
<div class="accordion mb-5" id="accordion-filter"> | |||
<div class="accordion-item"> | |||
<h2 class="accordion-header"> | |||
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-filter" aria-controls="collapse-filter"> | |||
絞り込み | |||
</button> | |||
</h2> | |||
<div id="collapse-filter" class="accordion-collapse collapse show" data-bs-parent="#accordion-filter"> | |||
<div class="accordion-body mx-5"> | |||
<div> | |||
<div class="row d-flex align-items-center my-2"> | |||
<div class="col-sm-4 fw-bold"> | |||
順序 | |||
</div> | |||
<div class="col-sm"> | |||
<div class="row align-items-center"> | |||
<div class="col form-check"> | |||
<input class="form-check-input" type="radio" name="order" id="order-desc"<?= $asc ? '' : ' checked="checked"' ?> /> | |||
<label class="form-check-label" for="order-desc"> | |||
新しい順 | |||
</label> | |||
</div> | |||
<div class="col form-check"> | |||
<input class="form-check-input" type="radio" name="order" id="order-asc"<?= $asc ? ' checked="checked"' : '' ?> /> | |||
<label class="form-check-label" for="order-asc"> | |||
古い順 | |||
</label> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
<div class="row d-flex align-items-center my-2"> | |||
<div class="col-sm-4 fw-bold"> | |||
日時ニジカ | |||
</div> | |||
<div class="col-sm 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="col-sm-4 fw-bold"> | |||
フリーワード | |||
</div> | |||
<div class="col-sm"> | |||
<input type="text" class="form-control" placeholder="ぬ゛ぅ゛ぅ゛ぅ゛ぅ゛ぅ゛ん゛" id="filter-keyword" | |||
value="<?= $keyword ?>"/> | |||
</div> | |||
</div> | |||
</div> | |||
<div class="mt-3 row"> | |||
<div class="col-sm gap-2 d-grid my-1"> | |||
<button type="button" class="btn btn-secondary" id="btn-reset">元に戻す</button> | |||
</div> | |||
<div class="col-sm gap-2 d-grid my-1"> | |||
<button type="button" class="btn btn-primary" id="btn-filter">絞り込む</button> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
<?php if (count ($log_data) > 0): ?> | |||
<div class="mb-4"> | |||
<?php require 'pagination.cmp.php' ?> | |||
</div> | |||
<div> | |||
<?php foreach (array_slice ($log_data, | |||
($page - 1) * $length, | |||
$length, | |||
true) as $record): ?> | |||
<div class="mb-4"> | |||
<div> | |||
<?= $record['date_time'] ?> | |||
</div> | |||
<div> | |||
<img src="<?= $record['chat_icon'] ?>" /> | |||
<?= $record['chat_name'] ?> | |||
</div> | |||
<div style="color: blue"> | |||
> <span style="font-style: italic"><?= $record['chat_message'] ?></span> | |||
</div> | |||
<div> | |||
<?= $record['answer'] ?> | |||
</div> | |||
</div> | |||
<?php endforeach ?> | |||
</div> | |||
<div class="mt-5"> | |||
<?php require 'pagination.cmp.php' ?> | |||
</div> | |||
<?php else: ?> | |||
何も見つかりませんでしたぬ゛ぅ゛ぅ゛ぅ゛ぅ゛ん゛ | |||
<?php endif ?> | |||
</div> | |||
<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> | |||
</body> | |||
</html> | |||
@@ -0,0 +1,65 @@ | |||
<?php | |||
if ($_SERVER['HTTP_HOST'] === 'nizika.monster') | |||
header ('location: //nizika.tv'); | |||
const LOG_PATH = './log.txt'; | |||
$log_data = []; | |||
$page = (int) ($_GET['p'] ?? 1); | |||
$length = (int) ($_GET['max'] ?? 20); | |||
$asc = ($_GET['asc'] ?? 0) != 0; | |||
$keyword = trim ($_GET['q'] ?? ''); | |||
$escaped = ($_GET['escaped'] ?? 0) != 0; | |||
$date_start = ($_GET['start'] ?? null) ?: null; | |||
$date_end = ($_GET['end'] ?? null) ?: null; | |||
$f = fopen (LOG_PATH, 'r'); | |||
if ($f !== false) | |||
{ | |||
while (($dt = fgetcsv ($f, 0, "\t")) !== false) | |||
{ | |||
$chat_info = json_decode ($dt[1]); | |||
$log_data[] = ['date_time' => $dt[0], | |||
'chat_icon' => $chat_info -> author -> imageUrl, | |||
'chat_name' => $escaped ? htmlspecialchars ($chat_info -> author -> name) : $chat_info -> author -> name, | |||
'chat_message' => $escaped ? htmlspecialchars ($chat_info -> message) : $chat_info -> message, | |||
'answer' => $escaped ? htmlspecialchars ($dt[2]) : $dt[2]]; | |||
} | |||
} | |||
fclose ($f); | |||
unset ($f); | |||
if ($keyword != '') | |||
{ | |||
$log_data = array_filter ($log_data, fn ($row) => ( | |||
strpos ($row['chat_name'] . "\n" . $row['chat_message'] . "\n" . $row['answer'], | |||
$keyword) | |||
!== 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; | |||
if (!($asc)) | |||
$log_data = array_reverse ($log_data); | |||
require_once './index.frm.php'; | |||
@@ -0,0 +1,2 @@ | |||
/*! jquery.cookie v1.4.1 | MIT */ | |||
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?a(require("jquery")):a(jQuery)}(function(a){function b(a){return h.raw?a:encodeURIComponent(a)}function c(a){return h.raw?a:decodeURIComponent(a)}function d(a){return b(h.json?JSON.stringify(a):String(a))}function e(a){0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\"));try{return a=decodeURIComponent(a.replace(g," ")),h.json?JSON.parse(a):a}catch(b){}}function f(b,c){var d=h.raw?b:e(b);return a.isFunction(c)?c(d):d}var g=/\+/g,h=a.cookie=function(e,g,i){if(void 0!==g&&!a.isFunction(g)){if(i=a.extend({},h.defaults,i),"number"==typeof i.expires){var j=i.expires,k=i.expires=new Date;k.setTime(+k+864e5*j)}return document.cookie=[b(e),"=",d(g),i.expires?"; expires="+i.expires.toUTCString():"",i.path?"; path="+i.path:"",i.domain?"; domain="+i.domain:"",i.secure?"; secure":""].join("")}for(var l=e?void 0:{},m=document.cookie?document.cookie.split("; "):[],n=0,o=m.length;o>n;n++){var p=m[n].split("="),q=c(p.shift()),r=p.join("=");if(e&&e===q){l=f(r,g);break}e||void 0===(r=f(r))||(l[q]=r)}return l};h.defaults={},a.removeCookie=function(b,c){return void 0===a.cookie(b)?!1:(a.cookie(b,"",a.extend({},c,{expires:-1})),!a.cookie(b))}}); |
@@ -0,0 +1,40 @@ | |||
<nav class="d-flex justify-content-center" aria-label="..."> | |||
<ul class="pagination opacity-0"> | |||
<?php if ($page > 1): ?> | |||
<li class="page-item"> | |||
<a class="page-link no-wrap" href="javascript: void (0)" onclick="Script.jumpTo (1)">|<</a> | |||
</li> | |||
<?php else: ?> | |||
<li class="page-item disabled"> | |||
<span class="page-link">|<</span> | |||
</li> | |||
<?php endif ?> | |||
<?php for ($i = max (min ($page + 10, $pages_max) - 20, 1); $i < $page; ++$i): ?> | |||
<li class="page-item page-<?= $page - $i ?>"> | |||
<a class="page-link" href="javascript: void (0)" onclick="Script.jumpTo (<?= $i ?>)"><?= $i ?></a> | |||
</li> | |||
<?php endfor ?> | |||
<li class="page-item active" aria-current="page"> | |||
<span class="page-link"><?= $page ?></span> | |||
</li> | |||
<?php for ($i = $page + 1; $i <= min (max ($page - 10, 1) + 20, $pages_max); ++$i): ?> | |||
<li class="page-item page-<?= $i - $page ?>"> | |||
<a class="page-link" href="javascript: void (0)" onclick="Script.jumpTo (<?= $i ?>)"><?= $i ?></a> | |||
</li> | |||
<?php endfor ?> | |||
<?php if ($page < $pages_max): ?> | |||
<li class="page-item"> | |||
<a class="page-link no-wrap" href="javascript: void (0)" onclick="Script.jumpTo (<?= $pages_max ?>)">>|</a> | |||
</li> | |||
<?php else: ?> | |||
<li class="page-item disabled"> | |||
<span class="page-link">>|</span> | |||
</li> | |||
<?php endif ?> | |||
</ul> | |||
</nav> | |||
@@ -0,0 +1,118 @@ | |||
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; | |||
}); | |||
const resetFilter = ( | |||
function () | |||
{ | |||
window.location.href = '/'; | |||
}); | |||
filterKeyword.addEventListener ('keydown', | |||
function (e) | |||
{ | |||
if (e.key === 'Enter') | |||
filter (e); | |||
}); | |||
btnFilter.addEventListener ('click', filter); | |||
$ ('#btn-reset').on ('click', resetFilter); | |||
$ (window).resize (this.setPagination); | |||
this.setPagination (); | |||
$ ('.pagination').removeClass ('opacity-0'); | |||
$ ('#accordion-filter').on ('shown.bs.collapse', function () | |||
{ | |||
$.cookie ('expand-filter', '1'); | |||
}); | |||
$ ('#accordion-filter').on ('hidden.bs.collapse', function () | |||
{ | |||
$.cookie ('expand-filter', '0'); | |||
}); | |||
if ($.cookie ('expand-filter') === '0') | |||
{ | |||
$ ('#collapse-filter').removeClass ('show'); | |||
$ ('#accordion-filter .accordion-button').addClass ('collapsed'); | |||
} | |||
} | |||
static | |||
jumpTo (page) | |||
{ | |||
const url = new URL (window.location.href); | |||
url.searchParams.delete ('p'); | |||
url.searchParams.append ('p', page); | |||
window.location.href = url; | |||
} | |||
static | |||
setPagination () | |||
{ | |||
for (let i = 1; i <= 20; ++i) | |||
$ (`.page-${i}`).removeClass ('d-none'); | |||
for (let i = 20; i > 1; --i) | |||
{ | |||
if (($ ('.pagination').width () < $ ('body').width () * .8) | |||
&& ($ ('.page-item:not(.d-none)').length / 2 % 2 != 0)) | |||
break; | |||
$ (`.page-${i}`).addClass ('d-none'); | |||
} | |||
} | |||
} | |||
Script.main (); | |||
@@ -0,0 +1,26 @@ | |||
.container-max-width | |||
{ | |||
max-width: 1600px; | |||
} | |||
.no-wrap | |||
{ | |||
white-space: nowrap; | |||
} | |||
.custom-width | |||
{ | |||
max-width: 1ex; | |||
} | |||
.row-width | |||
{ | |||
max-width: 6px; | |||
} | |||
.page-item | |||
{ | |||
width: 3.5em; | |||
text-align: center; | |||
} | |||