Arantor

  • As powerful as possible, as complex as necessary.
  • Posts: 14,278
Quick popup actions
« on March 22nd, 2013, 01:38 AM »
Been thinking about this a bit lately. We have a very lovely popup that we can put things in but right now all it's used for is modal popups of things and a few subsidiary information things.

It occurs to me we could use it for more, scenario depending - for example, the login button needn't necessarily take us to a full new page, we could show the login form with the popup. Or even sending PMs directly from the display view.

At least, that's the theory. Before I tackle this, I want to get a feel for whether it's worth the effort - since there's quite a bit to unravel to make this work.

Amongst other things, the event handling on the popup would need fixing (@Nao, this might be a job for you rather than me if we go down this road - right now, forms injected into #helf aren't actually accessible amongst other things), and some of the layout would need revisiting - for example the login page would need to not output its <we:cat> header if called AJAXively but it should output it if not called AJAXively, and stuff like that. Don't even get me started how messed up the send PM thing is!

We'd also have to make sure that these pages didn't themselves have a reqWin call, of course (popup of a popup == badness in a can)

I've attached a mash-up of what it might look like.[1]
 1. The missing header issue is not just on Opera, it's all browsers. Something about the way we:cat is styled is broken but I don't know what it is off hand. But it wouldn't look right even if it weren't transparent.

📎 quick_login.png - 174.6 kB, 1028x1135, viewed 700 times.

When we unite against a common enemy that attacks our ethos, it nurtures group solidarity. Trolls are sensational, yes, but we keep everyone honest. | Game Memorial

Nao

  • Dadman with a boy
  • Posts: 16,082
Re: Quick popup actions
« Reply #1, on March 23rd, 2013, 11:23 PM »
I'm all for going Ajax everywhere.
It's much easier to do than you're suggesting. Heck, we can even do it without any template changes! We just need to ensure the popup contents is restrained to a single <div id>. (Or <whatever id>.)
As a reminder for those who didn't realize: the search box's popup is called through Ajax.

Dunno about logins though... Will browsers correctly remember the passwords once entered? I think so, but it warrants caution.

Also, I think that notifications should be ajaxified, too. I'm hoping to be able to work on them tomorrow, or at worst, monday. Doing my best to save data... Hmm, probably should call the ajax link when hovering the notifications icon/text, rather than on click -- this will save like half a second, and might increase the chances of you seeing the popup upon click.

Arantor

  • As powerful as possible, as complex as necessary.
  • Posts: 14,278
Re: Quick popup actions
« Reply #2, on March 23rd, 2013, 11:31 PM »
Quote
It's much easier to do than you're suggesting. Heck, we can even do it without any template changes! We just need to ensure the popup contents is restrained to a single <div id>. (Or <whatever id>.)
As a reminder for those who didn't realize: the search box's popup is called through Ajax.
I like doing things modally like this - but the handling around the model popup constrains what can be done.
Quote
Dunno about logins though... Will browsers correctly remember the passwords once entered? I think so, but it warrants caution.
If the form's pulled in AJAXively, it is essentially no different to users using the quick login form in the sidebar.
Quote
Also, I think that notifications should be ajaxified, too. I'm hoping to be able to work on them tomorrow, or at worst, monday. Doing my best to save data... Hmm, probably should call the ajax link when hovering the notifications icon/text, rather than on click -- this will save like half a second, and might increase the chances of you seeing the popup upon click.
XenForo does it on hover, adding a loading icon to the element itself on hover to indicate that it's reloading. Not sure how it handles touch.