finishing the project
This commit is contained in:
DU CASSOULET
parent
4f57f22eb8
commit
a0d7babc50
1
.gitignore
vendored
1
.gitignore
vendored
@ -1,2 +1,3 @@
|
|||||||
node_modules/**
|
node_modules/**
|
||||||
|
.next/**
|
||||||
package-lock.json
|
package-lock.json
|
||||||
12
package.json
12
package.json
@ -9,14 +9,20 @@
|
|||||||
"lint": "next lint"
|
"lint": "next lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"axios": "^1.6.7",
|
||||||
|
"framer-motion": "^11.0.3",
|
||||||
|
"moment": "^2.30.1",
|
||||||
|
"next": "14.1.0",
|
||||||
"react": "^18",
|
"react": "^18",
|
||||||
"react-dom": "^18",
|
"react-dom": "^18",
|
||||||
"next": "14.1.0"
|
"react-icons": "^5.0.1",
|
||||||
|
"sass": "^1.70.0",
|
||||||
|
"universal-cookie": "^7.0.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"typescript": "^5",
|
|
||||||
"@types/node": "^20",
|
"@types/node": "^20",
|
||||||
"@types/react": "^18",
|
"@types/react": "^18",
|
||||||
"@types/react-dom": "^18"
|
"@types/react-dom": "^18",
|
||||||
|
"typescript": "^5"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
50
src/app/api/groups/route.ts
Normal file
50
src/app/api/groups/route.ts
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
import promos, { Campus } from "@/constants/promos";
|
||||||
|
import axios from "axios";
|
||||||
|
import moment from "moment";
|
||||||
|
import { type NextRequest, NextResponse } from "next/server";
|
||||||
|
|
||||||
|
type PlanningEvent = {
|
||||||
|
resourceId: string;
|
||||||
|
start: string;
|
||||||
|
end: string;
|
||||||
|
title: string;
|
||||||
|
numero: string;
|
||||||
|
nomADE: string;
|
||||||
|
salle: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export async function GET(req: NextRequest) {
|
||||||
|
const reqUrl = new URL(req.nextUrl.toString());
|
||||||
|
|
||||||
|
if (!reqUrl.searchParams.get("promo")) {
|
||||||
|
return NextResponse.json({ message: "No promo id entered." });
|
||||||
|
}
|
||||||
|
|
||||||
|
const promoId = parseInt(reqUrl.searchParams.get("promo")!);
|
||||||
|
|
||||||
|
if (isNaN(promoId)) {
|
||||||
|
return NextResponse.json({ message: "Promo id is not a number." });
|
||||||
|
}
|
||||||
|
|
||||||
|
const startDate = moment().startOf("year");
|
||||||
|
const endDate = moment().endOf("year").add(1, "year");
|
||||||
|
const promo = promos[promoId];
|
||||||
|
|
||||||
|
try {
|
||||||
|
if (promo.campus === Campus.Senart) return NextResponse.json(["0"]);
|
||||||
|
|
||||||
|
const url = new URL("http://www.iut-fbleau.fr/EDT/consulter/ajax/ep.php");
|
||||||
|
url.searchParams.set("p", promo.promoId);
|
||||||
|
url.searchParams.set("start", startDate.toJSON());
|
||||||
|
url.searchParams.set("end", endDate.toJSON());
|
||||||
|
|
||||||
|
const response = await axios.get(url.toString());
|
||||||
|
const data: PlanningEvent[] = response.data;
|
||||||
|
|
||||||
|
return NextResponse.json(
|
||||||
|
[...new Set(data.map((event) => event.numero))].sort()
|
||||||
|
);
|
||||||
|
} catch {
|
||||||
|
return NextResponse.json({ message: "An unexpected error occured." });
|
||||||
|
}
|
||||||
|
}
|
||||||
70
src/app/api/planning/route.ts
Normal file
70
src/app/api/planning/route.ts
Normal file
@ -0,0 +1,70 @@
|
|||||||
|
import { type NextRequest, NextResponse } from "next/server";
|
||||||
|
import moment from "moment";
|
||||||
|
import promos, { Campus } from "@/constants/promos";
|
||||||
|
import fetchFontainebleau from "@/utils/fetchFontainebleau";
|
||||||
|
import fetchSenart from "@/utils/fetchSenart";
|
||||||
|
|
||||||
|
export async function GET(req: NextRequest) {
|
||||||
|
const reqUrl = new URL(req.nextUrl.toString());
|
||||||
|
|
||||||
|
if (!reqUrl.searchParams.get("start")) {
|
||||||
|
return NextResponse.json({ message: "No start date entered." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!reqUrl.searchParams.get("end")) {
|
||||||
|
return NextResponse.json({ message: "No end date entered." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!reqUrl.searchParams.get("promo")) {
|
||||||
|
return NextResponse.json({ message: "No promo id entered." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!reqUrl.searchParams.get("grp")) {
|
||||||
|
return NextResponse.json({ message: "No group id entered." });
|
||||||
|
}
|
||||||
|
|
||||||
|
const startDate = moment(reqUrl.searchParams.get("start"));
|
||||||
|
const endDate = moment(reqUrl.searchParams.get("end"));
|
||||||
|
const promoId = parseInt(reqUrl.searchParams.get("promo")!);
|
||||||
|
const groupId = parseInt(reqUrl.searchParams.get("grp")!);
|
||||||
|
|
||||||
|
if (!startDate.isValid()) {
|
||||||
|
return NextResponse.json({ message: "Start date is not valid." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!endDate.isValid()) {
|
||||||
|
return NextResponse.json({ message: "End date is not valid." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (startDate.isAfter(endDate)) {
|
||||||
|
return NextResponse.json({ message: "Start date is after end date." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isNaN(promoId)) {
|
||||||
|
return NextResponse.json({ message: "Promo id is not a number." });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isNaN(groupId)) {
|
||||||
|
return NextResponse.json({ message: "Group id is not a number." });
|
||||||
|
}
|
||||||
|
|
||||||
|
const promo = promos[promoId];
|
||||||
|
|
||||||
|
try {
|
||||||
|
switch (promo.campus) {
|
||||||
|
case Campus.Fontainebleau:
|
||||||
|
return NextResponse.json(
|
||||||
|
await fetchFontainebleau(promo, groupId, startDate, endDate)
|
||||||
|
);
|
||||||
|
|
||||||
|
case Campus.Senart:
|
||||||
|
return NextResponse.json(await fetchSenart(promo, startDate, endDate));
|
||||||
|
|
||||||
|
default: {
|
||||||
|
return NextResponse.json({ message: "Promo campus is not valid." });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
return NextResponse.json({ message: "An unexpected error occured." });
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 5.6 KiB |
@ -1,107 +0,0 @@
|
|||||||
:root {
|
|
||||||
--max-width: 1100px;
|
|
||||||
--border-radius: 12px;
|
|
||||||
--font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono",
|
|
||||||
"Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro",
|
|
||||||
"Fira Mono", "Droid Sans Mono", "Courier New", monospace;
|
|
||||||
|
|
||||||
--foreground-rgb: 0, 0, 0;
|
|
||||||
--background-start-rgb: 214, 219, 220;
|
|
||||||
--background-end-rgb: 255, 255, 255;
|
|
||||||
|
|
||||||
--primary-glow: conic-gradient(
|
|
||||||
from 180deg at 50% 50%,
|
|
||||||
#16abff33 0deg,
|
|
||||||
#0885ff33 55deg,
|
|
||||||
#54d6ff33 120deg,
|
|
||||||
#0071ff33 160deg,
|
|
||||||
transparent 360deg
|
|
||||||
);
|
|
||||||
--secondary-glow: radial-gradient(
|
|
||||||
rgba(255, 255, 255, 1),
|
|
||||||
rgba(255, 255, 255, 0)
|
|
||||||
);
|
|
||||||
|
|
||||||
--tile-start-rgb: 239, 245, 249;
|
|
||||||
--tile-end-rgb: 228, 232, 233;
|
|
||||||
--tile-border: conic-gradient(
|
|
||||||
#00000080,
|
|
||||||
#00000040,
|
|
||||||
#00000030,
|
|
||||||
#00000020,
|
|
||||||
#00000010,
|
|
||||||
#00000010,
|
|
||||||
#00000080
|
|
||||||
);
|
|
||||||
|
|
||||||
--callout-rgb: 238, 240, 241;
|
|
||||||
--callout-border-rgb: 172, 175, 176;
|
|
||||||
--card-rgb: 180, 185, 188;
|
|
||||||
--card-border-rgb: 131, 134, 135;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
:root {
|
|
||||||
--foreground-rgb: 255, 255, 255;
|
|
||||||
--background-start-rgb: 0, 0, 0;
|
|
||||||
--background-end-rgb: 0, 0, 0;
|
|
||||||
|
|
||||||
--primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
|
|
||||||
--secondary-glow: linear-gradient(
|
|
||||||
to bottom right,
|
|
||||||
rgba(1, 65, 255, 0),
|
|
||||||
rgba(1, 65, 255, 0),
|
|
||||||
rgba(1, 65, 255, 0.3)
|
|
||||||
);
|
|
||||||
|
|
||||||
--tile-start-rgb: 2, 13, 46;
|
|
||||||
--tile-end-rgb: 2, 5, 19;
|
|
||||||
--tile-border: conic-gradient(
|
|
||||||
#ffffff80,
|
|
||||||
#ffffff40,
|
|
||||||
#ffffff30,
|
|
||||||
#ffffff20,
|
|
||||||
#ffffff10,
|
|
||||||
#ffffff10,
|
|
||||||
#ffffff80
|
|
||||||
);
|
|
||||||
|
|
||||||
--callout-rgb: 20, 20, 20;
|
|
||||||
--callout-border-rgb: 108, 108, 108;
|
|
||||||
--card-rgb: 100, 100, 100;
|
|
||||||
--card-border-rgb: 200, 200, 200;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
max-width: 100vw;
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
color: rgb(var(--foreground-rgb));
|
|
||||||
background: linear-gradient(
|
|
||||||
to bottom,
|
|
||||||
transparent,
|
|
||||||
rgb(var(--background-end-rgb))
|
|
||||||
)
|
|
||||||
rgb(var(--background-start-rgb));
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
html {
|
|
||||||
color-scheme: dark;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
5
src/app/globals.scss
Normal file
5
src/app/globals.scss
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
@ -1,12 +1,41 @@
|
|||||||
import type { Metadata } from "next";
|
import type { Metadata } from "next";
|
||||||
import { Inter } from "next/font/google";
|
import { Rubik } from "next/font/google";
|
||||||
import "./globals.css";
|
import "./globals.scss";
|
||||||
|
|
||||||
const inter = Inter({ subsets: ["latin"] });
|
const rubik = Rubik({ subsets: ["latin"] });
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: "Create Next App",
|
title: "UPEC Info Planning",
|
||||||
description: "Generated by create next app",
|
applicationName: "UPEC Info Planning",
|
||||||
|
description:
|
||||||
|
"L'emploi du temps du BUT informatique de l'UPEC sur les sites de Fontainebleau et Sénart.",
|
||||||
|
keywords: [
|
||||||
|
"UPEC",
|
||||||
|
"Info",
|
||||||
|
"Planning",
|
||||||
|
"Emploi du temps",
|
||||||
|
"Emploi du temps UPEC",
|
||||||
|
"Emploi du temps Info",
|
||||||
|
"Emploi du temps UPEC Info",
|
||||||
|
"UPEC Informatique",
|
||||||
|
"UPEC Info",
|
||||||
|
"UPEC Info Fontainebleau",
|
||||||
|
"UPEC Info Sénart",
|
||||||
|
"UPEC Info Planning",
|
||||||
|
],
|
||||||
|
authors: [{ name: "Gaston Chenet", url: "https://gastonchenet.fr" }],
|
||||||
|
creator: "Gaston Chenet",
|
||||||
|
publisher: "Gaston Chenet",
|
||||||
|
openGraph: {
|
||||||
|
title: "UPEC Info Planning",
|
||||||
|
description:
|
||||||
|
"L'emploi du temps du BUT informatique de l'UPEC sur les sites de Fontainebleau et Sénart.",
|
||||||
|
type: "website",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
export const viewport = {
|
||||||
|
themeColor: "#e42535",
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function RootLayout({
|
export default function RootLayout({
|
||||||
@ -16,7 +45,7 @@ export default function RootLayout({
|
|||||||
}>) {
|
}>) {
|
||||||
return (
|
return (
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<body className={inter.className}>{children}</body>
|
<body className={rubik.className}>{children}</body>
|
||||||
</html>
|
</html>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,230 +0,0 @@
|
|||||||
.main {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 6rem;
|
|
||||||
min-height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description {
|
|
||||||
display: inherit;
|
|
||||||
justify-content: inherit;
|
|
||||||
align-items: inherit;
|
|
||||||
font-size: 0.85rem;
|
|
||||||
max-width: var(--max-width);
|
|
||||||
width: 100%;
|
|
||||||
z-index: 2;
|
|
||||||
font-family: var(--font-mono);
|
|
||||||
}
|
|
||||||
|
|
||||||
.description a {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
gap: 0.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description p {
|
|
||||||
position: relative;
|
|
||||||
margin: 0;
|
|
||||||
padding: 1rem;
|
|
||||||
background-color: rgba(var(--callout-rgb), 0.5);
|
|
||||||
border: 1px solid rgba(var(--callout-border-rgb), 0.3);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
.code {
|
|
||||||
font-weight: 700;
|
|
||||||
font-family: var(--font-mono);
|
|
||||||
}
|
|
||||||
|
|
||||||
.grid {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: repeat(4, minmax(25%, auto));
|
|
||||||
max-width: 100%;
|
|
||||||
width: var(--max-width);
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
padding: 1rem 1.2rem;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
background: rgba(var(--card-rgb), 0);
|
|
||||||
border: 1px solid rgba(var(--card-border-rgb), 0);
|
|
||||||
transition: background 200ms, border 200ms;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card span {
|
|
||||||
display: inline-block;
|
|
||||||
transition: transform 200ms;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card h2 {
|
|
||||||
font-weight: 600;
|
|
||||||
margin-bottom: 0.7rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card p {
|
|
||||||
margin: 0;
|
|
||||||
opacity: 0.6;
|
|
||||||
font-size: 0.9rem;
|
|
||||||
line-height: 1.5;
|
|
||||||
max-width: 30ch;
|
|
||||||
text-wrap: balance;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
|
||||||
padding: 4rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center::before {
|
|
||||||
background: var(--secondary-glow);
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 480px;
|
|
||||||
height: 360px;
|
|
||||||
margin-left: -400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center::after {
|
|
||||||
background: var(--primary-glow);
|
|
||||||
width: 240px;
|
|
||||||
height: 180px;
|
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center::before,
|
|
||||||
.center::after {
|
|
||||||
content: "";
|
|
||||||
left: 50%;
|
|
||||||
position: absolute;
|
|
||||||
filter: blur(45px);
|
|
||||||
transform: translateZ(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
/* Enable hover only on non-touch devices */
|
|
||||||
@media (hover: hover) and (pointer: fine) {
|
|
||||||
.card:hover {
|
|
||||||
background: rgba(var(--card-rgb), 0.1);
|
|
||||||
border: 1px solid rgba(var(--card-border-rgb), 0.15);
|
|
||||||
}
|
|
||||||
|
|
||||||
.card:hover span {
|
|
||||||
transform: translateX(4px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-reduced-motion) {
|
|
||||||
.card:hover span {
|
|
||||||
transform: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Mobile */
|
|
||||||
@media (max-width: 700px) {
|
|
||||||
.content {
|
|
||||||
padding: 4rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.grid {
|
|
||||||
grid-template-columns: 1fr;
|
|
||||||
margin-bottom: 120px;
|
|
||||||
max-width: 320px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card {
|
|
||||||
padding: 1rem 2.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card h2 {
|
|
||||||
margin-bottom: 0.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center {
|
|
||||||
padding: 8rem 0 6rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center::before {
|
|
||||||
transform: none;
|
|
||||||
height: 300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description {
|
|
||||||
font-size: 0.8rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description a {
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description p,
|
|
||||||
.description div {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
position: fixed;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.description p {
|
|
||||||
align-items: center;
|
|
||||||
inset: 0 0 auto;
|
|
||||||
padding: 2rem 1rem 1.4rem;
|
|
||||||
border-radius: 0;
|
|
||||||
border: none;
|
|
||||||
border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);
|
|
||||||
background: linear-gradient(
|
|
||||||
to bottom,
|
|
||||||
rgba(var(--background-start-rgb), 1),
|
|
||||||
rgba(var(--callout-rgb), 0.5)
|
|
||||||
);
|
|
||||||
background-clip: padding-box;
|
|
||||||
backdrop-filter: blur(24px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.description div {
|
|
||||||
align-items: flex-end;
|
|
||||||
pointer-events: none;
|
|
||||||
inset: auto 0 0;
|
|
||||||
padding: 2rem;
|
|
||||||
height: 200px;
|
|
||||||
background: linear-gradient(
|
|
||||||
to bottom,
|
|
||||||
transparent 0%,
|
|
||||||
rgb(var(--background-end-rgb)) 40%
|
|
||||||
);
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tablet and Smaller Desktop */
|
|
||||||
@media (min-width: 701px) and (max-width: 1120px) {
|
|
||||||
.grid {
|
|
||||||
grid-template-columns: repeat(2, 50%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
.vercelLogo {
|
|
||||||
filter: invert(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo {
|
|
||||||
filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes rotate {
|
|
||||||
from {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
284
src/app/page.module.scss
Normal file
284
src/app/page.module.scss
Normal file
@ -0,0 +1,284 @@
|
|||||||
|
@import "./variables.scss";
|
||||||
|
|
||||||
|
section.buttons {
|
||||||
|
margin: 50px;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: right;
|
||||||
|
gap: 15px;
|
||||||
|
|
||||||
|
@media (max-width: 920px) {
|
||||||
|
margin-left: 100px;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
margin: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
article.selectionBar {
|
||||||
|
position: relative;
|
||||||
|
transition: 100ms ease;
|
||||||
|
width: 250px;
|
||||||
|
|
||||||
|
@media (max-width: 920px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.selected {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 16px;
|
||||||
|
font-size: 15px;
|
||||||
|
background: #dedfe3;
|
||||||
|
color: $darkGray;
|
||||||
|
border: none;
|
||||||
|
transition: 100ms ease;
|
||||||
|
cursor: pointer;
|
||||||
|
width: 250px;
|
||||||
|
|
||||||
|
@media (max-width: 920px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: darken(#dedfe3, 2.5);
|
||||||
|
color: $darkGray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unfoldIconUp,
|
||||||
|
.unfoldIconDown {
|
||||||
|
font-size: 18px;
|
||||||
|
transition: 200ms ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unfoldIconDown {
|
||||||
|
transform: rotate(180deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.choices {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 50;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
user-select: none;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
button.choice {
|
||||||
|
padding: 10px 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: $darkGray;
|
||||||
|
background: #dedfe3;
|
||||||
|
text-align: left;
|
||||||
|
border: none;
|
||||||
|
transition: 100ms ease;
|
||||||
|
cursor: pointer;
|
||||||
|
border-top: 1px solid #d9dce5;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-top: 1px solid #c8c8c8;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $darkGray;
|
||||||
|
background: darken(#dedfe3, 2.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
article.directions {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
@media (max-width: 920px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.directionButton {
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 10px 16px;
|
||||||
|
font-size: 18px;
|
||||||
|
border: none;
|
||||||
|
background: #dedfe3;
|
||||||
|
color: $darkGray;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: 100ms ease;
|
||||||
|
border-left: 1px solid #b8bac3;
|
||||||
|
|
||||||
|
@media (max-width: 920px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
border-left: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: darken(#dedfe3, 2.5);
|
||||||
|
color: $darkGray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textContent {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
section.planning {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(5, 1fr);
|
||||||
|
margin-right: 50px;
|
||||||
|
margin-left: 100px;
|
||||||
|
margin-bottom: 75px;
|
||||||
|
background: #f5f5f5;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
margin-left: 15px;
|
||||||
|
margin-right: 15px;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
article.planningDay {
|
||||||
|
div.title {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 18px 0;
|
||||||
|
color: $white;
|
||||||
|
background: $accentColor;
|
||||||
|
border-left: 1px solid $accentColorDark;
|
||||||
|
|
||||||
|
p.duration {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #f4c5c9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.dayEvents {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
div.hourPlaceholders {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
div.dayEvent {
|
||||||
|
border-top: 1px solid $secondaryColor;
|
||||||
|
border-left: 1px solid $secondaryColor;
|
||||||
|
height: 75px;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: 1px solid $secondaryColor;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.events div.event {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
background: $white;
|
||||||
|
border-radius: 6px;
|
||||||
|
border-left: 6px solid #00000000;
|
||||||
|
padding: 5px;
|
||||||
|
box-shadow: 0 0 10px #00000011;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: attr(data-room);
|
||||||
|
position: absolute;
|
||||||
|
top: 6px;
|
||||||
|
right: 6px;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 3px 5px;
|
||||||
|
background: $accentColor;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: $white;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p.interval {
|
||||||
|
font-size: 13px;
|
||||||
|
color: $gray;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p.title {
|
||||||
|
font-weight: 700;
|
||||||
|
margin-right: 20%;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.teacher {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 5px;
|
||||||
|
|
||||||
|
.teacherIcon {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.teacherContent {
|
||||||
|
font-size: 15px;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
h3.title {
|
||||||
|
border-left: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.dayEvents div.hourPlaceholders div.dayEvent {
|
||||||
|
&::before {
|
||||||
|
content: attr(data-start) ":00";
|
||||||
|
position: absolute;
|
||||||
|
font-size: 13px;
|
||||||
|
transform: translate(-130%, -50%);
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child::after {
|
||||||
|
content: attr(data-end) ":00";
|
||||||
|
position: absolute;
|
||||||
|
font-size: 13px;
|
||||||
|
transform: translate(-130%, 50%);
|
||||||
|
bottom: 0;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child div.dayEvents div.hourPlaceholders div.dayEvent {
|
||||||
|
border-right: 1px solid $secondaryColor;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
494
src/app/page.tsx
494
src/app/page.tsx
File diff suppressed because it is too large
Load Diff
12
src/app/variables.scss
Normal file
12
src/app/variables.scss
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
$accentColor: #e42535;
|
||||||
|
$accentColorDark: #c72331;
|
||||||
|
$accentColorDarker: #ac1e2a;
|
||||||
|
|
||||||
|
$white: #ffffff;
|
||||||
|
$black: #000000;
|
||||||
|
$lightBlack: #2a2a2a;
|
||||||
|
$darkGray: #555555;
|
||||||
|
$gray: #888888;
|
||||||
|
|
||||||
|
$primaryColor: #f0f0f0;
|
||||||
|
$secondaryColor: #e0e0e0;
|
||||||
10
src/constants/colors.ts
Normal file
10
src/constants/colors.ts
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
export default Object.freeze([
|
||||||
|
"#e8588f",
|
||||||
|
"#694994",
|
||||||
|
"#38abb8",
|
||||||
|
"#00519c",
|
||||||
|
"#88b917",
|
||||||
|
"#367b2a",
|
||||||
|
"#f5c82f",
|
||||||
|
"#f19217",
|
||||||
|
]);
|
||||||
44
src/constants/promos.ts
Normal file
44
src/constants/promos.ts
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
export enum Campus {
|
||||||
|
Fontainebleau,
|
||||||
|
Senart,
|
||||||
|
}
|
||||||
|
|
||||||
|
export type Promo = {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
promoId: string;
|
||||||
|
campus: Campus;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Object.freeze([
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
name: "BUT 1 (Fontainebleau)",
|
||||||
|
promoId: "50",
|
||||||
|
campus: Campus.Fontainebleau,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
name: "BUT 1 (Sénart)",
|
||||||
|
promoId: "14:113",
|
||||||
|
campus: Campus.Senart,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
name: "BUT 2 Fi",
|
||||||
|
promoId: "51",
|
||||||
|
campus: Campus.Fontainebleau,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
name: "BUT 2 Fa",
|
||||||
|
promoId: "52",
|
||||||
|
campus: Campus.Fontainebleau,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
name: "BUT 3",
|
||||||
|
promoId: "53",
|
||||||
|
campus: Campus.Fontainebleau,
|
||||||
|
},
|
||||||
|
]);
|
||||||
47
src/utils/fetchFontainebleau.ts
Normal file
47
src/utils/fetchFontainebleau.ts
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
import colors from "@/constants/colors";
|
||||||
|
import { Promo } from "@/constants/promos";
|
||||||
|
import axios from "axios";
|
||||||
|
import moment, { Moment } from "moment";
|
||||||
|
|
||||||
|
type PlanningEvent = {
|
||||||
|
resourceId: string;
|
||||||
|
start: string;
|
||||||
|
end: string;
|
||||||
|
title: string;
|
||||||
|
numero: string;
|
||||||
|
nomADE: string;
|
||||||
|
salle: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default async function fetchFontainebleau(
|
||||||
|
promo: Promo,
|
||||||
|
groupId: number,
|
||||||
|
startDate: Moment,
|
||||||
|
endDate: Moment
|
||||||
|
) {
|
||||||
|
const url = new URL("http://www.iut-fbleau.fr/EDT/consulter/ajax/ep.php");
|
||||||
|
|
||||||
|
url.searchParams.set("p", promo.promoId);
|
||||||
|
url.searchParams.set("start", startDate.toJSON());
|
||||||
|
url.searchParams.set("end", endDate.toJSON());
|
||||||
|
|
||||||
|
const response = await axios.get(url.toString());
|
||||||
|
const data: PlanningEvent[] = response.data;
|
||||||
|
|
||||||
|
return data
|
||||||
|
.filter((event) => event.numero === groupId.toString())
|
||||||
|
.map((event) => ({
|
||||||
|
start: moment(event.start).toJSON(),
|
||||||
|
end: moment(event.end).toJSON(),
|
||||||
|
title: event.title,
|
||||||
|
teacher: event.nomADE,
|
||||||
|
room: event.salle ?? "Inconnu",
|
||||||
|
color:
|
||||||
|
colors[
|
||||||
|
event.nomADE
|
||||||
|
.split("")
|
||||||
|
.reduce((acc, val) => val.charCodeAt(0) ** 2 + acc, 0) %
|
||||||
|
colors.length
|
||||||
|
],
|
||||||
|
}));
|
||||||
|
}
|
||||||
78
src/utils/fetchSenart.ts
Normal file
78
src/utils/fetchSenart.ts
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
import colors from "@/constants/colors";
|
||||||
|
import { Promo } from "@/constants/promos";
|
||||||
|
import axios from "axios";
|
||||||
|
import moment, { Moment } from "moment";
|
||||||
|
|
||||||
|
type SenPlanning = {
|
||||||
|
header: { left: string; center: string; right: string };
|
||||||
|
defaultDate: string;
|
||||||
|
defaultView: string;
|
||||||
|
scrollTime: string;
|
||||||
|
minTime: string;
|
||||||
|
maxTime: string;
|
||||||
|
navLinks: boolean;
|
||||||
|
locale: string;
|
||||||
|
noEventsMessage: string;
|
||||||
|
hiddenDays: number[];
|
||||||
|
editable: boolean;
|
||||||
|
eventLimit: boolean;
|
||||||
|
events: { title: string; start: string; end: string }[];
|
||||||
|
};
|
||||||
|
|
||||||
|
async function fetchSemester(promo: Promo, semesterNum: number) {
|
||||||
|
const url = new URL("https://dynasis.iutsf.org/index.php");
|
||||||
|
|
||||||
|
url.searchParams.set("group_id", "6");
|
||||||
|
url.searchParams.set("id", promo.promoId.split(":")[semesterNum]);
|
||||||
|
|
||||||
|
const response = await axios.get(url.toString());
|
||||||
|
const rawJsObject: string = response.data
|
||||||
|
.split(".fullCalendar(")[1]
|
||||||
|
.split(");")[0];
|
||||||
|
|
||||||
|
const readableJSONObject = rawJsObject
|
||||||
|
.replace(/\/\/.+/g, "")
|
||||||
|
.replace(/(?<!\\)'/g, '"')
|
||||||
|
.replace(/([a-zA-Z0-9_]+):\s/g, '"$1": ');
|
||||||
|
|
||||||
|
const JSONObject: SenPlanning = JSON.parse(readableJSONObject);
|
||||||
|
return JSONObject;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default async function fetchSenart(
|
||||||
|
promo: Promo,
|
||||||
|
startDate: Moment,
|
||||||
|
endDate: Moment
|
||||||
|
) {
|
||||||
|
const results = await Promise.all(
|
||||||
|
new Array(2).fill(0).map((_, i) => fetchSemester(promo, i))
|
||||||
|
);
|
||||||
|
|
||||||
|
const filteredEvents = results.map((r) =>
|
||||||
|
r.events.filter(
|
||||||
|
(e) =>
|
||||||
|
moment(e.start).isAfter(startDate) && moment(e.end).isBefore(endDate)
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
return filteredEvents.flat().map((event) => {
|
||||||
|
const [title, room, details] = event.title.split(/\r?\n/);
|
||||||
|
const regex = /^.+\(Sénart\)\s(?<teacher>.+\s)\s\(.+\)$/;
|
||||||
|
const teacher = details.match(regex)?.groups?.teacher ?? "A PRECISER";
|
||||||
|
|
||||||
|
return {
|
||||||
|
title: title.trim(),
|
||||||
|
room: room.trim() || "Inconnu",
|
||||||
|
teacher: teacher.trim(),
|
||||||
|
start: moment(event.start),
|
||||||
|
end: moment(event.end),
|
||||||
|
color:
|
||||||
|
colors[
|
||||||
|
teacher
|
||||||
|
.split("")
|
||||||
|
.reduce((acc, val) => val.charCodeAt(0) ** 2 + acc, 0) %
|
||||||
|
colors.length
|
||||||
|
],
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -12,6 +12,7 @@
|
|||||||
"isolatedModules": true,
|
"isolatedModules": true,
|
||||||
"jsx": "preserve",
|
"jsx": "preserve",
|
||||||
"incremental": true,
|
"incremental": true,
|
||||||
|
"downlevelIteration": true,
|
||||||
"plugins": [
|
"plugins": [
|
||||||
{
|
{
|
||||||
"name": "next"
|
"name": "next"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user