// Define a function that modifies the links on the live feed page function modifyLiveFeedLinks() { document.querySelectorAll(".status a").forEach(link => { link.setAttribute('target', '_blank'); }); } // Check if the current page is the live feed page if (window.location.href.includes("/live-feed")) { // Call the function on page load window.addEventListener('appLoaded', () => { modifyLiveFeedLinks(); // Override XMLHttpRequest.open to call the function when the request completes const oldOpen = XMLHttpRequest.prototype.open; XMLHttpRequest.prototype.open = function () { this.addEventListener('loadend', () => { setTimeout(modifyLiveFeedLinks, 200); }); oldOpen.apply(this, arguments); }; }); } function getProgramsTitle(){ if (!document.querySelector("#programs-v2")) { return } var url; var mainProgramTitleUrl = document.querySelector("#programs-v2 .main-program-left .program-title a"); if (mainProgramTitleUrl) { url = mainProgramTitleUrl.href; var mainProgramLeft = document.querySelector("#programs-v2 p.program-description"); if (mainProgramLeft) { var mainProgramLeftText = mainProgramLeft.innerText; console.log(mainProgramLeftText) var captionUrlArea = document.createElement("a"); captionUrlArea.innerText = mainProgramLeftText; captionUrlArea.href = url; captionUrlArea.setAttribute('target', '_blank'); console.log(captionUrlArea) mainProgramLeft.innerHTML = ""; mainProgramLeft.appendChild(captionUrlArea); } var mainProgramImage = document.querySelector("#programs-v2 .main-program-image"); var imageUrlArea = document.createElement("a"); imageUrlArea.href = url; imageUrlArea.setAttribute('target', '_blank'); imageUrlArea.classList.add("imageUrlArea"); mainProgramImage.appendChild(imageUrlArea); } } const programsV2ButtonLeft = document.querySelector(".main-program-image .left-arrow-button") ? document.querySelector(".main-program-image .left-arrow-button") : document.querySelector("div"); const programsV2ButtonRight = document.querySelector(".main-program-image .right-arrow-button") ? document.querySelector(".main-program-image .right-arrow-button") : document.querySelector("div"); // ADD URL TO Programs V2 Main Image and Caption document.addEventListener("appLoaded", () => { getProgramsTitle() }); programsV2ButtonLeft.addEventListener("click", (e) => { setTimeout(() => { getProgramsTitle() }, 700); }); programsV2ButtonRight.addEventListener("click", (e) => { setTimeout(() => { getProgramsTitle() }, 700); }); /* ----------- Script to change the social icons in the footer ----------- */ function changeFooterIcons() { // REQUIRES: urls added from the CMS /* SETTINGS */ // define svg icons - in this case round icons const fbIcon = ''; const twIcon = ''; const instaIcon = ''; const ytIcon = ''; const linkedinIcon = ''; /* END SETTINGS */ const socialIcons = document.querySelectorAll("#cms-footer .footer-social-links li a"); // define elements if (socialIcons) { // loop through icons - logic can adapt to fit the situation socialIcons.forEach(function (socialIcon) { let socialIconURL = socialIcon.href; // check what type of button if (socialIconURL.includes("facebook.com")) { socialIcon.classList.add('facebook-button'); // optional since we alrady add the icon below with color/fill already defined socialIcon.innerHTML = fbIcon; } if (socialIconURL.includes("twitter.com")) { socialIcon.classList.add('twitter-button'); // optional socialIcon.innerHTML = twIcon; } if (socialIconURL.includes("instagram.com")) { socialIcon.classList.add('instagram-button'); // optional socialIcon.innerHTML = instaIcon; } if (socialIconURL.includes("youtube.com")) { socialIcon.classList.add('youtube-button'); // optional socialIcon.innerHTML = ytIcon; } if (socialIconURL.includes("linkedin.com")) { socialIcon.classList.add('linkedin-button'); // optional socialIcon.innerHTML = linkedinIcon; } }); } } document.addEventListener("appLoaded", changeFooterIcons); /* ----------- END Script to change the social icons in the footer ----------- */ /* ----------- EDIT THE SQUARE BUTTONS WITH ICONS ----------- */ document.addEventListener("appLoaded", () => { const buttonsWithIcons = document.querySelectorAll(".button.square .icon-wrapper"); buttonsWithIcons.forEach(button => { let buttonWrap = button.closest(".button.square"); buttonWrap.classList.add("custom-square-button-with-icon") }); }); /* ----------- END EDIT THE SQUARE BUTTONS WITH ICONS ----------- */ /* ----------- Add Custom Buttons to Calendar ----------- */ function addCustomButtonsToCalendar() { const eventCalendarContainer = document.querySelector(".event-cal .event-cal-container"); if (eventCalendarContainer) { var buttons = { '2023-2024 Academic Calendar': 'https://www.humbleisd.net/browse/450376', 'Testing Calendar': 'https://www.humbleisd.net/o/teachinglearning/page/assessment' }; var schoolName = window.clientWorkStateTemp.globals.info.school_name; if (schoolName.includes("Middle") || schoolName.includes("High")) { var bellSchedulesSlug = 'bell-schedules'; var schoolAlias = window.clientWorkStateTemp.alias; bellSchedulesPath = '/o/' + schoolAlias + '/page/' + bellSchedulesSlug + ''; // if other schools use this section, they will use their own page; if it does not exist, it will use the one from District var http = new XMLHttpRequest() http.open('HEAD', bellSchedulesPath, false) http.send() if (http.status === 200) { //This file exist! } else { //This file does not exist! bellSchedulesPath = '/page/' + bellSchedulesSlug + ''; } buttons = { '2023-2024 Academic Calendar': 'https://www.humbleisd.net/browse/450376', 'Testing Calendar': 'https://www.humbleisd.net/o/teachinglearning/page/assessment', 'Bell Schedules': bellSchedulesPath }; } let eventCalendarCustomButtons = document.createElement("div"); eventCalendarCustomButtons.classList.add('customButtons'); for (const key in buttons) { let customCalendarButton = document.createElement("a"); customCalendarButton.setAttribute('target', '_blank'); customCalendarButton.setAttribute('href', `${buttons[key]}`); customCalendarButton.innerText = `${key}`; eventCalendarCustomButtons.appendChild(customCalendarButton); } eventCalendarContainer.insertAdjacentElement('beforebegin', eventCalendarCustomButtons); } } document.addEventListener("appLoaded", addCustomButtonsToCalendar); /* ----------- END Add Custom Buttons to Calendar ----------- */ /* ----------- Add Custom Buttons to Dining and Staff at Elementary Sites ----------- */ function addCustomButtonsToDining() { const diningContainer = document.querySelector("#menu-list"); if (diningContainer) { var buttons = { 'School Cafe': 'https://www.schoolcafe.com/HUMBLEISD', 'Child Nutrition': '/page/child-nutrition-services' }; let dinindCustomButtons = document.createElement("div"); dinindCustomButtons.classList.add('customButtons'); for (const key in buttons) { let customDiningButton = document.createElement("a"); customDiningButton.setAttribute('target', '_blank'); customDiningButton.setAttribute('href', `${buttons[key]}`); customDiningButton.innerText = `${key}`; dinindCustomButtons.appendChild(customDiningButton); } diningContainer.querySelector('.page-container').insertAdjacentElement('beforebegin', dinindCustomButtons); } } document.addEventListener("appLoaded", addCustomButtonsToDining); function addCustomButtonsToStaff() { const staffContainer = document.querySelector("#staff"); if (staffContainer) { var schoolName = window.clientWorkStateTemp.globals.info.school_name; if (schoolName.includes("Elementary")) { var classroomsSlug = 'classrooms'; var schoolAlias = window.clientWorkStateTemp.alias; classroomsPath = '/o/' + schoolAlias + '/page/' + classroomsSlug + ''; // if other schools use this section, they will use their own page; if it does not exist, it will use the one from District var http = new XMLHttpRequest() http.open('HEAD', classroomsPath, false) http.send() if (http.status === 200) { //This file exist! } else { //This file does not exist! classroomsPath = '/page/' + classroomsSlug + ''; } buttons = { 'Classrooms': classroomsPath }; } let staffCustomButtons = document.createElement("div"); staffCustomButtons.classList.add('customButtons'); for (const key in buttons) { let customStaffButton = document.createElement("a"); customStaffButton.setAttribute('target', '_blank'); customStaffButton.setAttribute('href', `${buttons[key]}`); customStaffButton.innerText = `${key}`; staffCustomButtons.appendChild(customStaffButton); } staffContainer.querySelector('.page-container').insertAdjacentElement('beforebegin', staffCustomButtons); } } document.addEventListener("appLoaded", addCustomButtonsToStaff); /* ----------- END Add Custom Buttons to Calendar ----------- */ document.addEventListener("appLoaded", () => { const stayConnectedTitle = document.querySelectorAll("#footer-f1 .footer-column-last h2"); if (stayConnectedTitle) { stayConnectedTitle.forEach(programsTitle => { programsTitle.innerText = "Connect With Us"; }); } }); /* ----------- Make Child Program Images Clickable ----------- */ const programs = document.querySelector("#programs-v2") const miniPrograms = document.querySelectorAll("#programs-v2 .program-row .forward") const stackedMiniPrograms = document.querySelectorAll("#programs-v2 .stacked-programs li") document.addEventListener('appLoaded', (event)=> { const linkAdder = (program) => { const link = program.querySelector("h3 a").href const text = program.querySelector(".program-description") const originalHTML = program.innerHTML program.innerHTML = `${originalHTML}` text.innerHTML = `${text}` } miniPrograms.forEach((p) => { // run a function on p linkAdder(p) }) stackedMiniPrograms.forEach((p) => { // run a function on p linkAdder(p) }) }); /* ----------- END Child Program Images Clickable ----------- */ function addCalendarButton() { const pageId = document.querySelector("#athletics"); if (pageId) { const targetElement = document.querySelector("#filter-container"); if (targetElement) { const buttonHTML = "Ticket Info"; targetElement.insertAdjacentHTML('beforebegin', buttonHTML); } } } window.addEventListener("appLoaded", addCalendarButton);

Ross Sterling Middle School

Humble High School Color Guard