https://especimensslop.straw.page/

扫描 ID：
8f0fa3bb-5f61-4657-9648-71699d7681a1已完成
提交的 URL：
https://especimensslop.straw.page/
报告完成时间：

链接 · 找到 2 个

从页面中识别出的传出链接

链接文本
https://discord.gg/f9gWFay9XPSpecimen's Slop!
https://straw.page?ref=logoMake your own StrawPage!

JavaScript 变量 · 找到 32 个

在页面窗口对象上加载的全局 JavaScript 变量是在函数外部声明的变量，可以从当前范围内的代码中的任何位置访问

名称类型
0object
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
$function
jQueryfunction
p5function
Konvaobject
formatPaintfunction
makeGridfunction

控制台日志消息 · 找到 0 条

记录到 Web 控制台的消息

HTML

页面的原始 HTML 正文

<!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&amp;n=184" 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="aa116ada-997c-40ac-b26b-f8fc544fc7cd"></script><meta property="twitter:title" content="especimensslop's strawpage"><meta property="twitter:description" content="especimensslop's strawpage"><meta property="og:image" content="https://strawcdn.com/capture/pics/especimensslop.straw.page.jpg?v=7508"><meta name="twitter:title" content="especimensslop'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/especimensslop.straw.page.jpg?v=6265"><meta name="straw:user" content="especimensslop"><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>especimensslop's strawpage</title></head><body style="--g:2.34375; --b:#ffffff;"><div class="first" style="--g: 2.34375;"><div class="content" style="height: 2893px;"><div class="element" data-image="contain" style="--x: -6.066666666666666; --y: -2.7733333333333334; --w: 28.30666666666667; --h: 15.6; --r: 0; --s: 1;" data-uid="csufvfuhra" data-type="image"><img src="https://files.strawcdn.com/straw/ueaHohRaGuDUBTqfwISz.png" draggable="false" loading="lazy"></div><div class="element" style="--ts: 1.5; --x: 0.6066666666666667; --y: 12.093333333333334; --w: 14.96; --h: 9; --r: 0; --s: 1; --f: Finger Paint;" data-uid="ygskkrkwht" data-type="text"><div class="el_content"><p>I'm a dumb 14 year old</p><p>online dating is very mid</p><p>I tend to draw stupid cats</p><p>join my server here:</p></div></div><a href="https://discord.gg/f9gWFay9XP" target="_blank"><div class="element" style="--ts: 1.5; --h: 1.8; --f: Space Mono; --x: 2.661804606119789; --y: 20.24007324218749; --w: 10.85; --r: 0; --s: 1; --co: #080603; --bc: #efd5f1;" data-uid="yjmhzaddhl" data-link="https://discord.gg/f9gWFay9XP" data-type="button2"><button><i class="fab fa-discord"></i><span>Specimen's Slop!</span></button></div></a><div class="element" data-image="contain" style="--x: 0.37022216796875; --y: 24.186666666666667; --w: 15.576444498697917; --h: 10.16; --r: 0; --s: 1;" data-uid="reuwpyjiek" data-type="image"><img src="https://files.strawcdn.com/straw/ZSVvpRxhiJbZCHQuzlXN.png" draggable="false" loading="lazy"></div><div class="element" style="--ts: 1.5; --h: 1.8; --f: Space Mono; --x: 2.236888427734375; --y: 34.17333333333333; --w: 11.7; --r: 0; --s: 1; --bc: #efd5f1;" data-uid="uoyzbtectx" data-type="button2"><button><i class="fab fa-discord"></i><span>some edgy kid's server</span></button></div><div class="element" data-image="contain" style="--x: 2.3466666666666667; --y: 4.293333333333333; --w: 7.92; --h: 7.2; --r: 0; --s: 1;" data-uid="qtxojrrakf" data-type="image"><img src="https://files.strawcdn.com/straw/CvEFXkBpqznnSTJobZXW.png" draggable="false" loading="lazy"></div><div class="element" data-image="contain" style="--x: 1.9924446614583333; --y: 38.80533325195312; --w: 12.906666666666666; --h: 11.213333333333333; --r: 0; --s: 1;" data-fun-spinner="true" data-uid="rnnydmfjii" data-type="image"><img src="https://files.strawcdn.com/straw/iPRLAjkktNLpySlgJDKS.jpg" draggable="false" loading="lazy"></div><div class="element" style="--y: 41.946666666666665; --x: -9.066666666666666;" data-uid="jgetfmkyft" data-type="paint"><svg style="--ns: 0;"><g></g></svg></div><div class="element" style="--x: 1.68; --y: 53.21333333333333; --w: 6.773333333333333; --h: 6.733333333333333; --r: 0; --s: 1; --co: #0f0705;" data-uid="nqkewqfbcy" 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="250" height="207"></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: 1.6666666666666665; --y: 60; --w: 13; --h: 6; --r: 0; --s: 1; --co: #130706;" data-uid="bchehqmeni" data-type="gimmick-ama"><div class="innerUhh"><div class="asker"><input type="text" placeholder="ask me anything (no death threats)" 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" style="--x: 7.173333333333335; --y: 56.36; --w: 8.56; --h: 3.9066666666666667; --r: 0; --s: 1;" data-image="contain" data-uid="mahibhzjog" data-type="image"><img src="https://files.strawcdn.com/straw/BaaaeUigvoeZFLNQVXaZ.gif" draggable="false" loading="lazy"></div><div class="element" style="--x: 1.6933333333333334; --y: 37; --w: 13; --h: 1; --r: 0; --s: 1;" data-uid="zumbzphrsv" 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: 1.6666666666666667; --y: 50.68; --w: 13.186666666666667; --h: 1; --r: 0; --s: 1;" data-uid="jyfehnjghn" 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: 1.7320275878906224; --y: 23.013406575520822; --w: 12.8813330078125; --h: 1; --r: 0; --s: 1;" data-uid="mpcsckknlw" 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: 1.6666666666666667; --y: 63.22666666666667; --w: 13; --h: 1; --r: 0; --s: 1;" data-uid="meuxoyorcu" 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" data-image="contain" style="--x: 0.06666666666666667; --y: 1.7866666666666666; --w: 17.106666666666666; --h: 17.36; --r: 301; --s: 1;" data-uid="pvghpfgfts" data-type="image"><img src="https://files.strawcdn.com/straw/bXECLFBPrTAipSIMvQhI.png" draggable="false" loading="lazy"></div><div class="element" style="--x: 2; --y: 12; --w: 12.64; --h: 1; --r: 0; --s: 1;" data-uid="tldlsznsve" 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" data-image="contain" style="--x: 2.6133333333333333; --y: 66; --w: 12; --h: 9; --r: 0; --s: 1;" data-type="image"><img src="https://files.strawcdn.com/straw/AgGqpSjYoYdNIWjLmXiO.png" draggable="false" loading="lazy"></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&amp;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:'8e8456f459616689',t:'MTczMjU2NjAyOS4wMDAwMDA='};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>