shoot
This commit is contained in:
-96
@@ -1,96 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap" rel="stylesheet">
|
||||
|
||||
<meta name="og:url" content="https://thatalex.dev" />
|
||||
<meta name="og:description" content="welcome to my portfolio website! well.. kinda. it's being rewritten, so it's a little bland here right now.." />
|
||||
<link rel="alternate" type="application/json+oembed" href="/static/oembed.json">
|
||||
|
||||
<title>alex</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<span class="header animation">
|
||||
<h1>hey hey! little bland 'round here, eh?</h1>
|
||||
</span>
|
||||
<span class="content animation">
|
||||
<p>yeah, i know. i'm scared too.
|
||||
<br />
|
||||
well, i'm reworking this website, so it'll be pretty when i'm done at least?
|
||||
</p>
|
||||
</span>
|
||||
<span class="content2 animation">
|
||||
<p>uhhh, you're still here? well.. i don't know what you're doing here.</p>
|
||||
</span>
|
||||
<span class="content3 animation">
|
||||
<p>okay seriously. what? can you like, leave?</p>
|
||||
</span>
|
||||
<span class="content4 animation">
|
||||
<p>I ASKED CAN YOU LEAVE??????</p>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<script src="static/js/haha.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
body {
|
||||
font-family: 'IBM Plex Sans', sans-serif;
|
||||
background-color:black;
|
||||
text-align:center;
|
||||
transform:translateY(30vh);
|
||||
}
|
||||
|
||||
p {
|
||||
font-size:25px;
|
||||
}
|
||||
|
||||
#container {
|
||||
color:white;
|
||||
}
|
||||
|
||||
.animation {
|
||||
animation-name: fade1;
|
||||
animation-fill-mode:forwards;
|
||||
opacity:0;
|
||||
animation-duration:3s;
|
||||
}
|
||||
|
||||
.header {
|
||||
animation-name: fade1;
|
||||
}
|
||||
|
||||
.content {
|
||||
animation-name: fade1;
|
||||
animation-delay:5s;
|
||||
}
|
||||
|
||||
.content2 {
|
||||
animation-name: fade1;
|
||||
animation-delay:60s;
|
||||
}
|
||||
|
||||
.content3 {
|
||||
animation-name: fade1;
|
||||
animation-delay:120s;
|
||||
}
|
||||
|
||||
.content4 {
|
||||
animation-name: fade1;
|
||||
animation-duration:3s;
|
||||
animation-delay:180s;
|
||||
}
|
||||
|
||||
@keyframes fade1 {
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
</style>
|
||||
@@ -1,52 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap" rel="stylesheet">
|
||||
<title>Spotify Widget</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="container">
|
||||
<div style="text-align:center;" class="image">
|
||||
<img width="150" id="cover-img">
|
||||
</div>
|
||||
|
||||
<div style="text-align:center;" id="content">
|
||||
<p id="cover-text"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.socket.io/4.5.0/socket.io.min.js" integrity="sha384-7EyYLQZgWBi67fBtVxw60/OWl1kjsfrPFcaU0pp0nAh+i8FD068QogUvg85Ewy1k" crossorigin="anonymous"></script>
|
||||
<script src="static/js/spotify_widget.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script>
|
||||
const string = window.location.search;
|
||||
const params = new URLSearchParams(string);
|
||||
|
||||
if (params.has('dark') && params.get('dark') == "true") {
|
||||
console.log('[ws-iframe] received dark mode override');
|
||||
document.body.style.backgroundColor = "black";
|
||||
document.getElementById("content").style.color = "white";
|
||||
} else if (params.has('light') && params.get("light") == "true") {
|
||||
console.log('[ws-iframe] received light mode override');
|
||||
document.body.style.backgroundColor = "white";
|
||||
document.getElementById("content").style.color = "black";
|
||||
} else {
|
||||
console.log('[ws-iframe] no override, defaulting to dark');
|
||||
document.body.style.backgroundColor = "black";
|
||||
document.getElementById("content").style.color = 'white';
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Quicksand', sans-serif;
|
||||
background-color:black;
|
||||
}
|
||||
</style>
|
||||
@@ -1,3 +0,0 @@
|
||||
setTimeout(() => {
|
||||
location.href="https://youareanidiot.cc"
|
||||
}, 365000)
|
||||
@@ -1,28 +0,0 @@
|
||||
const socket = io("https://api.zephmakes.tech")
|
||||
|
||||
// divs used
|
||||
var div = document.getElementById("container");
|
||||
var image = div.querySelector("#cover-img");
|
||||
var text = div.querySelector("#cover-text");
|
||||
var content = div.querySelector(".cover-text");
|
||||
|
||||
console.log("[ws-iframe] asked server to initiate connection..")
|
||||
socket.emit("spotify_status", "listen");
|
||||
socket.on("api_update", (song_data) => {
|
||||
if (!song_data.position) {
|
||||
image.src = "https://thatalex.dev/static/bad.png"
|
||||
text.innerHTML = "Uh oh!<br>There isn't an active song.<br><span style='font-size:10px;'><i>Try again later.</i></span>"
|
||||
} else {
|
||||
image.src = song_data.cover
|
||||
text.innerHTML = `${song_data.title} - ${song_data.album}<br>${song_data.artist}<br>${song_data.position}/${song_data.duration}`;
|
||||
}
|
||||
});
|
||||
|
||||
// on connect + error events
|
||||
socket.on("connect", () => {
|
||||
console.log('[ws-iframe] hello dear friend! connected successfully to backend, formatting page')
|
||||
})
|
||||
|
||||
socket.on("error", (e) => {
|
||||
console.log(e)
|
||||
})
|
||||
@@ -1,90 +0,0 @@
|
||||
body {
|
||||
font-family: 'Cairo', sans-serif;
|
||||
font-size:30px;
|
||||
background-color:black;
|
||||
color:white;
|
||||
}
|
||||
|
||||
a {
|
||||
padding-left:25px;
|
||||
}
|
||||
|
||||
i {
|
||||
color:white;
|
||||
}
|
||||
|
||||
input {
|
||||
background-color:gray;
|
||||
border-radius:15px;
|
||||
color:rgb(226, 226, 226);
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
color:white;
|
||||
padding-left:5px;
|
||||
}
|
||||
|
||||
#container {
|
||||
/* margin: 0 auto; */
|
||||
top:50%;
|
||||
left:50%;
|
||||
position:absolute;
|
||||
transform: translate(-50%, -50%)
|
||||
}
|
||||
|
||||
#textDiv {
|
||||
display:inline-block;
|
||||
animation: typingEffect 2s forwards;
|
||||
width:0%;
|
||||
border-width:1px;
|
||||
overflow:hidden;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
#box {
|
||||
background-color:gray;
|
||||
width:15px;
|
||||
opacity:0%;
|
||||
height:35px;
|
||||
border: 1px solid gray;
|
||||
animation-name: cursorBlink;
|
||||
animation-duration:0.5s;
|
||||
animation-iteration-count: infinite;
|
||||
margin: -25;
|
||||
z-index:1;
|
||||
position:absolute;
|
||||
transform: translate(-65%, 100%);
|
||||
}
|
||||
|
||||
#extraInfo {
|
||||
opacity:0;
|
||||
overflow:hidden;
|
||||
animation:fadeIn 1s forwards;
|
||||
animation-delay:2s;
|
||||
}
|
||||
|
||||
#contact {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.contactFade {
|
||||
display:block;
|
||||
animation: fadeIn 1s forwards;
|
||||
animation-play-state:paused;
|
||||
}
|
||||
|
||||
@keyframes cursorBlink {
|
||||
0% {opacity:0%;}
|
||||
25% {opacity:50%;}
|
||||
75% {opacity:0%;}
|
||||
}
|
||||
|
||||
@keyframes typingEffect {
|
||||
from {width:0%;}
|
||||
to {width:22%;}
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {opacity:0;}
|
||||
to {opacity:1;}
|
||||
}
|
||||
@@ -1,7 +0,0 @@
|
||||
{
|
||||
"version": "1.0",
|
||||
"type": "link",
|
||||
"title": "thatalex.dev",
|
||||
"author_name": "Alex",
|
||||
"author_url": "https://twitter.com/zstreamss"
|
||||
}
|
||||
Reference in New Issue
Block a user