Development: Frontend: Containers - zhaw-timetable/zhawo GitHub Wiki

• AppBarContainer ⇐ Component
  • appBarContainer.toggleDrawer
• BottomNavContainer ⇐ Component
  • new BottomNavContainer()
  • BottomNavContainer.updateViewState
• DrawerContainer ⇐ Component
  • new DrawerContainer()
  • DrawerContainer.toggleDrawer
  • DrawerContainer.handleDrawer
• DrawerNav ⇐ Component
  • new DrawerNav()
• DrawerOptions ⇐ Component
  • new DrawerOptions()
  • DrawerOptions.logout
  • DrawerOptions.handleThemeSwitchChange
  • DrawerOptions.handleThemeChanged
  • DrawerOptions.handleViewChanged
  • DrawerOptions.handleViewSwitchChange
• LoginContainer ⇐ Component
  • new LoginContainer()
  • LoginContainer.login
  • LoginContainer.getCurrentViewPath
• LoginSearch ⇐ Component
  • new LoginSearch()
  • loginSearch.componentDidMount()
  • LoginSearch.loadPossibleNames
  • LoginSearch.refreshPossibleLoginNames
  • LoginSearch.handleSuggestionsFetchRequested
  • LoginSearch.handleSuggestionsClearRequested
  • LoginSearch.handleChange
  • LoginSearch.handleKeyDown
  • LoginSearch.loginUser
  • LoginSearch.getSuggestions
  • LoginSearch.getSuggestionValue
  • LoginSearch.onSuggestionSelected
• MensaContainer ⇐ Component
  • new MensaContainer()
  • MensaContainer.onSwipeStart
  • MensaContainer.onSwipeMove
  • MensaContainer.onSwipeEnd
• MensaContextMenu ⇐ Component
  • new MensaContextMenu()
  • MensaContextMenu.handleMensasLoaded
  • MensaContextMenu.handleClick
  • MensaContextMenu.handleClose
  • MensaContextMenu.getMenuPlan
  • MensaContextMenu.handleGoToTodayClick
• MensaNavigationWeek ⇐ Component
  • new MensaNavigationWeek()
  • MensaNavigationWeek.refreshNavigation
  • MensaNavigationWeek.handleDateClick
  • MensaNavigationWeek.handleWeekBackClick
  • MensaNavigationWeek.handleWeekForwardClick
• MenuPlan ⇐ Component
  • new MenuPlan()
  • MenuPlan.handleMenuPlanChanged
• NotFoundContainer ⇐ Component
  • new NotFoundContainer()
• RoomSearchContainer ⇐ Component
  • new RoomSearchContainer()
  • RoomSearchContainer.setFreeRooms
  • RoomSearchContainer.setFloor
  • RoomSearchContainer.setRoomBackground
  • RoomSearchContainer.handleSearchClick
  • RoomSearchContainer.handleTimeChange
  • RoomSearchContainer.handleFloorClick
• Schedule ⇐ Component
  • new Schedule()
  • Schedule.toggleMonthView
  • Schedule.handleView
  • Schedule.onSwipeStart
  • Schedule.onSwipeMove
  • Schedule.onSwipeEnd
• EventDetailDialog ⇐ Component
  • new EventDetailDialog()
• LessonDay ⇐ Component
  • new LessonDay()
  • lessonDay.startTimer()
  • lessonDay.stopTimer()
  • LessonDay.setEvents
  • LessonDay.refreshSchedule
  • LessonDay.getTimeSlot
  • LessonDay.handleEventClick
  • LessonDay.handleCloseEventDetails
  • LessonDay.getWeekKey
  • LessonDay.getDayKey
  • LessonDay.checkForVszhawEvent
• LessonWeek ⇐ Component
  • new LessonWeek()
  • lessonWeek.startTimer()
  • lessonWeek.stopTimer()
  • LessonWeek.setEvents
  • LessonWeek.refreshSchedule
  • LessonWeek.getTimeSlot
  • LessonWeek.handleEventClick
  • LessonWeek.handleCloseEventDetails
  • LessonWeek.getWeekKey
  • LessonWeek.checkForVszhawEvent
• NavigationWeek ⇐ Component
  • new NavigationWeek()
  • NavigationWeek.refreshNavigation
  • NavigationWeek.handleDateClick
  • NavigationWeek.handleWeekBackClick
  • NavigationWeek.handleWeekForwardClick
