jonas/TIF22A_AnwProjekt_B
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Days Grayed Out

Browse Source
This commit is contained in:
brausjonas
2023-06-09 14:22:18 +02:00
parent b93c05b874
commit 74fbf38ecd
4 changed files with 77275 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
anwendung/src/components/CalenderView.jsx
+35 -15
View File
@@ -12,14 +12,18 @@ let cellHeight = 20;
let colors = ["#f80000", "#414141"]
let semesterStart;
let semesterEnd;
let currentWeekStartDay;
let currentYear;
let semesterStartYear;
let semesterEndYear;
let selectedElement;
let grabbedDown;
let isDayOkay = [true, true, true, true, true, true]
let errorState = ErrorType.Okay
let grayedOut = [false, false, false, false, false, false]
export default function CalenderView(p) {
@@ -27,15 +31,14 @@ export default function CalenderView(p) {
const [update, setUpdate] = useState(false)
const scrollRef = useRef(null);
const[startDayCalenderSideBar, setStartDayCalenderSideBar] = useState(0)
const[startYearCalenderSideBar, setStartYearCalenderSideBar] = useState(2000)
const[endDayCalenderSideBar, setEndDayCalenderSideBar] = useState(0)
const[endYearCalenderSideBar, setEndYearCalenderSideBar] = useState(2000)
const [startDayCalenderSideBar, setStartDayCalenderSideBar] = useState(0)
const [startYearCalenderSideBar, setStartYearCalenderSideBar] = useState(2000)
const [endDayCalenderSideBar, setEndDayCalenderSideBar] = useState(0)
const [endYearCalenderSideBar, setEndYearCalenderSideBar] = useState(2000)
const [highlightMonth, setHighlightMonth] = useState(0)
const [highlightYear, setHighlightYear] = useState(2000)
function readEntries() {
let url = baseURL + "/entries?semesterid=" + localStorage.getItem("currentsid") +
"&daynumber=" + currentWeekStartDay + "&yearnumber=" + currentYear + "&sessionid=" + localStorage.getItem("sessionid");
@@ -93,6 +96,13 @@ 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
j++
}
setEntries(en)
})
} catch (e) {
@@ -248,7 +258,9 @@ export default function CalenderView(p) {
if (!currentId.includes("grab")) {
if (!checkForElementAtRow(row + 2, currentColumnID)) {
if ((row - 1) / 4 >= 7 && (row + 2) / 4 <= 18) {
pushEntry(currentColumnID, row)
if(!grayedOut[currentColumnID]) {
pushEntry(currentColumnID, row)
}
}
}
} else {
@@ -313,6 +325,9 @@ export default function CalenderView(p) {
useEffect(() => {
semesterStart = 0;
semesterEnd = 0;
semesterStartYear = 0;
semesterEndYear = 0;
currentWeekStartDay = 0;
currentYear = 2000;
selectedElement = null;
@@ -333,6 +348,9 @@ export default function CalenderView(p) {
setHighlightYear(currentYear)
semesterStart = s.startday;
semesterEnd = s.endday;
semesterStartYear = s.startyear;
semesterEndYear = s.endyear;
setStartDayCalenderSideBar(semesterStart)
setEndDayCalenderSideBar(s.endday)
}).then(readEntries)
@@ -379,8 +397,7 @@ export default function CalenderView(p) {
temp.push(i);
}
function onMonthClick(monthIndex, startParts)
{
function onMonthClick(monthIndex, startParts) {
monthIndex--
let date = new Date(parseInt(startParts[2]), monthIndex, 1)
let start = new Date(date.getFullYear(), 0, 0)
@@ -401,7 +418,10 @@ export default function CalenderView(p) {
alignItems: "center"
}}>
<div>
<BasicDateCalendar startyear={startYearCalenderSideBar} startday={startDayCalenderSideBar} endyear={endYearCalenderSideBar} endday={endDayCalenderSideBar} highlightYear={highlightYear} highlightMonth={highlightMonth} onMonthClick={onMonthClick}/>
<BasicDateCalendar startyear={startYearCalenderSideBar} startday={startDayCalenderSideBar}
endyear={endYearCalenderSideBar} endday={endDayCalenderSideBar}
highlightYear={highlightYear} highlightMonth={highlightMonth}
onMonthClick={onMonthClick}/>
</div>
<div style={{
display: "flex",
@@ -449,7 +469,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"0"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>
@@ -475,7 +495,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"1"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>
@@ -502,7 +522,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"2"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>
@@ -530,7 +550,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"3"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>
@@ -557,7 +577,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"4"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>
@@ -584,7 +604,7 @@ export default function CalenderView(p) {
<div className={"spalte"}
id={"5"} style={{gridTemplateRows: `repeat(96, ${cellHeight}px)`}}
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)}>