@olea-bps/views 1.0.6 → 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/TimetableCalendar/index.js +42 -2
- package/package.json +2 -2
|
@@ -59,6 +59,26 @@ function TimetableViewCalendar(props) {
|
|
|
59
59
|
const [errorMessage, setErrorMessage] = useState('');
|
|
60
60
|
const [infoMessage, setInfoMessage] = useState('');
|
|
61
61
|
|
|
62
|
+
/**
|
|
63
|
+
* Höhe des Kalenders in Pixeln.
|
|
64
|
+
* Wird an die Calendar-Komponente in TimetableDay/TimetableWeek übergeben.
|
|
65
|
+
* WICHTIG: Bei Änderung dieses Wertes muss auch die height-Prop in TimetableDay und TimetableWeek angepasst werden!
|
|
66
|
+
*/
|
|
67
|
+
const CALENDAR_HEIGHT = 800;
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* Interne Mindesthöhe der react-native-big-calendar Bibliothek.
|
|
71
|
+
* Siehe: node_modules/react-native-big-calendar/build/index.es.js (MIN_HEIGHT = 1200)
|
|
72
|
+
*/
|
|
73
|
+
const CALENDAR_MIN_HEIGHT = 1200;
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* Berechnet die Höhe einer Stunden-Zelle in Pixeln.
|
|
77
|
+
* Verwendet die gleiche Formel wie react-native-big-calendar intern:
|
|
78
|
+
* cellHeight = Math.max(height - 30, MIN_HEIGHT) / 24
|
|
79
|
+
*/
|
|
80
|
+
const calculateCellHeight = (height) => Math.max(height - 30, CALENDAR_MIN_HEIGHT) / 24;
|
|
81
|
+
|
|
62
82
|
// Berechnen der Uhrzeit zu der beim Öffnen des Stundenplan Kalenders hingepsrungen werden soll.
|
|
63
83
|
// Wird in einem State gespeichert, weil später noch beim Focus-Wechsel erneut berechnet werden muss.
|
|
64
84
|
const [calendarScrollOffsetMinutes, setCalendarScrollOffsetMinutes] = useState(
|
|
@@ -70,7 +90,25 @@ function TimetableViewCalendar(props) {
|
|
|
70
90
|
: Duration.fromObject({ hours: DateTime.now().hour });
|
|
71
91
|
|
|
72
92
|
// Duration wird in Minuten umgewandelt, weil der Kalender ein Minutenoffset erwartet
|
|
73
|
-
|
|
93
|
+
const offsetMinutes = calendarScrollOffsetDuration.as('minutes');
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* iOS Workaround für Bug in react-native-big-calendar (v4.0.19)
|
|
97
|
+
*
|
|
98
|
+
* Problem: Die Bibliothek behandelt scrollOffsetMinutes auf iOS falsch.
|
|
99
|
+
* - Android verwendet: scrollTo({ y: (cellHeight * scrollOffsetMinutes) / 60 })
|
|
100
|
+
* - iOS verwendet: contentOffset.y = scrollOffsetMinutes (direkt als Pixel!)
|
|
101
|
+
*
|
|
102
|
+
* Lösung: Auf iOS den Wert vorab in Pixel umrechnen mit der gleichen Formel wie Android.
|
|
103
|
+
*
|
|
104
|
+
* Siehe: node_modules/react-native-big-calendar/build/index.es.js (Zeile 799 und 895)
|
|
105
|
+
*/
|
|
106
|
+
if (Platform.OS === 'ios') {
|
|
107
|
+
const cellHeight = calculateCellHeight(CALENDAR_HEIGHT);
|
|
108
|
+
return (cellHeight * offsetMinutes) / 60;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
return offsetMinutes;
|
|
74
112
|
}
|
|
75
113
|
);
|
|
76
114
|
|
|
@@ -105,6 +143,7 @@ function TimetableViewCalendar(props) {
|
|
|
105
143
|
return <CalendarDay
|
|
106
144
|
selectedDate={selectedDayModeDate}
|
|
107
145
|
calendarScrollOffsetMinutes={calendarScrollOffsetMinutes}
|
|
146
|
+
calendarHeight={CALENDAR_HEIGHT}
|
|
108
147
|
onDateChanged={setSelectedDayModeDate}
|
|
109
148
|
onCourseSelected={setSelectedEvent}
|
|
110
149
|
/>;
|
|
@@ -112,11 +151,12 @@ function TimetableViewCalendar(props) {
|
|
|
112
151
|
return <CalendarWeek
|
|
113
152
|
selectedISOWeek={selectedWeekModeISOWeekDate}
|
|
114
153
|
calendarScrollOffsetMinutes={calendarScrollOffsetMinutes}
|
|
154
|
+
calendarHeight={CALENDAR_HEIGHT}
|
|
115
155
|
onWeekChanged={setSelectedWeekModeISOWeekDate}
|
|
116
156
|
onCourseSelected={setSelectedEvent}
|
|
117
157
|
/>;
|
|
118
158
|
case 'month':
|
|
119
|
-
return <CalendarMonth today={today} setToday={setToday} month={month} setMonth={setMonth} calendarScrollOffsetMinutes={calendarScrollOffsetMinutes} />;
|
|
159
|
+
return <CalendarMonth today={today} setToday={setToday} month={month} setMonth={setMonth} calendarScrollOffsetMinutes={calendarScrollOffsetMinutes} calendarHeight={CALENDAR_HEIGHT} />;
|
|
120
160
|
default:
|
|
121
161
|
return null;
|
|
122
162
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@olea-bps/views",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.8",
|
|
4
4
|
"description": "Consolidated views for OLEA",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"repository": {
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"@olea-bps/context-canteen": "^1.0.0",
|
|
24
24
|
"@olea-bps/context-user": "^1.0.0",
|
|
25
25
|
"@olea-bps/context-public-transport-ticket": "^1.0.0",
|
|
26
|
-
"@olea-bps/context-event": "^1.0.
|
|
26
|
+
"@olea-bps/context-event": "^1.0.4",
|
|
27
27
|
"@olea-bps/context-info-dialog": "^1.0.0",
|
|
28
28
|
"@olea-bps/context-callmanager": "^1.0.0",
|
|
29
29
|
"@olea-bps/context-news": "^1.0.0",
|