Adding conflicting courses, in many cases, will push a course block to the next day or out of the grid.

[DereC4]

I've observed when 3 courses are added, the course block to the left jumps to the right. Is this expected behavior?

EDIT: I have realized that this occurs when 4+ courses added on the same day. Adjusting title to match problem.

_{Huly®: UTRP-345}

[Samathingamajig]

this also looks like an issue. i know exactly why this happens (since the purple course only thinks there are two courses total during its time block) but it's also wrong

[Samathingamajig]

not sure why this is happening though

[DereC4]

will check.

[DereC4]

WAIT IT'S A MONDAY COURSE WHAT

[DereC4]

https://discord.com/channels/743636346727301172/1302913583637725257/1302931097113591870

Additional details here

[IsaDavRod]

Added this to bug tracker but will investigate the issue later.

[IsaDavRod]

By Derek:

looks like when we have 3 courses or something.

[DereC4]

[IsaDavRod]

Just putting this for future reference

[IsaDavRod]

This bug happens when at least one course conflicts with courses that are consecutive.

• The goal is to first fix the bug using the simplest solution. If you want to try to do the complex way to maximize space, you are on your own since I have ZERO clue how that complex solution would work.

---

What is the bug?

The image below shows normal behavior for conflicting courses, and NONE are consecutive (none start at exactly the same time another one ends).

The image below also shows normal behavior for courses that do NOT conflict, and they ARE consecutive.

However, if we have consecutive courses, and a course that conflicts with both courses, a nasty bug appears. In the first image below, the blue course is suddenly PUSHED to the right since the red course was added. The second and third image below shows the correct behavior with different solutions.

IMAGE 1 (BUG)

IMAGE 2 (NO BUG): Complex solution to maximize space.

IMAGE 3 (NO BUG): Simple solution without maximizing space.

---

So what causes the bug?

In this image of 10 courses, the bug does not appear because—although many of them conflict with each other—they all share a common time (1:30pm-2:00pm), and that means none of them are consecutive.

However, if we add one course which conflicts with the others AND also happens to be consecutive with another course, the bug appears. In the image below, all but ONE course share the common time, 1:30pm-2:00pm. The purple course that starts at 11:30am and ends at 1:30pm is also consecutive with the blue course that starts at 1:30pm and ends at 3:30pm. Notice how the last blue course was pushed to the right. Behind the scenes, the blue course's margin-left is just 100% (WHICH IS BASICALLY THE BUG). It's not actually in the next cell. No block should ever have a margin-left of 100%.

In the image below, notice the following:

• margin-left of the blue course is 100%
• The first purple's margin-left is 12.5%.
• The margin-left of all the other courses are increasing by 10% (22.2, 33.3, 44.4. 55.5, 66.6, 77.7)
• All the widths except the first purple and blue (consecutive courses btw) have a width of 12.5% while the others have a width of 11.1.)

In this next image, the margin-left for the first purple is changed to 11.1% to match the pattern, and the margin-left of the blue course is changed to 88.8% to end the pattern. Both widths are also changed to 11.1% to match the widths of the other blocks. This is how it's supposed to look like.

---

However, things can get tricky, especially if we want to maximize space to ensure as much info in each block is shown.

Another example of the bug:

In the first image below, the bug is present. It might not look like anything is wrong, but the gap between the red and yellow/blue course is improper and not expected behavior. If we go into inspect, the red block has a width: calc(33.3333%) while the yellow and blue have a width: calc(50%). (see the second and third image below to see the correct behavior with different solutions).

IMAGE 1 (BUG)

IMAGE 2 (NO BUG): Complex solution to maximize space. (blue and yellow share a portion of the grid area)

IMAGE 3 (NO BUG): Simple solution without maximizing space. It divides the num of courses by 100 to get the % width per course.

---

EXPECTED BEHAVIOR:

NOTE: The likelihood of a student adding this many courses is very low, but this example is just to share an idea on maximizing space which is important if the student has two courses that share a conflicting course as in the earlier example.

SOLUTION ONE: (SIMPLEST)

When blocks conflict, the width of each block is supposed to be equally distributed.
For example, if five non-consecutive conflicting courses exist in a 100px grid cell, each course is supposed to take up 20% of that 100px space (which means they each have a 20% width of the entire cell).

SOLUTION TWO: (COMPLEX)

Any consecutive courses that share a conflicting course is supposed to take up the same % space (same width) and have the same left-margin.
For example, if there are three non-consecutive conflicting courses in a 100px grid cell AND two consecutive non-conflicting courses in the cell (assuming they share a conflicting course), the two consecutive non-conflicting courses take up the same 25% space, and the other three each take up their own 25% (this essentially maximizes space)
IMAGE 1: Maximizes space by having two consecutive courses share a portion of space, assuming they share a conflicting course.

IMAGE 2: Does not maximizes space, but also fixes the bug issue. Each course is given its own space, but less of the course detail is shown.

---

[IsaDavRod]

Made a new issue about this. #480