SimpsonGames.github.io/home_import.js at main · SimpsonGames/SimpsonGames.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
fetch('about_me.json')
    .then(response => response.json())
    .then(data => {

        //create about me section
        const aboutMeContainer = document.querySelector('#about-me-box');

        if (aboutMeContainer)
        {
            let firstElement = data.sections[0];
            const bodyElement = document.createElement('div');

            aboutMe = `<h1>${firstElement.title}</h1>
            <p>${firstElement.body}</p>
            <a href="/about_me"><button class="button">Read More</button></a>
            <hr></hr>`

            bodyElement.innerHTML = aboutMe;
            aboutMeContainer.appendChild(bodyElement);
        }
        else
        {
            console.log('No element found with selector "#about-me-box"');
        }
    });

fetch('portfolio.json')
    .then(response => response.json())
    .then(data => {

        const featuredContainer = document.querySelector('#featured-portfolio');

        if (featuredContainer)
        {
            data.projects.forEach(project => {
                if (project.featured)
                {
                    const featuredElement = document.createElement('div');
                    featuredElement.classList.add('portfolio-panel');

                    let featuredInfo = `
                    <img class="panel-image" src="img/portfolio/panels/${project.image}" alt="${project.title}">
                    <h3>${project.title} (${project.date})</h3>
                    <p class="panel-desc">${project.description}</p>
                    `;

                    if (project.portfolioPage !== null && project.portfolioPage !== "#")
                    {
                        featuredInfo += `<a href="portfolio/${project.portfolioPage}"><button class="button">Read More</button></>`;
                    }

                    if (project.externalPage !== null && project.externalPage !== "#")
                    {
                        featuredInfo += `<a href="${project.externalPage}" target="_blank"><button class="button">View Project Page</button></>`;
                    }

                    featuredElement.innerHTML = featuredInfo;
                    featuredContainer.appendChild(featuredElement);
                }
            });
        }
        else
        {
            console.log('No element found with selector #featured-portfolio')
        }

    });