forgot viewport=device-dim

Rudxain · Mar 8, 2024 · 81d8abe · 81d8abe · Rudxain · Mar 8, 2024
1 parent 2271207
commit 81d8abe
Showing 1 changed file with 1 addition and 1 deletion.
diff --git a/index.html b/index.html
@@ -1 +1 @@
-<!doctype html><html lang=en><head prefix="og: https://ogp.me/ns#"><meta charset=utf-8><link rel=manifest href=m.webmanifest><link rel=icon type=image/svg+xml href=i.svg><title>RGB digital rain</title><meta name=description content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!'><meta name=keywords content="RGB,The-Matrix,Digital-Rain,Matrix-rain,falling,code,rain,character,charset,random,animation,screensaver,wallpaper,background"><meta name=color-scheme content="light dark"><meta name=theme-color content=#0f0><style>body{width:100vw;height:100vh;overflow:hidden;display:block}#c{position:absolute;left:0;top:0;image-rendering:pixelated;touch-action:manipulation}</style><meta property=og:title content="RGB digital rain"><meta property=og:site_name content="Rudxain GitHub Page"><meta property=og:type content=website><link rel=canonical href=https://rudxain.github.io/RGB-digital-rain><meta property=og:url content=https://rudxain.github.io/RGB-digital-rain><meta property=og:description content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!'><meta property=og:image content=https://rudxain.github.io/RGB-digital-rain/d.png><meta property=og:image:width content=1366><meta property=og:image:height content=768><meta property=og:image:alt content="Desktop demo of The Matrix RGB digital rain"></head><body><canvas id=c>Enable JS Canvas</canvas><script>"use strict";{const t=255,e=2**32,i=isFinite,n=t=>!i(t),o=function*(t){for(let e=0;e<t;e++)yield e},r=Math.random,s=(t=0,i=e)=>r()*(i-t)+t>>>0,c=t=>t[r()*t.length>>>0],l=t=>1e3/t,a=document,h=a.body,f=requestAnimationFrame,m=a.getElementById("c"),d=m.getContext("2d",{alpha:!1,t:!0});let u=1,g=1;const y=t=>{d.fillStyle="#"+t,d.fillRect(0,0,u,g)},p=matchMedia?.("(prefers-color-scheme: light)");let x=!p?.matches;const v=32,w=(()=>{let t=!1;return{get o(){return t},set o(e){const i=!!e,n=t;t=i,!n&&i&&($=f(k)),n&&!i&&cancelAnimationFrame($)},i:{h:["f00","ff0","0f0","0ff","00f","f0f"],charset:[..."0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz"],l:24,u:1/v,m:3/4*(x?1:-1),p:250}}})(),M=class{#t;#e;#i;#n;constructor(){this.#t=this.#e=0,this.#i=t,this.#n="777"}init(t,e,i=!1){if(n(t)||n(e))throw new RangeError(`invalid coords: x=${t} y=${e}`);return this.#t=t,this.#e=e,i&&(this.#i=s(3*g/4,g+b)),this.#n=c(w.i.h),this}_(){return this.init(r()*u,r()*b,!0)}get x(){return this.#t}get y(){return this.#e}get M(){return this.#i}get color(){return this.#n}v(t){const e=this.#e+=t;if(n(e))throw new RangeError(`${e}`);return e}};let b=1;const E=()=>{const{clientWidth:t,clientHeight:e}=h;m.style.width=t+"px",m.style.height=e+"px";const i=devicePixelRatio,n=d.getImageData(0,0,u,g);u=m.width=t*i>>>0,g=m.height=e*i>>>0,d.putImageData(n,0,0),b=w.i.u*Math.min(u,g)*2,d.font=`bold ${b}px monospace`},R=Array.from({length:v>>1},(()=>new M)),S=[],A=(t,e)=>{const i=b/4;d.fillText(c(w.i.charset),t-i,e+i)},F=t=>{const e=(t-L)/l(w.i.l)>>>0;if(0==e)return;const i=b;for(const[t,n]of[...S].entries()){d.fillStyle="#"+n.color;for(const r of o(e)){if(A(n.x,n.y),n.y>g){S.splice(t,1);break}n.v(i)}}for(const t of R){d.fillStyle="#"+t.color;for(const n of o(e)){if(A(t.x,t.y),t.y>t.M){t._();break}t.v(i)}}L=t},I=e=>{const i=w.i.m,n=Math.round(Math.min((e-T)*Math.abs(i),t));n&&(y((i<0?"ffffff":"000000")+n.toString(16).padStart(2,"0")),T=e)};let L=0,T=0,$=0;const k=t=>{w.o&&(I(t),F(t),$=f(k))};(()=>{E(),y(w.i.m<0?"fff":"000");for(const t of R)t._();let t;w.o=!0,m.addEventListener("mousedown",(t=>{const e=devicePixelRatio;S.push((new M).init(t.clientX*e,t.clientY*e))})),addEventListener("resize",(()=>{clearTimeout(t),t=setTimeout(E,w.i.p)})),p?.addEventListener?.("change",(t=>{x=!t.matches,w.i.m=Math.abs(w.i.m)*(x?1:-1)}))})()}</script></body></html>
+<!doctype html><html lang=en><head prefix="og: https://ogp.me/ns#"><meta charset=utf-8><meta name=viewport content="width=device-width,height=device-height,initial-scale=1"><link rel=manifest href=m.webmanifest><link rel=icon type=image/svg+xml href=i.svg><title>RGB digital rain</title><meta name=description content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!'><meta name=keywords content="RGB,The-Matrix,Digital-Rain,Matrix-rain,falling,code,rain,character,charset,random,animation,screensaver,wallpaper,background"><meta name=color-scheme content="light dark"><meta name=theme-color content=#0f0><style>body{width:100vw;height:100vh;overflow:hidden;display:block}#c{position:absolute;left:0;top:0;image-rendering:pixelated;touch-action:manipulation}</style><meta property=og:title content="RGB digital rain"><meta property=og:site_name content="Rudxain GitHub Page"><meta property=og:type content=website><link rel=canonical href=https://rudxain.github.io/RGB-digital-rain><meta property=og:url content=https://rudxain.github.io/RGB-digital-rain><meta property=og:description content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!'><meta property=og:image content=https://rudxain.github.io/RGB-digital-rain/d.png><meta property=og:image:width content=1366><meta property=og:image:height content=768><meta property=og:image:alt content="Desktop demo of The Matrix RGB digital rain"></head><body><canvas id=c>Enable JS Canvas</canvas><script>"use strict";{const t=255,e=2**32,i=isFinite,n=t=>!i(t),o=function*(t){for(let e=0;e<t;e++)yield e},r=Math.random,s=(t=0,i=e)=>r()*(i-t)+t>>>0,c=t=>t[r()*t.length>>>0],l=t=>1e3/t,a=document,h=a.body,f=requestAnimationFrame,m=a.getElementById("c"),d=m.getContext("2d",{alpha:!1,t:!0});let u=1,g=1;const y=t=>{d.fillStyle="#"+t,d.fillRect(0,0,u,g)},p=matchMedia?.("(prefers-color-scheme: light)");let x=!p?.matches;const v=32,w=(()=>{let t=!1;return{get o(){return t},set o(e){const i=!!e,n=t;t=i,!n&&i&&($=f(k)),n&&!i&&cancelAnimationFrame($)},i:{h:["f00","ff0","0f0","0ff","00f","f0f"],charset:[..."0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz"],l:24,u:1/v,m:3/4*(x?1:-1),p:250}}})(),M=class{#t;#e;#i;#n;constructor(){this.#t=this.#e=0,this.#i=t,this.#n="777"}init(t,e,i=!1){if(n(t)||n(e))throw new RangeError(`invalid coords: x=${t} y=${e}`);return this.#t=t,this.#e=e,i&&(this.#i=s(3*g/4,g+b)),this.#n=c(w.i.h),this}_(){return this.init(r()*u,r()*b,!0)}get x(){return this.#t}get y(){return this.#e}get M(){return this.#i}get color(){return this.#n}v(t){const e=this.#e+=t;if(n(e))throw new RangeError(`${e}`);return e}};let b=1;const E=()=>{const{clientWidth:t,clientHeight:e}=h;m.style.width=t+"px",m.style.height=e+"px";const i=devicePixelRatio,n=d.getImageData(0,0,u,g);u=m.width=t*i>>>0,g=m.height=e*i>>>0,d.putImageData(n,0,0),b=w.i.u*Math.min(u,g)*2,d.font=`bold ${b}px monospace`},R=Array.from({length:v>>1},(()=>new M)),S=[],A=(t,e)=>{const i=b/4;d.fillText(c(w.i.charset),t-i,e+i)},F=t=>{const e=(t-L)/l(w.i.l)>>>0;if(0==e)return;const i=b;for(const[t,n]of[...S].entries()){d.fillStyle="#"+n.color;for(const r of o(e)){if(A(n.x,n.y),n.y>g){S.splice(t,1);break}n.v(i)}}for(const t of R){d.fillStyle="#"+t.color;for(const n of o(e)){if(A(t.x,t.y),t.y>t.M){t._();break}t.v(i)}}L=t},I=e=>{const i=w.i.m,n=Math.round(Math.min((e-T)*Math.abs(i),t));n&&(y((i<0?"ffffff":"000000")+n.toString(16).padStart(2,"0")),T=e)};let L=0,T=0,$=0;const k=t=>{w.o&&(I(t),F(t),$=f(k))};(()=>{E(),y(w.i.m<0?"fff":"000");for(const t of R)t._();let t;w.o=!0,m.addEventListener("mousedown",(t=>{const e=devicePixelRatio;S.push((new M).init(t.clientX*e,t.clientY*e))})),addEventListener("resize",(()=>{clearTimeout(t),t=setTimeout(E,w.i.p)})),p?.addEventListener?.("change",(t=>{x=!t.matches,w.i.m=Math.abs(w.i.m)*(x?1:-1)}))})()}</script></body></html>