228-new-frontend-for-parking

b24hugst commented

2026-05-25 12:49:48 +00:00

Collaborator

Added new layouts for each parking zone
Buttons to switch between zones
Variables showing the total amount of spots, and how many of those that are available.

I took the original layout that was already there in parkingLayout.js, and made one for each zone. I know this is horrendous for when you want to change something like size, as all coordinates and viewbox sizing will have to be updated as well. But I thought this could be improved in another issue maybe.

All and all I think it works and showcases things correctly.

Issue: #228

- Added new layouts for each parking zone - Buttons to switch between zones - Variables showing the total amount of spots, and how many of those that are available. I took the original layout that was already there in parkingLayout.js, and made one for each zone. I know this is horrendous for when you want to change something like size, as all coordinates and viewbox sizing will have to be updated as well. But I thought this could be improved in another issue maybe. All and all I think it works and showcases things correctly. Issue: #228

Screenshot 2026-05-25 143943.png

15 KiB

Screenshot 2026-05-25 144015.png

27 KiB

Screenshot 2026-05-25 144028.png

23 KiB

b24hugst added 4 commits

2026-05-25 12:49:49 +00:00

Added output of spots daf66494a7

Now shows total spots, available spots, and occupied spots. (In text. not in rectangle yet)

Buttons to change zones and updated layout b541cb02f8

Layouts for each zone added be418cdbdc

Can now switch between zones and their spots get updated green or red correctly

Added styling b06a5164c0

a24julot commented

2026-05-25 12:55:52 +00:00

Collaborator

The number for available spots is incorrect, it is one number less than it should be, see picture. And on grus it looks like all parkingspots are free, but it says only 6 are free.

image.png

18 KiB

image.png

16 KiB

a24julot commented

2026-05-25 12:56:42 +00:00

Collaborator

Is the idea to make them look like the parkings that are actually at Högskolan? This was the idea with the issue

b24hugst commented

2026-05-25 13:01:25 +00:00

Author

Collaborator

@a24julot wrote in #1146 (comment):

Is the idea to make them look like the parkings that are actually at Högskolan? This was the idea with the issue

Yeah I thought about that but wasn't sure how to be able to do it as I couldn't find good images online of the parking spots. I could try if I got them though.

And for the Grus I think I know how to fix it so I'll do it now.

@a24julot wrote in https://git.webug.se/Andras/BoundlessFlowCampus2K/pulls/1146#issuecomment-13918: > Is the idea to make them look like the parkings that are actually at Högskolan? This was the idea with the issue Yeah I thought about that but wasn't sure how to be able to do it as I couldn't find good images online of the parking spots. I could try if I got them though. And for the Grus I think I know how to fix it so I'll do it now.

a24julot commented

2026-05-25 13:07:26 +00:00

Collaborator

This is a screenshot from google maps, I think you can get a pretty good picture of the parking spots

image.png

1.4 MiB

b24hugst commented

2026-05-25 13:21:48 +00:00

Author

Collaborator

Ahh yeah switching to satelite made it work. Just to be clear. Is it these six? (forgot to circle in the grus)

Ahh yeah switching to satelite made it work. Just to be clear. Is it these six? (forgot to circle in the grus) ![image](/attachments/4e5ee5ed-3d01-45d3-af78-39baf7dd7800)

image.png

3.1 MiB

a24julot commented

2026-05-25 13:27:17 +00:00

Collaborator

Not the one to the right, that is for science park.
You can just focus on getting the correct layout for one parking zone for now because the merge is tomorrow.
In service/parkingService/parkingService/README.md there is an explanation on which parking is which.

Not the one to the right, that is for science park. You can just focus on getting the correct layout for one parking zone for now because the merge is tomorrow. In service/parkingService/parkingService/README.md there is an explanation on which parking is which.

b24hugst commented

2026-05-25 13:29:49 +00:00

Author

Collaborator

Ah tomorrow merge already? Yeah ok nice that readme will help a lot as I had no idea which one was which. I guess A is for the A house though so I can begin with that.

b24hugst commented

2026-05-25 15:19:19 +00:00

Author

Collaborator

Started and got a fair way on E, but it was a bit tricky. I won't be able to update it more today but can fix so the parking spots match later in the week after the merge if that's okay.

b23albst changed target branch from team_1_week_7 to both_teams_week_8

2026-05-27 08:56:58 +00:00

b23albst added 7 commits

2026-05-27 13:08:23 +00:00

Changed spot ids for Grus zone fd33fddc40

Added functionality for rotating spots. Changed height to 30. Did layout for f 4876c2a271

Corrected spotIds for layout f a7ffe2f2ab

Accidentally changed card title fbff9a561c

Fixed layout for Grus and corrected typo in layout f 2cf84913f5

Layout G 2e9c7a378c

Layout H 1fc3d538c8

b23albst added 2 commits

2026-05-27 20:17:22 +00:00

Layouts for A and E 1ac82c2810

Changed so that id's in layouts start at 1 in accordance with api data 6ecf0b7f76

b23albst commented

2026-05-27 20:51:36 +00:00

Collaborator

All layouts have been updated. When doing this, I ordered the spots from left to right and tried to comment what spots are where in the layout. Usually they start from the top left from the pov of a car arriving at the parking. This means I did not take into account the what spots are "special". This may need to be changed in the future (changing what spots are special in mockup generation would be easiest, I think), but since special spots are not used in the frontend at the moment, I think this is fine for now.

The merge conflicts in ParkingView.js are easy to fix. I believe it is only the title that has should be changed to the localization key and that in both_teams branch, the useParking hook has not got the zone parameter yet.

It is too late for me to look at the merge conflicts in theme.css. Good luck with that

(Ps. I'm aware that it would have been easier to change the values of height and width for the rectangles instead of adding angle 90 to (almost) everything in the layouts, but when realizing this, I was already in too deep...)

All layouts have been updated. When doing this, I ordered the spots from left to right and tried to comment what spots are where in the layout. Usually they start from the top left from the pov of a car arriving at the parking. This means I did not take into account the what spots are "special". This may need to be changed in the future (changing what spots are special in mockup generation would be easiest, I think), but since special spots are not used in the frontend at the moment, I think this is fine for now. The merge conflicts in ParkingView.js are easy to fix. I believe it is only the title that has should be changed to the localization key and that in both_teams branch, the useParking hook has not got the zone parameter yet. It is too late for me to look at the merge conflicts in theme.css. Good luck with that (Ps. I'm aware that it would have been easier to change the values of height and width for the rectangles instead of adding angle 90 to (almost) everything in the layouts, but when realizing this, I was already in too deep...)

b23albst added the

needs review

label

2026-05-27 20:51:59 +00:00

b23albst commented

2026-05-27 22:01:57 +00:00

Collaborator

Also, when looking at A on google maps, I could only identify 21 spots. However, the mockup generates data for 22, so I added 22 spots in the layout. This needs to be investigated further in the future, but it is not something major

👍 1