• ScheduleContextMenu ⇐ Component
  • new ScheduleContextMenu()
  • ScheduleContextMenu.refreshState
  • ScheduleContextMenu.handleGoToTodayClick
  • ScheduleContextMenu.handleOpen
  • ScheduleContextMenu.handleClose
  • ScheduleContextMenu.handleClearSearch
  • ScheduleContextMenu.refreshPossibleNames
  • ScheduleContextMenu.handleSuggestionsFetchRequested
  • ScheduleContextMenu.handleSuggestionsClearRequested
  • ScheduleContextMenu.handleChange
  • ScheduleContextMenu.handleKeyDown
  • ScheduleContextMenu.handleSearch
  • ScheduleContextMenu.getSuggestions
  • ScheduleContextMenu.getSuggestionValue
  • ScheduleContextMenu.onSuggestionSelected
• VszhawEvent ⇐ Component
  • new VszhawEvent()
  • VszhawEvent.gotoLink

Kind: global class
Extends: Component

AppBar Component. Styled in Material design. Can be passed children that will desplayed in bar.

State of Drawer

Kind: instance property of AppBarContainer

Kind: global class
Extends: Component

• BottomNavContainer ⇐ Component
  • new BottomNavContainer()
  • .updateViewState

Bottom App Drawer/ Navigation Component. Uses React router to switch between Components, by pushing Components to history. Styled in material design. Contains Material Icons that can be found in the assets folder.

Function that pushes view to history so Components can be changed using react router

Kind: static property of BottomNavContainer

Param	Type	Description
event	event
value	number	(name of new Component)

Kind: global class
Extends: Component

• DrawerContainer ⇐ Component
  • new DrawerContainer()
  • .toggleDrawer
  • .handleDrawer

Drawer Component.

Floats to the right. Is hidden on Mobile and fixed on lager Screens.

Function that calls action to open/close drawer state

Kind: static property of DrawerContainer

Function that is called when store changes. Sets local drawerOpen state to match store drawerOpen state.

Kind: static property of DrawerContainer

Kind: global class
Extends: Component

DrawerNav Component

Navigation bar in Drawer. Contains all the links to the links to the different Views. Replaces BottomNav on Desktop.

Kind: global class
Extends: Component

• DrawerOptions ⇐ Component
  • new DrawerOptions()
  • .logout
  • .handleThemeSwitchChange
  • .handleThemeChanged
  • .handleViewChanged
  • .handleViewSwitchChange

Drawer Option Component

Contains to option switches. Day/Week view. Dark/Light Mode. Contains Logout Button.

Function that call Action logout user.

Kind: static property of DrawerOptions

Function that is called on when Theme Switch changes. Calls action to set state in Global Store.

Kind: static property of DrawerOptions

Function that is called when store changes. Sets local themeSwitch state to match store theme state.

Kind: static property of DrawerOptions

Function that is called when store changes. Sets local viewSwitch state to match store isDayView state.

Kind: static property of DrawerOptions

Function that is called on when Day/Week view Switch changes. Calls action to set state in global Store.

Kind: static property of DrawerOptions

Kind: global class
Extends: Component

• LoginContainer ⇐ Component
  • new LoginContainer()
  • .login
  • .getCurrentViewPath

Login Component. Login page shown to users that are not loggin.

Function called when store changes Set local state redirectToPreviousRoute to true. This allows user to be redirected to next Component.

Kind: static property of LoginContainer

Function that pushes view to history so Components can be changed using react router.

Kind: static property of LoginContainer

Kind: global class
Extends: Component

• LoginSearch ⇐ Component
  • new LoginSearch()
  • instance
    • .componentDidMount()
  • static
    • .loadPossibleNames
    • .refreshPossibleLoginNames
    • .handleSuggestionsFetchRequested
    • .handleSuggestionsClearRequested
    • .handleChange
    • .handleKeyDown
    • .loginUser
    • .getSuggestions
    • .getSuggestionValue
    • .onSuggestionSelected

Login Search Component.

Maintains a list of all the possible User names. Filters list when user types. Login User and forwards to next Component. Chooses top name in list on enter press.

componentDidMount Function is called when the component is finished rendering. loadPossibleNames Function is called form this function, so that the possible username list is ready for the users when they start typing.

