954429 - Replace Bubble fade-in animation code (javascript) with a CSS animation

Status: RESOLVED FIXED

(Instantbird Graveyard :: Conversation, enhancement)

Description

[Benedikt Pfeifer]

*** Original post on bio 995 at 2011-08-26 13:45:00 UTC ***

*** Due to BzAPI limitations, the initial description is in comment 1 ***

Comment 1

[Benedikt Pfeifer]

Attachment: Patch v1

*** Original post on bio 995 as attmnt 792 at 2011-08-26 13:45:00 UTC ***

This patch replaces the javascript that animates the fade-in of new bubbles with pure CSS code.
I set the animation length to 0.3 seconds, that's what I took from the other code (opacity steps by 0.1 every 30ms).

Comment 2

[Florian Quèze [:florian]]

Comment on attachment 8352534 [details] [diff] [review]
Patch v1

*** Original change on bio 995 attmnt 792 at 2011-08-27 00:43:25 UTC ***

>diff -r 343293bfba9e instantbird/themes/messages/bubbles/main.css

>@@ -56,6 +57,22 @@
>   box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 3px;
> }
> 
>+div.bubble:not(.context) {

System messages should also be excluded from this animation.

>+  -moz-animation-duration: 0.3s;

After some testing, I think I prefer using the 0.5s value here. While the old removed code seems to do the animation in 300ms, I suspect there was some overhead that made it take a little more time.

>+@-moz-keyframes fadein{

Nit: Space before "fadein" and "{".

>+  from {
>+    opacity: 0.0;

Nit: I prefer just "0" here.

Comment 3

[Florian Quèze [:florian]]

*** Original post on bio 995 at 2011-08-27 00:44:49 UTC ***

Pushed this as https://hg.instantbird.org/instantbird/rev/47d172944654 with the changes described in comment 1. Thanks!