djkato/Chrome-performance-bug-muted-window
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

init

Browse source
This commit is contained in:
Djkato 2023-02-18 18:51:49 +01:00
commit dd774bb10b
20 changed files with 616 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
Jamie xx - Sleep Sound.mp3 Normal file
View file

Binary file not shown.

34
index.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mute and Unmute me</title>
</head>
<body>
<div class="svgwrapper">
<svg id="svgCanvas" style="width:100%;height:100%" viewBox="0 0 355 1920" preserveAspectRatio="none"></svg>
</div>
<button onclick="main()">start</button>
<audio id="audio"></audio>
</body>
<style>
.svgwrapper {
width: 100vw;
height: 50vh;
}
body {
margin: 0;
padding: 0;
}
</style>
<script src="index.js"></script>
</html>

80
index.js Normal file
View file

@ -0,0 +1,80 @@
/**
* Initialise web audio api
*/
let audio_context
const audio_element = document.querySelector("#audio")
audio_element.src = "Jamie xx - Sleep Sound.mp3"
//audio nodes
let track
let audio_context_analyzer
let prev_data = new Array()
function main() {
audio_context = new AudioContext()
track = audio_context.createMediaElementSource(audio_element)
audio_context_analyzer = audio_context.createAnalyser(audio_element)
audio_context_analyzer.fftSize = 1024
audio_context_analyzer.smoothingTimeConstant = .2
track.connect(audio_context_analyzer).connect(audio_context.destination)
audio_element.play()
animate()
}
function animate() {
const svg_canvas = document.querySelector("#svgCanvas")
let initial_shape = new Array()
for (let i = 0; i < 200; i++) {
initial_shape.push({
x: (svg_canvas.viewBox.baseVal.width / 200) * i,
y: svg_canvas.viewBox.baseVal.height / 2 - (0 / 200) * i
})
}
let fft_data_array = new Float32Array(200)
audio_context_analyzer.getFloatFrequencyData(fft_data_array)
/**
* mutate svg default shape by audio
*/
let mutated_shape = new Array()
for (let i = 0; i < fft_data_array.length; i++) {
mutated_shape.push({
x: (initial_shape[i].x /** ((Math.max(this.#FFTDataArray[i] + 100)) * 4)*/),
y: (initial_shape[i].y - Math.min(initial_shape[i].y, Math.max(fft_data_array[i] * 2 + 200, 0)))
})
}
/**
* create svg element
*/
let path = `M ${0} ${svg_canvas.viewBox.baseVal.height} `
for (let i = 0; i < mutated_shape.length; i++) {
path += `L ${mutated_shape[i].x},${mutated_shape[i].y} `
}
path += `L ${svg_canvas.viewBox.baseVal.height} ${svg_canvas.viewBox.baseVal.height / 2} `
path += `L ${svg_canvas.viewBox.baseVal.height} ${svg_canvas.viewBox.baseVal.height} `
path += `Z `
path = `<path width="100%" height="100%" d="${path}" stroke="none" fill="#c084fc"/>`
/**
* compare FFTData to previous ones
*/
let matched_amount = 0
for (let prev_dat in prev_data) {
if (prev_dat == fft_data_array) {
matched_amount += 1
}
}
console.log(`Matched ${matched_amount} times!`)
prev_data.push(fft_data_array)
svg_canvas.innerHTML = path
const drawVisual = requestAnimationFrame(animate)
}

12
node_modules/.bin/tiny-server generated vendored Normal file
View file

@ -0,0 +1,12 @@
#!/bin/sh
basedir=$(dirname "$(echo "$0" | sed -e 's,\\,/,g')")
case `uname` in
*CYGWIN*|*MINGW*|*MSYS*) basedir=`cygpath -w "$basedir"`;;
esac
if [ -x "$basedir/node" ]; then
exec "$basedir/node" "$basedir/../tiny-server/bin/index" "$@"
else
exec node "$basedir/../tiny-server/bin/index" "$@"
fi

17
node_modules/.bin/tiny-server.cmd generated vendored Normal file
View file

