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

Merge pull request 'NIZIKA_DEV-001' (#2) from NIZIKA_DEV-001 into develop/main

Browse Source 
Reviewed-on: http://miteruzo.ml:3000/miteruzo/nizika/pulls/2
This commit was merged in pull request #2.
This commit is contained in:
みてるぞ
2023-05-25 22:54:23 +09:00
parent 249a665557 7db6a857ea
commit 1328148f01
8 changed files with 119 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.gitignore
+2
View File
@@ -1,3 +1,5 @@
/nizika /nizika
/nizika_nizika
/nml /nml
/nizika_nml
assets/kita.wav
BIN
View File
Binary file not shown.
forms/footer.frm.php
+3
View File
@@ -0,0 +1,3 @@
<footer>
</footer>
forms/header.frm.php
+3
View File
@@ -0,0 +1,3 @@
<header>
</header>
forms/index.frm.php
+2 -1
View File
@@ -1,9 +1,10 @@
<!DOCTYPE html>
<html lang="ja"> <html lang="ja">
<head> <head>
<meta charset="utf8" /> <meta charset="utf8" />
<link rel="stylesheet" href="./styles/index.css" /> <link rel="stylesheet" href="./styles/index.css" />
<script src="./scripts/main.js" defer="defer"></script> <script src="./scripts/main.js" defer="defer"></script>
<title>伊地知ニジカ - 鑑賞編</title> <title>ニジカもんすたぁ!! - 入口</title>
</head> </head>
<body> <body>
forms/top.frm.php
+15
View File
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf8" />
</head>
<body>
<?php require_once './forms/header.frm.php' ?>
<main>
<p>ニジカもんすたぁ!! にようこそ!</p>
</main>
<?php require_once './forms/footer.frm.php' ?>
</body>
</html>
scripts/main.js
+90 -13
View File
@@ -1,9 +1,10 @@
const canvas = document.getElementById ('canvas'); const canvas = document.getElementById ('canvas');
const ctx = canvas.getContext ('2d'); const ctx = canvas.getContext ('2d');
const bg = (function () const bg = (
function ()
{ {
const _ = document.createElement('canvas'); const _ = document.createElement ('canvas');
const img = new Image (); const img = new Image ();
_.width = 1920; _.width = 1920;
@@ -11,7 +12,8 @@ const bg = (function ()
const ctx = _.getContext ('2d'); const ctx = _.getContext ('2d');
img.onload = (function () img.onload = (
function ()
{ {
ctx.drawImage (img, 0, 0); ctx.drawImage (img, 0, 0);
}); });
@@ -21,9 +23,10 @@ const bg = (function ()
return _; return _;
}) (); }) ();
const nizikaList = Array (24).fill ().map (function (__, i) const nizikaList = Array (24).fill ().map (
function (__, i)
{ {
const _ = document.createElement('canvas'); const _ = document.createElement ('canvas');
const img = new Image (); const img = new Image ();
_.width = 300; _.width = 300;
@@ -31,7 +34,8 @@ const nizikaList = Array (24).fill ().map (function (__, i)
const ctx = _.getContext ('2d'); const ctx = _.getContext ('2d');
img.onload = (function () img.onload = (
function ()
{ {
ctx.drawImage (img, 0, 0); ctx.drawImage (img, 0, 0);
replaceColorWithTransparent (_); replaceColorWithTransparent (_);
@@ -42,9 +46,10 @@ const nizikaList = Array (24).fill ().map (function (__, i)
return _; return _;
}); });
const kitaList = Array (40).fill ().map (function (__, i) const kitaList = Array (40).fill ().map (
function (__, i)
{ {
const _ = document.createElement('canvas'); const _ = document.createElement ('canvas');
const img = new Image (); const img = new Image ();
_.width = 428; _.width = 428;
@@ -52,7 +57,8 @@ const kitaList = Array (40).fill ().map (function (__, i)
const ctx = _.getContext ('2d'); const ctx = _.getContext ('2d');
img.onload = (function () img.onload = (
function ()
{ {
ctx.drawImage (img, 0, 0); ctx.drawImage (img, 0, 0);
}); });
@@ -62,11 +68,21 @@ const kitaList = Array (40).fill ().map (function (__, i)
return _; return _;
}); });
const upperKita = document.createElement ('canvas');
const runawayGuitar = new Audio ('./assets/kita.wav');
let canvasX; let canvasX;
let canvasY; let canvasY;
let frame = 0; let frame = 0;
let nizikaData = []; let nizikaData = [];
let kitaData = [];
const nizikaVel = 5;
let runawayFlag = false;
let runawayFrame = 0;
preprocess (); preprocess ();
@@ -76,6 +92,23 @@ window.setInterval (() => reDraw (), 16);
function function
preprocess () preprocess ()
{ {
canvas.addEventListener ('click',
function f (e)
{
this.removeEventListener ('click', f);
kitaData.push ({x: e.clientX,
y: e.clientY});
runawayFlag = true;
runawayFrame = frame;
runawayGuitar.play ();
});
upperKita.width = 428;
upperKita.height = 240;
reDraw (); reDraw ();
} }
@@ -91,17 +124,45 @@ reDraw ()
ctx.drawImage (bg, 0, 0, canvasX, canvasY); ctx.drawImage (bg, 0, 0, canvasX, canvasY);
nizikaData.push ({x: Math.random () * canvasX - 150, if (!(runawayFlag))
y: Math.random () * canvasY - 150}); {
nizikaData.push ({x: Math.random () * canvasX,
y: Math.random () * canvasY});
}
if (nizikaData.length > 100) if (nizikaData.length > 100)
nizikaData.shift (); nizikaData.shift ();
nizikaData.forEach (function (nizika) kitaData.forEach (
function (kita)
{ {
ctx.drawImage (nizikaList[frame % 24], nizika.x, nizika.y); ctx.drawImage (kitaList[frame % 40], kita.x - 214, kita.y - 120);
}); });
nizikaData.forEach (
function (nizika)
{
ctx.drawImage (nizikaList[frame % 24], nizika.x - 150, nizika.y - 150);
if (runawayFlag)
{
const l = Math.sqrt (Math.pow (kitaData[0].x - nizika.x, 2)
+ Math.pow (kitaData[0].y - nizika.y, 2));
const t = Math.atan2 (kitaData[0].y - nizika.y,
kitaData[0].x - nizika.x);
nizika.x += nizikaVel * Math.cos (t);
nizika.y += nizikaVel * Math.sin (t);
}
});
if (runawayFlag)
{
changeAlpha (upperKita, kitaList[frame % 40],
Math.max (runawayFrame - frame + 85, 0) * 3);
ctx.drawImage (upperKita, kitaData[0].x - 214, kitaData[0].y - 120);
}
++frame; ++frame;
} }
@@ -126,3 +187,19 @@ replaceColorWithTransparent (canvas)
context.putImageData (imageData, 0, 0); context.putImageData (imageData, 0, 0);
} }
function
changeAlpha (toCanvas, canvas, alpha)
{
const toCtx = toCanvas.getContext ('2d');
const ctx = canvas.getContext ('2d');
const imageData = ctx.getImageData (0, 0, canvas.width, canvas.height);
const pxs = imageData.data;
for (let i = 0; i < pxs.length; i += 4)
pxs[i + 3] = alpha;
toCtx.putImageData (imageData, 0, 0);
}
top.php
+4
View File
@@ -0,0 +1,4 @@
<?php
require_once './forms/top.frm.php';