mirror of
https://github.com/asimonson1125/asimonson1125.github.io.git
synced 2026-02-25 05:09:49 -06:00
Rebuild homepage with Flask
This commit is contained in:
27
src/static/js/checkbox.js
Normal file
27
src/static/js/checkbox.js
Normal file
@@ -0,0 +1,27 @@
|
||||
function toggle(dir) {
|
||||
let toggles = document.querySelectorAll(
|
||||
".checkbox-wrapper input[type=checkbox]"
|
||||
);
|
||||
let allow = [];
|
||||
toggles.forEach(function (x) {
|
||||
if (x.checked) {
|
||||
allow.push(x.id);
|
||||
}
|
||||
});
|
||||
let list = document.querySelectorAll(".checkbox-client > div");
|
||||
if (allow.length === 0) {
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
list[i].classList.remove("hidden" + dir);
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < list.length; i++) {
|
||||
list[i].classList.remove("hidden" + dir);
|
||||
for (let x = 0; x < allow.length; x++) {
|
||||
if (!list[i].classList.contains(allow[x])) {
|
||||
list[i].classList.add("hidden" + dir);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
40
src/static/js/chessbed.js
Normal file
40
src/static/js/chessbed.js
Normal file
@@ -0,0 +1,40 @@
|
||||
async function addChessEmbed(username) {
|
||||
let user, stats;
|
||||
try {
|
||||
user = await fetch(`https://api.chess.com/pub/player/${username}`);
|
||||
stats = await fetch(`https://api.chess.com/pub/player/${username}/stats`);
|
||||
} catch (e) {
|
||||
setChess({cName:"Chess.com request failed"});
|
||||
return;
|
||||
}
|
||||
if (user.status === 200) {
|
||||
user = await user.json();
|
||||
stats = await stats.json();
|
||||
ratings = {
|
||||
rapid: stats.chess_rapid.last.rating,
|
||||
blitz: stats.chess_blitz.last.rating,
|
||||
bullet: stats.chess_bullet.last.rating,
|
||||
tactics: stats.tactics.highest.rating,
|
||||
}
|
||||
setChess({cName:user["username"],pic:user.avatar,ratings:ratings});
|
||||
} else if (user === null || user.status === 403 || user.status === null) {
|
||||
chessSet({cName:"Chess.com request failed"});
|
||||
} else {
|
||||
chessSet({cName:"User Not Found"});
|
||||
}
|
||||
}
|
||||
|
||||
function setChess({cName = null, pic = null, ratings = null}) {
|
||||
if (cName) {
|
||||
document.querySelector(".chessName").textContent = cName;
|
||||
}
|
||||
if (pic) {
|
||||
document.querySelector(".chessImage").src = pic;
|
||||
}
|
||||
if (ratings) {
|
||||
document.querySelector(".chessRapid .chessStat").textContent = ratings.rapid;
|
||||
document.querySelector(".chessBlitz .chessStat").textContent = ratings.blitz;
|
||||
document.querySelector(".chessBullet .chessStat").textContent = ratings.bullet;
|
||||
document.querySelector(".chessPuzzles .chessStat").textContent = ratings.tactics;
|
||||
}
|
||||
}
|
||||
92
src/static/js/idler.js
Normal file
92
src/static/js/idler.js
Normal file
@@ -0,0 +1,92 @@
|
||||
const balls = [];
|
||||
const density = 0.00003;
|
||||
let screenWidth = window.innerWidth + 10;
|
||||
let screenHeight = window.innerHeight + 10;
|
||||
|
||||
class Ball {
|
||||
constructor(x, y, size, speed, angle) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.size = size;
|
||||
this.speed = speed;
|
||||
this.angle = angle;
|
||||
this.calcChange();
|
||||
}
|
||||
|
||||
calcChange() {
|
||||
this.xSpeed = this.speed * Math.sin((this.angle * Math.PI) / 180);
|
||||
this.ySpeed = this.speed * Math.cos((this.angle * Math.PI) / 180);
|
||||
}
|
||||
|
||||
update() {
|
||||
this.x += this.xSpeed;
|
||||
this.y += this.ySpeed;
|
||||
if (this.x > screenWidth) {
|
||||
this.x -= screenWidth;
|
||||
} else if (this.x < 0) {
|
||||
this.x += screenWidth;
|
||||
}
|
||||
if (this.y > screenHeight) {
|
||||
this.y -= screenHeight;
|
||||
} else if (this.y < 0) {
|
||||
this.y += screenHeight;
|
||||
}
|
||||
this.draw();
|
||||
}
|
||||
|
||||
draw() {
|
||||
stroke(200, 100);
|
||||
strokeWeight(2);
|
||||
fill(0);
|
||||
ellipse(this.x, this.y, this.size, this.size);
|
||||
}
|
||||
}
|
||||
|
||||
function setup() {
|
||||
frameRate(15);
|
||||
const pix = screenHeight * screenWidth;
|
||||
createCanvas(screenWidth, screenHeight);
|
||||
for (let i = 0; i < pix * density; i++) {
|
||||
let thisBall = new Ball(
|
||||
random(screenWidth),
|
||||
random(screenHeight),
|
||||
random(6) + 3,
|
||||
Math.exp(random(4) + 3) / 1000 + 1,
|
||||
random(360)
|
||||
);
|
||||
balls.push(thisBall);
|
||||
}
|
||||
|
||||
stroke(255);
|
||||
}
|
||||
|
||||
function windowResized() {
|
||||
screenWidth = window.innerWidth + 10;
|
||||
screenHeight = window.innerHeight + 10;
|
||||
resizeCanvas(screenWidth, screenHeight);
|
||||
}
|
||||
|
||||
function draw() {
|
||||
background(32);
|
||||
|
||||
for (let i = 0; i < balls.length; i++) {
|
||||
balls[i].update();
|
||||
}
|
||||
for (let i = 0; i < balls.length - 1; i++) {
|
||||
for (let j = i + 1; j < balls.length; j++) {
|
||||
let distance = dist(balls[i].x, balls[i].y, balls[j].x, balls[j].y);
|
||||
if (distance < 100){
|
||||
stroke(150);
|
||||
line(balls[i].x, balls[i].y, balls[j].x, balls[j].y);
|
||||
}
|
||||
else if (distance < 150) {
|
||||
stroke(100);
|
||||
let chance = 0.3 ** (((random(0.2) + 0.8) * distance) / 150);
|
||||
if (chance < 0.5) {
|
||||
stroke(50);
|
||||
}
|
||||
line(balls[i].x, balls[i].y, balls[j].x, balls[j].y);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
89
src/static/js/responsive.js
Normal file
89
src/static/js/responsive.js
Normal file
@@ -0,0 +1,89 @@
|
||||
window.onload = function () {
|
||||
onLoaded();
|
||||
};
|
||||
function onLoaded() {
|
||||
document.body.scrollTop = 0; // For Safari
|
||||
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
|
||||
let navs = document.querySelectorAll(".navElement");
|
||||
navs.forEach(function (element) {
|
||||
element.onclick = function () {
|
||||
window.scrollTo(0, 0);
|
||||
toggleMenu();
|
||||
};
|
||||
});
|
||||
|
||||
window.onresize = function () {
|
||||
resizer();
|
||||
};
|
||||
resizer();
|
||||
if (window.innerWidth < 1200) {
|
||||
const e = document.querySelector(".navControl");
|
||||
e.style.maxHeight = "0px";
|
||||
}
|
||||
}
|
||||
|
||||
function resizer() {
|
||||
const e = document.querySelector(".navControl");
|
||||
if (window.innerWidth > 1200) {
|
||||
// desktop view
|
||||
scrollFunction();
|
||||
window.onscroll = function () {
|
||||
scrollFunction();
|
||||
};
|
||||
e.style.maxHeight = `${e.scrollHeight + 10}px`;
|
||||
} else {
|
||||
// mobile view
|
||||
window.onscroll = "";
|
||||
document.querySelector(".header").style.backgroundColor = "#1a1a1a";
|
||||
document.querySelectorAll(".header .name h1").forEach(function (x) {
|
||||
x.style.fontSize = "1.5rem";
|
||||
});
|
||||
// document.querySelector('.header > h1').style.color = "#ecebeb";
|
||||
document.querySelector(".header").style.borderBottomWidth = "3px";
|
||||
e.style.maxHeight = "0px";
|
||||
document.querySelectorAll(".navElement *").forEach((x) => {
|
||||
x.style.paddingTop = ".3rem";
|
||||
x.style.paddingBottom = ".3rem";
|
||||
x.style.fontSize = "1rem";
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function scrollFunction() {
|
||||
if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 10) {
|
||||
document.querySelector(".header").style.backgroundColor = "#1a1a1a";
|
||||
document.querySelectorAll(".header .name h1").forEach(function (x) {
|
||||
x.style.fontSize = "1.5rem";
|
||||
});
|
||||
document.querySelectorAll(".navElement *").forEach((x) => {
|
||||
x.style.paddingTop = ".3rem";
|
||||
x.style.paddingBottom = ".3rem";
|
||||
x.style.fontSize = "1rem";
|
||||
});
|
||||
} else {
|
||||
document.querySelector(".header").style.backgroundColor = "rgba(0,0,0,0)";
|
||||
document.querySelectorAll(".header .name h1").forEach(function (x) {
|
||||
x.style.fontSize = "2rem";
|
||||
});
|
||||
// document.querySelector('.header > h1').style.color = "#ecebeb";
|
||||
document.querySelectorAll(".navElement *").forEach((x) => {
|
||||
x.style.paddingTop = ".5rem";
|
||||
x.style.paddingBottom = ".5rem";
|
||||
x.style.fontSize = "1.2rem";
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function toggleMenu() {
|
||||
if (window.innerWidth < 1200) {
|
||||
const e = document.querySelector(".navControl");
|
||||
const bar = document.querySelector(".header");
|
||||
if (e.style.maxHeight === "0px") {
|
||||
e.style.maxHeight = `${e.scrollHeight + 10}px`;
|
||||
bar.style.borderBottomWidth = "0px";
|
||||
} else {
|
||||
e.style.maxHeight = "0px";
|
||||
bar.style.borderBottomWidth = "3px";
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user