@ -0,0 +1,17 @@
@ECHO off
GOTO start
:find_dp0
SET dp0=%~dp0
EXIT /b
:start
SETLOCAL
CALL :find_dp0
IF EXIST "%dp0%\node.exe" (
SET "_prog=%dp0%\node.exe"
) ELSE (
SET "_prog=node"
SET PATHEXT=%PATHEXT:;.JS;=;%
)
endLocal & goto #_undefined_# 2>NUL || title %COMSPEC% & "%_prog%" "%dp0%\..\tiny-server\bin\index" %*

28
node_modules/.bin/tiny-server.ps1 generated vendored Normal file
View file

@ -0,0 +1,28 @@
#!/usr/bin/env pwsh
$basedir=Split-Path $MyInvocation.MyCommand.Definition -Parent
$exe=""
if ($PSVersionTable.PSVersion -lt "6.0" -or $IsWindows) {
# Fix case when both the Windows and Linux builds of Node
# are installed in the same directory
$exe=".exe"
}
$ret=0
if (Test-Path "$basedir/node$exe") {
# Support pipeline input
if ($MyInvocation.ExpectingInput) {
$input | & "$basedir/node$exe" "$basedir/../tiny-server/bin/index" $args
} else {
& "$basedir/node$exe" "$basedir/../tiny-server/bin/index" $args
}
$ret=$LASTEXITCODE
} else {
# Support pipeline input
if ($MyInvocation.ExpectingInput) {
$input | & "node$exe" "$basedir/../tiny-server/bin/index" $args
} else {
& "node$exe" "$basedir/../tiny-server/bin/index" $args
}
$ret=$LASTEXITCODE
}
exit $ret

16
node_modules/.package-lock.json generated vendored Normal file
View file

@ -0,0 +1,16 @@
{
"name": "performance-bug-unmuted-window",
"version": "1.0.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"node_modules/tiny-server": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/tiny-server/-/tiny-server-1.1.1.tgz",
"integrity": "sha512-UZdFJFqms0+mvWOs1LRuf2C/ONjERZvaAXXyvqHXGGZtFeFUfeunmVi7OFdI8OgCiBUM1Rq+BfYJ2guVUeXnUg==",
"bin": {
"tiny-server": "bin/index"
}
}
}
}

43
node_modules/tiny-server/README.md generated vendored Normal file
View file

@ -0,0 +1,43 @@
# tiny-server
A tiny Web Server
## Install
You can install to global
```shell
npm install -g tiny-server
```
or as a module
```shell
npm install tiny-server
```
## Usage
### global
```shell
tiny-server
```
It will use terminal's current working directory as the web server's root directory.
And the server's port is 3000.
You can specify a path as web server's root directory:
```shell
tiny-server ./www
```
You can export environment `PORT` value as the server's port:
```shell
export PORT=3001 && tiny-server;
```

24
node_modules/tiny-server/bin/index generated vendored Normal file
View file

@ -0,0 +1,24 @@
#!/usr/bin/env node
var Server = require("../lib/server");
var argv = process.argv.slice(2);
var cwd = argv[0] || process.cwd();
var port = process.env["PORT"] || 3000;
var server = new Server(cwd);
server.listen(port, function () {
console.log("============= start ============");
console.log(cwd);
console.log("http://localhost:" + port);
}).once("error", function (err) {
if (err.code === "EADDRINUSE") {
console.log("=============== ERROR ===============");
console.error("Port: " + port + " already in use");
console.log("=====================================");
}
process.exit(1);
});

1
node_modules/tiny-server/index.js generated vendored Normal file
View file

@ -0,0 +1 @@
module.exports = require("./lib/server");

42
node_modules/tiny-server/lib/detect.js generated vendored Normal file
View file

@ -0,0 +1,42 @@
module.exports = function () {
var unknowMIMEType = "application/octet-stream";
var mimeTypes = new Map([
["txt", "text/plain"],
["htm", "text/html"],
["html", "text/html"],
["xml", "text/xml"],
["css", "text/css"],
["js", "application/javascript"],
["json", "application/json"],
["mp3", "audio/mpeg"],
["wav", "audio/wav"],
["gif", "image/gif"],
["jpg", "image/jpeg"],
["jpeg", "image/jpeg"],
["png", "image/png"],
["bmp", "image/bmp"],
["svg", "image/svg+xml"],
["avi", "video/avi"],
["mp4", "video/mpeg"],
]);
return function (ext) {
if (!ext || typeof ext !== "string") {
return unknowMIMEType;
}
if (/^\./.test(ext)) {
ext = ext.slice(1);
}
ext = ext.toLowerCase();
if (mimeTypes.has(ext)) {
return mimeTypes.get(ext);
} else {
return unknowMIMEType;
}
};
};