Kind: instance method of LoginSearch

Function calls for possible usernames to be called, if store does not contain names yet.

If store does contain names it set loadingPossibleNames state to false, so that the Autosuggest component is shown and not the 3 dots.

Kind: static property of LoginSearch

Function that is called when store changes. Sets local possibleLoginNames state to match store possibleLoginNames state.

Set loadingPossibleNames state to false, so that the Autosuggest component is shown and no longer the 3 dots.

Kind: static property of LoginSearch

Function that is called when store changes. Set local suggestions state by calling getSuggestions function.

Kind: static property of LoginSearch

Function that clears local suggestions state. Called on Autosuggest onSuggestionsClearRequested.

Kind: static property of LoginSearch

Function called on Autosuggest component cahnge.

sets local value state to match Autosuggest value.

Kind: static property of LoginSearch

Function called on every key press in Autosuggest. Checks if key press was enter. If enter was pressed it sets the user using loginUser function.

Kind: static property of LoginSearch

Param	Type
event	event

Function called to to login user. Sets current user by calling setCurrentUser action. Gets user schedule using getSchedule action.

Kind: static property of LoginSearch

Param	Type
user	User

Function filters possibleLoginNames with input. Returns list of names.

Kind: static property of LoginSearch

Param	Type
value	string

Function called by Autosuggest. return suggestion.

Kind: static property of LoginSearch

Function called by Autosuggest on list element selection. Login user using loginUser.

Kind: static property of LoginSearch

Kind: global class
Extends: Component

• MensaContainer ⇐ Component
  • new MensaContainer()
  • .onSwipeStart
  • .onSwipeMove
  • .onSwipeEnd

Mensa Container Component. Mensa Page. Displays Mensa Info.

Function that sets local swipeInX state to. Used to swipe.

Kind: static property of MensaContainer

Function that sets local swipeInX state. Used to swipe.

Kind: static property of MensaContainer

Function that swipes by calling swipeRight or swipeLeft action. Uses local swipeInX state to decided if the user is swiping left or right.

Kind: static property of MensaContainer

Kind: global class
Extends: Component

• MensaContextMenu ⇐ Component
  • new MensaContextMenu()
  • .handleMensasLoaded
  • .handleClick
  • .handleClose
  • .getMenuPlan
  • .handleGoToTodayClick

Mensa Context Menu Component Contains the Mensa Elements that need to be passed to AppBar Go to today button Select Mensa button

Function called when store changes. List of Mensas is readay and list can be stored in local state. Local selectedMensaName state is set.

Kind: static property of MensaContextMenu

Function that sets local anchorEl state to selected value

Kind: static property of MensaContextMenu

Function that sets local anchorEl state back to null

Kind: static property of MensaContextMenu

Function that prevents the default behavior of an element, gets Menu plan for the selected Mensa using getMenuPlan action and sets local selectedMensaName state to the selected mensa and the anchorEl state to null.

Kind: static property of MensaContextMenu

Param	Type
params	Params

Function that prevents the default behavior of an element and uses the gotoDay action to go to current day.

Kind: static property of MensaContextMenu

Kind: global class
Extends: Component

• MensaNavigationWeek ⇐ Component
  • new MensaNavigationWeek()
  • .refreshNavigation
  • .handleDateClick
  • .handleWeekBackClick
  • .handleWeekForwardClick

Mensa Navigation Week Component. Navigation bar with the days of the week. Used to switch between days.

Function called when store changes. Sets local displayDay and displayWeek state to match store states.

Kind: static property of MensaNavigationWeek

Function that changes day by calling gotoDay action.

Kind: static property of MensaNavigationWeek

Function that changes day by calling gotoDay action. Before calling gotoDay it subtracts a week from the current date.

Kind: static property of MensaNavigationWeek

Function that changes day by calling gotoDay action. Before calling gotoDay it adds a week from the current date.

Kind: static property of MensaNavigationWeek

Kind: global class
Extends: Component

• MenuPlan ⇐ Component
  • new MenuPlan()
  • .handleMenuPlanChanged

Menu Plan Component. List of the Meals for Selected Mensa on selected day.

Function called when store changes. Sets local currentMenuDay, emptyMenuMessage and selectedMensaName state to match store.

