From 5157a662796798aa098895e1672f40b37416a734 Mon Sep 17 00:00:00 2001 From: thePeras Date: Sat, 10 Aug 2024 17:56:57 +0100 Subject: [PATCH 1/3] Create layout components --- content-scripts/components/Header.tsx | 59 ++++++++ .../components/HeaderAuthentication.tsx | 136 ++++++++++++++++++ content-scripts/components/HeaderLinks.tsx | 26 ++++ content-scripts/index.js | 14 +- .../modules/{layout.js => layout-old.js} | 29 ++-- content-scripts/modules/layout.ts | 72 ++++++++++ .../{utilities => options}/addStyles.js | 2 +- .../modules/options/{all.js => index.js} | 4 +- .../options/{some_options.js => options.js} | 25 ++-- content-scripts/modules/utilities/popover.js | 4 - content-scripts/types.ts | 5 + 11 files changed, 332 insertions(+), 44 deletions(-) create mode 100644 content-scripts/components/Header.tsx create mode 100644 content-scripts/components/HeaderAuthentication.tsx create mode 100644 content-scripts/components/HeaderLinks.tsx rename content-scripts/modules/{layout.js => layout-old.js} (96%) create mode 100644 content-scripts/modules/layout.ts rename content-scripts/modules/{utilities => options}/addStyles.js (85%) rename content-scripts/modules/options/{all.js => index.js} (90%) rename content-scripts/modules/options/{some_options.js => options.js} (72%) create mode 100644 content-scripts/types.ts diff --git a/content-scripts/components/Header.tsx b/content-scripts/components/Header.tsx new file mode 100644 index 0000000..6bf8eaf --- /dev/null +++ b/content-scripts/components/Header.tsx @@ -0,0 +1,59 @@ +import jsx from "texsaur"; + +import HeaderLinks from "./HeaderLinks"; +import Authentication from "./HeaderAuthentication"; +import { AuthSession } from "../types"; + +const HEADER_LINKS = { + Estudantes: { + Bolsas: "web_base.gera_pagina?p_pagina=242366", + "Escolher turmas": "it_geral.ver_insc", + "Estatutos especiais": "web_base.gera_pagina?p_pagina=242322", + Exames: "web_base.gera_pagina?p_pagina=242382", + Matrículas: "web_base.gera_pagina?p_pagina=31583", + Propinas: "web_base.gera_pagina?p_pagina=propinas ano corrente", + "Mais opções": "web_base.gera_pagina?p_pagina=ESTUDANTES", + }, + Faculdade: { + Alumni: "web_base.gera_pagina?p_pagina=243186", + "Calendário escolar": + "web_base.gera_pagina?p_pagina=página estática genérica 106", + Cursos: "cur_geral.cur_inicio", + Departamentos: "uni_geral.nivel_list?pv_nivel_id=1", + Empresas: "web_base.gera_pagina?p_pagina=242380", + Governo: "web_base.gera_pagina?p_pagina=31715", + Notícias: "noticias_geral.lista_noticias", + "Serviços/Gabinetes": "uni_geral.nivel_list?pv_nivel_id=4", + }, + Pesquisa: { + Edifícios: "instal_geral.edificio_query", + Estudantes: "fest_geral.fest_query", + Horários: "hor_geral.pesquisa_form", + Notícias: "noticias_geral.pesquisa", + Pessoal: "func_geral.formquery", + "Projetos de investigação": "projectos_geral.pesquisa_projectos", + Publicações: "pub_geral.pub_pesquisa", + Salas: "instal_geral.espaco_query", + Turmas: "it_turmas_geral.formquery", + "Unidades Curriculares": "ucurr_geral.pesquisa_ucs", + "Mais opções": "web_base.gera_pagina?p_pagina=1831", + }, +}; + +interface Props { + auth?: AuthSession | null; +} + +const Header = ({ auth = null }: Props) => { + return ( +
+ + + +
+ ); +}; + +export default Header; diff --git a/content-scripts/components/HeaderAuthentication.tsx b/content-scripts/components/HeaderAuthentication.tsx new file mode 100644 index 0000000..6616e8b --- /dev/null +++ b/content-scripts/components/HeaderAuthentication.tsx @@ -0,0 +1,136 @@ +import jsx from "texsaur"; +import { AuthSession } from "../types"; + +interface Props { + auth: AuthSession | null; +} + +const Authentication = ({ auth }: Props) => { + if (auth) + return ( +
+ +
+ + +
+ + +
+
+
    +
      +
      + + Sem notificações +
      +
      + +
      +
      +
      + +
      +
      + {auth.name} + {auth.number} +
      + +
      +
      + ); + + return ( +
      + + +
      + + + + + + + + + ou + + + Autenticação Federada + + + Recuperar palavra-passe + +
      +
      + ); +}; + +export default Authentication; diff --git a/content-scripts/components/HeaderLinks.tsx b/content-scripts/components/HeaderLinks.tsx new file mode 100644 index 0000000..07c63ef --- /dev/null +++ b/content-scripts/components/HeaderLinks.tsx @@ -0,0 +1,26 @@ +import jsx from "texsaur"; + +interface Props { + links: Record>; +} + +const HeaderLinks = ({ links }: Props) => { + return ( + + ); +}; + +export default HeaderLinks; diff --git a/content-scripts/index.js b/content-scripts/index.js index d294703..f6b0b48 100644 --- a/content-scripts/index.js +++ b/content-scripts/index.js @@ -4,7 +4,7 @@ import { currentAccountPage, addSortTableActions } from "./modules/initialize"; -import { injectAllChanges, userPreferences } from "./modules/options/all"; +import { injectAllChanges, userPreferences } from "./modules/options"; import constructNewData from "./modules/utilities/constructNewData"; import { getStorage, setStorage } from "./modules/utilities/storage"; import { rememberLogin } from "./modules/login"; @@ -48,21 +48,19 @@ const functionsToExecute = [ { name: "classPage", func: classPage }, { name: "courseUnitPage", func: courseUnitPage }, { name: "injectOverrideFunctions", func: injectOverrideFunctions }, - { name: "addStarIconToCard", func: addStarIconToCard} + { name: "addStarIconToCard", func: addStarIconToCard } ] const init = async () => { - // // Watch for resize events - // addResizeListener(); - // // Inject user preferences + // Inject user preferences const data = await getStorage(userPreferences); injectAllChanges(data); - if(!(await getStorage('favorite_courses'))){ - await setStorage({'favorite_courses': '{}'}) //Insert empty object + if (!(await getStorage('favorite_courses'))) { + await setStorage({ 'favorite_courses': '{}' }) //Insert empty object } - + functionsToExecute.forEach(f => { try { f.func(); diff --git a/content-scripts/modules/layout.js b/content-scripts/modules/layout-old.js similarity index 96% rename from content-scripts/modules/layout.js rename to content-scripts/modules/layout-old.js index 49d95ba..54df32d 100644 --- a/content-scripts/modules/layout.js +++ b/content-scripts/modules/layout-old.js @@ -43,9 +43,8 @@ const authentication = (auth) => ? /*html*/ `
      @@ -78,14 +77,12 @@ const authentication = (auth) => ${auth.number}
      @@ -88,9 +90,6 @@ const Authentication = ({ auth }: Props) => { -
      @@ -124,7 +123,7 @@ const Authentication = ({ auth }: Props) => { id="se-auth-federate" className="se-button" > - + Autenticação Federada diff --git a/content-scripts/components/Icon.tsx b/content-scripts/components/Icon.tsx new file mode 100644 index 0000000..542e948 --- /dev/null +++ b/content-scripts/components/Icon.tsx @@ -0,0 +1,13 @@ +import jsx from "texsaur"; + +interface IconProps { + name?: string; +} + +const Icon: JSX.Component = ({ name }) => { + return ( + + ); +} + +export default Icon; \ No newline at end of file diff --git a/content-scripts/modules/layout.ts b/content-scripts/modules/layout.ts index 74498ef..787c993 100644 --- a/content-scripts/modules/layout.ts +++ b/content-scripts/modules/layout.ts @@ -159,7 +159,7 @@ const loadNotifications = async (): Promise => { li.append(Button({ icon: "ri-check-line", className: "se-notification-button", - onClick: markAsRead, + onclick: markAsRead, })); } diff --git a/content-scripts/modules/utilities/popover.js b/content-scripts/modules/utilities/popover.js deleted file mode 100644 index a8cccd1..0000000 --- a/content-scripts/modules/utilities/popover.js +++ /dev/null @@ -1,48 +0,0 @@ -let popoverId = 0; - -export const createPopover = (popover, target = popover) => { - const id = popoverId++; - - popover.addEventListener(`popover-close:${id}`, (e) => e.stopPropagation()); - - document.addEventListener(`popover-close:${id}`, () => { - target?.classList.remove("se-popover-open"); - document.removeEventListener("click", close, { - capture: true, - }); - }); - - const close = (/** @type {Event} */ e) => - e.target?.dispatchEvent( - new CustomEvent(`popover-close:${id}`, { bubbles: true }) - ); - - const fn = (/** @type {Event} */ e) => { - if (target?.classList.contains("se-popover-open")) return; - - target?.classList.add("se-popover-open"); - document.addEventListener("click", close, { - capture: true, - }); - }; - - return fn; -}; - -export const togglePopover = (popoverId) => { - const popover = document.getElementById(popoverId); - if (!popover) return; - - const menuDivs = document.querySelectorAll('div[id$="-menu"]'); - menuDivs.forEach((div) => { - if (div !== popover) - div.classList.remove("se-popover-open"); - }); - - if (popover.classList.contains("se-popover-open")) { - popover.classList.remove("se-popover-open"); - } else { - popover.classList.add("se-popover-open"); - } - return; -} diff --git a/content-scripts/modules/utilities/popover.ts b/content-scripts/modules/utilities/popover.ts new file mode 100644 index 0000000..f4fc65c --- /dev/null +++ b/content-scripts/modules/utilities/popover.ts @@ -0,0 +1,17 @@ +export const togglePopover = (popoverId: string) => { + const popover = document.getElementById(popoverId); + if (!popover) return; + + const menuDivs = document.querySelectorAll('div[id$="-menu"]'); + menuDivs.forEach((div) => { + if (div !== popover) + div.classList.remove("se-popover-open"); + }); + + if (popover.classList.contains("se-popover-open")) { + popover.classList.remove("se-popover-open"); + } else { + popover.classList.add("se-popover-open"); + } + return; +}