24
node_modules/tiny-server/lib/mime.js generated vendored Normal file
View file

@ -0,0 +1,24 @@
"use strict";
var detect = require("./detect")();
module.exports = function () {
var mimeTypes = new Map();
var unknowMIMEType = "application/octet-stream";
return function (ext) {
if (!ext) {
return unknowMIMEType;
}
if (mimeTypes.has(ext)) {
return mimeTypes.get(ext);
} else {
var mimeType = detect(ext);
if (!mimeType) {
mimeType = unknowMIMEType;
}
mimeTypes.set(ext, mimeType);
return mimeType;
}
};
};

170
node_modules/tiny-server/lib/server.js generated vendored Normal file
View file

@ -0,0 +1,170 @@
"use strict";
var fs = require("fs");
var http = require("http");
var path = require("path");
var querystring = require("querystring");
var stream = require("stream");
var util = require("util");
var url = require("url");
var mime = require("./mime")();
var Server = function Server(cwd, middlewares) {
if (!(this instanceof Server)) {
return new Server(cwd, middlewares);
}
if (!cwd) {
cwd = process.cwd();
}
if (typeof middlewares === "function") {
middlewares = [middlewares];
} else if (!Array.isArray(middlewares)) {
middlewares = [];
}
http.Server.call(this);
this.cwd = cwd;
this.middlewares = middlewares;
var requestHandler = this.handler.bind(this);
this.on("request", requestHandler);
this.once("close", function () {
this.removeListener("request", requestHandler);
});
};
util.inherits(Server, http.Server);
Server.prototype.handler = function (req, res) {
var pathname = url.parse(req.url).pathname;
var filename = path.join(this.cwd, path.normalize(querystring.unescape(pathname)));
var that = this;
fs.exists(filename, function (exists) {
if (exists) {
fs.stat(filename, function (err, stats) {
if (err) {
return that.notFound(res);
}
if (stats.isFile()) {
var ext = path.extname(filename);
var mimeType = mime(ext);
res.writeHead(200, {
"Content-Type": mimeType,
"Access-Control-Allow-Origin": "*"
});
fs.createReadStream(filename).pipe(res);
} else if (stats.isDirectory()) {
if (!/\/$/.test(pathname)) {
res.writeHead(301, {
"Location": path.join(pathname, "/")
});
res.end();
return;
}
fs.readdir(filename, function (err, files) {
if (err) {
return that.notFound(res);
}
var len = files.length;
if (!len) {
dir(files);
return;
}
var items = [];
files.forEach(function (file) {
fs.stat(path.join(filename, file), function (err, stats) {
if (!err) {
items.push(stats.isDirectory() ? path.join(file, "/") : file);
}
--len;
if (!len) {
dir(items);
}
});
});
function dir(files) {
res.writeHead(200, {
"Content-Type": "text/html",
"Access-Control-Allow-Origin": "*"
});
res.end(["",
'<!DOCTYPE html>',
'<html>',
' <head>',
' <meta charset="UTF-8">',
' <meta name="viewport" content="width=device-width, initial-scale=1.0">',
' <title>Index of ' + pathname + '</title>',
' </head>',
' <body>',
' <h1>Index of ' + pathname + '</h1>',
' <hr>',
' <ul>',
' <li><a href="..">../</a></li>',
files.map(function (file) {
return ' <li><a href="' + path.join(pathname, file) + '">' + file + '</a></li>';
}).join("\n"),
' </ul>',
' <hr>',
' </body>',
'</html>',
""].join("\n"));
}
});
} else {
that.notFound(res);
}
});
} else {
that.notFound(res);
}
});
};
Server.prototype.notFound = function (res) {
res.writeHead(404, {
"Content-Type": "text/html",
"Access-Control-Allow-Origin": "*"
});
var file = path.join(this.cwd, "404.html");
fs.exists(file, function (exists) {
if (exists) {
fs.createReadStream(file).pipe(res);
} else {
default404Reader().pipe(res);
}
});
function default404Reader() {
var f404 = new stream.Readable();
f404._read = function () {
this.push(["",
'<!DOCTYPE html>',
'<html>',
' <head>',
' <meta charset="UTF-8">',
' <title>Not Found!</title>',
' </head>',
' <body>',
' <h1>File Not Found!</h1>',
' </body>',
'</html>',
""].join("\n"));
this.push(null);
};
return f404;
}
};
module.exports = Server;

