max/memorium
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

feat: use input type number for counter

Browse Source
This commit is contained in:
max_richter 2023-08-11 17:17:38 +02:00
parent 8d53e4cd68
commit 3aa96dcef3
2 changed files with 18 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
islands/Counter.tsx
View File

@ -18,6 +18,7 @@ export default function Counter(props: CounterProps) {
</Button>
<input
class="text-3xl bg-transparent inline text-center -mx-4"
type="number"
size={props.count.toString().length}
value={props.count}
onInput={(ev) => props.count.value = ev.target?.value}

37
static/thumbnails.js
View File

@ -41,16 +41,16 @@ function thumbHashToRGBA(hash) {
}
return ac;
};
let l_ac = decodeChannel(lx, ly, l_scale);
let p_ac = decodeChannel(3, 3, p_scale * 1.25);
let q_ac = decodeChannel(3, 3, q_scale * 1.25);
let a_ac = hasAlpha && decodeChannel(5, 5, a_scale);
const l_ac = decodeChannel(lx, ly, l_scale);
const p_ac = decodeChannel(3, 3, p_scale * 1.25);
const q_ac = decodeChannel(3, 3, q_scale * 1.25);
const a_ac = hasAlpha && decodeChannel(5, 5, a_scale);
// Decode using the DCT into RGB
let ratio = thumbHashToApproximateAspectRatio(hash);
let w = round(ratio > 1 ? 32 : 32 * ratio);
let h = round(ratio > 1 ? 32 / ratio : 32);
let rgba = new Uint8Array(w * h * 4), fx = [], fy = [];
const ratio = thumbHashToApproximateAspectRatio(hash);
const w = round(ratio > 1 ? 32 : 32 * ratio);
const h = round(ratio > 1 ? 32 / ratio : 32);
const rgba = new Uint8Array(w * h * 4), fx = [], fy = [];
for (let y = 0, i = 0; y < h; y++) {
for (let x = 0; x < w; x++, i += 4) {
let l = l_dc, p = p_dc, q = q_dc, a = a_dc;
@ -77,7 +77,7 @@ function thumbHashToRGBA(hash) {
// Decode P and Q
for (let cy = 0, j = 0; cy < 3; cy++) {
for (let cx = cy ? 0 : 1, fy2 = fy[cy] * 2; cx < 3 - cy; cx++, j++) {
let f = fx[cx] * fy2;
const f = fx[cx] * fy2;
p += p_ac[j] * f;
q += q_ac[j] * f;
}
@ -93,9 +93,9 @@ function thumbHashToRGBA(hash) {
}
// Convert to RGB
let b = l - 2 / 3 * p;
let r = (3 * l - b + q) / 2;
let g = r - q;
const b = l - 2 / 3 * p;
const r = (3 * l - b + q) / 2;
const g = r - q;
rgba[i] = max(0, 255 * min(1, r));
rgba[i + 1] = max(0, 255 * min(1, g));
rgba[i + 2] = max(0, 255 * min(1, b));
@ -106,9 +106,9 @@ function thumbHashToRGBA(hash) {
}
function rgbaToDataURL(w, h, rgba) {
let row = w * 4 + 1;
let idat = 6 + h * (5 + row);
let bytes = [
const row = w * 4 + 1;
const idat = 6 + h * (5 + row);
const bytes = [
137,
80,
78,
@ -153,7 +153,7 @@ function rgbaToDataURL(w, h, rgba) {
120,
1,
];
let table = [
const table = [
0,
498536548,
997073096,
@ -226,9 +226,6 @@ function rgbaToDataURL(w, h, rgba) {
return "data:image/png;base64," + btoa(String.fromCharCode(...bytes));
}
function thumbHashToDataURL(hash) {
}
document.querySelectorAll("[data-thumb]").forEach((entry) => {
const hash = entry.getAttribute("data-thumb");
@ -251,8 +248,8 @@ document.querySelectorAll("[data-thumb]").forEach((entry) => {
const child = entry.querySelector("img[data-thumb-img]");
if (child && !child.complete) {
child.style.opacity = 0;
child.style.transition = "opacity 0.3s ease";
child.addEventListener("load", () => {
child.style.transition = "opacity 0.3s ease";
child.style.opacity = 1;
});
}