Undum loses place in narration when pane-switching in mobile

[jjsonick]

On a mobile screen, the stats pane is hidden away unless you summon it, and when you switch to it, it takes up the entire screen -- which would be fine, except that exiting the stats pane and switching back to the story, you are returned to the top of the narration pane instead of wherever you where in the narration when you decided to look at your stats. It's jarring and can involve a fair amount of scrolling to get back to where you where in the story - pretty disruptive compared the rest of the smooth Undum experience.

The suggested change is to use javascript to save the scrolling point on each screen when it's switched to/from.

[sequitur]

I have a fix for this sitting in a branch. That branch descends from the commonjs fork that Raconteur is currently using, and it implements a new (Better, I think) way of handling scrolling in general, but backporting the code to Undum's trunk shouldn't be a big issue.

Basically, the way that branch currently works is:

• Whenever content is written to the story pane, it gets the .new class applied to it. That class is removed when newer content is written; so you can take all .new elements as the collection of content added by the last output transaction. (This has the side-effect that those elements can be styled with CSS, for example to add a fade-in effect to all new content).
• Scrolling (In the non-mobile interface) happens all at once by figuring out where exactly the viewport should be placed, taking into account all of the new content regardless of the order in which it was added. If the new content fits in the viewport, it gets placed near the bottom; if it's too big, the viewport scrolls so that the top of the new content is near the top of the viewport.
• When the user switches to display the content wrapper in the mobile interface, we set the scroll so that the top of the new content is placed roughly 500 pixels down the bottom of the viewport. $::offset() has unreliable behaviour in mobile devices from what I can tell, so it's at best a guesstimate, but it should be an improvement from returning to the top of the page.

If you can test this branch for me, I'd appreciate it; when I'm confident it doesn't break anything I'll merge it into the main commonjs branch.

[jjsonick]

Looks great! On mobile, only a tiny amount of scrolling needed when returning to the story pane now, far better than returning to the top of the page.

Didn't seem to see any bugs with this new behavior, but noticed one bug in the tutorial code itself. In the 'Different Kinds of Links' situation, 'leave this situation' when clicked doesn't take you anywhere (just becomes inactive), making that topic a dead end. This is true for the tutorial on the official Undum site, too, so it's not new to this branch. Should I open a separate issue for that?

In that topic, before clicking 'leave this situation', the new scroll code works as expected when going to Character pane and back to Story. After clicking that 'leave this situation', going to the Character pane and back to Story shows the old behavior of going to the top of the page, which I guess is a side effect of something new being expected, but not created.

[sequitur]

Have a look through Undum's own issues, yeah. This is a bug in Undum that has been around for a while. I don't know how to reproduce it.

If there is nothing new (Shouldn't be the case unless something has broken - which it has, clicking "leave the situation" there throws an error) it will take you to the top.