mirror of
https://github.com/He4eT/browser-milje-2077.git
synced 2026-05-04 17:07:24 +00:00
Cleaup
This commit is contained in:
parent
7dcf6efdef
commit
5a8128c25f
5 changed files with 42 additions and 49 deletions
|
|
@ -1,9 +1,4 @@
|
|||
# TODO
|
||||
|
||||
- Pointer events
|
||||
- Popup (hide milje, open settings)
|
||||
- Settings page
|
||||
- Params: color, density
|
||||
- Screenshots
|
||||
- README
|
||||
- Live reload
|
||||
|
|
|
|||
|
|
@ -179,20 +179,27 @@ function getCanvas(size) {
|
|||
|
||||
/** @see https://stackoverflow.com/questions/3448347/how-to-scale-an-imagedata-in-html-canvas */
|
||||
function scaleImageData(imageData, scale, ctx) {
|
||||
const scaled = ctx.createImageData(imageData.width * scale, imageData.height * scale)
|
||||
const scaled = ctx.createImageData(
|
||||
imageData.width * scale,
|
||||
imageData.height * scale,
|
||||
)
|
||||
const subLine = ctx.createImageData(scale, 1).data
|
||||
for (let row = 0; row < imageData.height; row++) {
|
||||
for (let col = 0; col < imageData.width; col++) {
|
||||
const sourcePixel = imageData.data.subarray(
|
||||
(row * imageData.width + col) * 4,
|
||||
(row * imageData.width + col) * 4 + 4)
|
||||
(row * imageData.width + col) * 4 + 4,
|
||||
)
|
||||
for (let x = 0; x < scale; x++) {
|
||||
subLine.set(sourcePixel, x * 4)
|
||||
}
|
||||
for (let y = 0; y < scale; y++) {
|
||||
const destRow = row * scale + y
|
||||
const destCol = col * scale
|
||||
scaled.data.set(subLine, (destRow * scaled.width + destCol) * 4)
|
||||
scaled.data.set(
|
||||
subLine,
|
||||
(destRow * scaled.width + destCol) * 4,
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>TV off</title>
|
||||
<style>
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: gray;
|
||||
}
|
||||
body, html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: gray;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
</head>
|
||||
<body>
|
||||
<script src="../../content_scripts/milje.js"></script>
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,35 +5,29 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Milje 2077 Settings</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: sans;
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form hr {
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.form-group input, .form button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.color-slider {
|
||||
width: 100%;
|
||||
}
|
||||
body {
|
||||
font-family: sans;
|
||||
}
|
||||
.form {
|
||||
width: 100%;
|
||||
}
|
||||
.form hr {
|
||||
margin: 16px 0;
|
||||
}
|
||||
.form-group {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.form-group label {
|
||||
display: block;
|
||||
}
|
||||
.form-group input, .form button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.color-slider {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -8,18 +8,15 @@
|
|||
text-align: center;
|
||||
font-family: sans;
|
||||
}
|
||||
|
||||
main {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
button {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue