Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
Rudxain authored Mar 7, 2024
1 parent 2f06c0c commit ca3e07c
Show file tree
Hide file tree
Showing 4 changed files with 18 additions and 3 deletions.
Binary file added d.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
17 changes: 16 additions & 1 deletion i.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html lang=en><head prefix='og: https://ogp.me/ns#'><meta charset=utf-8><link href=https://Rudxain.github.io/RGB-digital-rain rel=canonical><link href=i.svg rel=icon type=image/svg+xml><link href=m.webmanifest rel=manifest><title>RGB digital rain</title><meta content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!' name=description><meta content='RGB, The-Matrix, Digital-Rain, Matrix-rain, falling, code, rain, character, charset, random, animation, screensaver, wallpaper, background' name=keywords><meta content='Ricardo "Rudxain" Fernández Serrata, Ganesh Prasad' name=author><meta content='RGB digital rain' property=og:title><meta content='Rudxain GitHub Page' property=og:site_name><meta content=website property=og:type><meta content=https://Rudxain.github.io/RGB-digital-rain property=og:url><meta content='The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!' property=og:description><meta content=https://Rudxain.github.io/RGB-digital-rain/res/demo_horizontal.png property=og:image><meta content=1920 property=og:image:width><meta content=1080 property=og:image:height><meta content='Desktop demo of The Matrix RGB digital rain' property=og:image:alt><meta content=https://Rudxain.github.io/RGB-digital-rain/res/demo_vertical.png property=og:image><meta content=720 property=og:image:width><meta content=1280 property=og:image:height><meta content='Mobile demo of The Matrix RGB digital rain' property=og:image:alt><meta content=dark name=color-scheme><meta content=black name=theme-color><style>body,html{background-color:#000;width:100vw;height:100vh;margin:0;border:0;overflow:hidden;display:block}canvas{position:absolute;left:0;top:0;image-rendering:pixelated}</style><canvas id=c>Update browser or enable JS</canvas><script>'use strict';{let a=requestAnimationFrame,b=document,f=Math,c=b.getElementById('c'),g=c.getContext('2d',{alpha:!1,desynchronized:!0}),h=[],i=[],j=(a,b)=>f.random()*(b-a)+a|0,k,l,m,n,o,p,q=32,d=()=>{k=c.width=b.body.clientWidth,l=c.height=b.body.clientHeight;let a=f.ceil(k/q),d=p;for(e(!1);a>h.length;)h.push(0);for(h.length=a;a>i.length;)i.push(i.length%6);i.length=a,e(d)},r=()=>{g.font=`bold ${q}px monospace`;for(let a=0,d=0;a<h.length;a++,d+=q){let b=h[a],e=['f00','ff0','0f0','0ff','00f','f0f'][i[a]];g.fillStyle='#'+e;let c=j(0,94);g.fillText('!?"\'`#$%&()[]{}*+-,./\\|:;<=>@^_~0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'[c],d,b),c=j(64,16384),(b=h[a]=b>c?0:b+q)||(i[a]=(i[a]+1)%6)}},s=c=>{if(!p)return;let b=c-m;(b=f.round(b>255?255:b<0?0:b))&&(g.fillStyle='#000000'+b.toString(16).padStart(2,'0'),g.fillRect(0,0,k,l),m=c),a(s)},e=b=>{!p!= !b&&((p=!p)?(n=setInterval(r,41),a(s)):clearInterval(n))};d(),a(a=>{r(),m=a}),e(!0),addEventListener('resize',()=>{clearTimeout(o),o=setTimeout(d,1500)})}</script>
<!doctype html><html lang=en><head prefix="og: https://ogp.me/ns#"><meta charset=UTF-8><link rel=canonical href=https://rudxain.github.io/RGB-digital-rain><link rel=icon type=image/svg+xml href=i.svg><link rel=manifest href=m.webmanifest><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=author content='Ricardo "Rudxain" Fernández Serrata, Ganesh Prasad'><meta property=og:title content="RGB digital rain"><meta property=og:site_name content="Rudxain GitHub Page"><meta property=og:type content=website><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"><meta name=color-scheme content="light dark"><meta name=theme-color content=#0f0><style>body{width:100vw;height:100vh;overflow:hidden;display:block}canvas{position:absolute;left:0;top:0;image-rendering:pixelated}</style></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>
2 changes: 1 addition & 1 deletion m.webmanifest
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"name":"RGB digital rain","short_name":"RGB DigitRain","description":"The Matrix \u0022falling code/letter rain\u0022 animation but RGB. No more monochromatic green!","categories":["personalization","entertainment"],"start_url":"https://Rudxain.github.io/RGB-digital-rain","lang":"en","icons":[{"src":"i.svg","sizes":"any","type":"image/svg+xml"}],"background_color":"#000","theme_color":"#000","display":"fullscreen","screenshots":[{"src":"res/demo_horizontal.png","type":"image/png","sizes":"1920x1080","platform":"wide","label":"Desktop demo of RGB digital rain"},{"src":"res/demo_vertical.png","type":"image/png","sizes":"720x1280","platform":"narrow","label":"Mobile demo of RGB digital rain"}]}
{name:"RGB digital rain",short_name:"RGB DigitRain",description:'The Matrix "falling code/letter rain" animation but RGB. No more monochromatic green!',categories:["personalization","entertainment"],start_url:"https://Rudxain.github.io/RGB-digital-rain",lang:"en",icons:[{src:"i.svg",sizes:"any",type:"image/svg+xml"}],background_color:"#000",theme_color:"#0f0",display:"fullscreen",screenshots:[{src:"d.png",type:"image/png",sizes:"1366x768",platform:"wide"}]}

1 comment on commit ca3e07c

@Rudxain
Copy link
Owner Author

@Rudxain Rudxain commented on ca3e07c Mar 7, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

closes #42

Please sign in to comment.