Login

russian armor

Few minor bugs in livestreams page

8 Dec 2012, 22:21 PM
#1
avatar of JAnx
Coder Red Badge

Posts: 487 | Subs: 1

1) For some odd reason going straight to the http://www.coh2.org/livestreams/list will not show javascript graphs. However, if i click on the list view tab, they will become visible.

It's probably because of

Code
$('.sparkline span').sparkline();

will not be runned

Code
$(document).ready(function() {});

event.

http://www.coh2.org/livestreams/mixed works though

Some kind of racing condition?

2) Fade effect on switching between live stream views (Mixed and Grid) makes weird flickering in the tab content. It is probably because previous contents fadeOut is ongoing while new content with fadeIn runs into it.

Both on bugs on Google Chrome 23.0.1271.95 m
10 Dec 2012, 16:08 PM
#2
avatar of hicksi
Admin Black Badge

Posts: 983 | Subs: 3

Yep noticed it too, they just work properly in Firefox.

I had quick fix with double init the sparkline functions, but forget to look for the real reason. If you go in http://www.coh2.org/livestreams/list click through the tab menu and switch back to the list view they are working. Not sure yet why they aren't initialised on first behave in others browsers than Firefox.

this works
Code
$('.sparkline span').sparkline();
$('.sparkline span').sparkline();


but not this
Code
$('.sparkline span').sparkline();



Fade effects are at the moments just the "normal" ones, I didn't spend any time on making it look better. Feel free to make them look good and post code here :)
11 Dec 2012, 19:29 PM
#3
avatar of JAnx
Coder Red Badge

Posts: 487 | Subs: 1

I think i found the cause of the issue:
Code
<span values="461,332,465,639,168,465,0,573"><span>

Looks like we are opening 2 spans :)

Should be of course:
Code
<span values="461,332,465,639,168,465,0,573"></span>


And the reason why it is probably working in Firefox is that seems like Firefox is trying to fix unclosed html tags by closing them automagically.

True, Chrome tries to also fix this automagically, only thing is that it is closing both open tags instead of trying to match.

Go figure which automagic is better :)

Fade effect on switching between live stream views (Mixed and Grid) makes weird flickering in the tab content. It is probably because previous contents fadeOut is ongoing while new content with fadeIn runs into it.

That one is easy, i would suggest using hide() instead of fadeOut(). I believe it looks as good ;)
12 Dec 2012, 15:00 PM
#4
avatar of hicksi
Admin Black Badge

Posts: 983 | Subs: 3

oh lol yea, thanks. saves me time for looking after it :thumbsup:. that would explain why firefox behaves not like that, because firefox is clever and good in things like autocorrecting wrong/missing close elements.

i think i used hide() on test purpose earlier, but changed to fadeOut because i liked it more. but i will check that out later.

12 Dec 2012, 16:30 PM
#5
avatar of JAnx
Coder Red Badge

Posts: 487 | Subs: 1

jump backJump back to quoted post12 Dec 2012, 15:00 PMhicksi
i think i used hide() on test purpose earlier, but changed to fadeOut because i liked it more. but i will check that out later.

Sure, i guess that's one of those things that need to be tested out. It's just, i stopped using fadeOut() in similar situations because i figured that user needs to see content, not my fancy fade effect :)

One method would be to call a callback function on the fadeOut() complete. Callback function could be anonymous function which will just fadeIn() releavant content.

Code
$('.somethingSomething').fadeOut(function() {
$('.newTabContent').fadeIn();
});
13 Dec 2012, 16:57 PM
#6
avatar of JAnx
Coder Red Badge

Posts: 487 | Subs: 1

For the tab issue, i made a fast, in my opinion, a bit hack-ish solution (the hack part is that 200ms delay - which is the time fadeOut('fast') lasts.

Replace this:
Code
$('#livestream_viewContainer div.toggleContent').fadeOut();
$('#livestream_viewContainer div.toggleContent:eq(' + index + ')').fadeIn();

with this:
Code
$('#livestream_viewContainer div.toggleContent').stop(true, true).fadeOut('fast');
$('#livestream_viewContainer div.toggleContent:eq(' + index + ')').stop().delay(200).fadeIn('fast');


This tab changing could be simplified imo, but i am not gonna judge here :)
13 Dec 2012, 18:58 PM
#7
avatar of hicksi
Admin Black Badge

Posts: 983 | Subs: 3

Feel free to judge, as far as I'm not doing this on professional base and even if I would do, constructive criticism is the best you can get.

replaced :)
1 user is browsing this thread: 1 guest

Ladders Top 10

  • #
    Steam Alias
    W
    L
    %
    Streak
Data provided by Relic Relic Entertainment

Replay highlight

VS
  • U.S. Forces flag cblanco ★
  • The British Forces flag 보드카 중대
  • Oberkommando West flag VonManteuffel
  • Ostheer flag Heartless Jäger
uploaded by XXxxHeartlessxxXX

Board Info

270 users are online: 270 guests
2 posts in the last 24h
9 posts in the last week
33 posts in the last month
Registered members: 50147
Welcome our newest member, hayaldv27
Most online: 2043 users on 29 Oct 2023, 01:04 AM