« BBC whitespace trimming
[Bug] Select menu is slightly broken on touch screens
Minor display glitches in Wireless »

Nao

  • Dadman with a boy
  • Posts: 16,082
[Bug] Re: Select menu is slightly broken on touch screens
« Reply #15, on May 1st, 2012, 10:26 PM »
So.. I was thinking about this topic after noticing that Facebook's iOS app had a perfectly usable scrollbar in their notification area (so many things to do, so few things I actually remember to do later...), and decided to implement Dragooon's code for a try.

It's live here, and it's only 28 extra bytes to sbox.js (gzipped), so I'll certainly be keeping it... It seems to work just like on Facebook, I didn't think it would feel so natural to simply scroll by tapping and moving around in that place, but it does have one drawback... Try it on the Quick Access box. When you're moving the finger, it will 'naturally' highlight a few entries, even though I'm not actually selecting them... And if I release my finger, it'll immediately pick an entry and then proceed to run it. Which isn't good... It's probably good on other sboxes, but not this one, and I need a more 'generic' solution.
I'm sure it can be solved with another event or something that is touch-centric. Any ideas?

Dragooon

  • I can code! Really!
  • polygon.com has to be one of the best sites I've seen recently.
  • Posts: 1,841
The way it's meant to be

Nao

  • Dadman with a boy
  • Posts: 16,082
[Bug] Re: Select menu is slightly broken on touch screens
« Reply #17, on May 6th, 2012, 06:13 PM »
This would force me to add a touchend event, wouldn't it..?
And which one would I have to disable, do you reckon?
$items.not('.disabled').mousedown(clickSBItem), I suppose?

Wondering if it wouldn't be simpler to just turn it into a mouseup event... Maybe touch devices are less picky when it comes to mouseup... I don't know. I'd have to check on quirksmode.org, I think it lists all events triggered on touch for all touch devices...

Dragooon

  • I can code! Really!
  • polygon.com has to be one of the best sites I've seen recently.
  • Posts: 1,841
[Bug] Re: Select menu is slightly broken on touch screens
« Reply #18, on May 7th, 2012, 05:22 PM »
Yeah, something like this(Not tested)

Code: [Select]
$items = $dd.children().not('.optgroup');
$dd[0].addEventListener('touchend', function(e)
{
$items.mousedown(clickSBItem);
});
$dd[0].addEventListener('touchmove', function(e)
{
scrollTo(startPos - e.touches[0].pageY + iTouch);
e.preventDefault();
});
$dd[0].addEventListener('touchstart', function(e)
{
iTouch = e.touches[0].pageY;
startPos = parseInt($thumb.css('top') || 0);
$items.unbind('mousedown');
});

Not entirely sure about the mouseup thing, I think it'l still fire but I haven't experimented with that.
« BBC whitespace trimming
Minor display glitches in Wireless »