mirror of
https://github.com/BetterSEQTA/BetterSEQTA-Plus.git
synced 2026-06-06 03:34:40 +00:00
refactor: clean up initialisation logic
This commit is contained in:
sethburkart123
+222
-261
@@ -775,7 +775,6 @@ export async function ObserveMenuItemPosition() {
|
||||
}
|
||||
|
||||
function main(storedSetting: SettingsState) {
|
||||
// Handle undefined onoff setting
|
||||
if (typeof storedSetting.onoff === 'undefined') {
|
||||
browser.runtime.sendMessage({ type: 'setDefaultStorage' })
|
||||
}
|
||||
@@ -797,7 +796,6 @@ function main(storedSetting: SettingsState) {
|
||||
loading()
|
||||
InjectCustomIcons()
|
||||
HideMenuItems()
|
||||
CheckLoadOnPeriods()
|
||||
tryLoad()
|
||||
|
||||
window.addEventListener('load', tryLoad)
|
||||
@@ -855,22 +853,6 @@ export function AppendElementsToDisabledPage() {
|
||||
document.head.append(settingsStyle)
|
||||
}
|
||||
|
||||
var PageLoaded = false
|
||||
async function CheckLoadOnPeriods() {
|
||||
if (!PageLoaded) {
|
||||
await delay(1000)
|
||||
var code = document.getElementsByClassName('code')[0]
|
||||
if (code && !UserInitalCode) {
|
||||
LoadPageElements()
|
||||
finishLoad()
|
||||
PageLoaded = true
|
||||
}
|
||||
if (!code) {
|
||||
CheckLoadOnPeriods()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function closeSettings() {
|
||||
const ExtensionSettings = document.getElementById('ExtensionPopup')!
|
||||
const ExtensionIframe = document.getElementById('ExtensionIframe') as HTMLIFrameElement
|
||||
@@ -1174,266 +1156,245 @@ function ReplaceMenuSVG(element: HTMLElement, svg: string) {
|
||||
}
|
||||
|
||||
async function AddBetterSEQTAElements(toggle: any) {
|
||||
const code = document.getElementsByClassName('code')[0]
|
||||
// Replaces students code with the version of BetterSEQTA
|
||||
if (code != null) {
|
||||
if (!code.innerHTML.includes('BetterSEQTA')) {
|
||||
UserInitalCode = code.innerHTML
|
||||
code.innerHTML = `BetterSEQTA+ v${browser.runtime.getManifest().version}`
|
||||
code.setAttribute('data-hover', 'Click for user code')
|
||||
code.addEventListener('click', function () {
|
||||
var code = document.getElementsByClassName('code')[0]
|
||||
if (code.innerHTML.includes('BetterSEQTA')) {
|
||||
code.innerHTML = UserInitalCode
|
||||
code.setAttribute('data-hover', 'Click for BetterSEQTA+ version')
|
||||
} else {
|
||||
code.innerHTML = `BetterSEQTA+ v${
|
||||
browser.runtime.getManifest().version
|
||||
}`
|
||||
code.setAttribute('data-hover', 'Click for user code')
|
||||
}
|
||||
if (toggle) {
|
||||
// Creates Home menu button and appends it as the first child of the list
|
||||
|
||||
const result = await browser.storage.local.get()
|
||||
|
||||
animbkEnable(result)
|
||||
updateBgDurations(result)
|
||||
|
||||
DarkMode = result.DarkMode
|
||||
if (DarkMode) {
|
||||
document.documentElement.classList.add('dark')
|
||||
}
|
||||
|
||||
const container = document.getElementById('content')!
|
||||
const div = document.createElement('div')
|
||||
div.classList.add('titlebar')
|
||||
container.append(div)
|
||||
const NewButton = stringToHTML('<li class="item" data-key="home" id="homebutton" data-path="/home" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z" /></svg><span>Home</span></label></li>')
|
||||
|
||||
const menu = document.getElementById('menu')!
|
||||
const List = menu.firstChild! as HTMLElement
|
||||
|
||||
if (NewButton.firstChild) {
|
||||
List.insertBefore(NewButton.firstChild, List.firstChild)
|
||||
}
|
||||
|
||||
try {
|
||||
// Fetch the response and wait for it
|
||||
const response = await fetch(`${location.origin}/seqta/student/login`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json; charset=utf-8',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
mode: 'normal',
|
||||
query: null,
|
||||
redirect_url: location.origin,
|
||||
}),
|
||||
})
|
||||
if (toggle) {
|
||||
// Creates Home menu button and appends it as the first child of the list
|
||||
|
||||
const result = await browser.storage.local.get()
|
||||
// Parse the JSON response and wait for it
|
||||
const responseData = await response.json()
|
||||
let info = responseData.payload
|
||||
|
||||
animbkEnable(result)
|
||||
updateBgDurations(result)
|
||||
// Manipulate the DOM as needed
|
||||
const titlebar = document.getElementsByClassName('titlebar')[0]
|
||||
const userInfo = stringToHTML(
|
||||
/* html */`
|
||||
<div class="userInfosvgdiv tooltip">
|
||||
<svg class="userInfosvg" viewBox="0 0 24 24"><path fill="var(--text-primary)" d="M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z"></path></svg>
|
||||
<div class="tooltiptext topmenutooltip" id="logouttooltip"></div>
|
||||
</div>
|
||||
`
|
||||
).firstChild
|
||||
titlebar.append(userInfo!)
|
||||
|
||||
DarkMode = result.DarkMode
|
||||
if (DarkMode) {
|
||||
document.documentElement.classList.add('dark')
|
||||
}
|
||||
const userinfo = stringToHTML(/* html */
|
||||
`<div class="userInfo">
|
||||
<div class="userInfoText">
|
||||
<div style="display: flex; align-items: center;">
|
||||
<p class="userInfohouse userInfoCode"></p>
|
||||
<p class="userInfoName">${info.userDesc}</p>
|
||||
</div>
|
||||
<p class="userInfoCode">${UserInitalCode}</p>
|
||||
</div>
|
||||
</div>`).firstChild
|
||||
titlebar.append(userinfo!)
|
||||
|
||||
const container = document.getElementById('content')!
|
||||
const div = document.createElement('div')
|
||||
div.classList.add('titlebar')
|
||||
container.append(div)
|
||||
const NewButton = stringToHTML('<li class="item" data-key="home" id="homebutton" data-path="/home" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z" /></svg><span>Home</span></label></li>')
|
||||
var logoutbutton = document.getElementsByClassName('logout')[0]
|
||||
var userInfosvgdiv = document.getElementById('logouttooltip')!
|
||||
userInfosvgdiv.appendChild(logoutbutton)
|
||||
|
||||
const menu = document.getElementById('menu')!
|
||||
const List = menu.firstChild! as HTMLElement
|
||||
// Await the fetch response
|
||||
const peopleResponse = await fetch(`${location.origin}/seqta/student/load/message/people`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json; charset=utf-8',
|
||||
},
|
||||
body: JSON.stringify({ mode: 'student' }),
|
||||
})
|
||||
|
||||
if (NewButton.firstChild) {
|
||||
List.insertBefore(NewButton.firstChild, List.firstChild)
|
||||
}
|
||||
// Await the JSON parsing of the response
|
||||
const peopleResponseData = await peopleResponse.json()
|
||||
let students = peopleResponseData.payload
|
||||
|
||||
try {
|
||||
// Fetch the response and wait for it
|
||||
const response = await fetch(`${location.origin}/seqta/student/login`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json; charset=utf-8',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
mode: 'normal',
|
||||
query: null,
|
||||
redirect_url: location.origin,
|
||||
}),
|
||||
})
|
||||
|
||||
// Parse the JSON response and wait for it
|
||||
const responseData = await response.json()
|
||||
let info = responseData.payload
|
||||
|
||||
// Manipulate the DOM as needed
|
||||
const titlebar = document.getElementsByClassName('titlebar')[0]
|
||||
const userInfo = stringToHTML(
|
||||
/* html */`
|
||||
<div class="userInfosvgdiv tooltip">
|
||||
<svg class="userInfosvg" viewBox="0 0 24 24"><path fill="var(--text-primary)" d="M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z"></path></svg>
|
||||
<div class="tooltiptext topmenutooltip" id="logouttooltip"></div>
|
||||
</div>
|
||||
`
|
||||
).firstChild
|
||||
titlebar.append(userInfo!)
|
||||
|
||||
const userinfo = stringToHTML(/* html */
|
||||
`<div class="userInfo">
|
||||
<div class="userInfoText">
|
||||
<div style="display: flex; align-items: center;">
|
||||
<p class="userInfohouse userInfoCode"></p>
|
||||
<p class="userInfoName">${info.userDesc}</p>
|
||||
</div>
|
||||
<p class="userInfoCode">${UserInitalCode}</p>
|
||||
</div>
|
||||
</div>`).firstChild
|
||||
titlebar.append(userinfo!)
|
||||
|
||||
var logoutbutton = document.getElementsByClassName('logout')[0]
|
||||
var userInfosvgdiv = document.getElementById('logouttooltip')!
|
||||
userInfosvgdiv.appendChild(logoutbutton)
|
||||
|
||||
// Await the fetch response
|
||||
const peopleResponse = await fetch(`${location.origin}/seqta/student/load/message/people`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json; charset=utf-8',
|
||||
},
|
||||
body: JSON.stringify({ mode: 'student' }),
|
||||
})
|
||||
|
||||
// Await the JSON parsing of the response
|
||||
const peopleResponseData = await peopleResponse.json()
|
||||
let students = peopleResponseData.payload
|
||||
|
||||
// Process the students data
|
||||
var index = students.findIndex(function (person: any) {
|
||||
return (
|
||||
person.firstname == info.userDesc.split(' ')[0] &&
|
||||
person.surname == info.userDesc.split(' ')[1]
|
||||
)
|
||||
})
|
||||
|
||||
let houseelement1 = document.getElementsByClassName('userInfohouse')[0]
|
||||
const houseelement = houseelement1 as HTMLElement
|
||||
if (students[index]?.house) {
|
||||
if (students[index]?.house_colour) {
|
||||
houseelement.style.background = students[index].house_colour
|
||||
try {
|
||||
let colorresult = GetThresholdOfColor(students[index]?.house_colour)
|
||||
|
||||
houseelement.style.color = colorresult && colorresult > 300 ? 'black' : 'white'
|
||||
houseelement.innerText = students[index].year + students[index].house
|
||||
} catch (error) {
|
||||
houseelement.innerText = students[index].house
|
||||
}
|
||||
}
|
||||
} else {
|
||||
houseelement.innerText = students[index].year
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error fetching and processing student data:', error)
|
||||
}
|
||||
|
||||
const NewsButtonStr = '<li class="item" data-key="news" id="newsbutton" data-path="/news" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M20 3H4C2.89 3 2 3.89 2 5V19C2 20.11 2.89 21 4 21H20C21.11 21 22 20.11 22 19V5C22 3.89 21.11 3 20 3M5 7H10V13H5V7M19 17H5V15H19V17M19 13H12V11H19V13M19 9H12V7H19V9Z" /></svg><span>News</span></label></li>'
|
||||
const NewsButton = stringToHTML(NewsButtonStr)
|
||||
List!.appendChild(NewsButton.firstChild!)
|
||||
|
||||
let a = document.createElement('div')
|
||||
a.classList.add('icon-cover')
|
||||
a.id = 'icon-cover'
|
||||
menu!.appendChild(a)
|
||||
|
||||
const menuCover = document.querySelector('#icon-cover')
|
||||
menuCover!.addEventListener('click', function () {
|
||||
location.href = '../#?page=/home'
|
||||
loadHomePage();
|
||||
(document!
|
||||
.getElementById('menu')!
|
||||
.firstChild! as HTMLElement).classList.remove('noscroll')
|
||||
})
|
||||
// Creates the home container when the menu button is pressed
|
||||
const homebutton = document.getElementById('homebutton')
|
||||
homebutton!.addEventListener('click', function () {
|
||||
if (!MenuOptionsOpen) {
|
||||
loadHomePage()
|
||||
}
|
||||
})
|
||||
|
||||
// Creates the news container when the menu button is pressed
|
||||
const newsbutton = document.getElementById('newsbutton')
|
||||
newsbutton!.addEventListener('click', function () {
|
||||
if (!MenuOptionsOpen) {
|
||||
SendNewsPage()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
appendBackgroundToUI()
|
||||
addExtensionSettings()
|
||||
|
||||
// If betterSEQTA+ is enabled, run the code
|
||||
if (toggle) {
|
||||
// Creates settings and dashboard buttons next to alerts
|
||||
let SettingsButton = stringToHTML(
|
||||
'<button class="addedButton tooltip" id="AddedSettings""><svg width="24" height="24" viewBox="0 0 24 24"><g><g><path d="M23.182,6.923c-.29,0-3.662,2.122-4.142,2.4l-2.8-1.555V4.511l4.257-2.456a.518.518,0,0,0,.233-.408.479.479,0,0,0-.233-.407,6.511,6.511,0,1,0-3.327,12.107,6.582,6.582,0,0,0,6.148-4.374,5.228,5.228,0,0,0,.333-1.542A.461.461,0,0,0,23.182,6.923Z"></path><path d="M9.73,10.418,7.376,12.883c-.01.01-.021.016-.03.025L1.158,19.1a2.682,2.682,0,1,0,3.793,3.793l4.583-4.582,0,0,4.1-4.005-.037-.037A9.094,9.094,0,0,1,9.73,10.418ZM3.053,21.888A.894.894,0,1,1,3.946,21,.893.893,0,0,1,3.053,21.888Z"></path></g></g></svg><div class="tooltiptext topmenutooltip">BetterSEQTA+ Settings</div></button>',
|
||||
// Process the students data
|
||||
var index = students.findIndex(function (person: any) {
|
||||
return (
|
||||
person.firstname == info.userDesc.split(' ')[0] &&
|
||||
person.surname == info.userDesc.split(' ')[1]
|
||||
)
|
||||
let ContentDiv = document.getElementById('content')
|
||||
ContentDiv!.append(SettingsButton.firstChild!)
|
||||
})
|
||||
|
||||
const result: any = await new Promise(resolve => {
|
||||
const result = browser.storage.local.get()
|
||||
result.then(resolve, onError)
|
||||
})
|
||||
let houseelement1 = document.getElementsByClassName('userInfohouse')[0]
|
||||
const houseelement = houseelement1 as HTMLElement
|
||||
if (students[index]?.house) {
|
||||
if (students[index]?.house_colour) {
|
||||
houseelement.style.background = students[index].house_colour
|
||||
try {
|
||||
let colorresult = GetThresholdOfColor(students[index]?.house_colour)
|
||||
|
||||
const DarkMode = result!.DarkMode
|
||||
const tooltipString = GetLightDarkModeString(DarkMode)
|
||||
const svgContent = DarkMode ? '<defs><clipPath id="__lottie_element_80"><rect width="24" height="24" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_80)"><g style="display: block;" transform="matrix(1,0,0,1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,-4 C-2.2100000381469727,-4 -4,-2.2100000381469727 -4,0 C-4,2.2100000381469727 -2.2100000381469727,4 0,4 C2.2100000381469727,4 4,2.2100000381469727 4,0 C4,-2.2100000381469727 2.2100000381469727,-4 0,-4z"></path></g></g><g style="display: block;" transform="matrix(1,0,0,1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,6 C-3.309999942779541,6 -6,3.309999942779541 -6,0 C-6,-3.309999942779541 -3.309999942779541,-6 0,-6 C3.309999942779541,-6 6,-3.309999942779541 6,0 C6,3.309999942779541 3.309999942779541,6 0,6z M8,-3.309999942779541 C8,-3.309999942779541 8,-8 8,-8 C8,-8 3.309999942779541,-8 3.309999942779541,-8 C3.309999942779541,-8 0,-11.3100004196167 0,-11.3100004196167 C0,-11.3100004196167 -3.309999942779541,-8 -3.309999942779541,-8 C-3.309999942779541,-8 -8,-8 -8,-8 C-8,-8 -8,-3.309999942779541 -8,-3.309999942779541 C-8,-3.309999942779541 -11.3100004196167,0 -11.3100004196167,0 C-11.3100004196167,0 -8,3.309999942779541 -8,3.309999942779541 C-8,3.309999942779541 -8,8 -8,8 C-8,8 -3.309999942779541,8 -3.309999942779541,8 C-3.309999942779541,8 0,11.3100004196167 0,11.3100004196167 C0,11.3100004196167 3.309999942779541,8 3.309999942779541,8 C3.309999942779541,8 8,8 8,8 C8,8 8,3.309999942779541 8,3.309999942779541 C8,3.309999942779541 11.3100004196167,0 11.3100004196167,0 C11.3100004196167,0 8,-3.309999942779541 8,-3.309999942779541z"></path></g></g></g>' :
|
||||
'<defs><clipPath id="__lottie_element_263"><rect width="24" height="24" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_263)"><g style="display: block;" transform="matrix(1.5,0,0,1.5,7,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,-4 C-2.2100000381469727,-4 -1.2920000553131104,-2.2100000381469727 -1.2920000553131104,0 C-1.2920000553131104,2.2100000381469727 -2.2100000381469727,4 0,4 C2.2100000381469727,4 4,2.2100000381469727 4,0 C4,-2.2100000381469727 2.2100000381469727,-4 0,-4z"></path></g></g><g style="display: block;" transform="matrix(-1,0,0,-1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,6 C-3.309999942779541,6 -6,3.309999942779541 -6,0 C-6,-3.309999942779541 -3.309999942779541,-6 0,-6 C3.309999942779541,-6 6,-3.309999942779541 6,0 C6,3.309999942779541 3.309999942779541,6 0,6z M8,-3.309999942779541 C8,-3.309999942779541 8,-8 8,-8 C8,-8 3.309999942779541,-8 3.309999942779541,-8 C3.309999942779541,-8 0,-11.3100004196167 0,-11.3100004196167 C0,-11.3100004196167 -3.309999942779541,-8 -3.309999942779541,-8 C-3.309999942779541,-8 -8,-8 -8,-8 C-8,-8 -8,-3.309999942779541 -8,-3.309999942779541 C-8,-3.309999942779541 -11.3100004196167,0 -11.3100004196167,0 C-11.3100004196167,0 -8,3.309999942779541 -8,3.309999942779541 C-8,3.309999942779541 -8,8 -8,8 C-8,8 -3.309999942779541,8 -3.309999942779541,8 C-3.309999942779541,8 0,11.3100004196167 0,11.3100004196167 C0,11.3100004196167 3.309999942779541,8 3.309999942779541,8 C3.309999942779541,8 8,8 8,8 C8,8 8,3.309999942779541 8,3.309999942779541 C8,3.309999942779541 11.3100004196167,0 11.3100004196167,0 C11.3100004196167,0 8,-3.309999942779541 8,-3.309999942779541z"></path></g></g></g>'
|
||||
|
||||
const LightDarkModeButton = stringToHTML(`
|
||||
<button class="addedButton DarkLightButton tooltip" id="LightDarkModeButton">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">${svgContent}</svg>
|
||||
<div class="tooltiptext topmenutooltip" id="darklighttooliptext">${tooltipString}</div>
|
||||
</button>
|
||||
`)
|
||||
|
||||
ContentDiv!.append(LightDarkModeButton.firstChild!)
|
||||
|
||||
updateAllColors(DarkMode, result.selectedColor)
|
||||
|
||||
document.getElementById('LightDarkModeButton')!.addEventListener('click', async () => {
|
||||
const result: any = await new Promise(resolve => {
|
||||
const result = browser.storage.local.get()
|
||||
result.then(resolve, onError)
|
||||
})
|
||||
|
||||
console.log(!settingsState.DarkMode)
|
||||
settingsState.DarkMode = !settingsState.DarkMode;
|
||||
|
||||
updateAllColors(!settingsState.DarkMode, result.selectedColor)
|
||||
|
||||
const darklightText = document.getElementById('darklighttooliptext')
|
||||
darklightText!.innerText = GetLightDarkModeString(!settingsState.DarkMode)
|
||||
})
|
||||
|
||||
// Locate the menuToggle element
|
||||
const menuToggle = document.getElementById('menuToggle')
|
||||
menuToggle!.innerHTML = ''
|
||||
|
||||
// Create three divs to act as lines of the hamburger icon
|
||||
for (let i = 0; i < 3; i++) {
|
||||
const line = document.createElement('div')
|
||||
line.className = 'hamburger-line'
|
||||
menuToggle!.appendChild(line)
|
||||
houseelement.style.color = colorresult && colorresult > 300 ? 'black' : 'white'
|
||||
houseelement.innerText = students[index].year + students[index].house
|
||||
} catch (error) {
|
||||
houseelement.innerText = students[index].house
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Creates settings and dashboard buttons next to alerts
|
||||
let SettingsButton = stringToHTML(
|
||||
'<button class="addedButton" id="AddedSettings""><svg width="24" height="24" viewBox="0 0 24 24"><g style="fill: var(--text-color);"><g><path d="M23.182,6.923c-.29,0-3.662,2.122-4.142,2.4l-2.8-1.555V4.511l4.257-2.456a.518.518,0,0,0,.233-.408.479.479,0,0,0-.233-.407,6.511,6.511,0,1,0-3.327,12.107,6.582,6.582,0,0,0,6.148-4.374,5.228,5.228,0,0,0,.333-1.542A.461.461,0,0,0,23.182,6.923Z"></path><path d="M9.73,10.418,7.376,12.883c-.01.01-.021.016-.03.025L1.158,19.1a2.682,2.682,0,1,0,3.793,3.793l4.583-4.582,0,0,4.1-4.005-.037-.037A9.094,9.094,0,0,1,9.73,10.418ZM3.053,21.888A.894.894,0,1,1,3.946,21,.893.893,0,0,1,3.053,21.888Z"></path></g></g></svg></button>',
|
||||
)
|
||||
let ContentDiv = document.getElementById('content')
|
||||
ContentDiv!.append(SettingsButton.firstChild!)
|
||||
houseelement.innerText = students[index].year
|
||||
}
|
||||
|
||||
var AddedSettings = document.getElementById('AddedSettings')
|
||||
var extensionPopup = document.getElementById('ExtensionPopup')
|
||||
|
||||
AddedSettings!.addEventListener('click', function () {
|
||||
if (SettingsClicked) {
|
||||
extensionPopup!.classList.add('hide')
|
||||
animate(
|
||||
'#ExtensionPopup',
|
||||
{ opacity: [1, 0], scale: [1, 0] },
|
||||
{ easing: spring({ stiffness: 220, damping: 18 }) }
|
||||
);
|
||||
(document.getElementById('ExtensionIframe')! as HTMLIFrameElement).contentWindow!.postMessage('popupClosed', '*')
|
||||
SettingsClicked = false;
|
||||
} else {
|
||||
extensionPopup!.classList.remove('hide')
|
||||
animate(
|
||||
'#ExtensionPopup',
|
||||
{ opacity: [0, 1], scale: [0, 1] },
|
||||
{ easing: spring({ stiffness: 260, damping: 24 }) }
|
||||
)
|
||||
SettingsClicked = true
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('Error fetching and processing student data:', error)
|
||||
}
|
||||
|
||||
const NewsButtonStr = '<li class="item" data-key="news" id="newsbutton" data-path="/news" data-betterseqta="true"><label><svg style="width:24px;height:24px" viewBox="0 0 24 24"><path fill="currentColor" d="M20 3H4C2.89 3 2 3.89 2 5V19C2 20.11 2.89 21 4 21H20C21.11 21 22 20.11 22 19V5C22 3.89 21.11 3 20 3M5 7H10V13H5V7M19 17H5V15H19V17M19 13H12V11H19V13M19 9H12V7H19V9Z" /></svg><span>News</span></label></li>'
|
||||
const NewsButton = stringToHTML(NewsButtonStr)
|
||||
List!.appendChild(NewsButton.firstChild!)
|
||||
|
||||
let a = document.createElement('div')
|
||||
a.classList.add('icon-cover')
|
||||
a.id = 'icon-cover'
|
||||
menu!.appendChild(a)
|
||||
|
||||
const menuCover = document.querySelector('#icon-cover')
|
||||
menuCover!.addEventListener('click', function () {
|
||||
location.href = '../#?page=/home'
|
||||
loadHomePage();
|
||||
(document!
|
||||
.getElementById('menu')!
|
||||
.firstChild! as HTMLElement).classList.remove('noscroll')
|
||||
})
|
||||
// Creates the home container when the menu button is pressed
|
||||
const homebutton = document.getElementById('homebutton')
|
||||
homebutton!.addEventListener('click', function () {
|
||||
if (!MenuOptionsOpen) {
|
||||
loadHomePage()
|
||||
}
|
||||
})
|
||||
|
||||
// Creates the news container when the menu button is pressed
|
||||
const newsbutton = document.getElementById('newsbutton')
|
||||
newsbutton!.addEventListener('click', function () {
|
||||
if (!MenuOptionsOpen) {
|
||||
SendNewsPage()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
appendBackgroundToUI()
|
||||
addExtensionSettings()
|
||||
|
||||
// If betterSEQTA+ is enabled, run the code
|
||||
if (toggle) {
|
||||
// Creates settings and dashboard buttons next to alerts
|
||||
let SettingsButton = stringToHTML(
|
||||
'<button class="addedButton tooltip" id="AddedSettings""><svg width="24" height="24" viewBox="0 0 24 24"><g><g><path d="M23.182,6.923c-.29,0-3.662,2.122-4.142,2.4l-2.8-1.555V4.511l4.257-2.456a.518.518,0,0,0,.233-.408.479.479,0,0,0-.233-.407,6.511,6.511,0,1,0-3.327,12.107,6.582,6.582,0,0,0,6.148-4.374,5.228,5.228,0,0,0,.333-1.542A.461.461,0,0,0,23.182,6.923Z"></path><path d="M9.73,10.418,7.376,12.883c-.01.01-.021.016-.03.025L1.158,19.1a2.682,2.682,0,1,0,3.793,3.793l4.583-4.582,0,0,4.1-4.005-.037-.037A9.094,9.094,0,0,1,9.73,10.418ZM3.053,21.888A.894.894,0,1,1,3.946,21,.893.893,0,0,1,3.053,21.888Z"></path></g></g></svg><div class="tooltiptext topmenutooltip">BetterSEQTA+ Settings</div></button>',
|
||||
)
|
||||
let ContentDiv = document.getElementById('content')
|
||||
ContentDiv!.append(SettingsButton.firstChild!)
|
||||
|
||||
const result: any = await new Promise(resolve => {
|
||||
const result = browser.storage.local.get()
|
||||
result.then(resolve, onError)
|
||||
})
|
||||
|
||||
const DarkMode = result!.DarkMode
|
||||
const tooltipString = GetLightDarkModeString(DarkMode)
|
||||
const svgContent = DarkMode ? '<defs><clipPath id="__lottie_element_80"><rect width="24" height="24" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_80)"><g style="display: block;" transform="matrix(1,0,0,1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,-4 C-2.2100000381469727,-4 -4,-2.2100000381469727 -4,0 C-4,2.2100000381469727 -2.2100000381469727,4 0,4 C2.2100000381469727,4 4,2.2100000381469727 4,0 C4,-2.2100000381469727 2.2100000381469727,-4 0,-4z"></path></g></g><g style="display: block;" transform="matrix(1,0,0,1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,6 C-3.309999942779541,6 -6,3.309999942779541 -6,0 C-6,-3.309999942779541 -3.309999942779541,-6 0,-6 C3.309999942779541,-6 6,-3.309999942779541 6,0 C6,3.309999942779541 3.309999942779541,6 0,6z M8,-3.309999942779541 C8,-3.309999942779541 8,-8 8,-8 C8,-8 3.309999942779541,-8 3.309999942779541,-8 C3.309999942779541,-8 0,-11.3100004196167 0,-11.3100004196167 C0,-11.3100004196167 -3.309999942779541,-8 -3.309999942779541,-8 C-3.309999942779541,-8 -8,-8 -8,-8 C-8,-8 -8,-3.309999942779541 -8,-3.309999942779541 C-8,-3.309999942779541 -11.3100004196167,0 -11.3100004196167,0 C-11.3100004196167,0 -8,3.309999942779541 -8,3.309999942779541 C-8,3.309999942779541 -8,8 -8,8 C-8,8 -3.309999942779541,8 -3.309999942779541,8 C-3.309999942779541,8 0,11.3100004196167 0,11.3100004196167 C0,11.3100004196167 3.309999942779541,8 3.309999942779541,8 C3.309999942779541,8 8,8 8,8 C8,8 8,3.309999942779541 8,3.309999942779541 C8,3.309999942779541 11.3100004196167,0 11.3100004196167,0 C11.3100004196167,0 8,-3.309999942779541 8,-3.309999942779541z"></path></g></g></g>' :
|
||||
'<defs><clipPath id="__lottie_element_263"><rect width="24" height="24" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_263)"><g style="display: block;" transform="matrix(1.5,0,0,1.5,7,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,-4 C-2.2100000381469727,-4 -1.2920000553131104,-2.2100000381469727 -1.2920000553131104,0 C-1.2920000553131104,2.2100000381469727 -2.2100000381469727,4 0,4 C2.2100000381469727,4 4,2.2100000381469727 4,0 C4,-2.2100000381469727 2.2100000381469727,-4 0,-4z"></path></g></g><g style="display: block;" transform="matrix(-1,0,0,-1,12,12)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill-opacity="1" d=" M0,6 C-3.309999942779541,6 -6,3.309999942779541 -6,0 C-6,-3.309999942779541 -3.309999942779541,-6 0,-6 C3.309999942779541,-6 6,-3.309999942779541 6,0 C6,3.309999942779541 3.309999942779541,6 0,6z M8,-3.309999942779541 C8,-3.309999942779541 8,-8 8,-8 C8,-8 3.309999942779541,-8 3.309999942779541,-8 C3.309999942779541,-8 0,-11.3100004196167 0,-11.3100004196167 C0,-11.3100004196167 -3.309999942779541,-8 -3.309999942779541,-8 C-3.309999942779541,-8 -8,-8 -8,-8 C-8,-8 -8,-3.309999942779541 -8,-3.309999942779541 C-8,-3.309999942779541 -11.3100004196167,0 -11.3100004196167,0 C-11.3100004196167,0 -8,3.309999942779541 -8,3.309999942779541 C-8,3.309999942779541 -8,8 -8,8 C-8,8 -3.309999942779541,8 -3.309999942779541,8 C-3.309999942779541,8 0,11.3100004196167 0,11.3100004196167 C0,11.3100004196167 3.309999942779541,8 3.309999942779541,8 C3.309999942779541,8 8,8 8,8 C8,8 8,3.309999942779541 8,3.309999942779541 C8,3.309999942779541 11.3100004196167,0 11.3100004196167,0 C11.3100004196167,0 8,-3.309999942779541 8,-3.309999942779541z"></path></g></g></g>'
|
||||
|
||||
const LightDarkModeButton = stringToHTML(`
|
||||
<button class="addedButton DarkLightButton tooltip" id="LightDarkModeButton">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">${svgContent}</svg>
|
||||
<div class="tooltiptext topmenutooltip" id="darklighttooliptext">${tooltipString}</div>
|
||||
</button>
|
||||
`)
|
||||
|
||||
ContentDiv!.append(LightDarkModeButton.firstChild!)
|
||||
|
||||
updateAllColors(DarkMode, result.selectedColor)
|
||||
|
||||
document.getElementById('LightDarkModeButton')!.addEventListener('click', async () => {
|
||||
const result: any = await new Promise(resolve => {
|
||||
const result = browser.storage.local.get()
|
||||
result.then(resolve, onError)
|
||||
})
|
||||
|
||||
console.log(!settingsState.DarkMode)
|
||||
settingsState.DarkMode = !settingsState.DarkMode;
|
||||
|
||||
updateAllColors(!settingsState.DarkMode, result.selectedColor)
|
||||
|
||||
const darklightText = document.getElementById('darklighttooliptext')
|
||||
darklightText!.innerText = GetLightDarkModeString(!settingsState.DarkMode)
|
||||
})
|
||||
|
||||
// Locate the menuToggle element
|
||||
const menuToggle = document.getElementById('menuToggle')
|
||||
menuToggle!.innerHTML = ''
|
||||
|
||||
// Create three divs to act as lines of the hamburger icon
|
||||
for (let i = 0; i < 3; i++) {
|
||||
const line = document.createElement('div')
|
||||
line.className = 'hamburger-line'
|
||||
menuToggle!.appendChild(line)
|
||||
}
|
||||
} else {
|
||||
// Creates settings and dashboard buttons next to alerts
|
||||
let SettingsButton = stringToHTML(
|
||||
'<button class="addedButton" id="AddedSettings""><svg width="24" height="24" viewBox="0 0 24 24"><g style="fill: var(--text-color);"><g><path d="M23.182,6.923c-.29,0-3.662,2.122-4.142,2.4l-2.8-1.555V4.511l4.257-2.456a.518.518,0,0,0,.233-.408.479.479,0,0,0-.233-.407,6.511,6.511,0,1,0-3.327,12.107,6.582,6.582,0,0,0,6.148-4.374,5.228,5.228,0,0,0,.333-1.542A.461.461,0,0,0,23.182,6.923Z"></path><path d="M9.73,10.418,7.376,12.883c-.01.01-.021.016-.03.025L1.158,19.1a2.682,2.682,0,1,0,3.793,3.793l4.583-4.582,0,0,4.1-4.005-.037-.037A9.094,9.094,0,0,1,9.73,10.418ZM3.053,21.888A.894.894,0,1,1,3.946,21,.893.893,0,0,1,3.053,21.888Z"></path></g></g></svg></button>',
|
||||
)
|
||||
let ContentDiv = document.getElementById('content')
|
||||
ContentDiv!.append(SettingsButton.firstChild!)
|
||||
}
|
||||
|
||||
var AddedSettings = document.getElementById('AddedSettings')
|
||||
var extensionPopup = document.getElementById('ExtensionPopup')
|
||||
|
||||
AddedSettings!.addEventListener('click', function () {
|
||||
if (SettingsClicked) {
|
||||
extensionPopup!.classList.add('hide')
|
||||
animate(
|
||||
'#ExtensionPopup',
|
||||
{ opacity: [1, 0], scale: [1, 0] },
|
||||
{ easing: spring({ stiffness: 220, damping: 18 }) }
|
||||
);
|
||||
(document.getElementById('ExtensionIframe')! as HTMLIFrameElement).contentWindow!.postMessage('popupClosed', '*')
|
||||
SettingsClicked = false;
|
||||
} else {
|
||||
extensionPopup!.classList.remove('hide')
|
||||
animate(
|
||||
'#ExtensionPopup',
|
||||
{ opacity: [0, 1], scale: [0, 1] },
|
||||
{ easing: spring({ stiffness: 260, damping: 24 }) }
|
||||
)
|
||||
SettingsClicked = true
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function GetLightDarkModeString(darkMode: boolean) {
|
||||
|
||||
Reference in New Issue
Block a user