@ -4,33 +4,11 @@ import { Tooltip } from "antd";
import { useState , useEffect } from "react" ;
import axios from "axios" ;
const TelegramOutlinedSvg = ( ) = > {
return (
< svg
width = "24px"
height = "24px"
version = "1.1"
xmlns = "http://www.w3.org/2000/svg"
style = { {
fillRule : "evenodd" ,
clipRule : "evenodd" ,
strokeLinejoin : "round" ,
strokeMiterlimit : 1.41421 ,
} }
>
< path
id = "telegram-1"
d = "M18.384,22.779c0.322,0.228 0.737,0.285 1.107,0.145c0.37,-0.141 0.642,-0.457 0.724,-0.84c0.869,-4.084 2.977,-14.421 3.768,-18.136c0.06,-0.28 -0.04,-0.571 -0.26,-0.758c-0.22,-0.187 -0.525,-0.241 -0.797,-0.14c-4.193,1.552 -17.106,6.397 -22.384,8.35c-0.335,0.124 -0.553,0.446 -0.542,0.799c0.012,0.354 0.25,0.661 0.593,0.764c2.367,0.708 5.474,1.693 5.474,1.693c0,0 1.452,4.385 2.209,6.615c0.095,0.28 0.314,0.5 0.603,0.576c0.288,0.075 0.596,-0.004 0.811,-0.207c1.216,-1.148 3.096,-2.923 3.096,-2.923c0,0 3.572,2.619 5.598,4.062Zm-11.01,-8.677l1.679,5.538l0.373,-3.507c0,0 6.487,-5.851 10.185,-9.186c0.108,-0.098 0.123,-0.262 0.033,-0.377c-0.089,-0.115 -0.253,-0.142 -0.376,-0.064c-4.286,2.737 -11.894,7.596 -11.894,7.596Z"
/ >
< / svg >
) ;
} ;
const LastFmLi = ( ) = > {
function LastFmLi() {
const [ nowPlayingSong , setNowPlayingSong ] = useState < string > ( "nothing" ) ;
const [ nowPlayingArtist , setNowPlayingArtist ] = useState < string > ( "no-one" ) ;
st updateNowPlaying = async (= >
async function updateNowPlaying() {
try {
const songData = await axios . get (
"https://jsonplaceholder.typicode.com/posts"
@ -40,7 +18,7 @@ const LastFmLi = () => {
} catch ( err ) {
console . error ( err ) ;
}
} ;
}
useEffect ( ( ) = > {
updateNowPlaying ( ) ;
@ -54,19 +32,82 @@ const LastFmLi = () => {
return < li > listening to ____ by ____ < / li > ;
} ;
const Age = ( ) = > {
const [ age , setAge ] = useState (
Math . round ( ( new Date ( ) . getTime ( ) - 1021004428000 ) / 1000 )
function Age() {
// Accounts for leap years and stuff
function milliseconds_year() {
const dateObj = new Date ( ) ;
const dateInit = Math . round (
new Date ( dateObj . getFullYear ( ) , 0 , 1 ) . getTime ( )
) ;
const dateEnd = Math . round (
new Date ( dateObj . getFullYear ( ) , 11 , 31 , 23 , 59 , 59 , 999 ) . getTime ( )
) ;
return dateEnd - dateInit ;
}
const UpdateAge = ( ) = > {
setAge ( Math . round ( ( new Date ( ) . getTime ( ) - 1021004428000 ) / 1000 ) ) ;
} ;
function searchSternBorcotTree (
target : number ,
left_n : number ,
left_d : number ,
right_n : number ,
right_d : number ,
count : number = 0
) : [ number , number ] {
count ++ ;
const center_n : number = left_n + right_n ;
const center_d : number = left_d + right_d ;
// Check to see if we've gone too deep
if ( count > 25 ) return [ center_n , center_d ] ;
// Check to see if we're close enough to the target
if ( Math . abs ( target - ( center_n / center_d ) ) > 0.001 ) {
// Look right down the tree
if ( target > ( center_n / center_d ) )
return searchSternBorcotTree (
target ,
center_n ,
center_d ,
right_n ,
right_d ,
count
) ;
// Ok now look left
return searchSternBorcotTree (
target ,
left_n ,
left_d ,
center_n ,
center_d ,
count
) ;
}
return [ center_n , center_d ] ;
}
function CalcAge() {
let ageMs = new Date ( ) . getTime ( ) - 1021004428000 ;
const yearMs = milliseconds_year ( ) ;
const ageYearsComponent = Math . floor ( ageMs / yearMs ) ;
const ageSecondsComponent = Math . floor ( ( ageMs % yearMs ) / 1000 ) ;
const [ target_n , target_d ] = searchSternBorcotTree (
ageSecondsComponent / ( yearMs / 1000 ) ,
0 ,
1 ,
1 ,
1
) ;
return ` ${ ageYearsComponent } and ${ target_n } / ${ target_d } ` ;
}
const [ age , setAge ] = useState ( CalcAge ( ) ) ;
function UpdateAge() {
setAge ( CalcAge ( ) ) ;
}
useEffect ( ( ) = > {
UpdateAge ( ) ;
const interval = setInterval ( UpdateAge , 1000 ) ;
const interval = setInterval ( UpdateAge , 5 000) ;
return ( ) = > {
clearInterval ( interval ) ;
@ -75,16 +116,16 @@ const Age = () => {
return (
< li >
<span style = { { fontFamily : "Fira Code" } } > { age } < / span > seconds old { " " }
{age } years old
< / li >
) ;
} ;
export const AboutMe = ( ) = >
const EmailHandler = ( ) = >
export function AboutMe()
function EmailHandler()
const email = "Y29udGFjdEBqYWtlY292ZXIubWU=" ;
window . prompt ( "Thanks for being a human! Here's my email:" , atob ( email ) ) ;
} ;
}
return (
< div id = { "about-me-parent" } >
@ -164,14 +205,23 @@ export const AboutMe = () => {
< h2 > I ' m : < / h2 >
< ul >
< Age / >
< Tooltip
title = {
"Hey! This part is still a work in progress, check back in a bit to see if it's working!"
}
>
< LastFmLi / >
< li >
doing ( general stuff - in class , projects , sleeping , games )
< / li >
< / Tooltip >
< li >
rather colorblind
< / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
) ;
} ;
}
