miteruzo
/
nizika
0
0
Fork 0
Code Issues 5 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

BC詳細画面

bc-detail
みてるぞ 1 year ago
parent
2fba77b89f
commit
0a1e46dd37
9 changed files with 122 additions and 5 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      broadcast/assets/bg.jpg
  2. BIN
      broadcast/assets/nikumaru.otf
  3. BIN
      broadcast/assets/talking.png
  4. +5
    -5
      broadcast/index.frm.php
  5. +9
    -0
      broadcast/script.js
  6. +12
    -0
      broadcast/talk.css
  7. +22
    -0
      broadcast/talk.frm.php
  8. +63
    -0
      broadcast/talk.js
  9. +11
    -0
      broadcast/talk.php

BIN
broadcast/assets/bg.jpg View File

Before After
Width: 852  |  Height: 480  |  Size: 450 KiB

BIN
broadcast/assets/nikumaru.otf View File


BIN
broadcast/assets/talking.png View File

Before After
Width: 512  |  Height: 248  |  Size: 17 KiB

+ 5
- 5
broadcast/index.frm.php View File

@@ -27,7 +27,7 @@
<div class="accordion-item"> <div class="accordion-item">
<h2 class="accordion-header"> <h2 class="accordion-header">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-filter" aria-controls="collapse-filter"> <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-filter" aria-controls="collapse-filter">
絞り込みてすと
絞り込み
</button> </button>
</h2> </h2>


@@ -124,9 +124,9 @@
$length, $length,
true) true)
as $record): ?> as $record): ?>
<div class="mb-4">
<div class="mb-4 message-block">
<div> <div>
<?= $record['date_time'] ?>
<span class="message-block-dt"><?= $record['date_time'] ?></span>
</div> </div>


<div> <div>
@@ -135,11 +135,11 @@
</div> </div>


<div style="color: blue"> <div style="color: blue">
&gt; <span style="font-style: italic"><?= $record['chat_message'] ?></span>
&gt; <span class="message-block-chat" style="font-style: italic"><?= $record['chat_message'] ?></span>
</div> </div>


<div> <div>
<?= $record['answer'] ?>
<span class="message-block-answer"><?= $record['answer'] ?></span>
</div> </div>
</div> </div>
<?php endforeach ?> <?php endforeach ?>


+ 9
- 0
broadcast/script.js View File

@@ -78,6 +78,15 @@ Script
$.cookie ('expand-filter', '0'); $.cookie ('expand-filter', '0');
}); });


$ ('.message-block').on ('click', function ()
{
const dt = $ (this).find ('.message-block-dt').text ();
const chat = $ (this).find ('.message-block-chat').text ();
const answer = $ (this).find ('.message-block-answer').text ();

window.open (`./talk.php?dt=${dt}&chat=${chat}&answer=${answer}`);
});

if ($.cookie ('expand-filter') === '0') if ($.cookie ('expand-filter') === '0')
{ {
$ ('#collapse-filter').removeClass ('show'); $ ('#collapse-filter').removeClass ('show');


+ 12
- 0
broadcast/talk.css View File

@@ -0,0 +1,12 @@
@font-face
{
font-family: 'Nikumaru';
src: url(./assets/nikumaru.otf);
}

body
{
background-color: black;
font-family: Nikumaru;
}


+ 22
- 0
broadcast/talk.frm.php View File

@@ -0,0 +1,22 @@
<!-- vim:set tabstop=4 softtabstop=4 expandtab :-->

<!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>
<link href="./talk.css?<?= filemtime ('./talk.css') ?>" rel="stylesheet" />
<title>あほ</title>
<input type="hidden" id="dt" value="<?= $dt ?>" />
<input type="hidden" id="chat" value="<?= $chat ?>" />
<input type="hidden" id="answer" value="<?= $answer ?>" />
</head>

<body>
<canvas id="canvas"></canvas>

<script src="./talk.js?<?= filemtime ('./talk.js') ?>" type="text/javascript"></script>
</body>
</html>


+ 63
- 0
broadcast/talk.js View File

@@ -0,0 +1,63 @@
class
Talk
{
static
main ()
{
const canvas = new Canvas;

setInterval (() => canvas.resize (), 100);
}
}


class
Canvas
{
constructor ()
{
this.canvas = $ ('#canvas');
this.ctx = this.canvas[0].getContext ('2d');

this.bg = new Image ();
this.bg.src = './assets/bg.jpg';

this.bg.onload = () => this.resize ();
}

resize ()
{
this.canvas.width ($ (window).width ());
this.canvas.height ($ (window).height ());

this.redraw ();
}

redraw ()
{
this.putBG (this.canvas.width (), this.canvas.height ());
}

putBG (sizeX, sizeY)
{
const width = this.bg.width;
const height = this.bg.height;

const vertical = sizeY / sizeX > height / width;

console.log (sizeX, sizeY, width, height);

const zoom = vertical ? (sizeX / width) : (sizeY / height);

const x = vertical ? 0 : ((sizeX - width * zoom) / 2);
const y = vertical ? ((sizeY - height * zoom) / 2) : 0;

this.ctx.drawImage (this.bg,
0, 0, width, height,
x, y, width, height);
}
}


Talk.main ();


+ 11
- 0
broadcast/talk.php View File

@@ -0,0 +1,11 @@
<?php

if ($_SERVER['HTTP_HOST'] === 'nizika.monster')
header ('location: //nizika.tv/talk.php');

$dt = $_GET['dt'];
$name = $_GET['chat'];
$answer = $_GET['answer'];

require_once './talk.frm.php';


Write Preview
Loading…
Cancel
Save