Fix issue #337, #339, #223

[elfman]

#339 rely on #337 be fixed, so I rise PR for them together

[birdofpreyru]

@elfman Had no chance to test it carefully, though, during a brief try I've noted the following problem:

• If I open desktop kind of menu on tablet (by tapping on, say, Learn) and then tap on the white part of the header (i.e. the same element where Compete, Learn and Community buttons are, just outside of them, and other elements, menu is not closed and there are some error in console.

[elfman]

Fixed, please test again.

[elfman]

issue #223 and #339 are both related with TopcoderHeader, so I put it in this PR too.
Please take it account when testing.

[birdofpreyru]

@elfman Wow :) These are big changes, and they seem to be working fine :)

There is just one more enhancement that would be handy: now if I use switch browser into touch device emulation mode, use touches to play with the menu, then switch to the normal mode and try to interact with the menu neither hovering nor clicks work anymore until I reload the app. I understand, that it is not an issue for production use, as user, in the same session, will not switch like this. Though, for dev/testing routine, it would be super-cool to fix it, so that such switches do not break anything. Also, I guess, it should be just a small modification somewhere, as there is no real need to disable all hover-related logic once you have opened a menu with touch, right?

[elfman]

@birdofpreyru MouseEnter & MouseLeave Event can also be triggered in mobile device. But their event logic is not fit to mobile device and can't work with touch event. For example, I tap on a menu button when menu opened, the menu should be closed as touch event do so, but the MouseEnter will also be trigger, and it will open the menu again, then the menu looks like nothing happened.
so I disable mouseenter and mouseleave when touch event triggered.
If you want to make it work when switching emulation mode, how about reset the isMobile state in onLayout when width changed?

[birdofpreyru]

@elfman No, I don't like listening the width change, as it probably will slow down window resizing (which is already not that fast). Can we just re-enable mouseenter and mouseleave once the menu is closed? I believe, it is already closed automatically if I switch between touch device and desktop in the way described above. And having them enabled when the menu is closed is not a problem for us?

[elfman]

That's a good idea, I'll do it

[elfman]

@birdofpreyru Updated.