Battle Replay: switch card overlap from right to left

Feature Request
#1

When viewing the battle replay, you can mouse over the cards to see what card got played, and that card pops up to the front when you hover over it.

An annoying thing I found is that even though the battle replay progresses from left to right, mousing over from left to right is troublesome because sometimes you can skip over a card as you hover your mouse through the battle.

Given cards A, B, and C close together in time:
Hovering over card A will partially cover card B, while card C covers the rest of card B, so if you mouse left to right, you go from card A to C, skipping B.

This can be fixed if cards to the left didn’t naturally cover cards to the right, but instead, the other way around.

#2

Interesting observation. I’ll try to find a way to make this better. Can you give an example of this in your log? My thinking is that this only happens in Triple Elixir.

I will say however that your solution is not necessarily the right one. However, we will devise better way of showing the card highlight without changing their z-position so that no cards will cover another card at any time.

#3

I should note that the card position recedes back into the background when not hovered. An alternative way of dealing with this is to never move them to the top and just add a highlighted card somewhere.

Are you on desktop or mobile? Such UI changes would work fine on desktop but on mobile it might make the interface overly complicated and noisy.

#4

I am on PC.
This generally happens often with cycle decks, where the cycle player needs to play several cards quickly.

This happens much more often in double and triple elixir time, which you have noted, but it’ll happen anytime 3 cards are played in succession.

For example, a 2.6 player:


Battles show here have a small timeline that is prone to this problem.

The problem is alleviated if you go to click on permalink to see a battle, since the timeline is expanded, but the problem can still show up, despite the expanded timeline.
https://royaleapi.com/replay?tag=08R8GPL8VUR9&team_tags=VQ8LLJV&opponent_tags=8RPUR099&team_crowns=2&opponent_crowns=1

#5

Thanks for your example. I see what you mean. I’ll try to remind myself to look into this.

#6

@David I have removed the z-index change for cards. Let me know if that solves your issue.

#7

actually, it makes it worse @SML

at least with the earlier version, you can see every card if you hover carefully.

now, if two cards are played quickly, you literally cannot see the first card.

#9

What is your preferred display then?

#10

The original is better than what is current.

The ideal scheme I would suggest is reversing all the z positions (cards played first go on top, cards played last go on bottom), and keeping the hover effect that brings the hovered card to the top.

This way, you can mouse hover from left to right, and not miss a single card.

#11

You can’t do that because the hover action is on the card (the entire card), not the position)

#12

Reversing the card z-position won’t work because you will will be clipping it off. trust me. this is not a solution.

#13

can you at least bring back the original hover effect?

right now, you cannot see a card that behind another.

#14

@SML how about adding arrows (or any kind of button) to allow users to move back and forward card by card?

1 Like