diff --git a/.eslintrc.yml b/.eslintrc.yml index 5d35cab..79d19ce 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -26,7 +26,7 @@ rules: - double semi: - error - - never + - always react/jsx-pascal-case: error react/jsx-closing-bracket-location: error react/jsx-closing-tag-location: error diff --git a/index.html b/index.html index 0369de8..07f2662 100755 --- a/index.html +++ b/index.html @@ -9,7 +9,6 @@ Horarios Unsa 2 - diff --git a/package.json b/package.json index f110623..c6289fc 100755 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "vite-plugin-solid": "^2.2.6" }, "scripts": { - "start": "vite", + "start": "vite --host", "dev": "vite", "build": "vite build", "serve": "vite preview" diff --git a/public/css/global.css b/public/css/global.css deleted file mode 100755 index f60e534..0000000 --- a/public/css/global.css +++ /dev/null @@ -1,11 +0,0 @@ -:root { - --color-texto: white; -} - -body { - color: var(--color-texto); -} - -[class^="ph-"], [class*=" ph-"] ::before { - font-size: 0.8rem; -} \ No newline at end of file diff --git a/public/horarios/2022_2_fps_ingenieriadesistemas.yaml b/public/horarios/2022_2_fps_ingenieriadesistemas.yaml index ed69a5d..156a37a 100755 --- a/public/horarios/2022_2_fps_ingenieriadesistemas.yaml +++ b/public/horarios/2022_2_fps_ingenieriadesistemas.yaml @@ -13,93 +13,128 @@ años: abreviado: TAIS Teoria: A: - Docente: "?" + Docente: Robert Arisaca Horas: - Ma0940 - Ma1040 - Ma1130 B: - Docente: "?" + Docente: Robert Arisaca Horas: - Vi1450 - Vi1550 - Vi1640 Laboratorio: A: - Docente: "?" + Docente: Robert Arisaca Horas: - Mi0700 - Mi0750 B: - Docente: "?" + Docente: Robert Arisaca Horas: - Mi1400 - Mi1450 + C: + Docente: Lazo Dely + Horas: + - Mi1830 + - Mi1920 Plataformas: nombre: Plataformas Emergentes abreviado: PE Teoria: A: - Docente: "?" + Docente: Diego Iquira Horas: - Lu0750 - Lu0850 Laboratorio: A: - Docente: "?" + Docente: Diego Iquira Horas: - Ju0850 - Ju0940 + B: + Docente: Diego Iquira + Horas: + - Ma1740 + - Ma1830 Proyecto de Sw: nombre: Proyecto de Ingeniería de Software 2 abreviado: PIS2 Teoria: A: - Docente: "?" + Docente: Freddy Saji Horas: - Lu0940 - Lu1040 C: - Docente: "?" + Docente: Freddy Saji Horas: - Lu1130 - Lu1220 B: - Docente: "?" + Docente: Freddy Saji Horas: - Lu1550 - Lu1640 D: - Docente: "?" + Docente: Freddy Saji Horas: - Lu1740 - Lu1830 E: - Docente: "?" + Docente: Freddy Saji Horas: - Ju0940 - Ju1040 Laboratorio: + A: + Docente: William Bornas + Horas: + - Ma0700 + - Ma0750 B: - Docente: "?" + Docente: Giovanni Martinez Horas: - Mi1830 - Mi1920 + C: + Docente: José Sulla + Horas: + - Ju1740 + - Ju1830 + D: + Docente: William Bornas + Horas: + - Vi1550 + - Vi1730 + E: + Docente: William Bornas + Horas: + - Ma0850 + - Ma0940 Sw de Juegos: nombre: Desarrollo de Software para Juegos abreviado: DSJ Teoria: A: - Docente: "?" + Docente: José Sulla Horas: - Lu1920 - Lu2010 Laboratorio: A: - Docente: "?" + Docente: José Sulla Horas: - Mi1220 - Mi1310 + B: + Docente: José Sulla + Horas: + - Mi1550 + - Mi1640 Tesis 2: nombre: Seminario de Tesis 2 abreviado: ST2 @@ -163,23 +198,34 @@ años: abreviado: GSTI Teoria: A: - Docente: "?" + Docente: Fabricio Calienes Horas: - Ma1740 - Ma1830 + Laboratorio: + A: + Docente: Luis Rocha + Horas: + - Ju1830 + - Ju1920 + B: + Docente: Luis Rocha + Horas: + - Vi1830 + - Vi1920 Practicas: nombre: Prácticas Pre Profesionales abreviado: PPP Teoria: A: - Docente: "?" + Docente: Juan Zuñiga Horas: - Mi1740 - Mi1830 - Vi1740 - Vi1830 B: - Docente: "?" + Docente: Juan Zuñiga Horas: - Mi1920 - Mi2010 diff --git a/public/img/wall0.webp b/public/img/wall0.webp old mode 100755 new mode 100644 index 7907f10..4c16403 Binary files a/public/img/wall0.webp and b/public/img/wall0.webp differ diff --git a/public/img/wall1.webp b/public/img/wall1.webp deleted file mode 100644 index 4c16403..0000000 Binary files a/public/img/wall1.webp and /dev/null differ diff --git a/public/img/wall2.webp b/public/img/wall2.webp deleted file mode 100644 index f4830eb..0000000 Binary files a/public/img/wall2.webp and /dev/null differ diff --git a/src/App.tsx b/src/App.tsx index 130b466..d96f9da 100755 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,16 +1,19 @@ -import { Main } from "./Views/Main" -import { Index } from "./Views/Index" -import { Editor } from "./Views/Editor" -import { useRouter } from "./Router" -import { Switch, Match } from "solid-js" -import { Wallpaper } from "./Wallpaper" +import { Main } from "./Views/Main"; +import { Index } from "./Views/Index"; +import { Editor } from "./Views/Editor"; +import { useRouter } from "./Router"; +import { Switch, Match, Show } from "solid-js"; +import { Wallpaper } from "./Wallpaper"; function App() { - const route = useRouter() + const route = useRouter(); + const isMobile = screen.width <= 500; return ( -
- +
+ + + 404!

}> @@ -23,7 +26,7 @@ function App() {
- ) + ); } -export default App +export default App; diff --git a/src/BarraSuperior.tsx b/src/BarraSuperior.tsx index 1bd0ec4..1138acc 100755 --- a/src/BarraSuperior.tsx +++ b/src/BarraSuperior.tsx @@ -1,10 +1,10 @@ -import { estilosGlobales } from "./Estilos" -import { StyleSheet, css } from "aphrodite" -import { numWallpaper, setNumWallpaper } from "./Store" -import { TamanoLetra } from "./BarraSuperior/TamanoLetra" -import { RouterLink } from "./Router" +import { estilosGlobales } from "./Estilos"; +import { StyleSheet, css } from "aphrodite"; +import { numWallpaper, setNumWallpaper } from "./Store"; +import { TamanoLetra } from "./BarraSuperior/TamanoLetra"; +import { RouterLink } from "./Router"; -const ultimoIndiceWallpaper = 2 +const ultimoIndiceWallpaper = 1; const e = StyleSheet.create({ contCambiador: { @@ -30,29 +30,29 @@ const e = StyleSheet.create({ paddingLeft: "0.5rem", marginRight: "0.25rem", }, -}) +}); const retrocederWallpaper = () => { - const num = numWallpaper() + const num = numWallpaper(); if (num > 0) { - setNumWallpaper(num - 1) - localStorage.setItem("num-img", (num - 1).toString()) + setNumWallpaper(num - 1); + localStorage.setItem("num-img", (num - 1).toString()); } else { - setNumWallpaper(ultimoIndiceWallpaper) - localStorage.setItem("num-img", (ultimoIndiceWallpaper).toString()) + setNumWallpaper(ultimoIndiceWallpaper); + localStorage.setItem("num-img", (ultimoIndiceWallpaper).toString()); } -} +}; const avanzarWallpaper = () => { - const num = numWallpaper() + const num = numWallpaper(); if (num < ultimoIndiceWallpaper) { - setNumWallpaper(num + 1) - localStorage.setItem("num-img", (num + 1).toString()) + setNumWallpaper(num + 1); + localStorage.setItem("num-img", (num + 1).toString()); } else { - setNumWallpaper(0) - localStorage.setItem("num-img", (0).toString()) + setNumWallpaper(0); + localStorage.setItem("num-img", (0).toString()); } -} +}; function CambiadorImg() { return ( @@ -71,14 +71,14 @@ function CambiadorImg() { />
- ) + ); } const estilos = StyleSheet.create({ tituloPrincipal: { fontWeight: "bold", }, -}) +}); export function BarraSuperior() { return ( @@ -107,5 +107,5 @@ export function BarraSuperior() { Ingeniería de Sistemas 2022-B - ) + ); } diff --git a/src/Creditos.tsx b/src/Creditos.tsx index 1b19bf8..0540265 100644 --- a/src/Creditos.tsx +++ b/src/Creditos.tsx @@ -1,4 +1,4 @@ -import { StyleSheet, css } from "aphrodite" +import { StyleSheet, css } from "aphrodite"; const e = StyleSheet.create({ creditos: { @@ -6,16 +6,10 @@ const e = StyleSheet.create({ paddingTop: "7.5rem", paddingBottom: "1rem", }, -}) +}); export function Creditos() { return ( -
- Desarrollado por Fernando Araoz con TypeScript, JSX y Solid.js. -
- - Ir a la versión anterior. - -
- ) +
+ ); } diff --git a/src/Store.ts b/src/Store.ts index 4311022..38eb32f 100755 --- a/src/Store.ts +++ b/src/Store.ts @@ -1,48 +1,37 @@ -import { createSignal } from "solid-js" - -enum ModoColor { - Claro, - Oscuro, - Auto -} +import { createSignal } from "solid-js"; export type Dia = "Lunes" | "Martes" | "Miercoles" | "Jueves" | "Viernes"; -export const dias: Dia[] = ["Lunes", "Martes", "Miercoles", "Jueves", "Viernes"] +export const dias: Dia[] = ["Lunes", "Martes", "Miercoles", "Jueves", "Viernes"]; export const horas = [ "07:00 - 07:50", "07:50 - 08:40", - "08:40 - 08:50", "08:50 - 09:40", "09:40 - 10:30", - "10:30 - 10:40", "10:40 - 11:30", "11:30 - 12:20", "12:20 - 13:10", "13:10 - 14:00", "14:00 - 14:50", "14:50 - 15:40", - "15:40 - 15:50", "15:50 - 16:40", "16:40 - 17:30", - "17:30 - 17:40", "17:40 - 18:30", "18:30 - 19:20", "19:20 - 20:10", "20:10 - 21:00", "21:00 - 21:00", -] +]; export const horasDescanso = [ "08:40 - 08:50", "10:30 - 10:40", "15:40 - 15:50", "17:30 - 17:40", -] +]; -const numImgGuardado = Number(localStorage.getItem("num-img") ?? "1") -const tamanoLetraGuardado = Number(localStorage.getItem("tamano-letra") ?? "16") +const numImgGuardado = Number(localStorage.getItem("num-img") ?? "0"); +const tamanoLetraGuardado = Number(/* localStorage.getItem("tamano-letra") ?? */ "16"); -export const [modoColor, setModoColor] = createSignal(ModoColor.Oscuro) -export const [numWallpaper, setNumWallpaper] = createSignal(numImgGuardado) -export const [mostrarDescansos, setMostrarDescansos] = createSignal(true) -export const [tamanoLetra, setTamanoLetra] = createSignal(tamanoLetraGuardado) +export const [numWallpaper, setNumWallpaper] = createSignal(numImgGuardado); +export const [tamanoLetra, setTamanoLetra] = createSignal(tamanoLetraGuardado); +export const [isMobile, setIsMobile] = createSignal(screen.width < 500); diff --git a/src/Views/Editor.tsx b/src/Views/Editor.tsx index d0216e4..ed7bd76 100644 --- a/src/Views/Editor.tsx +++ b/src/Views/Editor.tsx @@ -1,15 +1,13 @@ -import { BarraSuperior } from "../BarraSuperior" -import { estilosGlobales } from "../Estilos" -import { StyleSheet, css } from "aphrodite" -import { Separador } from "../Separador" -import { Tabla } from "../ContenedorHorarios/Tabla" -import YAML from "yaml" -import { TablaObserver } from "../ContenedorHorarios/TablaObserver" -import { Curso, Cursos } from "../types/DatosHorario" -import { CursosElem } from "../ContenedorHorarios/CursosElem" -import { For, createMemo } from "solid-js" -import {createStore} from "solid-js/store" -import { CursoEditor } from "./Editor/CursoEditor" +import { BarraSuperior } from "../BarraSuperior"; +import { estilosGlobales } from "../Estilos"; +import { StyleSheet, css } from "aphrodite"; +import { Separador } from "../Separador"; +import { Tabla } from "../ContenedorHorarios/Tabla"; +import { TablaObserver } from "../ContenedorHorarios/TablaObserver"; +import { Curso, Cursos } from "../types/DatosHorario"; +import { For, createMemo } from "solid-js"; +import {createStore} from "solid-js/store"; +import { CursoEditor } from "./Editor/CursoEditor"; const e = StyleSheet.create({ contenedorGlobal: { @@ -19,7 +17,7 @@ const e = StyleSheet.create({ alignItems: "center", justifyContent: "center", }, -}) +}); interface Data { indice: number, @@ -40,39 +38,39 @@ const [nuevaData, setNuevaData] = createStore({ }, }, }], -}) +}); type FormEvent = Event & { submitter: HTMLElement; } & { currentTarget: HTMLFormElement; target: HTMLFormElement; } export function Editor() { - const tablaObserver = new TablaObserver() - const dataWrapper = createMemo(() => nuevaData) + const tablaObserver = new TablaObserver(); + const dataWrapper = createMemo(() => nuevaData); const agregarCurso = (ev: FormEvent) => { - ev.preventDefault() + ev.preventDefault(); /// @ts-ignore - const nombreCurso: string = ev.target.elements.nombre_curso.value + const nombreCurso: string = ev.target.elements.nombre_curso.value; /// @ts-ignore - const nombreAbreviado: string = ev.target.elements.nombre_abreviado.value + const nombreAbreviado: string = ev.target.elements.nombre_abreviado.value; const curso: Curso = { nombre: nombreCurso, abreviado: nombreAbreviado, oculto: false, Teoria: {}, - } + }; - setNuevaData("cursos", nuevaData.indice, curso) - setNuevaData("indice", (i) => i + 1) - } + setNuevaData("cursos", nuevaData.indice, curso); + setNuevaData("indice", (i) => i + 1); + }; const data = createMemo(() => { - const o: Cursos = {} + const o: Cursos = {}; nuevaData.cursos.forEach((c) => { - o[c.nombre] = c - }) - return o - }) + o[c.nombre] = c; + }); + return o; + }); return (
@@ -127,5 +125,5 @@ export function Editor() {
- ) + ); } diff --git a/src/Views/Index.tsx b/src/Views/Index.tsx index f1d55ae..2d89bca 100644 --- a/src/Views/Index.tsx +++ b/src/Views/Index.tsx @@ -1,6 +1,8 @@ -import { estilosGlobales } from "../Estilos" -import { StyleSheet, css } from "aphrodite" -import { RouterLink } from "../Router" +import { estilosGlobales } from "../Estilos"; +import { StyleSheet, css } from "aphrodite/no-important"; +import { RouterLink } from "../Router"; +import { Show } from "solid-js"; +import { isMobile } from "../Store"; const e = StyleSheet.create({ contenedorGlobal: { @@ -27,60 +29,107 @@ const e = StyleSheet.create({ verticalAlign: "bottom", marginRight: "0.5rem", }, -}) +}); + +function MobileIndex() { + const s = StyleSheet.create({ + boton: { + backgroundColor: "var(--color-primario)", + color: "white", + padding: "1rem 5rem", + borderRadius: "25px", + margin: "1.5rem 0", + boxShadow: "2px 2px 2px 0 gray", + cursor: "pointer", + }, + entrada: { + borderTop: "none", + borderRight: "none", + borderLeft: "none", + borderBottom: "solid 2px gray", + padding: "0.75rem 1rem", + }, + }); + + const inputElement = ; + + const login = () => { + console.log((inputElement as HTMLInputElement).value); + }; + + return ( +
+
+

Iniciar sesión

+
+
+ {inputElement} +
+ +
+
+ ); +} export function Index() { return ( -
-
-
-

- Horarios UNSA -

-

- Esta página te permite crear tu horario fácilmente, sin importar de que - año son los cursos. -

-

- Por ahora solo está disponible para ing. de sistemas. Proximamente se habilitarán - otras carreras. -

-

- Se recomienda usar un computador/laptop y un navegador actualizado (Firefox, Chrome, - Qutebrowser). -

-
- - Ing. de Sistemas - - {/* + <> + +
+
+
+

+ Horarios UNSA +

+

+ Esta página te permite crear tu horario fácilmente, sin importar de que + año son los cursos. +

+

+ Por ahora solo está disponible para ing. de sistemas. Proximamente se habilitarán + otras carreras. +

+

+ Se recomienda usar un computador/laptop y un navegador actualizado (Firefox, Chrome, + Qutebrowser). +

+
+ + Ing. de Sistemas + + {/* */} - - - Editor - - - - Código fuente en GitHub - -
-
- ) + + + Editor + + + + Código fuente en GitHub + +
+
+ + + + + + ); } diff --git a/src/Wallpaper.tsx b/src/Wallpaper.tsx index 54161ab..3e9f472 100755 --- a/src/Wallpaper.tsx +++ b/src/Wallpaper.tsx @@ -1,13 +1,13 @@ -import { StyleSheet, css } from "aphrodite" -import { numWallpaper } from "./Store" -import { createEffect } from "solid-js" -import {createStore} from "solid-js/store" +import { StyleSheet, css } from "aphrodite"; +import { numWallpaper } from "./Store"; +import { createEffect } from "solid-js"; +import {createStore} from "solid-js/store"; -const duracionTransicion = 250 +const duracionTransicion = 250; export function Wallpaper() { /// @ts-ignore - const soportaBackdropFilter = document.body.style.backdropFilter !== undefined + const soportaBackdropFilter = document.body.style.backdropFilter !== undefined; const estilos = StyleSheet.create({ contenedorCover: { @@ -32,32 +32,32 @@ export function Wallpaper() { coverTransicion: { opacity: 0, }, - }) + }); const [estilosRaw, setEstilosRaw] = createStore({ "background-image": "none", opacity: 1, - }) + }); createEffect(() => { - const numImg = numWallpaper() - setEstilosRaw("opacity", 0) + const numImg = numWallpaper(); + setEstilosRaw("opacity", 0); const promesa250ms = new Promise((resolve) => { - setTimeout(resolve, duracionTransicion) - }) + setTimeout(resolve, duracionTransicion); + }); - const url = `/img/wall${numImg}.webp` - const img = new Image() + const url = `/img/wall${numImg}.webp`; + const img = new Image(); img.addEventListener("load", async() => { - await promesa250ms + await promesa250ms; setEstilosRaw({ "background-image": `url('${url}')`, opacity: 1, - }) - }) - img.src = url - }) + }); + }); + img.src = url; + }); return (
@@ -66,6 +66,6 @@ export function Wallpaper() { style={{"background-image": estilosRaw["background-image"], opacity: estilosRaw.opacity}} />
- ) + ); } diff --git a/src/index.tsx b/src/index.tsx index ac16ac6..859966c 100755 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,7 +1,7 @@ -import "solid-js" -import { render } from "solid-js/web" -import App from "./App" -import "normalize.css" -import "./styles/global.css" +import "solid-js"; +import { render } from "solid-js/web"; +import App from "./App"; +import "normalize.css"; +import "./styles/global.css"; -render(App, document.getElementById("root") as Node) +render(App, document.getElementById("root") as Node); diff --git a/src/styles/global.css b/src/styles/global.css index e695d18..1db1445 100755 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -1,9 +1,47 @@ +:root { + --color-texto: white; + --color-primario: #531925; +} + +body { + color: var(--color-texto); +} + +[class^="ph-"], [class*=" ph-"] ::before { + font-size: 0.8rem; +} + +* { + color: var(--color-texto); +} + body { font-family: Inter, sans-serif; + color: var(--color-texto); } button { background-color: transparent; - color: var(--color); + color: var(--color-texto); border: none; } + +h1 { + font-weight: 600; +} + +h2 { + font-weight: 500; +} + +@media screen and (max-width: 500px) { + .hide-on-small { + display: none !important; + } +} + +@media screen and (min-width: 501px) { + .hide-on-big { + + } +}