34
node_modules/tiny-server/package.json generated vendored Normal file
View file

@ -0,0 +1,34 @@
{
"name": "tiny-server",
"version": "1.1.1",
"description": "a tiny Web Server",
"main": "index.js",
"scripts": {
"test": "mocha ./test/index.js"
},
"bin": {
"tiny-server": "./bin/index"
},
"keywords": [
"http",
"web",
"server",
"tiny"
],
"author": "zbinlin",
"license": "MIT",
"directories": {
"test": "test"
},
"repository": {
"type": "git",
"url": "git+https://github.com/zbinlin/tiny-server.git"
},
"bugs": {
"url": "https://github.com/zbinlin/tiny-server/issues"
},
"homepage": "https://github.com/zbinlin/tiny-server#readme",
"devDependencies": {
"mocha": "^10.0.0"
}
}

23
node_modules/tiny-server/test/detect-test.js generated vendored Normal file
View file

@ -0,0 +1,23 @@
"use strict";
var assert = require("assert");
var detect = require("../lib/detect")();
describe("test lib/detect", function () {
it("非法参数时，返回 application/octet-stream", function () {
assert.equal(detect(), "application/octet-stream");
});
it("扩展名不区别大小写", function () {
var mimeType = "text/plain";
assert.equal(detect("txt"), mimeType);
assert.equal(detect("TXT"), mimeType);
});
it("扩展名前可带 .，如 .txt", function () {
var mimeType = "text/plain";
assert.equal(detect(".txt"), mimeType);
});
it("未知扩展名，返回 application/octet-stream", function () {
assert.equal(detect(".xxx"), "application/octet-stream");
});
});

5
node_modules/tiny-server/test/index.js generated vendored Normal file
View file

@ -0,0 +1,5 @@
"use strict";
require("./detect-test");
require("./mime-test");
require("./server-test");

19
node_modules/tiny-server/test/mime-test.js generated vendored Normal file
View file

@ -0,0 +1,19 @@
"use strict";
var assert = require("assert");
var mime = require("../lib/mime")();
describe("test lib/mime", function () {
it("非法参数时，返回 application/octet-stream", function () {
assert.equal(mime(), "application/octet-stream");
});
it(".txt 返回 text/plain", function () {
assert.equal(mime(".txt"), "text/plain");
assert.equal(mime(".txt"), "text/plain");
});
it("未知扩展名，返回 application/octet-stream", function () {
assert.equal(mime(".xxx"), "application/octet-stream");
});
});

0
node_modules/tiny-server/test/server-test.js generated vendored Normal file
View file

31
package-lock.json generated Normal file
View file

@ -0,0 +1,31 @@
{
"name": "performance-bug-unmuted-window",
"version": "1.0.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "performance-bug-unmuted-window",
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"tiny-server": "^1.1.1"
}
},
"node_modules/tiny-server": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/tiny-server/-/tiny-server-1.1.1.tgz",
"integrity": "sha512-UZdFJFqms0+mvWOs1LRuf2C/ONjERZvaAXXyvqHXGGZtFeFUfeunmVi7OFdI8OgCiBUM1Rq+BfYJ2guVUeXnUg==",
"bin": {
"tiny-server": "bin/index"
}
}
},
"dependencies": {
"tiny-server": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/tiny-server/-/tiny-server-1.1.1.tgz",
"integrity": "sha512-UZdFJFqms0+mvWOs1LRuf2C/ONjERZvaAXXyvqHXGGZtFeFUfeunmVi7OFdI8OgCiBUM1Rq+BfYJ2guVUeXnUg=="
}
}
}

13
package.json Normal file
View file

@ -0,0 +1,13 @@
{
"name": "performance-bug-unmuted-window",
"version": "1.0.0",
"description": "",
"scripts": {
"serve": "tiny-server"
},
"author": "",
"license": "ISC",
"dependencies": {
"tiny-server": "^1.1.1"
}
}