|
|
|
|
@ -1,6 +1,7 @@
|
|
|
|
|
import _ from 'lodash'
|
|
|
|
|
import { render } from 'preact'
|
|
|
|
|
import { useEffect, useState } from 'preact/hooks'
|
|
|
|
|
import { differenceInMinutes, startOfDay } from 'date-fns'
|
|
|
|
|
|
|
|
|
|
// import { ToolOverlay } from './components/ToolOverlay.jsx'
|
|
|
|
|
//
|
|
|
|
|
@ -18,12 +19,7 @@ import { Icon } from './components/Icon.jsx'
|
|
|
|
|
import { Popup } from './components/Popup.jsx'
|
|
|
|
|
import { Toolbar } from './components/Toolbar.jsx'
|
|
|
|
|
import { OptionBar } from './components/OptionBar.jsx'
|
|
|
|
|
import {
|
|
|
|
|
prettyAulaName,
|
|
|
|
|
prettyProfName,
|
|
|
|
|
clearOldPersistentStates,
|
|
|
|
|
usePersistentState,
|
|
|
|
|
} from './utils.jsx'
|
|
|
|
|
import { prettyAulaName, prettyProfName, usePersistentState } from './utils.jsx'
|
|
|
|
|
import { SettingsBar } from './components/SettingsBar.jsx'
|
|
|
|
|
|
|
|
|
|
// Che fanno queste due righe?
|
|
|
|
|
@ -31,10 +27,10 @@ window._ = _
|
|
|
|
|
window.dataBuffer = {}
|
|
|
|
|
|
|
|
|
|
const TIMETABLE_IDS = {
|
|
|
|
|
'anno-1': '667e88275e9623041f0e43d4',
|
|
|
|
|
'anno-2': '667e89055e9623041f0e43d6',
|
|
|
|
|
'anno-3': '667e89fcf748ed0415a11dcc',
|
|
|
|
|
'magistrale': '667ebae63379a3046517ffd4',
|
|
|
|
|
'anno-1': '64a7c1c651f079001d52e9c8',
|
|
|
|
|
'anno-2': '6308e2dc09352a0208fefdd9',
|
|
|
|
|
'anno-3': '6308e42a1df5cb026699ced4',
|
|
|
|
|
'magistrale': '64a7c7091ab813002c5d9ede',
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// const DEFAULT_DATE_RANGE = {
|
|
|
|
|
@ -50,17 +46,15 @@ const TIMETABLE_IDS = {
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
function specialEventPatches(eventi) {
|
|
|
|
|
// Il laboratorio del primo anno in realtà è in due gruppi separati
|
|
|
|
|
// Il laboratorio del primo anno in realtà è in due canali separati
|
|
|
|
|
let i = 1
|
|
|
|
|
eventi.forEach(evento => {
|
|
|
|
|
if (
|
|
|
|
|
evento.nome === 'LABORATORIO DI INTRODUZIONE ALLA MATEMATICA COMPUTAZIONALE'
|
|
|
|
|
evento.nome ===
|
|
|
|
|
'LABORATORIO DI INTRODUZIONE ALLA MATEMATICA COMPUTAZIONALE'
|
|
|
|
|
) {
|
|
|
|
|
if (evento.docenti[0].nome === 'GIOVANNI') {
|
|
|
|
|
evento.nome += ' (A)'
|
|
|
|
|
}
|
|
|
|
|
if (evento.docenti[0].nome === 'PAOLO') {
|
|
|
|
|
evento.nome += ' (B)'
|
|
|
|
|
}
|
|
|
|
|
evento.nome += ` (${i})`
|
|
|
|
|
i++
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
@ -69,12 +63,17 @@ function specialEventPatches(eventi) {
|
|
|
|
|
|
|
|
|
|
function formatEvents(timetable) {
|
|
|
|
|
return timetable.map(({ nome, dataInizio, dataFine, docenti, aule }) => {
|
|
|
|
|
const start = new Date(dataInizio)
|
|
|
|
|
const end = new Date(dataFine)
|
|
|
|
|
return {
|
|
|
|
|
id: nome,
|
|
|
|
|
name: _.split(nome, '-', 1)[0].trim(),
|
|
|
|
|
start: new Date(dataInizio),
|
|
|
|
|
end: new Date(dataFine),
|
|
|
|
|
docenti: docenti.map(({ nome, cognome }) => prettyProfName(nome, cognome)),
|
|
|
|
|
day: start.getDay(),
|
|
|
|
|
start: differenceInMinutes(start, startOfDay(start)),
|
|
|
|
|
end: differenceInMinutes(end, startOfDay(start)),
|
|
|
|
|
docenti: docenti.map(({ nome, cognome }) =>
|
|
|
|
|
prettyProfName(nome, cognome)
|
|
|
|
|
),
|
|
|
|
|
aule: aule.map(aula => prettyAulaName(aula.codice)),
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
@ -131,7 +130,7 @@ async function loadCalendari(date) {
|
|
|
|
|
const timetablesRaw = results.map(timetable =>
|
|
|
|
|
specialEventPatches(_.uniqBy(timetable, 'id'))
|
|
|
|
|
)
|
|
|
|
|
const allRaw = specialEventPatches(_.concat(...results), 'id')
|
|
|
|
|
const allRaw = specialEventPatches(_.uniqBy(_.concat(...results), 'id'))
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
'anno-1': formatEvents(timetablesRaw[0]),
|
|
|
|
|
@ -142,19 +141,50 @@ async function loadCalendari(date) {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const View = ({ view, selection, setSelection, timetables }) => {
|
|
|
|
|
const View = ({
|
|
|
|
|
view,
|
|
|
|
|
selection,
|
|
|
|
|
setSelection,
|
|
|
|
|
timetables,
|
|
|
|
|
custom,
|
|
|
|
|
setCustom,
|
|
|
|
|
}) => {
|
|
|
|
|
if (view === 'orario') {
|
|
|
|
|
return <Schedule selection={selection} timetables={timetables} />
|
|
|
|
|
return (
|
|
|
|
|
<Schedule
|
|
|
|
|
selection={selection}
|
|
|
|
|
timetables={timetables}
|
|
|
|
|
custom={custom}
|
|
|
|
|
/>
|
|
|
|
|
)
|
|
|
|
|
} else if (view === 'lista') {
|
|
|
|
|
return (
|
|
|
|
|
<Courses
|
|
|
|
|
selection={selection}
|
|
|
|
|
setSelection={setSelection}
|
|
|
|
|
source={'tutti'}
|
|
|
|
|
timetables={timetables}
|
|
|
|
|
hideOtherCourses={true}
|
|
|
|
|
custom={custom}
|
|
|
|
|
isRestrictedList={true}
|
|
|
|
|
/>
|
|
|
|
|
)
|
|
|
|
|
} else if (view === 'custom') {
|
|
|
|
|
return (
|
|
|
|
|
<div class="custom-events-view">
|
|
|
|
|
<textarea
|
|
|
|
|
value={custom}
|
|
|
|
|
onChange={e => setCustom(e.target.value)}
|
|
|
|
|
/>
|
|
|
|
|
<p>Esempio di evento personalizzato</p>
|
|
|
|
|
<p>
|
|
|
|
|
Nome evento [label globale]:
|
|
|
|
|
<br />
|
|
|
|
|
- Lun 9-11
|
|
|
|
|
<br />
|
|
|
|
|
- Mar 9:00-11:00
|
|
|
|
|
<br />- Gio 8:00-12:00 [label locale]
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
} else {
|
|
|
|
|
return (
|
|
|
|
|
<Courses
|
|
|
|
|
@ -162,7 +192,7 @@ const View = ({ view, selection, setSelection, timetables }) => {
|
|
|
|
|
setSelection={setSelection}
|
|
|
|
|
source={view}
|
|
|
|
|
timetables={timetables}
|
|
|
|
|
hideOtherCourses={false}
|
|
|
|
|
isRestrictedList={false}
|
|
|
|
|
/>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
@ -184,11 +214,14 @@ const App = ({}) => {
|
|
|
|
|
setTimetables(await loadCalendari(new Date(date)))
|
|
|
|
|
}, [date])
|
|
|
|
|
|
|
|
|
|
// View Modes
|
|
|
|
|
// const [mode, setMode] = usePersistentState('orario.mode', MODE_COURSES)
|
|
|
|
|
|
|
|
|
|
// Selection
|
|
|
|
|
const [selectedCourses, setSelectedCourses] = usePersistentState('selection', [])
|
|
|
|
|
const [selectedCourses, setSelectedCourses] = usePersistentState(
|
|
|
|
|
'selection',
|
|
|
|
|
[]
|
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
// Custom Events
|
|
|
|
|
const [custom, setCustom] = usePersistentState('custom', [])
|
|
|
|
|
|
|
|
|
|
// Menus
|
|
|
|
|
const [helpVisible, setHelpVisible] = useState(false)
|
|
|
|
|
@ -259,15 +292,16 @@ const App = ({}) => {
|
|
|
|
|
) : timetables['tutti'].length === 0 ? (
|
|
|
|
|
<div class="warning">
|
|
|
|
|
<p>
|
|
|
|
|
Non esistono corsi per la settimana selezionata: buone
|
|
|
|
|
vacanze! 🎉
|
|
|
|
|
Non esistono corsi per la settimana selezionata:
|
|
|
|
|
buone vacanze! 🎉
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
Per cambiare settimana puoi usare il widget Calendario (
|
|
|
|
|
Per cambiare settimana puoi usare il widget
|
|
|
|
|
Calendario (
|
|
|
|
|
<Icon name="calendar_month" />) in alto a destra
|
|
|
|
|
<br />
|
|
|
|
|
In versione mobile, il widget Calendario è situato dentro
|
|
|
|
|
il Menu (
|
|
|
|
|
In versione mobile, il widget Calendario è
|
|
|
|
|
situato dentro il Menu (
|
|
|
|
|
<Icon name="menu" />)
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
@ -277,6 +311,8 @@ const App = ({}) => {
|
|
|
|
|
setSelection={setSelectedCourses}
|
|
|
|
|
view={view}
|
|
|
|
|
timetables={timetables}
|
|
|
|
|
custom={custom}
|
|
|
|
|
setCustom={setCustom}
|
|
|
|
|
/>
|
|
|
|
|
))}
|
|
|
|
|
</div>
|
|
|
|
|
|
Francesco Baldino