Go to project: Let’s go swimming
I really love swimming! There, I said it. Since moving to my current city 5 years ago I have been swimming more than ever. But! Somehow I always seem to get there right when they are closed or – especially now in the summer time – go to the pool and find out that they are closed for several weeks!
The city’s website where you can find opening hours for all the pools, is really hard to navigate, and they have made it very difficult to find out the opening hours for their pools. My guess is that the number 1 reason people use the site is to find out which pool is open at what time that day/week, so I decided to make a website dedicated to just that!
I had hoped that the city had some sort of API with all the information, but they seem to be closed off to me at least. So I made a bunch of objects with all the opening hours. I only had the opening hours for the next 6 months so in December I have to update the site with the next 6 months.
The city has a pdf file with a calendar that you can download from the site to put on your fridge ie., and I have made a direct link to that calendar on my site too. Hope that they dont mind.
I actually just used the site myself yesterday, on a mobile phone, and it was waaay easier (even though I had to go through my homepage) to find the data. I love it 🙂
So I learned:
- We found a function that uses the Date function to find the current week for the user. We of course use the week number to display the current opening hours for the relevant week.
- I initially made a whole bunch of arrays with all the opening hours for each pool (sadly they don’t really match ever!), but the BF said that I should make an object for each pool and then add all the weeks in as the keys. Then I made a bunch of variables that holds an object with the opening hours.
- Hooking them up was way easier than I expected. We made an if statement to check whether the opening hours are one opening hour per day or two opening hours per day. This sounds confusing, but the CSS is a bit different to make room for the two opening hours, so that’s what the if statement is for.
100daysofprogramming 