From d68ba1521a7fbcc80da449ffd27072e2c7cbe75b Mon Sep 17 00:00:00 2001
From: Alphons Joseph <93847055+Crazypersonalph@users.noreply.github.com>
Date: Mon, 9 Sep 2024 18:16:59 +0800
Subject: [PATCH] About page button
---
src/SEQTA.ts | 99 +++++++++++++++++++
src/seqta/utils/listeners/MessageListener.ts | 8 +-
.../pages/settings/general.svelte | 12 ++-
3 files changed, 117 insertions(+), 2 deletions(-)
diff --git a/src/SEQTA.ts b/src/SEQTA.ts
index 5eac2715..0f25e7eb 100644
--- a/src/SEQTA.ts
+++ b/src/SEQTA.ts
@@ -343,6 +343,105 @@ export function OpenWhatsNewPopup() {
})
}
+export function OpenAboutPage() {
+ const background = document.createElement('div')
+ background.id = 'whatsnewbk'
+ background.classList.add('whatsnewBackground')
+
+ const container = document.createElement('div')
+ container.classList.add('whatsnewContainer')
+
+ var header: any = stringToHTML(
+ /* html */
+ ``
+ ).firstChild
+
+ let imagecont = document.createElement('div')
+ imagecont.classList.add('whatsnewImgContainer')
+
+ let textcontainer = document.createElement('div')
+ textcontainer.classList.add('whatsnewTextContainer')
+
+ let text = stringToHTML(
+ /* html */ `
+
+ `,
+ ).firstChild
+
+ let footer = stringToHTML(
+ /* html */ `
+
+ `).firstChild
+
+ let exitbutton = document.createElement('div')
+ exitbutton.id = 'whatsnewclosebutton'
+
+ container.append(header)
+ container.append(imagecont)
+ container.append(textcontainer)
+ container.append(text as ChildNode)
+ container.append(footer as ChildNode)
+ container.append(exitbutton)
+
+ background.append(container)
+
+ document.getElementById('container')!.append(background)
+
+ let bkelement = document.getElementById('whatsnewbk')
+ let popup = document.getElementsByClassName('whatsnewContainer')[0]
+
+ if (settingsState.animations) {
+ animate(
+ [popup, bkelement as HTMLElement],
+ { scale: [0, 1], opacity: [0, 1] },
+ { easing: spring({ stiffness: 220, damping: 18 }) }
+ )
+
+ animate(
+ '.whatsnewTextContainer *',
+ { opacity: [0, 1], y: [10, 0] },
+ {
+ delay: stagger(0.05, { start: 0.1 }),
+ duration: 0.5,
+ easing: [.22, .03, .26, 1]
+ }
+ )
+ }
+
+ delete settingsState.justupdated
+
+ bkelement!.addEventListener('click', function (event) {
+ // Check if the click event originated from the element itself and not any of its children
+ if (event.target === bkelement) {
+ DeleteWhatsNew()
+ }
+ });
+
+ var closeelement = document.getElementById('whatsnewclosebutton')
+ closeelement!.addEventListener('click', function () {
+ DeleteWhatsNew()
+ })
+}
+
export async function finishLoad() {
try {
document.querySelector('.legacy-root')?.classList.remove('hidden');
diff --git a/src/seqta/utils/listeners/MessageListener.ts b/src/seqta/utils/listeners/MessageListener.ts
index b4d53146..8dca6921 100644
--- a/src/seqta/utils/listeners/MessageListener.ts
+++ b/src/seqta/utils/listeners/MessageListener.ts
@@ -1,6 +1,6 @@
import browser from 'webextension-polyfill'
-import { closeSettings, MenuOptionsOpen, OpenMenuOptions, OpenWhatsNewPopup } from '../../../SEQTA';
+import { closeSettings, MenuOptionsOpen, OpenMenuOptions, OpenWhatsNewPopup, OpenAboutPage } from '../../../SEQTA';
import { deleteTheme } from '@/seqta/ui/themes/deleteTheme';
import { getAvailableThemes } from '@/seqta/ui/themes/getAvailableThemes';
import { saveTheme } from '@/seqta/ui/themes/saveTheme';
@@ -79,6 +79,12 @@ export class MessageHandler {
closeSettings();
sendResponse({ status: 'success' });
break;
+
+ case 'OpenAboutPage':
+ OpenAboutPage();
+ closeSettings();
+ sendResponse({ status: 'success' });
+ break;
case 'OpenThemeCreator':
const themeID = request?.body?.themeID;
diff --git a/src/svelte-interface/pages/settings/general.svelte b/src/svelte-interface/pages/settings/general.svelte
index c4afd9ad..81e53913 100644
--- a/src/svelte-interface/pages/settings/general.svelte
+++ b/src/svelte-interface/pages/settings/general.svelte
@@ -90,10 +90,20 @@
onChange: (isOn: boolean) => settingsState.lessonalert = isOn
}
},
+ {
+ title: "About BetterSEQTA+",
+ description: "Opens About page.",
+ id: 9,
+ Component: Button,
+ props: {
+ onClick: () => browser.runtime.sendMessage({ type: 'currentTab', info: 'OpenAboutPage' }),
+ text: "Open"
+ }
+ },
{
title: "BetterSEQTA+",
description: "Enables BetterSEQTA+ features",
- id: 9,
+ id: 10,
Component: Switch,
props: {
state: $settingsState.onoff,