diff --git a/src/SEQTA.ts b/src/SEQTA.ts
index 2fe239f4..3164b226 100644
--- a/src/SEQTA.ts
+++ b/src/SEQTA.ts
@@ -1275,6 +1275,20 @@ function CheckUnmarkedAttendance(lessonattendance: any) {
return lesson
}
+function convertTo12HourFormat(time: string): string {
+ let [hours, minutes] = time.split(':').map(Number);
+ let period = 'AM';
+
+ if (hours >= 12) {
+ period = 'PM';
+ if (hours > 12) hours -= 12;
+ } else if (hours === 0) {
+ hours = 12;
+ }
+
+ return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')} ${period}`;
+}
+
function callHomeTimetable(date: string, change?: any) {
// Creates a HTTP Post Request to the SEQTA page for the students timetable
var xhr = new XMLHttpRequest()
@@ -1321,6 +1335,11 @@ function callHomeTimetable(date: string, change?: any) {
lessonArray[i].from = lessonArray[i].from.substring(0, 5)
lessonArray[i].until = lessonArray[i].until.substring(0, 5)
+ if (settingsState.timeFormat === '12') {
+ lessonArray[i].from = convertTo12HourFormat(lessonArray[i].from)
+ lessonArray[i].until = convertTo12HourFormat(lessonArray[i].until)
+ }
+
// Checks if attendance is unmarked, and sets the string to " ".
lessonArray[i].attendanceTitle = CheckUnmarkedAttendance(
lessonArray[i].attendance,
@@ -1864,22 +1883,19 @@ export async function loadHomePage() {
document.title = 'Home ― SEQTA Learn'
const element = document.querySelector('[data-key=home]')
- await new Promise((resolve) => {
- // Delay to prevent SEQTA from removing the UI elements
- setTimeout(resolve, 8)
- })
+ await delay(8)
// Apply the active class to indicate clicked on home button
element!.classList.add('active')
// Remove all current elements in the main div to add new elements
const main = document.getElementById('main')
-
- main!.innerHTML = ''
-
+
if (!main) {
console.error('Main element not found.')
return
+ } else {
+ main!.innerHTML = ''
}
const icon = document.querySelector('link[rel*="icon"]')! as HTMLLinkElement
@@ -1901,12 +1917,27 @@ export async function loadHomePage() {
const date = new Date()
// Creates the shortcut container into the home container
- const Shortcut = stringToHTML('')
+ const Shortcut = stringToHTML(/* html */`
+ `)
+
// Appends the shortcut container into the home container
document.getElementById('home-container')?.append(Shortcut?.firstChild!)
// Creates the container div for the timetable portion of the home page
- const Timetable = stringToHTML('')
+ const Timetable = stringToHTML(/* html */`
+ `)
+
// Appends the timetable container into the home container
document.getElementById('home-container')?.append(Timetable?.firstChild!)
diff --git a/src/interface/hooks/settingsState.ts b/src/interface/hooks/settingsState.ts
index 0562a224..f7ee23fb 100644
--- a/src/interface/hooks/settingsState.ts
+++ b/src/interface/hooks/settingsState.ts
@@ -2,6 +2,7 @@ import browser from 'webextension-polyfill'
import { useEffect, useMemo } from "react";
import { SettingsProps } from "../types/SettingsProps";
import { MainConfig, SettingsState } from "../types/AppProps";
+import { SettingsState as StorageSettingsState } from '../../types/storage';
let RanOnce = false;
let previousSettingsState: SettingsState
@@ -12,7 +13,7 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) =>
RanOnce = true;
// @ts-expect-error - TODO: Fix this
- browser.storage.local.get().then((result: MainConfig) => {
+ browser.storage.local.get().then((result: StorageSettingsState) => {
setSettingsState({
notificationCollector: result.notificationcollector,
lessonAlerts: result.lessonalert,
@@ -23,7 +24,8 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) =>
shortcuts: result.shortcuts,
customshortcuts: result.customshortcuts,
transparencyEffects: result.transparencyEffects,
- selectedTheme: result.selectedTheme
+ selectedTheme: result.selectedTheme,
+ timeFormat: result.timeFormat
});
});
});
@@ -38,7 +40,8 @@ const useSettingsState = ({ settingsState, setSettingsState }: SettingsProps) =>
"shortcuts": "shortcuts",
"customshortcuts": "customshortcuts",
"transparencyEffects": "transparencyEffects",
- "selectedTheme": "selectedTheme"
+ "selectedTheme": "selectedTheme",
+ "timeFormat": "timeFormat"
}), []);
const storageChangeListener = (changes: browser.Storage.StorageChange) => {
diff --git a/src/interface/pages/SettingsPage/Settings.tsx b/src/interface/pages/SettingsPage/Settings.tsx
index 4b99f3fc..f2cec732 100644
--- a/src/interface/pages/SettingsPage/Settings.tsx
+++ b/src/interface/pages/SettingsPage/Settings.tsx
@@ -11,10 +11,10 @@ import { memo } from 'react';
const Settings: React.FC = () => {
const { settingsState, setSettingsState } = useSettingsContext();
- const switchChange = (key: string, isOn: boolean) => {
+ const switchChange = (key: string, value: boolean | string) => {
setSettingsState({
...settingsState,
- [key]: isOn,
+ [key]: value,
});
};
@@ -61,6 +61,11 @@ const Settings: React.FC = () => {
description: "Sends a native browser notification ~5 minutes prior to lessons.",
modifyElement: switchChange('lessonAlerts', isOn)} />
},
+ {
+ title: "12 Hour Time",
+ description: "Prefer 12 hour time format for SEQTA",
+ modifyElement: switchChange('timeFormat', isOn ? "12" : "24")} />
+ },
{
title: "BetterSEQTA+",
description: "Enables BetterSEQTA+ features",
diff --git a/src/interface/types/AppProps.ts b/src/interface/types/AppProps.ts
index 608a6021..0175de06 100644
--- a/src/interface/types/AppProps.ts
+++ b/src/interface/types/AppProps.ts
@@ -9,6 +9,7 @@ export interface SettingsState {
shortcuts: Shortcut[];
customshortcuts: CustomShortcut[];
transparencyEffects: boolean;
+ timeFormat?: string;
}
interface ToggleItem {
diff --git a/src/types/storage.ts b/src/types/storage.ts
index aa78b247..16e8dc5d 100644
--- a/src/types/storage.ts
+++ b/src/types/storage.ts
@@ -32,7 +32,8 @@ export interface SettingsState {
shortcuts: Shortcut[];
subjectfilters: Record;
transparencyEffects: boolean;
- justupdated?: boolean | null;
+ justupdated?: boolean;
+ timeFormat?: string;
}
interface ToggleItem {