859259 - [Transitions. UX] Implement task switching transitions as specified.

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::System, defect)

Description

[Victoria Gerchinhoren [:vicky]]

When triggering and overlay, this should come from the bottom to top.

Please refer to specs: 
https://www.dropbox.com/sh/ekzrrz7um4uj6y0/NVzqB1D4hx/03%20Transitions
TransitionsVXX.pdf (latest version)

Please refer to CSS transition here: http://buildingfirefoxos.com/transitions/task-switching/

Lack of Transitions affect the experience. Required for TEF build.
Transitions a key feature to give the user a clue of the architecture of the OS and how to navigate it.

Comment 1

[Cristian Rodriguez (:crdlc)]

Attachment: Patch v1

Main goals:

* Implementation of the specification (after uploading this patch I gonna to upload a demo video)

* We just fetch background images when the cards are on the viewport. It means that when we enter in the task switcher, only two cards are loaded. So the start up time is less

* All cards out the screen define their display to 'none'. This idea has been taken from homescreen grid implementation so the memory is released instead of having all cards loaded on memory

Comment 2

[Cristian Rodriguez (:crdlc)]

Attachment: Demo

Comment 3

[Vivien Nicolas (:vingtetun) (:21) - (NOT reading bugmails, needinfo? please)]

Comment on attachment 736289 [details]
Patch v1

https://github.com/vingtetun/gaia/commit/7c8ebd3a39ecffb3cedc268f17c679c518a6df44

<3

Comment 4

[Cristian Rodriguez (:crdlc)]

Hi, I don't understand anything :) Did you take my branch, opened other pr from your repository with my code and merged?

The pr is this [1] and it is different to yours finally merged.

Could you explain me it? It is very weird.

Thanks

[1] https://github.com/mozilla-b2g/gaia/pull/9117

Comment 5

[Cristian Rodriguez (:crdlc)]

Hi again Vivien,

   I reverted your commit because while you were checking out my branch, I did some suggestions provided by UX so finally I reverted your merge and I merged my pr. I guess that you don't have problems with it. If I am wrong, please tell me.

Thanks 

https://github.com/mozilla-b2g/gaia/commit/fa79f2f1101dd904dbda67478ce4e0c336bcd73d

Comment 6

[Cristian Rodriguez (:crdlc)]

I understood the issue :) Vivien tried to help me resolving a conflict, but while he was resolving the conflict and merging, I was updating my branch with some suggestions from UX jejej. Thanks for you work Vivien!! Sorry because we didn't have synchronization

Comment 7

[Julien Wajsberg [:julienw]]

should this go to v1-train ?

Comment 8

[Cristian Rodriguez (:crdlc)]

Maria, do you have more info? AFAIK it is being discussed right now Julien

Comment 9

[James Lal [:lightsofapollo]]

It sounds like this blocks https://bugzilla.mozilla.org/show_bug.cgi?id=861846 on v1-train?

Comment 10

[Maria Angeles Oteo (:oteo)]

Agreed with Jsmes. Let's go for it, besides this improvement in task switcher transitions is great to have in v1-train (confirmed with Jaime Cheng and Josh Carpenter that we should uplift it)

Comment 11

[Wayne Chang [:wchang]]

Triage agrees to leo+ as the improvement is great and bug 861846 also depends on this.

Comment 12

[Julien Wajsberg [:julienw]]

note that we'll probably have follow-ups about that (I've seen some strange behaviour myself) so we need to have QA test this thoroughly once it's uplifted so that we address the strange behaviours as early as possible. I don't want that we fix this 10 days before the release :)

Comment 13

[John Ford [:jhford] CET/CEST Berlin Time]

I was not able to uplift this bug to v1-train.  If this bug has dependencies which are not marked in this bug, please comment on this bug.  If this bug depends on patches that aren't approved for v1-train, we need to re-evaluate the approval.  Otherwise, if this is just a merge conflict, you might be able to resolve it with:

  git checkout v1-train
  git cherry-pick -x -m1 fa79f2f1101dd904dbda67478ce4e0c336bcd73d
  <RESOLVE MERGE CONFLICTS>
  git commit

Comment 14

[Cristian Rodriguez (:crdlc)]

v1-train 

https://github.com/mozilla-b2g/gaia/commit/adad88f6c039fbb065925f44f6e29986b9f1d6f4

Comment 16

[ying.xu]

There is some thing wrong in the patch.

+  function onMoveEventForDeleting(evt, deltaY) {
+    var dy = deltaY | initialTouchPosition[1] -
+                              (evt.touches ? evt.touches[0].pageY : evt.pageY);
+    evt.target.style.MozTransform = 'scale(' + CC_SCALE +
+                                                  ') translateY(-' + dy + 'px)';  //here
+  }

when dy = -xxx, translateY would get an invalid value such as translateY(--xxx).

Here are the log we got:

E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--163px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--163px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--163px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--164px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--166px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--166px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration dropped." {file: "app://system.gaiamobile.org/index.html" line: 0 column: 29 source: "scale(0.8) translateY(--167px)"}]
E/GeckoConsole(  105): [JavaScript Warning: "Error in parsing value for '-moz-transform'.  Declaration

Comment 17

[Julien Wajsberg [:julienw]]

Dear ying.xu, I think you're right, but please file a new bug for this.

Put this bug in the "blocks" line for the new bug :)

Comment 18

[ying.xu]

(In reply to Julien Wajsberg [:julienw] from comment #17)
> Dear ying.xu, I think you're right, but please file a new bug for this.
> 
> Put this bug in the "blocks" line for the new bug :)
New bug:
https://bugzilla.mozilla.org/show_bug.cgi?id=927768

Comment 19

[Arnau March [:arnau] ( not working in Firefox OS anymore :( )]

Comment on attachment 736289 [details]
Patch v1

Clearing feedback as is an old patch