Kind: static property of MenuPlan

Kind: global class
Extends: Component

Not Found Container Component 404 page

Kind: global class
Extends: Component

• RoomSearchContainer ⇐ Component
  • new RoomSearchContainer()
  • .setFreeRooms
  • .setFloor
  • .setRoomBackground
  • .handleSearchClick
  • .handleTimeChange
  • .handleFloorClick

Room Search Container Component Shows all free rooms for current day.

Time slot can be selected and then rooms that are free for duration of full time are shown. Free rooms have a colored background.

Function called when store changes. Sets local currentFreeRooms state to match store currentFreeRooms state. Sets background of free rooms using setRoomBackground

Kind: static property of RoomSearchContainer

Function called when store changes. Sets local currentFreeRooms, currentFloor and currentBuildingFloors state to match store. Sets background of free rooms using setRoomBackground

Kind: static property of RoomSearchContainer

Function that sets the state for rooms/floors that should have a colored background.

Kind: static property of RoomSearchContainer

Function that gets free rooms for a given time slot using getFreeRoomsByTime action. Uses local startTime and endTime state as time slot

Kind: static property of RoomSearchContainer

Functions that sets times on change. Set local startTime, startTimeIndex, endTime and endTimeIndex state. Makes sure end time is after start time.

Kind: static property of RoomSearchContainer

Function changes floor on changeFloor action.

Kind: static property of RoomSearchContainer

Kind: global class
Extends: Component

• Schedule ⇐ Component
  • new Schedule()
  • .toggleMonthView
  • .handleView
  • .onSwipeStart
  • .onSwipeMove
  • .onSwipeEnd

Schedule Component Displays the schedule for the current user. User can swipe between days/weeks.

Function that toggles local isOpen state.

Kind: static property of Schedule

Function that is called when store changes. Sets local isDayView to match store.

Kind: static property of Schedule

Function that sets local swipeInX state to 0. Used to swipe.

Kind: static property of Schedule

Function that sets local swipeInX state. Used to swipe.

Kind: static property of Schedule

Function that sets local swipeInX state. Used to swipe.

Kind: static property of Schedule

Kind: global class
Extends: Component

Event Detail Dialog Component Dialog Windows for Events.

Kind: global class
Extends: Component

• LessonDay ⇐ Component
  • new LessonDay()
  • instance
    • .startTimer()
    • .stopTimer()
  • static
    • .setEvents
    • .refreshSchedule
    • .getTimeSlot
    • .handleEventClick
    • .handleCloseEventDetails
    • .getWeekKey
    • .getDayKey
    • .checkForVszhawEvent

Lesson Day Component Lesson information container for one day.

Function that start a timer that updates activeSlot state every 60000 milliseconds. Local activeSlot state is set to current time slot using getTimeSlot.

Kind: instance method of LessonDay

Ends interval started using startTimer.

Kind: instance method of LessonDay

Function called on store change. Sets local vszhawEvents state to match store events state

Kind: static property of LessonDay

Function called when store changes. Sets local slots, displayDay and schedule states to match store.

Kind: static property of LessonDay

Function that returns current time slot in a given list of time slots.

Kind: static property of LessonDay

Param	Type
slots	Array.<slot>

Function that sets local eventDetailsOpen state to true and eventForDetails to the given param, after checking if the clicked event contains actual information (not. f.ex. holiday). Doing so will cause model to open.

Kind: static property of LessonDay

Function that sets local eventDetailsOpen state to false and eventForDetails to null. Doing so will cause model to close.

Kind: static property of LessonDay

Function will return the first day of the week for the given date formatted as YYYY-MM-DD

Kind: static property of LessonDay

Param	Type
displayDay	Date

Function will return the given date formatted as YYYY-MM-DD

Kind: static property of LessonDay

Param	Type
displayDay	Date

Function returns the next vszhawEvents, if one exists during current week.

Kind: static property of LessonDay

Kind: global class
Extends: Component

• LessonWeek ⇐ Component
  • new LessonWeek()
  • instance
    • .startTimer()
    • .stopTimer()
  • static
    • .setEvents
    • .refreshSchedule
    • .getTimeSlot
    • .handleEventClick
    • .handleCloseEventDetails
    • .getWeekKey
    • .checkForVszhawEvent

Lesson Week Component Used to display Week Schedule.

