Home of the Blizzard - another site from the Australian Antarctic Division

[AAD Web Team]

Hi all,

I thought that you'd be interested to know we've now launched our third ProcessWire site, called Home of the Blizzard - The Australasian Antarctic Expedition. It's about Douglas Mawson's famous expedition of 1911-1914. As a part of the move to ProcessWire from our previous CMS it has undergone a redesign as well. It has been done completely in-house.

https://mawsonshuts.antarctica.gov.au/

It uses Fancybox for the image galleries and modal menu, Plyr for video, and Modernizr (primarily to check for CSS Grid compatibility).

It was actually the first PW site we started working on, but then the SCAR COMNAP and Antarctic Jobs sites became priorities so it got pushed back. It's great to have it live at last.

The next PW site we launch should be our main site (http://www.antarctica.gov.au)! That's still a work in progress. ?

[bernhard]

Thx for sharing and congratulations for the great site!

Interesting approach for the menu! I tested it on mobile and found this little hickup (and spacings could also be removed):

Also I'd suggest to list all children at the bottom of those pages: https://mawsonshuts.antarctica.gov.au/preparation/australia-and-antarctica/ (not only next and previous). For me it was not clear that the two links at the bottom belong to one parent (as seen very well in the menu). You can have a look how I did it here: https://www.maletschek.at/segelmacherei/persenning/cockpitpersenning/

[AAD Web Team]

Thanks for the feedback @bernhard. May I ask what type of phone and which browser that is? It was tested extensively across a range of devices and browsers using BrowserStack, but there are so many possible combinations these days it's easy to miss some.

Your feedback on the navigation is also appreciated. The content presented across the site is very linear in nature as it is based on Douglas Mawson's book, hence the previous and next links. We'll take another look.

[bernhard]

It's a WIKO phone, Android + Chrome https://www.amazon.de/gp/product/B01EM2SUL2/

Another thing I just found: https://mawsonshuts.antarctica.gov.au/preparation/australia-and-antarctica/

Quote

This page was last updated on 13 September 2011.

The edited date is in the footer, so for me this seems like the whole website was last updated in 2011... Maybe that could be moved to the content block of the site.

[AAD Web Team]

Thanks again for your feedback, and for the phone details @bernhard. Browserstack doesn't include any WIKO phones, but I was able to recreate the issue on a Nexus 5. I'll see what I can do to fix it.

[AAD Web Team]

Hi @bernhard,

I think I've now fixed the issue with the menu that you were experiencing with your phone. Would you mind taking another look?

Thanks!

[bernhard]

This issue is fixed now, but when I try to scroll down the menu further than shown on the screenshot the modal closes:

[AAD Web Team]

17 hours ago, bernhard said:

This issue is fixed now, but when I try to scroll down the menu further than shown on the screenshot the modal closes:

This is an odd one. It seems to only happen in the Android version of Chrome. If you keep your finger on the menu while scrolling it works, but as soon as you touch the blue background and scroll, the modal closes. In my testing, it doesn't happen in Firefox on the same type of phone, nor does it happen in Chrome or Safari on iOS.

I'm not sure if this is a bug with Fancybox or a bug with Chrome for Android - either way I'm not sure how to go about fixing it or even where to report the bug. I'll keep Googling to see if I can find anyone else with the same issue.

[wbmnfktr]

Just an idea... but there might be an event() in your .js that watches if someone clicks or touches outside the opened navigation container and therefore closes it. It's not that uncommon to take care of opened elements and to close them if there is an click/touch event somewhere else.

As you use fancybox I looked for this feature and found this:

  // Clicked on the background (backdrop) element;
  // if you have not changed the layout, then most likely you need to use `clickSlide` option
  clickOutside: "close",

There are more similar options, maybe someone can look into it and test it.

[AAD Web Team]

Thanks @wbmnfktr, I'll certainly have to have a play around with those options (I've left them all at their defaults).

However, I would've thought the resulting behaviour should be the same across browsers. In this case, it's only a problem with the Android version of Chrome. In all other browsers that I've tested it behaves as it should, where the menu only closes if you tap the close button or outside the blue menu area.

[AAD Web Team]

Hi again @bernhard and @wbmnfktr,

It should now be fixed. Well, I think there's still some kind of bug in the way Chrome for Android behaves, but I was able to completely turn off the 'touch' option for the modal menu instance of Fancybox. Swiping is not needed for the menu so that has fixed the issue, and it doesn't seem to have had any other adverse effects from what I can see so far. ?