Calender View Module and Semester names and Numbers are shown
Also in the Dashboard for Lecturers
This commit is contained in:
brausjonas
@@ -66,12 +66,10 @@ export default function CalenderView(p) {
|
||||
errorState[i] = ErrorType.TooLate
|
||||
isDayOkay[i] = false
|
||||
break
|
||||
}
|
||||
else if(new Date(currentYear, 0, elem.daynumber).getUTCDay() === 5) {
|
||||
} else if (new Date(currentYear, 0, elem.daynumber).getUTCDay() === 5) {
|
||||
errorState[i] = ErrorType.Saturday
|
||||
isDayOkay[i] = false
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
if ((elem.timestart - 1) / 4 <= 11 && (elem.timeend - 1) / 4 >= 14) {
|
||||
errorState[i] = ErrorType.NotEnoughLunchTime
|
||||
isDayOkay[i] = false
|
||||
@@ -109,10 +107,9 @@ export default function CalenderView(p) {
|
||||
|
||||
for (let i = 0; i < 6; i++) {
|
||||
for (let k = 0; k < 20; k++) {
|
||||
if (en[i][k] != null){
|
||||
if (en[i][k] != null) {
|
||||
|
||||
if (en[i][k].semesterid != currentsid)
|
||||
{
|
||||
if (en[i][k].semesterid != currentsid) {
|
||||
for (let l = 0; l < 20; l++) {
|
||||
if (en[i][l] != null && en[i][l].usercreatedbyid != userid) {
|
||||
if (en[i][l].timestart <= en[i][k].timestart && en[i][l].timeend >= en[i][k].timeend) {
|
||||
@@ -144,13 +141,12 @@ export default function CalenderView(p) {
|
||||
}
|
||||
|
||||
let j = 0;
|
||||
for(let i = Math.round(((new Date(currentYear, 0, currentWeekStartDay) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))); i <= Math.round(((new Date(currentYear, 0, currentWeekStartDay + 5) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))); i++)
|
||||
{
|
||||
grayedOut[j] = i % Math.round(((new Date(currentYear, 11, 31) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))) < semesterStart && semesterEnd && new Date(currentYear, 0, currentWeekStartDay + j).getFullYear() == semesterStartYear || i % Math.round(((new Date(currentYear, 11, 31) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))) > semesterEnd && new Date(currentYear, 0, currentWeekStartDay + j).getFullYear() == semesterEndYear
|
||||
for (let i = Math.round(((new Date(currentYear, 0, currentWeekStartDay) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))); i <= Math.round(((new Date(currentYear, 0, currentWeekStartDay + 5) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))); i++) {
|
||||
grayedOut[j] = i % Math.round(((new Date(currentYear, 11, 31) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))) < semesterStart && semesterEnd && new Date(currentYear, 0, currentWeekStartDay + j).getFullYear() == semesterStartYear || i % Math.round(((new Date(currentYear, 11, 31) - new Date(currentYear, 0, 0)) / (1000 * 60 * 60 * 24))) > semesterEnd && new Date(currentYear, 0, currentWeekStartDay + j).getFullYear() == semesterEndYear
|
||||
j++
|
||||
}
|
||||
for (let i = 0; i < 6; i++) {
|
||||
let date = new Date(currentYear, 0, currentWeekStartDay+i)
|
||||
let date = new Date(currentYear, 0, currentWeekStartDay + i)
|
||||
grayedOut[i] = holiday(currentYear, date.getMonth(), date.getDate()) ? holiday(currentYear, date.getMonth(), date.getDate()) : grayedOut[i]
|
||||
}
|
||||
|
||||
@@ -190,7 +186,7 @@ export default function CalenderView(p) {
|
||||
}).then(r => readEntries())
|
||||
}
|
||||
|
||||
function holiday(year, month, day){
|
||||
function holiday(year, month, day) {
|
||||
var feiertagejs = require('feiertagejs');
|
||||
let today = new Date(year, month, day)
|
||||
return feiertagejs.isHoliday(today, 'BW')
|
||||
@@ -316,9 +312,9 @@ export default function CalenderView(p) {
|
||||
if (e.button === 0) {
|
||||
if (!currentId.includes("e")) {
|
||||
if (!currentId.includes("grab")) {
|
||||
if (!checkForElementAtRow(row + 2, currentColumnID) && !checkForElementAtRow(row+1, currentColumnID)) {
|
||||
if (!checkForElementAtRow(row + 2, currentColumnID) && !checkForElementAtRow(row + 1, currentColumnID)) {
|
||||
if ((row - 1) / 4 >= 7 && (row + 2) / 4 <= 18) {
|
||||
if(!grayedOut[currentColumnID]) {
|
||||
if (!grayedOut[currentColumnID]) {
|
||||
pushEntry(currentColumnID, row)
|
||||
}
|
||||
}
|
||||
@@ -347,8 +343,7 @@ export default function CalenderView(p) {
|
||||
setHighlightMonth(date.getMonth())
|
||||
setHighlightYear(date.getFullYear())
|
||||
|
||||
for(let i = 0; i < errorState.length; i++)
|
||||
{
|
||||
for (let i = 0; i < errorState.length; i++) {
|
||||
errorState[i] = ErrorType.Okay
|
||||
}
|
||||
|
||||
@@ -361,8 +356,7 @@ export default function CalenderView(p) {
|
||||
setHighlightMonth(date.getMonth())
|
||||
setHighlightYear(date.getFullYear())
|
||||
|
||||
for(let i = 0; i < errorState.length; i++)
|
||||
{
|
||||
for (let i = 0; i < errorState.length; i++) {
|
||||
errorState[i] = ErrorType.Okay
|
||||
}
|
||||
|
||||
@@ -376,9 +370,9 @@ export default function CalenderView(p) {
|
||||
if (id == userCreatedByID) {
|
||||
if (isDayOkay[columnID] && moduleid == localStorage.getItem("moduleid")) {
|
||||
return "#77932b";
|
||||
}else if(moduleid != localStorage.getItem("moduleid")){
|
||||
} else if (moduleid != localStorage.getItem("moduleid")) {
|
||||
return "#346991";
|
||||
}else {
|
||||
} else {
|
||||
return "#e5a10e";
|
||||
}
|
||||
|
||||
@@ -393,11 +387,9 @@ export default function CalenderView(p) {
|
||||
if (id == userCreatedByID) {
|
||||
if (isDayOkay[columnID] && moduleid == localStorage.getItem("moduleid")) {
|
||||
return "#5a6c20";
|
||||
} else if(moduleid != localStorage.getItem("moduleid"))
|
||||
{
|
||||
} else if (moduleid != localStorage.getItem("moduleid")) {
|
||||
return "#346991"
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
return "#c08809";
|
||||
}
|
||||
} else {
|
||||
@@ -434,6 +426,7 @@ export default function CalenderView(p) {
|
||||
semesterEndYear = s.endyear;
|
||||
setStartDayCalenderSideBar(semesterStart)
|
||||
setEndDayCalenderSideBar(s.endday)
|
||||
|
||||
}).then(readEntries)
|
||||
|
||||
scrollRef.current.scrollTop = 600;
|
||||
@@ -488,8 +481,7 @@ export default function CalenderView(p) {
|
||||
setHighlightMonth(date.getMonth())
|
||||
setHighlightYear(currentYear)
|
||||
|
||||
for(let i = 0; i < errorState.length; i++)
|
||||
{
|
||||
for (let i = 0; i < errorState.length; i++) {
|
||||
errorState[i] = ErrorType.Okay
|
||||
}
|
||||
|
||||
@@ -498,320 +490,350 @@ export default function CalenderView(p) {
|
||||
|
||||
return (
|
||||
|
||||
<div className={"calender-direction-wrapper"}>
|
||||
<div>
|
||||
<BasicDateCalendar startyear={startYearCalenderSideBar} startday={startDayCalenderSideBar}
|
||||
endyear={endYearCalenderSideBar} endday={endDayCalenderSideBar}
|
||||
highlightYear={highlightYear} highlightMonth={highlightMonth}
|
||||
onMonthClick={onMonthClick}/>
|
||||
</div>
|
||||
<div style={{
|
||||
display: "flex",
|
||||
height: "73vh",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
}} id={update}>
|
||||
<WeekSelector year={currentYear} startday={currentWeekStartDay} onFunctionLeft={() => onWeekLeft()}
|
||||
onFunctionRight={() => onWeekRight()}/>
|
||||
<div style={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
}}>
|
||||
<p style={{
|
||||
fontSize: 40,
|
||||
marginBottom: 60
|
||||
}}>{p.semesterName}</p>
|
||||
<div className={"calender-direction-wrapper"}>
|
||||
<div>
|
||||
<BasicDateCalendar startyear={startYearCalenderSideBar} startday={startDayCalenderSideBar}
|
||||
endyear={endYearCalenderSideBar} endday={endDayCalenderSideBar}
|
||||
highlightYear={highlightYear} highlightMonth={highlightMonth}
|
||||
onMonthClick={onMonthClick}/>
|
||||
</div>
|
||||
<div style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
height: "73vh",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
backgroundColor: "white",
|
||||
gap: 5,
|
||||
}}>
|
||||
<div style={{borderRadius: 10, padding: 10, backgroundColor: "#f1f1f1"}} className={"box-shadow"}>
|
||||
<div>
|
||||
<div className={"wochen-tag-container"}>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Montag {new Date(currentYear, 0, currentWeekStartDay).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Dienstag {new Date(currentYear, 0, currentWeekStartDay + 1).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Mittwoch {new Date(currentYear, 0, currentWeekStartDay + 2).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Donnerstag {new Date(currentYear, 0, currentWeekStartDay + 3).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Freitag {new Date(currentYear, 0, currentWeekStartDay + 4).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Samstag {new Date(currentYear, 0, currentWeekStartDay + 5).getDate()}.
|
||||
}} id={update}>
|
||||
<WeekSelector year={currentYear} startday={currentWeekStartDay} onFunctionLeft={() => onWeekLeft()}
|
||||
onFunctionRight={() => onWeekRight()}/>
|
||||
<div style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
backgroundColor: "white",
|
||||
gap: 5,
|
||||
}}>
|
||||
<div style={{borderRadius: 10, padding: 10, backgroundColor: "#f1f1f1"}}
|
||||
className={"box-shadow"}>
|
||||
<div>
|
||||
<div className={"wochen-tag-container"}>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Montag {new Date(currentYear, 0, currentWeekStartDay).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Dienstag {new Date(currentYear, 0, currentWeekStartDay + 1).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Mittwoch {new Date(currentYear, 0, currentWeekStartDay + 2).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Donnerstag {new Date(currentYear, 0, currentWeekStartDay + 3).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Freitag {new Date(currentYear, 0, currentWeekStartDay + 4).getDate()}.
|
||||
</div>
|
||||
<div
|
||||
className={"wochen-tag font-big"}>Samstag {new Date(currentYear, 0, currentWeekStartDay + 5).getDate()}.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={"calender-container"} ref={scrollRef}>
|
||||
<div className={"calender-container"} ref={scrollRef}>
|
||||
|
||||
<div className={"calender-view content"} style={{height: cellHeight * 96 + 10}}>
|
||||
<div className={"calender-view content"} style={{height: cellHeight * 96 + 10}}>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"0"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[0] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
<div className={"spalte"}
|
||||
id={"0"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[0] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
{entries[0].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
{entries[0].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 0, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"1"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[1] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
{entries[1].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"2"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[2] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[2].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"3"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[3] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
{entries[3].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"4"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[4] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[4].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"5"} style={{
|
||||
gridTemplateRows: `repeat(96, ${cellHeight}px)`,
|
||||
backgroundColor: grayedOut[5] ? "#aaaaaa" : "#ffffff"
|
||||
}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[5].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"1"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[1] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
{entries[1].map(d => (d != null && <div className={"entry"} style={{
|
||||
<div className={"overlay"} style={{backgroundColor: "rgba(0, 0, 0, 0)"}}>
|
||||
{/*maps a list of internal time stamps to lines and time stamps*/}
|
||||
{temp.map(i => (<div style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
height: cellHeight * 2,
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-around",
|
||||
alignItems: "center",
|
||||
}} className={"no-pointer-events"}>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 1, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"2"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[2] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[2].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 2, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"3"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[3] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
{entries[3].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 3, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"4"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[4] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[4].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 4, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"spalte"}
|
||||
id={"5"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`, backgroundColor: grayedOut[5] ? "#aaaaaa" : "#ffffff"}}
|
||||
onMouseDown={e => onMouseDown(e)}
|
||||
onMouseMove={e => onMouseMove(e)}
|
||||
onMouseUp={e => onMouseUp(e)}>
|
||||
|
||||
|
||||
{entries[5].map(d => (d != null && <div className={"entry"} style={{
|
||||
width: "100%",
|
||||
gridRowStart: d.timestart,
|
||||
gridRowEnd: d.timeend,
|
||||
backgroundColor: getEntryColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}} id={d.id + "e"}>
|
||||
<div className={"resize-grab"} id={"grabup"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
<div style={{maxHeight: "60%"}} className={"no-pointer-events"}>
|
||||
<p>{internal_to_time(d.timestart) + " - " + internal_to_time(d.timeend)}</p>
|
||||
<p>{d.info}</p>
|
||||
</div>
|
||||
<div className={"resize-grab"} id={"grabdown"} style={{
|
||||
backgroundColor: getResizeBarColor(d.usercreatedbyid, 5, d.semesterid, d.moduleid)
|
||||
}}></div>
|
||||
</div>))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className={"overlay"} style={{backgroundColor: "rgba(0, 0, 0, 0)"}}>
|
||||
{/*maps a list of internal time stamps to lines and time stamps*/}
|
||||
{temp.map(i => (<div style={{
|
||||
width: "100%",
|
||||
height: cellHeight * 2,
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-around",
|
||||
alignItems: "center",
|
||||
}} className={"no-pointer-events"}>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
<div style={{
|
||||
borderBottom: (i / 4 === 7 || i / 4 === 18 ? "3px solid #fc3d03" : "1px solid #363636"),
|
||||
}}><p style={{
|
||||
color: "gray",
|
||||
marginTop: cellHeight - 3,
|
||||
marginRight: 120,
|
||||
fontSize: 12,
|
||||
textAlign: "center"
|
||||
}}>{internal_to_time(i + 1)}</p></div>
|
||||
</div>))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={"error-bar"}>
|
||||
{errorState.map((e, index) => (
|
||||
<div style={{
|
||||
display: e === ErrorType.Okay ? "none" : "flex",
|
||||
width: "90%",
|
||||
backgroundColor: e === ErrorType.Okay ? "white" : "#e5a10e",
|
||||
borderRadius: 15,
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
gap: 10,
|
||||
alignItems: "center",
|
||||
minHeight: 120,
|
||||
maxHeight: 120,
|
||||
padding: 10
|
||||
}} className={"box-shadow"}>
|
||||
<p style={{
|
||||
borderRadius: 15,
|
||||
backgroundColor: "#346991",
|
||||
<div className={"error-bar"}>
|
||||
{errorState.map((e, index) => (
|
||||
<div style={{
|
||||
display: e === ErrorType.Okay ? "none" : "flex",
|
||||
width: "90%",
|
||||
paddingTop: 1,
|
||||
paddingBottom: 1,
|
||||
color: "white",
|
||||
textAlign: "center"
|
||||
}}>{new Date(currentYear, 0, currentWeekStartDay + index).toLocaleDateString()}</p>
|
||||
<p style={{
|
||||
textAlign: "center"
|
||||
}}>{e}</p>
|
||||
</div>))}
|
||||
backgroundColor: e === ErrorType.Okay ? "white" : "#e5a10e",
|
||||
borderRadius: 15,
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
gap: 10,
|
||||
alignItems: "center",
|
||||
minHeight: 120,
|
||||
maxHeight: 120,
|
||||
padding: 10
|
||||
}} className={"box-shadow"}>
|
||||
<p style={{
|
||||
borderRadius: 15,
|
||||
backgroundColor: "#346991",
|
||||
width: "90%",
|
||||
paddingTop: 1,
|
||||
paddingBottom: 1,
|
||||
color: "white",
|
||||
textAlign: "center"
|
||||
}}>{new Date(currentYear, 0, currentWeekStartDay + index).toLocaleDateString()}</p>
|
||||
<p style={{
|
||||
textAlign: "center"
|
||||
}}>{e}</p>
|
||||
</div>))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -18,7 +18,7 @@ export default function planning(p)
|
||||
<Back onClick={() => router.back()}/>
|
||||
<HelpButton/>
|
||||
<Background/>
|
||||
<CalenderView/>
|
||||
<CalenderView semesterName={localStorage.getItem("semestername") + " " + (localStorage.getItem("admin") == 1 ? "" : localStorage.getItem("currentmodulename"))}/>
|
||||
<SubmitButton />
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -26,19 +26,20 @@ export default function SemesteroverviewLecturer(p) {
|
||||
let semesterURL = baseURL + "/semester/id/all?ids=" + args + "&sessionid=" + localStorage.getItem("sessionid");
|
||||
fetch(semesterURL).then(r => r.json()).then(sem => {
|
||||
sem.map(e => {
|
||||
temp.push(e.name)
|
||||
temp.push(e.name + " Sem. " + (e.number + 1))
|
||||
})
|
||||
}).then(() => setSemesterNames(temp))
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function onClickSemester(e, m) {
|
||||
function onClickSemester(e, m, name) {
|
||||
if (e.activated == 1) {
|
||||
if (m.target === m.currentTarget) {
|
||||
localStorage.setItem("currentsid", e.semesterid)
|
||||
localStorage.setItem("currentmodulename", e.name)
|
||||
localStorage.setItem("moduleid", e.id)
|
||||
localStorage.setItem("semestername", name)
|
||||
router.push("/planning")
|
||||
}
|
||||
}
|
||||
@@ -62,10 +63,10 @@ export default function SemesteroverviewLecturer(p) {
|
||||
{entries.map((e, index) => (
|
||||
<div className={"semester-tile box-shadow"} style={{
|
||||
backgroundColor: e.activated == 1 ? "#ffffff" : "#aaaaaa"
|
||||
}} onClick={(f) => onClickSemester(e, f)}>
|
||||
}} onClick={(f) => onClickSemester(e, f, semesterNames[index])}>
|
||||
<SemesterTile
|
||||
editable={false} text={semesterNames[index]} text2={e.name}
|
||||
onClick={(f) => onClickSemester(e, f)}
|
||||
onClick={(f) => onClickSemester(e, f, semesterNames[index])}
|
||||
/>
|
||||
<StatusBar progress={0} modules={entries}/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user