- ID de l'analyse :
- 8dde526f-291c-467e-b401-64feecdbacfeTerminée
- URL soumise :
- https://autumnvoir.straw.page/
- Fin du rapport :
Liens : 4 trouvé(s)
Liens sortants identifiés à partir de la page
Lien | texte |
---|---|
https://youtube.com/@autumnvoir?si=6voUJD2oMg-HlcfE | Youtube |
https://www.roblox.com/users/239124786/profile | Roblox |
https://steamcommunity.com/id/WBRT/ | Steam |
https://straw.page?ref=logo | Make your own StrawPage! |
Variables JavaScript : 32 trouvée(s)
Les variables JavaScript globales chargées dans l'objet fenêtre d'une page sont des variables déclarées en dehors des fonctions et accessibles depuis n'importe quel endroit du code au sein du champ d'application actuel
Nom | Type |
---|---|
0 | object |
onbeforetoggle | object |
documentPictureInPicture | object |
onscrollend | object |
$ | function |
jQuery | function |
p5 | function |
Konva | object |
formatPaint | function |
makeGrid | function |
Messages de journal de console : 0 trouvé(s)
Messages consignés dans la console web
HTML
Le corps HTML de la page en données brutes
<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" crossorigin="anonymous"><link href="https://fonts.googleapis.com/css?family=Karla:400,900|PT+Sans+Narrow|Yantramanav:400,900|Roboto:900,400|Bangers|Krona+One|Nunito:400,900|Frank+Ruhl+Libre:400,900|Oswald:400,900|Source+Serif+Pro|Work+Sans:400,900|Open+Sans|Raleway|Lato|Passion+One|Lateef|Crimson+Text|Baloo+Paaji+2|Jost|Oswald|Montserrat|Lexend+Deca|Bungee+Shade|Rubik|Inter:400,900|Bebas+Neue|Syncopate:400,700|VT323:400,900|Poppins:400,900|Fredoka+One:400,900|Staatliches:400,900|Redacted+Script:400,900|Rubik+Pixels:400,900|Cute+Font:400,900|Kosugi+Maru:400,900|Darumadrop+One:400,900|Kaisei+Decol:400,900|Playfair+Display:400,900|Rubik+Doodle+Shadow:400,900|Shadows+Into+Light:400,900|M+PLUS+1:400,900|Zeyada:400,900|Rock+Salt:400,900|Leckerli+One:400,900|Space+Mono:400,900|Finger+Paint:400,900" rel="stylesheet"><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/p5.js"></script><script src="https://cdn.jsdelivr.net/npm/[email protected]/konva.min.js"></script><link href="https://straw.page/min/?g=els&n=8322" rel="stylesheet"><link rel="apple-touch-icon" sizes="180x180" href="https://straw.page/apple-touch-icon.png?v=2"><link rel="icon" type="image/png" sizes="32x32" href="https://straw.page/favicon-32x32.png?v=2"><link rel="icon" type="image/png" sizes="16x16" href="https://straw.page/favicon-16x16.png?v=2"><script defer="" src="https://notebook.straw.page" data-website-id="e542f189-5790-4d32-a332-4f67b7c0d470"></script><meta property="twitter:title" content="autumnvoir's strawpage"><meta property="twitter:description" content="autumnvoir's strawpage"><meta property="og:image" content="https://strawcdn.com/capture/pics/autumnvoir.straw.page.jpg?v=5244"><meta name="twitter:title" content="autumnvoir's strawpage"><meta name="twitter:description" content="Made with StrawPage"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:image" content="https://strawcdn.com/capture/pics/autumnvoir.straw.page.jpg?v=9552"><meta name="straw:user" content="autumnvoir"><script src="https://cdn.usefathom.com/script.js" data-site="ZXDYIAXN" defer=""></script><style>* { outline: 0; margin: 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } html { -webkit-text-size-adjust: 100%; } a,a:link,a:visited,.a:hover,.a:focus,a:active{ color: inherit; text-decoration: none; } body { overflow-x: hidden; background: var(--b); --b: #fff; background-size: cover; background-position: center; background-attachment: scroll; --mw: 600; } .first { font-family: 'Yantramanav'; --p: #df001d; --g: 32px; --gs: 2.73438em; --extra: 1; background-size: cover; background-position: center; background-attachment: scroll; overflow-x: hidden; overflow-y: hidden } .content { margin: 0 auto; /* min-height: calc(200vh + calc(1rem * calc(var(--extra) * var(--g)))); */ width: 100%; max-width: calc(1px * var(--mw)); position: relative; font-size:min(16px, 16 * (100vw / var(--mw))); min-height: 100vh; } .element:hover { cursor: auto } .element[data-type=text] * { -webkit-user-drag: auto; -khtml-user-drag: auto; -moz-user-drag: auto; -o-user-drag: auto; user-drag: auto; -khtml-user-select: auto; -o-user-select: auto; -moz-user-select: auto; -webkit-user-select: auto; user-select: auto; } .element { transition: transform 0.3s ease } .content a .element:hover,.element[data-scrollto]:hover { transform: rotate(calc(1deg*var(--r))) scale(calc(var(--s) * 1.05)); cursor: pointer } .content a .element:hover button { cursor: pointer } .element:not([data-type=wordart]) p { -webkit-transform: translate3d(0,0,0) } .branding{position:fixed;bottom:30px;right:30px;display:flex;align-items:center;filter:drop-shadow(0 1px 5px rgba(0,0,0,.4));background:#df001d;z-index: 9999999999999999;transition:all 0.3s ease; transform: none}.branding img{height:40px;width:40px;margin-bottom:0;padding: 2px}.brandingContent{display:none}.brandingContent p{margin:0;font-family:'Yantramanav';color:#fff;font-size:16px;padding:0 8px} .branding:hover { transform: scale(1.1); cursor: pointer } @media(min-width: 5px){ .brandingContent{display:block !important} } .inst { --scaler: 1.2 } .inst.fb { --scaler: 1.15 } .inst .element[data-type=text] .el_content, .inst .element[data-type=icon] .el_content, .inst .element[data-type=button] button { font-size: calc(1em * calc(var(--ts) / var(--scaler))); } .element[data-type=embed] iframe { pointer-events: all } .element[data-type=image]:not([data-link]):not([data-scrollto]),.element[data-type=icon]:not([data-link]):not([data-scrollto]),.element[data-type=shape]:not([data-link]):not([data-scrollto]){ pointer-events: none } .element[data-type=text]:not([data-link]):not([data-scrollable]):not([data-scrollto]){ pointer-events: none } .element[data-type=text]:not([data-link]):not([data-scrollto]) *{ pointer-events: all } .element[data-type=icon][data-link]{ pointer-events: none } .element[data-type=icon][data-link] i{ pointer-events: all } .element[data-type=paint] {pointer-events: none} .element[data-type=paint] g {pointer-events: all} /* GIMMICKS */ .element[data-type=gimmick-canvas] { border: 0.15em solid var(--co); --co: #df001d; --ts: 1; border-radius: 5px; transform: rotate(calc(1deg*var(--r))) } .element[data-type=gimmick-canvas] .innerCanvas { height: 100%; width: 100%; display: flex; flex-direction: column } .element[data-type=gimmick-canvas] .toolbox { margin: 0 0 0 auto; background: #fff; padding: 0.4em 0.6em; color: var(--co); display: inline-flex; font-size: calc(1em * var(--ts)); position: absolute; top: -0em; left: 50%; transform: translate(-50%,-100%); border: 0.15em solid var(--co); border-radius: calc(5px / 2); align-items: center; max-width: 100% } .element[data-type=gimmick-canvas] .toolbox i { padding: 0 0.4em; font-size: 1.1em; } .element[data-type=gimmick-canvas] .picasso { background: #fff; flex: 1; border-radius: calc(5px / 2); overflow: hidden; position: relative } .element[data-type=gimmick-canvas] .picasso canvas { height: 100%; width: 100% } .element[data-type=gimmick-canvas] .sendPicasso { padding: 0em; } .element[data-type=gimmick-canvas] .sendPicasso button { -webkit-appearance: none; appearance: none; background: #fff; color: var(--co); text-align: center; border: 0; border-top: 0.15em solid var(--co); width: 100%; padding: 0.5em 0.2em; font-family: 'Yantramanav'; font-size: 1.1em; border-bottom-left-radius: calc(5px / 2); border-bottom-right-radius: calc(5px / 2); transition: all 0.3s ease } .element[data-type=gimmick-canvas] .sendPicasso button:hover { background: var(--co); color: #fff; cursor: pointer } .element[data-type=gimmick-ama] .askerSend button:hover { background: var(--co); color: #fff; cursor: pointer } .element[data-type=gimmick-ama] .askExtra { position: relative; transition: all 0.3s ease } .element[data-type=gimmick-ama] .askExtra img { height: 1.875em; width: 1.875em; position: absolute; left: calc(50% - 4px); top: 50%; transform: translate(-50%,-50%); object-fit: cover; object-position: center } .element[data-type=gimmick-ama] .askExtra:hover { opacity: 0.5; cursor: pointer } .element[data-type=gimmick-canvas] .canvCol { height: 1.1em; width: 1.1em; border-radius: 50%; margin: 0 0.4em; background: conic-gradient(from 0deg at 50% 50%, rgba(255,0,0,1) 0%, rgba(255,154,0,1) 10%, rgba(208,222,33,1) 20%, rgba(79,220,74,1) 30%, rgba(63,218,216,1) 40%, rgba(47,201,226,1) 50%, rgba(28,127,238,1) 60%, rgba(95,21,242,1) 70%, rgba(186,12,248,1) 80%, rgba(251,7,217,1) 90%, rgba(255,0,0,1) 100%); } .element[data-type=gimmick-canvas] [type=color] { visibility: hidden; position: absolute; } .canvSizing { display: flex; align-items: center } .element[data-type=gimmick-canvas] [type=range] { border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 5px; width: 3em; background: var(--co); border-radius: 40px; border: 1px solid var(--co); background: 0; margin: 0 0.5rem } .element[data-type=gimmick-canvas] [type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; background: var(--co); height: 15px; width: 15px; border: 2px solid var(--co); border-radius: 40px } .element[data-type=gimmick-canvas].doneArt,.element[data-type=gimmick-ama].doneArt { pointer-events: none; } .jfr .element, .jfr .element * { pointer-events: all !important } @media(max-width: 385px){ .element[data-type=gimmick-canvas] [type=range]::-webkit-slider-thumb { height: 12px; width: 12px; } } .element[data-type=image] img { width: calc(100% * var(--s)); height: calc(100% * var(--s)); transform: scale(calc(1 / var(--s))) translateZ(0); } @-moz-document url-prefix() { .element[data-type=image] img { min-height: calc(100% * var(--s)); min-width: calc(100% * var(--s)); } } .element[data-type=majorityvote] .innerTalking p:not(.activeTalk){ display: none } .element[data-type=majorityvote] .innerTalking:hover { cursor: pointer } .element.disableTmp { pointer-events: none } .completionCasso { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; background: var(--co); align-items: center; justify-content: center; opacity: 0; pointer-events: none; display: flex; transition: opacity 0.3s ease } .completionCasso button { -webkit-appearance: none; appearance: none; background: #fff; color: var(--co); border: 1px solid #fff; font-family: 'Yantramanav'; font-size: 1em; padding: 0.3em 0.8em; transition: all 0.3s ease } .completionCasso button:hover { transform: scale(1.1); cursor: pointer } .element[data-type=gimmick-canvas].doneArt .completionCasso { pointer-events: all; opacity: 1; } .element[data-sound] { pointer-events: all !important } .element[data-sound]:hover { cursor: pointer } .element[data-type=spotify]:hover .imgWrap i { transform: translate(-50%,-50%) scale(1.1) } .cursorMode .cursorReal { background-image: var(--cu); height: 32px; width: 32px; background-size: contain; background-repeat: no-repeat; background-position: center; position: fixed; top: 100px; left: 100px; z-index: 999999999999999999999; pointer-events: none; } .cursorMode,.cursorMode * { cursor: none !important } .spotSearch { background: #18181b; max-height: 270px; position: fixed; bottom: -120vh; left: 0; right: 0; max-width: 420px; margin: 0 auto; border-top-left-radius: 20px; border-top-right-radius: 20px; padding: 15px; height: 100%; opacity: 0; transition: bottom 0.3s ease } .spotSearch.bringUp { bottom: 0; opacity: 1; } .spotSearch .closer { background: #000; position: absolute; top: 0; left: 50%; transform: translate(-50%,-100%); color: #fff; height: 30px; width: 40px; border-top-left-radius: 5px; border-top-right-radius: 5px; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; } .spotSearch .closer:hover { opacity: 0.8; cursor: pointer } .innerSpotSearch { overflow-y: scroll; height: 100% } .searchWrap { position: sticky; top: 0px; display: grid; grid-template-columns: auto 1fr; grid-gap: 10px; color: #8d8d8f; background: #27272a; border-radius: 40px; overflow: hidden } .searchWrap input { background: #27272a; width: 100%; font-family: 'Yantramanav'; padding: 8px 8px; border: 0; font-size: 14px; color: #fff } .searchWrap input::placeholder { color: #8d8d8f } .searchWrap i { display: inline-flex; align-items: center; justify-content: center; padding-left: 14px; font-size: 13px; } .spotResults { padding: 20px 0; display: grid; grid-gap: 10px } .spotItem { display: grid; grid-template-columns: auto 1fr auto; grid-gap: 20px; color: #fff; padding: 10px; border-radius: 10px; transition: all 0.3s ease } .spotItem:hover { background: rgba(255,255,255,0.05); cursor: pointer } .spotItem img { height: 30px; width: 30px; object-fit: cover; object-position: center; border-radius: 6px; } .spotMeta { color: #cfcfd3; display: grid; grid-gap: 4px; } .spotMeta h5 { font-size: 13px; color: #fff } .spotMeta p { font-size: 13px; } .spotMeta i { font-size: 12px; padding-right: 4px } .spotActions { display: flex; align-items: center } .spotActions i { padding: 4px; font-size: 13px; } .followingDon { transition: all 0.3s ease } .followingDon:hover { opacity: 0.5; cursor: pointer } .element[data-type=windowsplayer] input[type=range] { -webkit-appearance: none; width: 100%; background: transparent; font-size: 1em } .element[data-type=windowsplayer] input[type=range]::-webkit-slider-runnable-track { width: 100%; height: .25em; background: #9b9a99; border-radius: 6.25em; box-shadow: inset .0625em .0625em #000, inset -.0625em -.0625em #9b9a99; } .element[data-type=windowsplayer] input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: .625em; height: 1em; background: #9b9a99; box-shadow: inset .0625em .0625em #9b9a99, inset -.0625em -.0625em #000, inset .125em .125em #9b9a99, inset -.125em -.125em #000; margin-top: -.375em; position: relative; z-index: 1; } .memeInp { justify-content: flex-end } .ff .element[data-type=image] img { background-color: transparent }</style><title>autumnvoir's strawpage</title></head><body style="--g: 2.34375; --b: #956acd; background-attachment: scroll;"><div class="first" style="--g: 2.34375;"><div class="content" style="height: 1870px;"><div class="element" style="--x: 0; --y: 0; --w: 16; --h: 1; --r: 0; --s: 1; --bc: #7a39ac;" data-uid="hwzkuttflx" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--ts: 1.1; --x: 0.21333333333333335; --y: 0; --w: 7; --h: 1; --r: 0; --s: 1; --co: #ffffff; --ta: left; --f: VT323;" data-uid="cgprsudjjy" data-type="text"><div class="el_content"><p>Shorksoft Goober-Explorer</p></div></div><div class="element" style="--x: 0; --y: 1; --w: 16; --h: 1; --r: 0; --s: 1; --boc: #919191; --bos: 0.06; --bc: #c4c4c4;" data-uid="wdyvziveix" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 0; --y: 1; --w: 4.4; --h: 1; --r: 0; --s: 1; --px: 0.5; --ta: left;" data-uid="wulsyjztfd" data-type="text"><div class="el_content"><p><u>F</u>ile | <u>E</u>dit | <u>D</u>elete</p></div></div><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 6.133333333333334; --y: 0.9966666666666667; --w: 10.6; --h: 1; --r: 0; --s: 0.7; --bc: #ffffff; --boc: #919191; --bos: 0.07;" data-fun-markoui="normal" data-fun-text="Goober Alert!" data-lock="true" data-uid="iuquqiwhjf" data-type="text"><div class="el_content"><p>Goober Alert!</p></div></div><div class="element" style="--x: 0; --y: 2; --w: 5.4; --h: 6; --r: 0; --s: 1; --boc: #919191; --bos: 0.06;" data-uid="zqblrxoeye" data-type="image"><img src="https://files.strawcdn.com/straw/FPKdzCCefPhNUsEtIjzS.png" draggable="false" loading="lazy"></div><div class="element" style="--y: 0; --x: -11.2;" data-uid="kmfftrxxbk" data-type="paint"><svg style="--ns: 0;"><g></g></svg></div><div class="element" style="--x: 5.386666666666667; --y: 1.9733333333333334; --w: 10.65; --h: 3; --r: 0; --s: 1; --bc: #e2a7d8; --boc: #919191; --bos: 0.06;" data-uid="onvljkoyxf" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--ts: 2; --x: 4.194166666666668; --y: 2.066666666666667; --w: 13.1; --h: 2.9; --r: 0; --s: 0.8;" data-uid="fikybnaoxq" data-type="wordart"><div class="wordart" data-genre="nine"><p data-content="Mae The Shork">Mae The Shork</p></div></div><div class="element" style="--x: 5.4; --y: 4.946666666666666; --w: 10.65; --h: 3.05; --r: 0; --s: 1; --bc: #df9fca; --boc: #919191; --bos: 0.06;" data-uid="crqkqhiufc" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--y: 0; --x: -11.2;" data-uid="oigyrrjmpk" data-type="paint"><svg style="--ns: 0;"><g></g></svg></div><div class="element" style="--ts: 1.2; --f: VT323; --co: #050101; --x: 8.173333333333334; --y: 5.373333333333333; --w: 7.52; --h: 2.066666666666667; --r: 0; --s: 1.05; --bc: rgba(0,0,0,0); --ta: left;" data-uid="zlukvtoetb" data-type="text"><div class="el_content"><p>Howdy, I'm Mae / Autumnvoir. I like to keep a chill demeanor. I'm a video editor and content creator focusing on Roblox content.</p></div></div><div class="element" style="--y: 0; --x: -11.2; --r: 0; --s: 1;" data-uid="wilxcpkdgh" data-type="paint"><svg style="--ns: 0;"><g></g></svg></div><div class="element" style="--x: 0.0133333; --y: 7.955782877604167; --w: 8.7; --h: 9.227815208318049; --r: 360; --s: 0.9977900149864655; --bc: #d581a4; --boc: #919191; --bos: 0.06;" data-lock="true" data-uid="fyewkgdfzu" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--ts: 1.3; --f: VT323; --co: #050101; --x: 0.58875; --y: 8.133333333333333; --w: 6.724226802671309; --h: 1; --r: 360; --s: 1.0418254147556607; --px: 0.5; --ta: left;" data-uid="uvchfwcypd" data-type="text"><div class="el_content"><p><u>Who Is "Mae" As A Character?</u></p></div></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 0.8158333333333333; --y: 8.953333333333333; --w: 6.93163135840268; --h: 4.583494990854902; --r: 360; --s: 1.05; --bc: rgba(0,0,0,0); --ta: left;" data-uid="jfnachlqga" data-type="text"><div class="el_content"><p>Mae is a male 6'1 Tiger shark with wolf like fur. He has light blue eyes, and black hair going down the back of his head and just above his eyes. His fur/skin is two-tones of grey. His back fin sits uncomfortably in most clothing, so he cuts a hole in the back of all of his clothes to fit it.</p></div></div><div class="element" data-image="contain" style="--x: 7.5; --y: 9.231666666666667; --w: 1; --h: 1; --r: 6; --s: 1.0213392514398592;" data-uid="gnrlpbxhzd" data-type="image"><img src="https://files.strawcdn.com/straw/KKWxswksgayHFFulIoYl.png" draggable="false" loading="lazy"></div><div class="element" style="--x: 8.69333; --y: 7.97333; --w: 7.35; --h: 9.15; --r: 0; --s: 1; --bc: #e0a3cc; --boc: #919191; --bos: 0.06;" data-lock="true" data-uid="thasbsnjzw" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--ts: 1.3; --f: VT323; --co: #050101; --x: 8.746666666666666; --y: 7.826666666666667; --w: 6.92; --h: 1; --r: 0; --s: 0.9; --px: 0.5; --ta: right;" data-uid="gknhbjypxn" data-type="text"><div class="el_content"><p><u>Likes & Dislikes</u></p></div></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 9.24; --y: 8.276666666666667; --w: 6.15; --h: 1; --r: 0; --s: 1.05; --bc: rgba(0,0,0,0); --ta: left;" data-uid="vgukisqulj" data-type="text"><div class="el_content"><p><u>Likes</u><span> </span></p><p>Gaming (Roblox, TF2, Minecraft) Editing and Entertaining. Music (YonKaGor, Rare Americans)<u> Dislikes</u></p><p>Negativity, Lack of funny bone, Dishonesty, RTS games, Brain rot...</p></div></div><div class="element" style="--ts: 1.3; --f: VT323; --co: #050101; --x: 8.898333333333333; --y: 13.226666666666667; --w: 7.1; --h: 1; --r: 0; --s: 1; --px: 0.5; --ta: left;" data-uid="uvjorzwwew" data-type="text"><div class="el_content"><p><u>DNI List</u></p></div></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 9.28; --y: 14.159583333333334; --w: 6.84; --h: 2.640416666666667; --r: 0; --s: 1.1; --bc: rgba(0,0,0,0); --ta: left;" data-uid="qtlinzvwre" data-type="text"><div class="el_content"><p>• Pedos</p><p>• Zoos</p><p>• Negative Nancys</p></div></div><div class="element" style="--x: 0; --y: 17.08; --w: 16; --h: 6; --r: 360; --s: 0.9932162392470645; --bc: #df9fbe; --boc: #919191; --bos: 0.06;" data-lock="true" data-uid="uckuiygslx" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><a href="https://youtube.com/@autumnvoir?si=6voUJD2oMg-HlcfE" target="_blank"><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 2; --y: 18; --w: 3.4; --h: 1; --r: 0; --s: 1; --bc: #e4e4e4; --boc: #919191; --bos: 0.06;" data-uid="xyxuvzhgzm" data-link="https://youtube.com/@autumnvoir?si=6voUJD2oMg-HlcfE" data-type="text"><div class="el_content"><p>Youtube</p></div></div></a><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 10.6667; --y: 17.9733; --w: 3.4; --h: 1; --r: 0; --s: 1; --bc: #e4e4e4; --boc: #919191; --bos: 0.06;" data-uid="nbeyhacske" data-type="text"><div class="el_content"><p>Discord @Autumnnvoir</p></div></div><a href="https://www.roblox.com/users/239124786/profile" target="_blank"><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 10.413333333333334; --y: 20.76; --w: 3.4; --h: 1; --r: 0; --s: 1; --bc: #e4e4e4; --boc: #919191; --bos: 0.06;" data-uid="cttfqjxgkn" data-link="https://www.roblox.com/users/239124786/profile" data-type="text"><div class="el_content"><p>Roblox</p></div></div></a><a href="https://steamcommunity.com/id/WBRT/" target="_blank"><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 2.8266666666666667; --y: 21.093333333333334; --w: 3.4; --h: 1; --r: 0; --s: 1; --bc: #e4e4e4; --boc: #919191; --bos: 0.06;" data-uid="ogaimeddph" data-link="https://steamcommunity.com/id/WBRT/" data-type="text"><div class="el_content"><p>Steam</p></div></div></a><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: -0.018333333333333333; --y: 23.063333333333333; --w: 16; --h: 1.25; --r: 0; --s: 1; --bc: #ffffff; --boc: #919191; --bos: 0.07;" data-fun-markoui="normal" data-fun-text="↓ Optional if you're cool! ↓" data-uid="fviarxofia" data-type="text"><div class="el_content"><p>↓ Optional if you're cool! ↓</p></div></div><div class="element" data-image="contain" style="--x: 6.693333333333333; --y: 18.466666666666665; --w: 3; --h: 3; --r: 0; --s: 1;" data-uid="tevcuxknob" data-type="image"><img src="https://files.strawcdn.com/straw/tciSFVpZVetHPXpowpPg.gif" draggable="false" loading="lazy"></div><div class="element" style="--x: 0.0133333; --y: 24.3067; --w: 16; --h: 13.35; --r: 0; --s: 1; --bc: #de9cc8; --boc: #919191; --bos: 0.06;" data-lock="true" data-uid="dhjjcaipeh" data-type="shape"><div class="innerShape"><svg width="1200pt" height="1200pt" version="1.1" viewBox="109.19999694824219,121.19999694824219,970.7999877929688,970.7999877929688" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" style="--ns: 0;"><path xmlns="http://www.w3.org/2000/svg" d="m109.2 121.2h970.8v970.8h-970.8z"></path></svg></div></div><div class="element" style="--x: 4.1866666666666665; --y: 26.026666666666667; --w: 7.7; --h: 6.3; --r: 0; --s: 1; --co: #2866eb;" data-uid="abbxhalcva" data-type="gimmick-canvas"><div class="innerCanvas"><div class="toolbox"><i class="fas fa-undo"></i><div class="canvSizing"><input type="range" min="2" max="12" step="2" value="4"></div><span class="canvCol"></span><input type="color" id="colpick"><label for="colpick" style="visibility: hidden; position:absolute"></label></div><div class="picasso"><canvas width="284" height="191"></canvas><div class="completionCasso"><button type="button">get your own drawings!</button></div></div><div class="sendPicasso"><button type="button">Send anonymously 🎨🤫</button></div></div></div><div class="element" style="--x: 3.3333333333333335; --y: 33.57333333333333; --w: 9.3; --h: 3; --r: 0; --s: 1; --co: #2866eb;" data-uid="bbkbxefalp" data-type="gimmick-ama"><div class="innerUhh"><div class="asker"><input type="text" placeholder="Ask me something!" maxlength="288"><div class="askExtra"><i class="fab fa-spotify"></i></div></div><div class="askerSend"><button type="button">Send anonymously ✍️🤫</button></div></div></div><div class="element" data-image="contain" style="--x: 12.563090737508794; --y: 26.930252697481745; --w: 2; --h: 2; --r: 0; --s: 1;" data-uid="kxwrykmrmw" data-type="image"><img src="https://media.tenor.com/wzI0zr-ofLkAAAAi/shark-shark-emote.gif" draggable="false" loading="lazy"></div><div class="element" data-image="contain" style="--x: 0.84; --y: 25.426666666666666; --w: 2; --h: 2; --r: 0; --s: 1;" data-uid="mvxoelfezf" data-type="image"><img src="https://media.tenor.com/6vSSWGKPQzMAAAAi/shark-3d.gif" draggable="false" loading="lazy"></div><div class="element" data-image="contain" style="--x: 1.52; --y: 30.746666666666666; --w: 2; --h: 2; --r: 0; --s: 1;" data-uid="ygtrqahnbx" data-type="image"><img src="https://media.tenor.com/NG0AinDFug8AAAAi/blahaj-blahaj-pet.gif" draggable="false" loading="lazy"></div><div class="element" data-image="contain" style="--x: 13.304083210640117; --y: 32.06403860893945; --w: 2; --h: 2; --r: 0; --s: 1;" data-uid="fdrunaitid" data-type="image"><img src="https://media.tenor.com/W4fin3TpJKcAAAAi/blahaj-spin.gif" draggable="false" loading="lazy"></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 4.36; --y: 0.9866666666666667; --w: 3.2; --h: 1; --r: 0; --s: 1; --px: 0.5; --ta: center;" data-uid="ltcxvxgbho" data-type="text"><div class="el_content"><p>˚₊· ͟͟͞➳˚ ༘♡ ⋆。<br></p></div></div><div class="element" style="--ts: 1.1; --f: VT323; --co: #050101; --x: 0.7504166666666666; --y: 16.225; --w: 7.808749657346492; --h: 0.6412184495192308; --r: 360; --s: 1.1; --bc: rgba(0,0,0,0); --ta: left;" data-uid="jfnachlqga" data-type="text"><div class="el_content"><p>Currently not looking for a partner <3</p></div></div><div class="element" data-image="contain" style="--x: 0.9834804823890304; --y: 38.11071523542693; --w: 14; --h: 9; --r: 360; --s: 1.136674057101984; --bos: 0.06; --boc: #919191;" data-uid="amygsxevyz" data-type="image"><img src="https://files.strawcdn.com/straw/BQpjDvpGaxAqWrWKBMzw.jpg" draggable="false" loading="lazy"></div><div class="element" style="--ts: 1.5; --f: VT323; --co: #050101; --x: 4.306666666666667; --y: 38.93333333333333; --w: 6; --h: 1; --r: 0; --s: 0.75;" data-uid="gflokturrv" data-type="text"><div class="el_content"><p>(believe it or not, this is indeed a guy.)</p></div></div></div><div class="spotSearch"><i class="fas fa-times closer"></i><div class="innerSpotSearch"><div class="searchWrap"><i class="fas fa-search"></i><input type="text" placeholder="Search for a song to recommend!"></div><div class="spotResults"></div></div></div></div><a href="https://straw.page?ref=logo"><div class="branding"><img src="https://straw.page/mid-logo.png"><div class="brandingContent" style="display: none;"><p>Make your own StrawPage!</p></div></div></a><script>const debounce = (func, wait) => { let timeout; return function executedFunction(...args) { const later = () => { clearTimeout(timeout); func(...args); }; clearTimeout(timeout); timeout = setTimeout(later, wait); }; }; function formatPaint(){ var maxWindow = parseFloat($(".first").css("--mw")); var currentWindow = $(window).width(); if(currentWindow < maxWindow){ var paintRatio = currentWindow/maxWindow; $(".first svg,#drawing svg").each(function(){ var getOldS = parseFloat(1 - paintRatio); $(this).css("--ns",getOldS); }); } else { $(".first svg,#drawing svg").css("--ns",0); } } function makeGrid(){ var getSize = parseFloat($(".content").outerWidth())/16/16; $(".first").css("--g",getSize); gridSize = parseFloat($(".grid").css("--g"))*16; gridDown = false; gridSelected = false; formatPaint(); } makeGrid(); $(window).on("resize",function(){ makeGrid(); }); $('.spotSearch input').keyup(debounce(function(){ var getVal = $('.spotSearch input').val(); $.ajax({ url:"https://straw.page/power/spotify/search", method:"GET", data: {q: getVal}, success:function(data) { $(".spotResults").empty(); for(var i=0;i<data.length;i++){ $(".spotResults").append(`<div class="spotItem"><img src="${data[i].album_image_url}"><div class="spotMeta" data-sound="${data[i].preview}"><h5>${data[i].name}</h5><p><i class="fab fa-spotify"></i>${data[i].artist_list}</p></div></div>`); } } }); },500)); function calculateEditorHeight(){ var getScroll = $(document).scrollTop(); $(".content").css("height",""); var getHeight = $(".content")[0].scrollHeight; var getWindowHeight = $(window).outerHeight(); /*$(".content").css("min-height",getHeight+((getWindowHeight/100)*75));*/ $(".content").css("height",getHeight+80); $(document).scrollTop(getScroll); } calculateEditorHeight(); $(window).on('load',function(){ calculateEditorHeight(); if (typeof umami !== 'undefined') { ok = umami; if (typeof ok.track == "undefined") { ok.track = function () { } } } }); $(document).on("mousemove touchmove",function(e){ var currentY = e.originalEvent.touches ? e.originalEvent.touches[0].pageY : e.pageY; var currentX = e.originalEvent.touches ? e.originalEvent.touches[0].pageX : e.pageX; $(".eyeball span").each(function(){ var standardR = parseFloat($(this).closest(".element").css("--r")); var eye = $(this); var eyeX = (eye.offset().left) + (eye.width() / 2); var eyeY = (eye.offset().top) + (eye.height() / 2); rad = Math.atan2(currentX - eyeX, currentY - eyeY); rot = (rad * (180 / Math.PI) * -1) + 180; rot-=standardR; eye.css({ '-webkit-transform': 'rotate(' + rot + 'deg)', '-moz-transform': 'rotate(' + rot + 'deg)', '-ms-transform': 'rotate(' + rot + 'deg)', 'transform': 'rotate(' + rot + 'deg)' }); }); }); if($(window).width() < 5){ $(".branding").mouseover(function(){$(".brandingContent").show(150)}).mouseleave(function(){$(".brandingContent").hide(150)}); } var findr = ['Instagram','Snapchat','FB']; function containsCheck(target, pattern){ var value = 0; pattern.forEach(function(word){ value = value + target.includes(word); }); return (value === 1) } if(containsCheck(navigator.userAgent, findr)){ $(".first").addClass("inst"); }</script><script src="https://cdnjs.cloudflare.com/ajax/libs/pako/2.0.4/pako.min.js"></script><script src="https://straw.page/min/?g=drawm&n=88"></script><script>$(document).on("click",".element[data-type=gimmick-ama] button",function(){ var parentCanv = $(this).closest(".element"); var question = $(parentCanv).find("input").val(); var prompt = $(parentCanv).find(".asker input").attr("placeholder"); var music = {}; if(question.length < 1){ return; } if($(parentCanv).find(".askExtra img").length > 0){ music.album = $(parentCanv).find(".askExtra img").attr("src"); music.song = $(parentCanv).data("song"); music.artist = $(parentCanv).data("artist"); music.sound = $(parentCanv).data("sound"); } $(parentCanv).addClass("doneArt"); $.ajax({ type: "POST", url: "/gimmicks/ama", data: { q: question, p: prompt, m: music }, success: function(response) { try { ok.track("sent ama!"); } catch(e){ } $(parentCanv).find(".askerSend button").text("Sent! 😎"); } }); });</script><script>var audioElements = {}; var spotEls = {}; $(document).on("click",".element[data-sound]",function(){ if($(this).data("type") == "spotify"){ $(this).toggleClass("playing"); if($(this).hasClass("playing")){ $(this).find(".imgWrap i").attr("class","fas fa-pause"); } else { $(this).find(".imgWrap i").attr("class","fas fa-play"); } } var soundID = $(this).data("sound"); if (!audioElements[soundID]) { audioElements[soundID] = new Audio(soundID); } var audio = audioElements[soundID]; if (audio.paused) { audio.play(); } else { audio.pause(); } }); let userAgent = navigator.userAgent; if(userAgent.match(/firefox|fxios/i)) { $("body").addClass("ff"); } if($(".element[data-type=blog").length > 0){ $.ajax({ type: "GET", url: "blog/fetch/posts", success: function(data) { if(data.length > 0){ for (item of data) { switch(item['type']){ case "post": $(".element[data-type=blog] .innerBlog").append(`<div class="post"><a href="${item.url}"><div class="innerPost">${item.content}<div class="meta"><p>~ ${item.published}</p></div></div></a></div>`); break; } } } } }); } function isTouchDevice() { return (('ontouchstart' in window) || (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)); } function startMajorityVoteTalk(closestEl = null) { var targetElements = closestEl ? $(closestEl).find(".activeTalk") : $(".activeTalk"); targetElements.each(function() { var talkCtx = this; var getText = $(this).data("talk").trim(); $(this).text(""); $(this).closest(".element").addClass("disableTmp"); for (let i = 0; i < getText.length; i++) { setTimeout(function() { if ($(talkCtx).text().length === i) { $(talkCtx).append(getText[i]); } if (i === getText.length - 1) { $(talkCtx).closest(".element").removeClass("disableTmp"); } }, 20 * i); } }); } $(".element[data-type=majorityvote").each(function(){ $(this).find(".innerTalking p").eq(0).addClass("activeTalk"); startMajorityVoteTalk(); }); if($(".element[data-type=friends").length > 0){ $.ajax({ url:"/get/following", method:"GET", success:function(data) { $(".innerFriendsList").empty(); $(".innerFriendsList").each(function(){ for(var i=0;i<data.sites.length;i++){ $(this).append(`<div class="followingDon" data-site="${data.sites[i].site}"><a href="https://${data.sites[i].site}.straw.page"><div class="innerFollowingDon"><img src="${data.sites[i].pic}" />${data.sites[i].site.length > 7 ? '<div class="marquee" data-fun-text="'+data.sites[i].site+'"></div>' : '<p>'+data.sites[i].site+'</p>'}</div></a></div>`); } }); } }); } $(document).on("click",".innerTalking",function(){ var ctxTalk = $(this).find(".activeTalk"); var ctxScene = $(this).closest(".scene"); var closestEl = $(this).closest(".element"); if($(ctxTalk).next("p").length > 0){ $(ctxTalk).empty(); $(ctxTalk).removeClass("activeTalk"); $(ctxTalk).next("p").addClass("activeTalk"); startMajorityVoteTalk(closestEl); } else { if($(ctxScene).next(".scene").length>0){ $(ctxScene).next(".scene").addClass("active"); $(ctxScene).find(".activeTalk").removeClass("activeTalk"); $(ctxScene).removeClass("active"); $(ctxScene).next(".scene").find(".innerTalking p").eq(0).addClass("activeTalk"); startMajorityVoteTalk(closestEl); } else { $(".activeTalk").removeClass("activeTalk"); $(this).closest(".element").find(".active").removeClass("active"); $(this).closest(".element").find(".scene").eq(0).addClass("active"); $(this).closest(".element").find(".scene.active .innerTalking p").eq(0).addClass("activeTalk"); startMajorityVoteTalk(closestEl); } } }); var amaCtx; $(document).on("click",".spotItem",function(){ $(amaCtx).find("img").remove(); $(amaCtx).find(".askExtra").append(`<img src="${$(this).find("img").attr("src")}">`); $(amaCtx).data("song",$(this).find("h5").text()); $(amaCtx).data("artist",$(this).find("p").text()); $(amaCtx).data("sound",$(this).find(".spotMeta").attr("data-sound")); $(".spotSearch").removeClass("bringUp"); }); $(document).on("click",".askExtra",function(){ amaCtx = $(this).closest(".element"); $(".spotSearch").addClass("bringUp"); }); $(document).on("click",".spotSearch .closer",function(){ $(".spotSearch").removeClass("bringUp"); }); $(document).on("click",".element[data-scrollto]",function(e){ e.stopImmediatePropagation(); var getScrollID = $(this).data("scrollto").trim(); $('html, body').animate({ scrollTop: $(`.element[data-uid=${getScrollID}]`).offset().top }, 400); }); function convertRemToPixels(rem) { return rem * parseFloat(getComputedStyle($(".content")[0]).fontSize); } function calculateH(desiredHeight) { const remInPixels = convertRemToPixels(1); const multiplier = 2.34375; const baseHeight = remInPixels * multiplier; const h = desiredHeight / baseHeight; return h; } $(window).on("load",function(){ $(".element[data-type=blogcontent]").each(function(){ var getBound = $(this)[0].getBoundingClientRect(); var oldH = parseFloat($(this).css("--h")); var oldY = parseFloat($(this).css("--y")); var diffH = calculateH(getBound.height) - oldH; $(".element").not(this).each(function(){ var ctxBound = $(this)[0].getBoundingClientRect(); if (ctxBound.left < getBound.right && ctxBound.right > getBound.left) { var ctxY = parseFloat($(this).css("--y")); if(ctxY >= oldY+oldH){ $(this).css("--y",ctxY+diffH); } } }); }); calculateEditorHeight(); }); $(document).on("click","a",function(){ if($(this).find(".element[data-type=button2]").length > 0){ var getLinkText = $(this).text().trim(); ok.track("clicked: " + getLinkText); } }); function findExtraInfo(uid){ for(var i=0; i<extraInfo.length;i++){ if(extraInfo[i].uid == uid){ return extraInfo[i]; } } return false; } var extraInfo = []; $(document).on("click",".memeControls i.fa-plus",function(){ $(this).closest(".element").find(".memeGallery").fadeIn(100); }); $('.memeGallery input').keyup(function() { var self = this; debounce(function(){ var getVal = $(self).val(); $.ajax({ url: "/search/stickers", method: "POST", data: { query: getVal }, success: function(data) { $(self).closest(".element").find(".memeGallResults").empty(); for(var i=0;i<data.gifs.length;i++){ $(self).closest(".element").find(".memeGallResults").append(`<img src="${data.gifs[i]}">`); } } }); }, 300)(); }); $(document).on("click",".memeControls i.fa-plus,.memeInp i",function(){ $(this).closest(".element").find(".memeGallery").toggleClass("showMemeGallery"); }); $('.element[data-type=memegen]').each(function() { const $element = $(this); const $container = $element.find('.officialMemeContainer'); const uniqueID = 'container-' + Math.random().toString(36).substr(2, 9); $container.attr('id', uniqueID); const stage = new Konva.Stage({ container: uniqueID, width: $container.outerWidth(), height: $container.outerHeight() }); const layer = new Konva.Layer(); stage.add(layer); const bgImageSrc = $(this).data("img");; const bgImage = new Image(); bgImage.crossOrigin = "anonymous"; bgImage.src = bgImageSrc; let backgroundImage; bgImage.onload = function() { const canvasWidth = stage.width(); const canvasHeight = stage.height(); const imgWidth = bgImage.width; const imgHeight = bgImage.height; const scale = Math.max(canvasWidth / imgWidth, canvasHeight / imgHeight); const scaledWidth = imgWidth * scale; const scaledHeight = imgHeight * scale; const x = (canvasWidth - scaledWidth) / 2; const y = (canvasHeight - scaledHeight) / 2; backgroundImage = new Konva.Image({ image: bgImage, x: x, y: y, width: scaledWidth, height: scaledHeight, listening: false, }); layer.add(backgroundImage); layer.moveToBottom(); layer.draw(); }; $element.on('click', '.memeGallResults img', function() { const img = new Image(); img.crossOrigin = "anonymous"; img.src = $(this).attr('src'); $(this).closest(".memeGallery").removeClass("showMemeGallery"); img.onload = function() { const maxSize = 100; let scaleFactor = 1; if (img.width > img.height) { scaleFactor = maxSize / img.width; } else { scaleFactor = maxSize / img.height; } const scaledWidth = img.width * scaleFactor; const scaledHeight = img.height * scaleFactor; const sticker = new Konva.Image({ image: img, x: (stage.width() - scaledWidth) / 2, y: (stage.height() - scaledHeight) / 2, width: scaledWidth, height: scaledHeight, draggable: true, }); layer.add(sticker); layer.draw(); const tr = new Konva.Transformer({ nodes: [sticker], rotateEnabled: true, enabledAnchors: [ 'top-left', 'top-right', 'bottom-left', 'bottom-right', 'middle-left', 'middle-right', 'top-center', 'bottom-center', ], flipEnabled: true, stroke: 'black', strokeWidth: 2, anchorStroke: 'black', anchorFill: 'black', anchorSize: 6, borderStroke: 'black', borderStrokeWidth: 1, }); layer.add(tr); layer.draw(); const $stickerButtons = $element.find('.stickerButtons'); sticker.on('click', function() { tr.nodes([sticker]); layer.draw(); $stickerButtons.addClass("showMemeGallery"); }); stage.on('click', function(e) { if (e.target === stage) { tr.nodes([]); layer.draw(); $stickerButtons.removeClass("showMemeGallery"); } }); $stickerButtons.find('.fa-trash').on('click', function() { sticker.destroy(); tr.destroy(); layer.draw(); $stickerButtons.removeClass("showMemeGallery"); }); $stickerButtons.addClass("showMemeGallery"); } }); $element.find('.downloadMeme').on('click', function() { const transformers = stage.find('Transformer'); transformers.forEach(tr => tr.hide()); layer.draw(); const dataURL = stage.toDataURL({ pixelRatio: 3 }); transformers.forEach(tr => tr.show()); layer.draw(); const link = document.createElement('a'); link.href = dataURL; link.download = 'meme.png'; document.body.appendChild(link); link.click(); document.body.removeChild(link); }); $element.find('.resetMeme').on('click', function() { layer.destroyChildren(); layer.add(backgroundImage); layer.draw(); }); $element.find('.changeBackground').on('click', function() { const input = document.createElement('input'); input.type = 'file'; input.accept = 'image/*'; input.onchange = function(event) { const file = event.target.files[0]; const reader = new FileReader(); reader.onload = function(e) { const newBgImage = new Image(); newBgImage.src = e.target.result; newBgImage.crossOrigin = "anonymous"; newBgImage.onload = function() { const canvasWidth = stage.width(); const canvasHeight = stage.height(); const imgWidth = newBgImage.width; const imgHeight = newBgImage.height; const scale = Math.max(canvasWidth / imgWidth, canvasHeight / imgHeight); const scaledWidth = imgWidth * scale; const scaledHeight = imgHeight * scale; const x = (canvasWidth - scaledWidth) / 2; const y = (canvasHeight - scaledHeight) / 2; backgroundImage.image(newBgImage); backgroundImage.width(scaledWidth); backgroundImage.height(scaledHeight); backgroundImage.position({ x: x, y: y }); layer.draw(); }; }; reader.readAsDataURL(file); }; input.click(); }); });</script><script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8ea39bf658e42165',t:'MTczMjg5MzkxNS4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script><iframe height="1" width="1" style="position: absolute; top: 0px; left: 0px; border: none; visibility: hidden;"></iframe></body></html>