lee
/
leemorgan-dev


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
							<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Lee Morgan</title>
        <link rel="stylesheet" href="/style">
    </head>
    <body>
        <div id="menu">
            <button id="projectsButton" class="active">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <polyline points="16 18 22 12 16 6"></polyline>
                    <polyline points="8 6 2 12 8 18"></polyline>
                </svg>

                <p>My Projects</p>
            </button>

            <button id="aboutButton">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
                    <circle cx="12" cy="7" r="4"></circle>
                </svg>

                <p>About Me</p>
            </button>

            <button id="writingButton">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M12 19l7-7 3 3-7 7-3-3z"></path>
                    <path d="M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z"></path>
                    <path d="M2 2l7.586 7.586"></path>
                    <circle cx="11" cy="11" r="2"></circle>
                </svg>

                <p>Blog</p>
            </button>

            <button id="linksButton">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
                    <line x1="3" y1="9" x2="21" y2="9"></line>
                    <line x1="9" y1="21" x2="9" y2="9"></line>
                </svg>

                <p>Fun Links</p>
            </button>

            <button id="travelButton">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <circle cx="12" cy="12" r="10"></circle>
                    <polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"></polygon>
                </svg>
                
                <p>Travel</p>
            </button>

            <button id="learnButton">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                    <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path>
                    <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path>
                </svg>

                <p>Learn</p>
            </button>
        </div>

        <div id="main">
            <div id="projects" class="cardContainer">
                <a class="card" href="https://thesubline.com">
                    <h2>The Subline</h2>
                    <img src="/images/subline" alt="The Subline">
                    <p>A web application to assist restaurant owners in managing their inventories. Providing insights into usage, waste and other details through the use of data.</p>
                </a>

                <a class="card" href="https://budgeteer.money">
                    <h2>Budgeteer</h2>
                    <img src="/images/budgeteer" alt="Budgeteer">
                    <p>A simple web application to help people to budget their money in a simple and approachable manner.</p>
                </a>

                <a class="card" href="markket.xyz">
                    <h2>Local Markets</h2>
                    <img src="/images/market" alt="Market">
                    <p>A website for people to find farmers markets and vendors of local products in their area.</p>
                </a>

                <a class="card" href="/sudoku">
                    <h2>Sudoku Solver</h2>
                    <img src="/images/sudoku" alt="Sudoku">
                    <p>Stuck on a particularly difficult game of sudoku? Enter any sudoku puzzle and have it solved immediately.</p>
                </a>

                <a class="card" href="/birthdayparadox">
                    <h2>The Birthday Paradox</h2>
                    <img src="/images/birthday" alt="Birthday Hat">
                    <p>A demonstration of the counterintuitive birthday paradox.</p>
                </a>
            </div>

            <div id="about" style="display:none;">
                <h1>Ya, Ya, I'm working on it...</h1>
            </div>

            <div id="writing" class="cardContainer" style="display:none;"></div>

            <div id="links" class="cardContainer" style="display:none;">
                <a class="card" href="https://cs-online.club/en/servers">
                    <h2>CS:GO in the browser</h2>
                    <p>A website to play CS:GO in the browser with other people online.</p>
                </a>

                <a class="card" href="https://driveandlisten.herokuapp.com/">
                    <h2>Drive and Listen</h2>
                    <p>Pretend to be driving your car and listening to the radio. Watch cars driving down the road all over the world while listening to local radio stations.</p>
                </a>

                <a class="card" href="https://www.ekzhang.com/game-of-life">
                    <h2>Conway's Game of Life</h2>
                    <p>Play around and experiment with different situations in Conway's Game of Life</p>
                </a>

                <a class="card" href="https://librivox.org/">
                    <h2>LibriVox</h2>
                    <p>Free public domain audiobooks. Listen to books for free, or volunteer your time to read them for others to listen to</p>
                </a>

                <a class="card" href="https://rocketcrab.com/">
                    <h2>rocketcrab.com</h2>
                    <p>Party games right on your phone</p>
                </a>

                <a class="card" href="https://thetruesize.com/">
                    <h2>The True Size of</h2>
                    <p>The common Mercator projection map that we are used to distorts the real size of countries. This site will let you move and directly compare the real size of different countries to see how big they really are</p>
                </a>

                <a class="card" href="https://win95.ajf.me/">
                    <h2>Windows 95</h2>
                    <p>Use a virtual Windows 95 computer right in your browser</p>
                </a>

                <a class="card" href="https://pointerpointer.com/">
                    <h2>Pointer Pointer</h2>
                    <p>Point to your pointer</p>
                </a>

                <a class="card" href="https://pudding.cool/2020/12/judge-my-spotify">
                    <h2>Judge My Spotify</h2>
                    <p>Let an AI criticize your taste in music</p>
                </a>
            </div>

            <div id="travel" style="display:none">
                <template id="travelCard">
                    <div class="card">
                        <h1></h1>
                        <img>
                    </div>
                </template>

                <template id="backCard">
                    <div class="card backCard">
                        <h1>BACK</h1>

                        <svg width="50" height="50" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                            <polyline points="9 14 4 9 9 4"></polyline>
                            <path d="M20 20v-7a4 4 0 0 0-4-4H4"></path>
                        </svg>
                    </div>
                </template>
            </div>

            <div id="learn" class="cardContainer" style="display:none">
                <a class="card" href="/learn/web">
                    <h2>Intro to Web Programming</h2>
                    <img src="/images/netscape" alt="Netscape logo">
                </a>

                <a class="card" href="/learn/html">
                    <h2>HTML</h2>
                    <img src="/images/html5" alt="HTML 5">
                </a>
            </div>
        </div>

        <script>
            let buttons = document.getElementById("menu").children;
            let content = document.getElementById("main").children;

            for(let i = 0; i < buttons.length; i++){
                buttons[i].onclick = ()=>{
                    for(let j = 0; j < buttons.length; j++){
                        buttons[j].classList.remove("active");
                    }
                    buttons[i].classList.add("active");

                    for(let j = 0; j < content.length; j++){
                        content[j].style.display = "none";
                    }

                    let string = buttons[i].id.replace("Button", "");
                    document.getElementById(string).style.display = "flex";
                };
            }

            fetch("/writing/directories")
                .then(response => response.json())
                .then((response)=>{
                    let writing = document.getElementById("writing");
                    let template = document.getElementById("backCard").content.children[0];

                    let recurse = (currentArray, currentContainer)=>{
                        for(let i = 0; i < currentArray.length; i++){
                            let card = {};
                            if(currentArray[i].contents[0].title === undefined){
                                card = document.createElement("div");
                                card.onclick = ()=>{
                                    currentContainer.style.display = "none";
                                    newContainer.style.display = "flex";
                                };

                                let name = document.createElement("h1");
                                name.innerText = currentArray[i].name.toUpperCase();
                                card.appendChild(name);
                            }else{
                                card = document.createElement("a");
                                card.href = currentArray[i].contents[0].route;

                                let title = document.createElement("h2");
                                title.innerText = currentArray[i].contents[0].title;
                                card.appendChild(title);

                                let img = document.createElement("img");
                                img.src = currentArray[i].contents[0].img;
                                img.alt = `${currentArray[i].contents[0].title} image`;
                                card.appendChild(img);
                            }

                            card.classList.add("card");
                            currentContainer.appendChild(card);

                            let newContainer = document.createElement("div");
                            newContainer.classList.add("cardContainer");
                            newContainer.style.display = "none";
                            writing.appendChild(newContainer);

                            let backCard = template.cloneNode(true);
                            backCard.onclick = ()=>{
                                newContainer.style.display = "none";
                                currentContainer.style.display = "flex";
                            }
                            newContainer.appendChild(backCard);

                            if(currentArray[i].contents[0].contents === undefined) continue;
    
                            recurse(currentArray[i].contents, newContainer);
                        }
                    }

                    let headContainer = document.createElement("div");
                    headContainer.classList.add("cardContainer");
                    headContainer.style.display = "flex";
                    writing.appendChild(headContainer);

                    recurse(response, headContainer);
                })
                .catch((err)=>{});

            fetch("/travel/directories")
                .then(response => response.json())
                .then((response)=>{
                    let mainContainer = document.getElementById("travel");
                    let template = document.getElementById("travelCard").content.children[0];

                    let recurse = (contents, container, prevCard)=>{
                        for(let i = 0; i < contents.length; i++){
                            if(contents[i].name !== undefined){
                                let finalFolder = true;
                                for(let j = 0; j < contents[i].contents.length; j++){
                                    if(contents[i].contents[j].name !== undefined) finalFolder = false;
                                }

				if(back !== undefined) container.appendChild(back);

                                if(finalFolder === true){
                                    let card = document.createElement("a");
                                    card.classList.add("card");
                                    card.href = contents[i].route;
                                    container.appendChild(card);

                                    let h1 = document.createElement("h1");
                                    h1.innerText = contents[i].name.replaceAll("-", " ");
                                    card.appendChild(h1);

                                    let img = document.createElement("img");
                                    img.src = contents[i].contents[0].src;
                                    img.alt = contents[i].name;
                                    card.appendChild(img);
                                }else{
                                    let newContainer = document.createElement("div");
                                    newContainer.classList.add("cardContainer");
                                    newContainer.style.display = "none";
                                    mainContainer.appendChild(newContainer);

                                    let card = template.cloneNode(true);
                                    card.children[0].innerText = contents[i].name.replaceAll("-", " ");
                                    card.children[1].alt = contents[i].name.replaceAll("-", " ");
                                    card.onclick = ()=>{
                                        container.style.display = "none";
                                        newContainer.style.display = "flex";
                                    }
                                    container.appendChild(card);

                                    recurse(contents[i].contents, newContainer, card);
                                }
                            }else{
                                if(prevCard.children[1].src === ""){
                                    prevCard.children[1].src = contents[i].src;
                                }
                            }
                        }
                    }

                    let headContainer = document.createElement("div");
                    headContainer.classList.add("cardContainer");
                    headContainer.style.display = "flex";
                    mainContainer.appendChild(headContainer);

                    recurse(response, headContainer);
                })
                .catch((err)=>{});
        </script>
    </body>
</html>