From 7bc0ad72ba615655af3c9d3377d97a6647d13432 Mon Sep 17 00:00:00 2001 From: End Date: Fri, 19 Dec 2025 19:52:22 -0700 Subject: [PATCH] init --- img/backgroundtile.png | Bin 0 -> 2124 bytes img/ornaments.png | Bin 0 -> 1806 bytes img/tree.png | Bin 0 -> 25974 bytes index.html | 29 ++++++++++++ script.js | 87 ++++++++++++++++++++++++++++++++++++ style.css | 97 +++++++++++++++++++++++++++++++++++++++++ 6 files changed, 213 insertions(+) create mode 100644 img/backgroundtile.png create mode 100644 img/ornaments.png create mode 100644 img/tree.png create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/img/backgroundtile.png b/img/backgroundtile.png new file mode 100644 index 0000000000000000000000000000000000000000..d2927823ce43eddecaa84133c450bfd9e0762b4e GIT binary patch literal 2124 zcmeAS@N?(olHy`uVBq!ia0y~yV0-|=9Be?5+AI5}0x6baC(jTLAgJL;>0n^sVD@xz z45^s&_WD8IJ8lB52N&)PG;ZMSmlRyf!XmHIGe0Ga^~1&O?RM{GMlu|ze>MLX14D%} zBU?iQ1G9re1EYe%0R{nq1O^Tc0|pir2?i!69tOriC~fzZk>Sssa@*+d>r3<`~8Q^w90?SZH>PQ z?thF(U4C}7%G(8ZjDzJ5-hU0ZD};98H?$KnfpkupG`L{2uf4vx^ncXzYk%(!;Ya{_ u<-mM+dOAG+3~h7#y*KcrJERNYI)>nO>y5Kh8H<3;0|rl5KbLh*2~7a*yozN2 literal 0 HcmV?d00001 diff --git a/img/ornaments.png b/img/ornaments.png new file mode 100644 index 0000000000000000000000000000000000000000..d3c30d370a0db34f13081a52c8c9feab0cf6c38a GIT binary patch literal 1806 zcmYk7c{H188^&LX&>)r$I%pU(6j8hK$tPk9Wdt=yDWa|682OZbwn~v8Rn*efpw%cX z?Pruhr<68KNrl*2A@;SFHn!Neyz`DTe|&%3&wb8y&V4=ibN&8!(%oEfQYXJX2>^hU zlcSvn)JvdB5gtGp(YXGNQeReq1wMoh^;Ph1rqb!Ts-Y@5iW~za-g2xV^B0H zDG3BYAH$_J08})sqSNUIAYiC;*Wr7nU(U(W2S5cJjv>4w)dR^LG81f|j|G4pro8}Q zB3~VSeyIn9gWzS_7ytqQ?-PK>nom~OzLg^jVRaAz0o#7})+%Hq#5d(Z-l>-D34 z$nb>lC)Gdqgsy$aop|-=)BCNME+O=|+Wmu}Uo4WesF>;}GcOKj_bY~!d6h(7cHw^m zw@q&vav6*~Tj#(DJXfidWhJT8*lO(@=p|3xYGG18ct==wTS*RjtginA5Au@#I`k?F z_7(TOg!NAHB@*WSir9BmfzzGUKgP&Y6r?ASl`=-*LUnTYCmVI1`M7$D z2|-u%f1(uZP|8oRQ9oW>QwZDUE1Zw#BFu7(;PiuvbM}darxRT?1xSoW zS}JEp>!)Gwkx!4k%_Na|zNPo~r@GSrRBQ2< zG>g9^v*F)&BdPEQC*g^pZvTlH2gE_Em|XC56gcpMqrnnM?dd=1fw$4Im1)0Yf(Mg_ zhj{H%%ex-ZddYDZ;^%cG6}LJB^#aL!;7$RjEyA*XeQi(mSZf@(d25IQiQD9`+3D@! z7wrmvBdObXlMqOK^MLFj*=i*sqM4dkaVQT7G5TMPVxAd6gOk$(_Rz>6Tl=675F zk1+d~u#yCGTq?z6V@P?^#I>8cAUJptw>FlDu|PbglNYd)yf271aVt~uI}FB~ndg`e zJ@TI#k9+qLNW`Idt*8NH3TmXbP_03K`8l2*gv0a?2cS1aEm{jheBAsddy!rVq)mi+ zMl=Q+(L)T7jkoajp9OTUMD#Yyp7|L! z@|}56^*n-~J1COj!UJVh#&^tDAH2;ARN$y=!DKUBMpz;&e&?LC`#luM*vCbZ1M+Ja z;tk92NO&bq2jw>uHGoM$*<}q5g^+22nV5M40Y#P{*g*x2oA#+BfAih8BP~Tm$gJ@h zKDI4GGysL-U0S_*cb}SL?`tM6vh!4RYssCrsP(Ud4B9(2EpvG(_?=3Y%{(KuA95Z! z5^1%dk?q-8>d=U06Tif$o}ibxmBUGHyBIo$?Jxo#C>OwlEDxwJ(FNzcGGKd-x|GXt z2E{Fhw8CfK;Eu3u;Q|eUe_?{QPTuGtF48n~g*x+xeuv)J90u;q5#Bi?S1SYH$N_MXKTgpES@u!~HB*7EaS z)%Lr$O6wT0i||N_aeqxoL&3Rg0^e_sY&%NF@iLF1xZZ7JN)XqOT3v*WZ4>9C4}zfT z*qoV(7AMRz`laWwEj@w~U4&*AhmW=TND1^l<5F$_5`&#u-4kW5KLj1~y)^^wQ0C0Q zTtAmCxot(E*JLbdS`#ERoXvlpC{DO7T&3T)FMZU$$|k0umHq~>5bT}U*KG`=H-NkR zyfT5>>rIL5ShLx>!qm%Oi`kHIZAe!zWy&`cMs5_L$5C4by7R~qD_qlZM|S}y|x+%oBX~1G^EDK)YM@XJE`lx znBL6EHqqiffXy1R6AK8a)l=Ir+1Gp7SL3enpLIBqHju2n1{5(-Heyt9PJzUyr*0&q r?bC8nJNoxks#f~~4trFX60?fM^T}5JVShj$8vr=jyV||938ef5!?=WB literal 0 HcmV?d00001 diff --git a/img/tree.png b/img/tree.png new file mode 100644 index 0000000000000000000000000000000000000000..3d059433c4ed31be578f5cc773bbf2f1d6f42373 GIT binary patch literal 25974 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 M3pEQ4#{VeyKMJvMY5)KL literal 0 HcmV?d00001 diff --git a/index.html b/index.html new file mode 100644 index 0000000..12c08e1 --- /dev/null +++ b/index.html @@ -0,0 +1,29 @@ + + + + + + Haxmas Day 7 + + + + + + + + +
+
+
⭐
+
+
+ + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..2100a7b --- /dev/null +++ b/script.js @@ -0,0 +1,87 @@ +const date = new Date(); +const days = date.getDate(); +const month = date.getMonth() + 1; +const year = date.getFullYear(); + +const ornamentPositions = [ + // Row 1 + { x: 0, y: 0 }, + { x: 16, y: 0 }, + { x: 32, y: 0 }, + { x: 48, y: 0 }, + { x: 64, y: 0 }, + { x: 80, y: 0 }, + // Row 2 + { x: 0, y: 16 }, + { x: 16, y: 16 }, + { x: 32, y: 16 }, + { x: 48, y: 16 }, + { x: 64, y: 16 }, + { x: 80, y: 16 }, + // Row 3 + { x: 0, y: 32 }, + { x: 16, y: 32 }, + { x: 32, y: 32 }, + { x: 48, y: 32 }, + { x: 64, y: 32 }, + { x: 80, y: 32 }, + // Row 4 + { x: 0, y: 48 }, + { x: 16, y: 48 }, + { x: 32, y: 48 }, + { x: 48, y: 48 }, + { x: 64, y: 48 }, + { x: 80, y: 48 }, +]; + +const stars = ["⭐", "💫", "💖", "🎄", "🏴‍☠️", "👾", "✨", "🌟"]; + +function changeStar() { + let randomIndex = Math.floor(Math.random() * stars.length); + document.getElementById("star").innerText = stars[randomIndex]; +} + +function getTreeX(y) { + const center = 132; + const maxWidth = 100; + const minWidth = 10; + + const progress = Math.min(Math.max((y - 50) / 350, 0), 1); + const widthAtY = minWidth + (maxWidth - minWidth) * progress; + + return center + (Math.random() - 0.5) * 2 * widthAtY; +} + +document.addEventListener("DOMContentLoaded", () => { + const decorations = document.getElementById("decorations"); + const dateText = document.getElementById("date"); + const star = document.getElementById("star"); + + dateText.innerText = days + "/" + month + "/" + year; + + let ornamentCount = 5; + if (month === 12) { + ornamentCount = Math.max(25 - days, 0); + } + + for (let i = 0; i < ornamentCount; i++) { + const randomPos = + ornamentPositions[Math.floor(Math.random() * ornamentPositions.length)]; + + const ornament = document.createElement("div"); + ornament.className = "ornament"; + ornament.id = "ornament" + i; + + ornament.style.backgroundPosition = `-${randomPos.x}px -${randomPos.y}px`; + + const y = Math.random() * 300 + 80; + const x = getTreeX(y); + + ornament.style.left = x + "px"; + ornament.style.top = y + "px"; + + decorations.appendChild(ornament); + } + + star.addEventListener("click", changeStar); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..5371e08 --- /dev/null +++ b/style.css @@ -0,0 +1,97 @@ +body { + font-family: "VT323", monospace; + background: linear-gradient(180deg, #0f0f23 0%, #1a1a3e 50%, #0f0f23 100%); + color: azure; + margin: 0; + padding: 20px; + min-height: 100vh; +} + +#header, +#footer { + text-align: center; +} + +#header h1 { + font-size: 3rem; + margin-bottom: 0; +} + +#header h2 { + font-size: 1.5rem; + margin-top: 0.5rem; +} + +#tree-container { + width: 264px; + height: 456px; + margin: 2rem auto; + position: relative; + overflow: hidden; +} + +#tree { + width: 264px; + height: 456px; + background-image: url("img/tree.png"); + background-repeat: no-repeat; + image-rendering: pixelated; + animation: tree-lights 0.8s steps(1) infinite; +} + +@keyframes tree-lights { + 0% { + background-position: 0 0; + } + 25% { + background-position: -264px 0; + } + 50% { + background-position: 0 -456px; + } + 75% { + background-position: -264px -456px; + } + 100% { + background-position: 0 0; + } +} + +#star { + position: absolute; + top: 0; + left: 50%; + transform: translateX(-50%); + font-size: 3rem; + z-index: 5; + cursor: pointer; + transition: transform 0.2s; +} + +#star:hover { + transform: translateX(-50%) scale(1.2); +} + +#decorations { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + pointer-events: none; +} + +.ornament { + width: 16px; + height: 16px; + background-image: url("img/ornaments.png"); + background-repeat: no-repeat; + position: absolute; + z-index: 10; + transform: scale(2); + image-rendering: pixelated; +} + +.important-text { + color: #5bc0de; +}