alex/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated website

Browse Source
This commit is contained in:
Alex Frantz
2022-06-22 20:30:39 -04:00
parent bce362c430
commit f3943205f3
14 changed files with 66 additions and 382 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CNAME
-1
View File
@@ -1 +0,0 @@
thatalex.dev
index.html
+8 -60
View File
@@ -4,70 +4,18 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Alex 👋</title>
<!-- Discord Embeds -->
<meta content="Alex 👋" property="og:title" />
<meta content="Welcome to my website! I'm a Java(script) developer, along with knowing some Python, HTML and CSS!" property="og:description" />
<meta content="https://pause.thatalex.dev" property="og:url" />
<meta content="#000f54" data-react-helmet="true" name="theme-color" />
<link rel="stylesheet" href="https://thatalex.dev/static/css/main.css">
<link rel="stylesheet" href="https://thatalex.dev/static/main.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<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=Fira+Sans:wght@200&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@500&display=swap" rel="stylesheet">
<title>z // alex</title>
</head>
<body>
<div class="welcome"></div>
<div id="querydiv"></div>
<div id="welcome-text">
<h3>👋, I'm Alex!</h3>
<p>I do QA stuff @ <a href="https://medal.tv" target="_blank">Medal.tv</a> & some coding on the side<br>
<a href="/links">Find all my links here!</a></p>
<h3>What am I listening to?</h3>
<div id="spotify">
<img width="80" src="https://thatalex.dev/static/img/services/spotify-logo.png">
<div id="songContent"></div>
</div>
<hr>
<h4>Projects</h4>
<ul>
<li>A <a href="https://github.com/awexthedev/mcimpos" target="_blank">Minecraft Among Us</a> Minigame (insp by <a href="https://innersloth.com/games/among-us" target="_blank">Innersloth's game</a>)</li>
<li>A <a href="https://github.com/awexthedev/sharex-express" target="_blank">ShareX</a> Uploader based in Node.js (<a href="https://github.com/awexthedev/sharex-express" target="_blank">link</a>)</li>
</ul>
<hr>
<h4>Partners</h4>
<p>I am partnered with <a href="https://medal.tv/u/thatoneawex?ref=awex_partner" target="_blank">Medal.tv</a>, a short-form gaming clip sharing service.</p>
<div class="medal" style="background-color:gray; padding-top:20px; padding-bottom:20px; width:50%; margin:0 auto; border-radius:50px;">
<span id="clip"></span>
</div>
<div id="container">
<div id="textDiv"><p>hi, i'm <span id="name">alex</span>!</p></div><span id="box"></span>
<p style="display:block; margin:auto; float:left;">i work part-time at <span style="color:yellow">medal.tv</span> & do backend development in my offtime</p><br>
<a style="display:block; margin:auto; float:left;" href="https://github.com/zevhr" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
</div>
<br>
<div id="footer">
<p><a href="mailto:hi@thatalex.dev">Email</a></p>
<a href="https://twitter.com/thatawex" style="color:white;" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
<a href="https://github.com/awexthedev" style="color:white;" target="_blank"><i class="fa fa-github" aria-hidden="true"></i></a>
<a href="https://instagram.com/thatoneawex" style="color:white;" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i></a>
</div>
<p style="font-size:10px;"><a style="color:#111;" href="https://dashbot.us">a</a></p>
<script src="https://thatalex.dev/static/js/paramSearch.js"></script>
<script src="https://thatalex.dev/static/js/spotifyWidget.js"></script>
<script src="https://thatalex.dev/static/js/medalClip.js"></script>
<script>
if (document.readyState === 'interactive' || document.readyState === 'complete') {
getState();
} else {
document.addEventListener('DOMContentLoaded', getState);
}
</script>
</body>
</html>
links.html
-55
View File
@@ -1,55 +0,0 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Alex > Links</title>
<link rel="stylesheet" href="/static/css/tree.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">
<!-- Meta Tags -->
<meta property="og:site_name" content="Awex" />
<meta content="Links > Alex 👋" property="og:title">
<meta content="https://thatalex.dev/links" property="og:url">
<meta content="#363636" name="theme-color" data-react-helmet="true">
<meta property="og:description" content="See where you can find me around the internet! I'm in a lot of places. Actually, now that I list it, more than I thought i was..">
</head>
<body>
<div class="userName">
Alex
</div>
<div class="description">
quality assurance @ medal.tv
</div>
<div class="links">
<a class="link" href="https://medal.tv/thatoneawex" target="_blank">
<i class="fas fa-medal">&nbsp;</i>Medal.tv
</a>
<a class="link" href="https://last.fm/user/lulawex" target="_blank">
<i class="fab fa-lastfm">&nbsp;</i>Last.fm
</a>
<a class="link" href="https://github.com/awexthedev" target="_blank">
<i class="fab fa-github">&nbsp;</i>Github
</a>
<a class="link" href="discord:///users/288101780074528768" target="_blank">
<i class="fab fa-discord">&nbsp;</i>Discord (opens in Discord)
</a>
<a class="link" href="https://www.instagram.com/thatoneawex/" target="_blank">
<i class="fab fa-instagram">&nbsp;</i>Instagram
</a>
<a class="link" href="https://www.reddit.com/user/lulawex" target="_blank">
<i class="fab fa-reddit">&nbsp;</i>Reddit
</a>
</div>
<div class="source">
This was built on <a href="https://github.com/RyanLefebvre/TREE" target="_blank">Tree</a>, a linktr.ee alternative.
</div>
</body>
</html>
splitstat/docs.html
-12
View File
@@ -1,12 +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">
<title>Redirecting..</title>
</head>
<script>
location.href = "https://github.com/awexthedev/splitstat/wiki/Commands"
</script>
</html>
splitstat/index.html
-12
View File
@@ -1,12 +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">
<title>Redirecting..</title>
</head>
<script>
location.href = "https://top.gg/bot/868689248218411050"
</script>
</html>
splitstat/privacy.html
-37
View File
@@ -1,37 +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="stylesheet" href="https://thatalex.dev/static/css/main.css">
<title>Alex > SplitStat Privacy</title>
</head>
<body>
<h3>SplitStat Privacy Policy</h3>
<p>Updated April 2022<br><a href="mailto:hi@thatalex.dev">hi@thatalex.dev</a></p>
<h3>Intro</h3>
<p>The SplitStat Bot is a Discord bot developed by <a href="https://thatalex.dev" target="_blank">Alex</a>. This bot is not affiliated with <a href="https://tracker.gg" target="_blank">Tracker.gg</a> nor <a href="https://splitgate.com" target="_blank">Splitgate/1047 Games</a>.<br>
Throughout this document, The SplitStat Bot will be referred to by the terms "we, our, us, the Service" or "SplitStat Bot".</p>
<h3>What data is collected?</h3>
<p>Below is a list of data we collect, why we collect it, and what is done with it.<br>
<ul>
<li style="font-size:20px;">IGNs (In-Game Names) - Used to find your player profile via Tracker.gg's API. Only used to make a web request, never stored on the Service's end.</li>
<li style="font-size:20px;">Player Platforms - Used to find your player profile via Tracker.gg's API. Only used to make a web request, never stored on the Service's end.</li>
<li style="font-size:20px;">Discord Display Name (username#1234) - Logged in errors & used to identify misuse of the Service</li>
<li style="font-size:20px;">Discord Guild Name - Logged in errors & used to identify misuse of the Service</li>
</ul>
All data is collected within reason and can be withdrawn anytime by ceasing use of the Service.
</p>
<h3>How is the data used?</h3>
<p>For select items (IGNs, Player Platforms), this is not stored locally and immediately used to request user profiles from Tracker.gg.<br>
For Discord-provided items, like your username and guild, these are logged to the Service in order to prevent misuse of the Service and properly handle issues that may arise.<br>
SplitStat does not disclose this information with any third-party platform unless required by law.</p>
<h3>Can I refuse data collection?</h3>
<p>You are free to refuse our data collection, however understand that the Service may not be able to provide some services.</p>
<h3>Contact Us</h3>
<p>Should any questions arise from this policy, please email the developer via the email listed at the top of this page.<br>
This project is open-source. You can find the repository <a href="https://github.com/awexthedev/splitstat" target="_blank">here.</a></p>
</body>
</html>
static/css/main.css
-49
View File
@@ -1,49 +0,0 @@
body {
font-family: 'Fira Sans', sans-serif;
font-size:30px;
background-color: #111;
color:azure;
text-align:center;
}
a {
color:white;
}
p {
font-size:20px;
}
li {
font-size:25px;
list-style-type:none;
}
hr {
width:20%;
}
#querydiv {
padding-top:40px;
}
.welcome {
width: 100%;
background-image: url('../../static/img/profile.png');
background-repeat: no-repeat;
background-size: cover;
height: 305px;
background-color: purple;
background-position: center;
position:relative;
top:0px;
left:0px;
right:0px;
display:block;
}
#welcome-text {
position:relative;
text-align:center;
}
static/css/tree.css
-117
View File
@@ -1,117 +0,0 @@
html, body {
margin: 0;
height: 100%;
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
top:50%;
}
html{
background-color:black;
background-size:cover;
}
a {
color:white;
}
a:hover {
color:gray;
}
body {
background-size: 400% 400%;
padding-top:35px;
padding-bottom:35px;
height:fit-content;
min-height:100%;
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
:root {
--accentColor: #E6E6E6;
--delay: .3s;
}
.description, .source{
color:white;
text-align:center;
margin: 27px auto;
margin-top:10px;
width:90%;
max-width: 500px;
}
.source{
font-size:small;
margin-top:50px;
}
.profilePicture, .profilePicture img {
position: relative;
width: 130px;
height: 130px;
display: block;
margin: 35px auto 20px;
border-radius: 50%;
}
.userName {
color: var(--accentColor);
font-size: x-large;
font-weight: bold;
line-height: 1.25;
display: block;
width: 100%;
text-align: center;
text-decoration: none;
}
.links {
max-width: 675px;
width: auto;
display: block;
margin: 27px auto;
}
.link {
position: relative;
background-color: transparent;
color: var(--accentColor);
border: solid var(--accentColor) 2px;
border-radius: 10px;
font-size: 1rem;
text-align: center;
display: block;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
padding: 10px;
text-decoration: none;
-webkit-tap-highlight-color: transparent;
}
@media (hover: hover) {
.link:hover {
background-color: var(--accentColor);
color: #000; /* Fallback for older browsers */
color: rgba(0, 0, 0, 0.5);
}
}
.link:active {
background-color: var(--accentColor);
color: #000; /* Fallback for older browsers */
color: rgba(0, 0, 0, 0.5);
}
static/img/profile.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 726 KiB

static/img/services/spotify-logo.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 108 KiB

static/js/medalClip.js
-12
View File
@@ -1,12 +0,0 @@
const clipSpan = document.getElementById("clip");
fetch("https://developers.medal.tv/v1/latest?userId=215577&limit=1", {
method: "GET",
headers: {
"authorization": "pub_ecEyOlY5G2u9476DMGOxcxiNcaOTEjmq",
"Content-Type": "application/json"
}
}).then(async function(response) {
const data = await response.json();
if(screen.width < 1920) { clipSpan.innerHTML = `<h3><a href="${data.contentObjects[0].directClipUrl}" target="_blank">${data.contentObjects[0].contentTitle}</a></h3>` }
else clipSpan.innerHTML = `${data.contentObjects[0].embedIframeCode}<br><hr><h3>${data.contentObjects[0].contentTitle}</h3>`;
});
static/js/paramSearch.js
-10
View File
@@ -1,10 +0,0 @@
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
const div = document.getElementById("querydiv");
console.log(params)
if (params.reason) {
if (params.reason == "old_domain") {
div.innerHTML = '<p style="color:red;">You have been redirected here from an old domain. Please use this domain.</p>';
}
}
static/js/spotifyWidget.js
-17
View File
@@ -1,17 +0,0 @@
async function getState() {
const data = await fetch("https://api.thatalex.dev/v0/web/spotify/player/state", {
method: "GET"
}).then(response => response.json())
.catch(async function(response) {
const d = await response.json();
if (response.status == 401 && d.message == "Access Token was invalid. Token was refreshed & next request should succeed.") {
location.reload();
} else if (response.status != 200 || response.status != 204) {
console.log(`Uh oh, a little fucky wucky owo occurred\n\n${d}`)
document.getElementById("songContent").innerHTML = `<p style="color:red;">Uh oh! There was an error fetching song content.<br>The API may be temporarily down.</p>`
}
});
if(data.playing) document.getElementById("songContent").innerHTML = `<p><strong>${data.data.songData.songName}</strong> by <strong>${data.data.songData.artists[0].name}</strong> at <strong>${data.data.device.volume}%</strong> volume.`
else document.getElementById("songContent").innerHTML = `<p><strong>${data.data.songData.songName}</strong> by <strong>${data.data.songData.artists[0].name}</strong> is <strong>paused</strong>.`
}
static/main.css
+58
View File
@@ -0,0 +1,58 @@
body {
font-family: 'Cairo', sans-serif;
font-size:30px;
background-color:black;
color:white;
}
a {
padding-left:25px;
}
i {
color:white;
}
#container {
/* margin: 0 auto; */
top:50%;
left:50%;
position:absolute;
transform: translate(-50%, -50%)
}
#textDiv {
/* display:inline-block; */
float:left;
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%);
}
@keyframes cursorBlink {
0% {opacity:0%;}
25% {opacity:50%;}
75% {opacity:0%;}
}
@keyframes typingEffect {
from {width:0%;}
to {width:34%;}
}