Function that start a timer that updates activeSlot state every 60000 milliseconds. Local activeSlot state is set to current time slot using getTimeSlot.

Kind: instance method of LessonWeek

Ends interval started using startTimer.

Kind: instance method of LessonWeek

Function called on store change. Sets local vszhawEvents state to match store events state

Kind: static property of LessonWeek

Function called when store changes. Sets local slots, displayDay and schedule states to match store.

Kind: static property of LessonWeek

Function that returns current time slot in a given list of time slots.

Kind: static property of LessonWeek

Param	Type
slots	Array.<slot>

Function that sets local eventDetailsOpen state to true and eventForDetails to the given param, after checking if the clicked event contains actual information (not. f.ex. holiday). Doing so will cause model to open.

Kind: static property of LessonWeek

Function that sets local eventDetailsOpen state to false and eventForDetails to null. Doing so will cause model to close.

Kind: static property of LessonWeek

Function will return the first day of the week for the given date.

Kind: static property of LessonWeek

Param	Type
displayDay	Date

Function returns the next vszhawEvents, if one exists during current week.

Kind: static property of LessonWeek

Kind: global class
Extends: Component

• NavigationWeek ⇐ Component
  • new NavigationWeek()
  • .refreshNavigation
  • .handleDateClick
  • .handleWeekBackClick
  • .handleWeekForwardClick

Navigation Week Component Week days Mon-Sat used for navigation.

Function called when store changes. Sets local displayDay and displayWeek state to match store.

Kind: static property of NavigationWeek

Function set current date to given date using gotoDay action

Kind: static property of NavigationWeek

Param	Type
newDate	date

Function that changes day by calling gotoDay action. Before calling gotoDay it subtracts a week from the current date.

Kind: static property of NavigationWeek

Function that changes day by calling gotoDay action. Before calling gotoDay it adds a week from the current date.

Kind: static property of NavigationWeek

Kind: global class
Extends: Component

• ScheduleContextMenu ⇐ Component
  • new ScheduleContextMenu()
  • .refreshState
  • .handleGoToTodayClick
  • .handleOpen
  • .handleClose
  • .handleClearSearch
  • .refreshPossibleNames
  • .handleSuggestionsFetchRequested
  • .handleSuggestionsClearRequested
  • .handleChange
  • .handleKeyDown
  • .handleSearch
  • .getSuggestions
  • .getSuggestionValue
  • .onSuggestionSelected

Schedule Context Menu Component

Function called on store change. Set local currentSearch state to match store.

Kind: static property of ScheduleContextMenu

Function that prevents the default behavior of an element and uses the gotoDay action to go to current day.

Kind: static property of ScheduleContextMenu

Function used to open Schedule Search by setting isScheduleSearchOpen state to true.

Kind: static property of ScheduleContextMenu

Function used to close Schedule Search by setting isScheduleSearchOpen state to false. Resets value state.

Kind: static property of ScheduleContextMenu

Function clears search by calling clearSearch action

Kind: static property of ScheduleContextMenu

Function called on store change. Sets local possibleNames to match store.

Kind: static property of ScheduleContextMenu

Function used to set local suggestions state by calling getSuggestions. Used by Autosuggest.

Kind: static property of ScheduleContextMenu

Param	Type
value	string

Function used to clear local suggestions state. Used by Autosuggest.

Kind: static property of ScheduleContextMenu

Function used to set local value state. Used by Autosuggest.

Kind: static property of ScheduleContextMenu

Function called on every key press and prevents the default. Selects suggestion on enter press using handleSearch.

Kind: static property of ScheduleContextMenu

Function that get schedule for search by calling getSchedule action and closes modular using handleClose.

Kind: static property of ScheduleContextMenu

Function that filters possibleNames by value.

Kind: static property of ScheduleContextMenu

Param	Type
value	string

Function that get suggestion value from given suggestion

Kind: static property of ScheduleContextMenu

Function that selects suggestion using handleSearch. Prevents Default.

Kind: static property of ScheduleContextMenu

Kind: global class
Extends: Component

• VszhawEvent ⇐ Component
  • new VszhawEvent()
  • .gotoLink

Vszhaw Event Component Container for Event, to place event in schedule

Function that forwards to given link

Kind: static property of VszhawEvent

Param	Type
link	string