Merged conflicts

pull/4/head
Antonio De Lucreziis 2 years ago
commit 0b1dbaebbd

@ -22,7 +22,7 @@ export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource, theme
<img src="logo-circuit-board.svg" alt="logo" /> / <span>Orario</span> <img src="logo-circuit-board.svg" alt="logo" /> / <span>Orario</span>
</div> </div>
</div> </div>
<div class="options"> {/* <div class="options">
<div class="label">Gruppo Corsi</div> <div class="label">Gruppo Corsi</div>
<ComboBox <ComboBox
value={source} value={source}
@ -47,7 +47,7 @@ export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource, theme
]} ]}
/> />
</div> </div>
<hr /> <hr /> */}
<div class="help"> <div class="help">
<h2> <h2>
<Icon name="info" /> <Icon name="info" />

@ -0,0 +1,41 @@
import { CompoundButton } from './CompoundButton.jsx'
import { MODE_COURSE, MODE_SCHEDULE, MODE_WORKWEEK, MODE_WORKWEEK_GRID } from './EventsView.jsx'
import { Icon } from './Icon.jsx'
export const Optionbar = ({ mode, setMode, source, setSource, onHelp }) => {
return (
<div class="optionbar">
<div class="option-group">
<div class="item option">
<CompoundButton
options={[
{ value: 'anno-1', label: 'I' },
{ value: 'anno-2', label: 'II' },
{ value: 'anno-3', label: 'III' },
{ value: 'magistrale', label: 'M' },
{ value: 'tutti', label: <Icon name="apps" /> },
]}
value={source}
setValue={setSource}
/>
</div>
</div>
<div class="option-group">
<div class="item option">
<CompoundButton
options={[
{ value: MODE_COURSE, label: <Icon name="list" /> },
{
value: MODE_WORKWEEK_GRID,
label: <Icon name="calendar_view_month" />,
},
{ value: MODE_SCHEDULE, label: <Icon name="calendar_view_day" /> },
]}
value={mode}
setValue={setMode}
/>
</div>
</div>
</div>
)
}

@ -9,6 +9,7 @@ import { Help } from './components/Help.jsx'
import { Icon } from './components/Icon.jsx' import { Icon } from './components/Icon.jsx'
import { Popup } from './components/Popup.jsx' import { Popup } from './components/Popup.jsx'
import { Toolbar } from './components/Toolbar.jsx' import { Toolbar } from './components/Toolbar.jsx'
import { Optionbar } from './components/Optionbar.jsx'
window._ = _ window._ = _
window.dataBuffer = {} window.dataBuffer = {}
@ -58,20 +59,37 @@ async function loadEventi(ids) {
}) })
) )
<<<<<<< HEAD
if (ids.length === 1) { if (ids.length === 1) {
return calendari[0] return calendari[0]
} }
=======
// console.log(calendari)
if (ids.length === 1) {
return calendari[0]
}
>>>>>>> 41195462f176b27e142a78d7a63c072144135c5a
return _.uniqBy(_.concat(...calendari), 'id') return _.uniqBy(_.concat(...calendari), 'id')
} }
const App = ({}) => { const App = ({}) => {
<<<<<<< HEAD
// Data Sources // Data Sources
const [source, setSource] = useState('magistrale') const [source, setSource] = useState('magistrale')
const [eventi, setEventi] = useState([]) const [eventi, setEventi] = useState([])
// View Modes // View Modes
const [mode, setMode] = useState(MODE_COURSE) const [mode, setMode] = useState(MODE_COURSE)
=======
// Data Sources
const [source, setSource] = useState('anno-1')
const [eventi, setEventi] = useState([])
// View Modes
const [mode, setMode] = useState(MODE_WORKWEEK_GRID)
>>>>>>> 41195462f176b27e142a78d7a63c072144135c5a
// Selection // Selection
const [selectedCourses, setSelectedCourses] = useState([]) const [selectedCourses, setSelectedCourses] = useState([])
@ -81,8 +99,14 @@ const App = ({}) => {
const [helpVisible, setHelpVisible] = useState(false) const [helpVisible, setHelpVisible] = useState(false)
const [showMobileMenu, setShowMobileMenu] = useState(false) const [showMobileMenu, setShowMobileMenu] = useState(false)
<<<<<<< HEAD
useEffect(async () => {
const eventi = await loadEventi(CALENDAR_IDS[source])
=======
useEffect(async () => { useEffect(async () => {
console.log('source changed')
const eventi = await loadEventi(CALENDAR_IDS[source]) const eventi = await loadEventi(CALENDAR_IDS[source])
>>>>>>> 41195462f176b27e142a78d7a63c072144135c5a
window.dataBuffer[source] = eventi window.dataBuffer[source] = eventi
@ -93,8 +117,14 @@ const App = ({}) => {
const toolOverlayVisible = const toolOverlayVisible =
selectedCourses.length > 0 && selectedCourses.filter(id => groupIds.has(id)).length > 0 selectedCourses.length > 0 && selectedCourses.filter(id => groupIds.has(id)).length > 0
<<<<<<< HEAD
useEffect(() => { useEffect(() => {
const groupIds = new Set(eventi.map(e => e.nome)) const groupIds = new Set(eventi.map(e => e.nome))
=======
useEffect(() => {
console.log('course length changed')
const groupIds = new Set(eventi.map(e => e.nome))
>>>>>>> 41195462f176b27e142a78d7a63c072144135c5a
if ( if (
selectedCourses.length === 0 || selectedCourses.length === 0 ||
@ -126,6 +156,15 @@ const App = ({}) => {
setTheme, setTheme,
}} }}
/> />
<Optionbar
{...{
mode,
setMode,
source,
setSource,
onHelp: () => setHelpVisible(true),
}}
/>
<EventsView <EventsView
mode={mode} mode={mode}
selection={selectedCourses} selection={selectedCourses}

@ -448,9 +448,38 @@ body {
} }
} }
} }
.optionbar {
@extend .panel;
padding: 1rem 0.75rem 1rem 1rem;
border-radius: 0;
border: none;
border-bottom: 1px solid var(--border-500);
height: 4rem;
display: none;
align-items: center;
justify-content: space-between;
@media screen and (max-width: $device-s-width), (pointer: coarse) {
display: flex;
}
.option-group {
display: flex;
align-items: center;
gap: 0.75rem;
}
}
.events-view { .events-view {
height: calc(100vh - 4rem); height: calc(100vh - 4rem);
@media screen and (max-width: $device-s-width), (pointer: coarse) {
height: calc(100vh - 8rem);
}
.course-view { .course-view {
padding: 1rem; padding: 1rem;

Loading…
Cancel
Save