From 6fe08cd4b3a0db0695db13a1b95cab7834de3ba6 Mon Sep 17 00:00:00 2001
From: Maxime Quandalle <maxime@quandalle.com>
Date: Fri, 22 May 2015 19:40:12 +0200
Subject: Animate popup screens transition

---
 client/components/main/popup.tpl.jade | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

(limited to 'client/components/main/popup.tpl.jade')

diff --git a/client/components/main/popup.tpl.jade b/client/components/main/popup.tpl.jade
index ba24db0a..9e99030d 100644
--- a/client/components/main/popup.tpl.jade
+++ b/client/components/main/popup.tpl.jade
@@ -3,11 +3,19 @@
   class=currentBoard.colorClass
   style="display:block; left:{{offset.left}}px; top:{{offset.top}}px;")
   .header.clearfix
-    if hasPopupParent
-      a.back-btn.js-back-view
-        i.fa.fa-chevron-left
+    a.back-btn.js-back-view(class="{{#unless hasPopupParent}}is-hidden{{/unless}}")
+      i.fa.fa-chevron-left
     span.header-title= title
-    a.close-btn.js-close-popover
+    a.close-btn.js-close-pop-over
       i.fa.fa-times
-  .content.clearfix
-    +Template.dynamic(template=popupName data=dataContext)
+  .content-wrapper
+    //-
+      We display the all stack of popup content next to each other and move
+      the "window" by translating .content-container inside .content-wrapper.
+    .content-container(style="transform:translateX({{containerTranslation}}px)")
+      each stack
+        //-
+          XXX We need a better way to express the "is the last element" condition.
+          Hopefully the @last helper will come soon (or at least @index)
+        .content(class="{{#unless $eq popupName ../popupName}}is-hidden{{/unless}}")
+          +Template.dynamic(template=popupName data=dataContext)
-- 
cgit v1.2.3-1-g7c22