app.js

/* Ensures that DOM content is loaded before HTML content */
document.addEventListener('DOMContentLoaded', function() {
    const studyGroupData = {
        "studyGroups": [
            {
                "id": 1,
                "major": "Computer and Information Technology",
                "courses": ["Introduction to C Programming", "System Administration"],
                "studyTimes": ["Wednesday 3pm-5pm", "Thursday 12pm-2pm"],
                "groupSize": 6
            },
    
            {
                "id": 2,
                "major": "Electrical Engineering",
                "courses": ["Linear Circuit Analysis I", "Signals and Systems"],
                "studyTimes": ["Monday 4pm-5:30pm", "Wednesday 6pm-8pm", "Friday 2:30pm-4pm"],
                "groupSize": 10
            },
    
            {
                "id": 3,
                "major": "Fisheries and Aquatic Sciences",
                "courses": ["Marine Biology", "Aquatic Sampling Techniques"],
                "studyTimes": ["Monday 10am-12pm", "Thursday 4pm-5:30pm"],
                "groupSize": 4
            },
    
            {
                "id": 4,
                "major": "Developmental and Family Science",
                "courses": ["Introduction to Family Process", "Biosocial Foundations of the Family"],
                "studyTimes": ["Tuesday 3:30pm-6pm", "Thursday 2pm-4pm"],
                "groupSize": 8
            },
    
            {
                "id": 5,
                "major": "Biochemistry",
                "courses": ["Molecules", "Metabolism"],
                "studyTimes": ["Wednesday 5pm-7:30pm", "Friday 2:45pm-4:30pm"],
                "groupSize": 10
            },
    
            {
                "id": 6,
                "major": "Organizational Leadership",
                "courses": ["Project Management", "Business Principles for Organizational Leadership"],
                "studyTimes": ["Tuesday 4pm-7pm", "Friday 4:45pm-6:30pm"],
                "groupSize": 5
            },
    
    
            {
                "id": 7,
                "major": "Food Science",
                "courses": ["Food Processing I", "Food Chemistry"],
                "studyTimes": ["Monday 5:30pm-6:45pm", "Wednesday 6pm-8:30pm"],
                "groupSize": 8
            },
    
            {
                "id": 8,
                "major": "Psychological Sciences",
                "courses": ["Introduction to Cognitive Psychology", "Introduction to Learning"],
                "studyTimes": ["Tuesday 4pm-6pm", "Wednesday 5:30pm-7pm"],
                "groupSize": 6
            },
    
            {
                "id": 9,
                "major": "Farm Management",
                "courses": ["Economics of Agricultural Markets", "Farm Organization"],
                "studyTimes": ["Wednesday 8pm-9:30pm", "Thursday 3pm-5:30pm"],
                "groupSize": 10
            },
    
    
            {
                "id": 10,
                "major": "Planetary Sciences",
                "courses": ["Introduction to Earth Sciences", "Mineralogy"],
                "studyTimes": ["Monday 10:30am-12pm", "Thursday 4pm-6:30pm"],
                "groupSize": 4
            }
        ]
    }
    document.getElementById('preferencesForm').addEventListener('submit', function(event) {
        event.preventDefault();
        const inputMajor = document.getElementById('major').value;
        const inputCourse = document.getElementById('course').value;
        const inputTime = document.getElementById('time').value;
        const inputSize = document.getElementById('size').value;

        console.log("Input Major: ", inputMajor);
        console.log("Input Course: ", inputCourse);
        console.log("Input Time: ", inputTime);
        console.log("Input Size: ", inputSize);


        /* Filtering study groups based on user's preferences */
        const matchingGroups = studyGroupData.studyGroups.filter(group => {
            return (
                group.major === inputMajor &&
                group.courses.includes(inputCourse) &&
                group.studyTimes.includes(inputTime) &&
                group.groupSize >= inputSize
            );
        });

        console.log("Matching Groups: ", matchingGroups)

        /* Clear existing results */
        const resultsContainer = document.getElementById('results');
        resultsContainer.innerHTML = '';

        /* Displaying matching groups */
        if (matchingGroups.length > 0) {
            const heading = document.createElement('h2');
            heading.textContent = "Matching Study Groups";
            resultsContainer.appendChild(heading);

            matchingGroups.forEach(group => {
                const groupDiv = document.createElement('div');
                groupDiv.classList.add('study-group');

                const majorParagraph = document.createElement('p');
                majorParagraph.textContent = `Major: ${group.major}`;

                const coursesParagraph = document.createElement('p');
                coursesParagraph.textContent = `Course: ${inputCourse}`;

                const timesParagraph = document.createElement('p');
                timesParagraph.textContent = `Study Times: ${group.studyTimes.join(", ")}`;

                const sizeParagraph = document.createElement('p');
                sizeParagraph.textContent = `Group Size: ${group.groupSize}`;

                const joinButton = document.createElement('button');
                joinButton.textContent = 'Join';
                joinButton.addEventListener('click', function() {
                    alert(`You have joined the ${group.major} study group for ${inputCourse}.`);
                });

                groupDiv.appendChild(majorParagraph);
                groupDiv.appendChild(coursesParagraph);
                groupDiv.appendChild(timesParagraph);
                groupDiv.appendChild(sizeParagraph);
                groupDiv.appendChild(joinButton);

                resultsContainer.appendChild(groupDiv);
            });
        } else {
            const noResultsParagraph = document.createElement('p');
            noResultsParagraph.textContent = "No matching study groups found.";
            resultsContainer.appendChild(noResultsParagraph);
        }

        if (!inputMajor) {
            alert('Please select a major.');
            return;
        }

        if (!inputCourse) {
            alert('Please select a course.');
            return;
        }

        if (!inputTime) {
            alert('Please select a time.');
            return;
        }

        if (!inputSize) {
            alert('Please select a group size.');
            return;
        }
    });
});