From f28c6be7ed6074fd7a1153033095926c5f69b552 Mon Sep 17 00:00:00 2001
From: Juanfran <juanfran.alcantara@kaleidos.net>
Date: Mon, 24 Oct 2016 12:09:46 +0200
Subject: [PATCH] increase performance open filters

---
 .../components/filter/filter.directive.coffee     |  8 ++++++++
 app/modules/components/filter/filter.scss         | 15 +++------------
 app/partials/kanban/kanban.jade                   |  2 +-
 app/partials/taskboard/taskboard.jade             |  2 +-
 app/styles/layout/issues.scss                     |  3 +++
 5 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/app/modules/components/filter/filter.directive.coffee b/app/modules/components/filter/filter.directive.coffee
index c15eb137..c781971f 100644
--- a/app/modules/components/filter/filter.directive.coffee
+++ b/app/modules/components/filter/filter.directive.coffee
@@ -26,6 +26,14 @@ FilterDirective = () ->
             else if scope.vm.filtersForm.$dirty
                 unwatch()
 
+        attrs.$observe "open", (open) ->
+            open = scope.$eval(open)
+
+            if open
+                el.addClass('open')
+            else
+                el.removeClass('open')
+
     return {
         scope: {
             onChangeQ: "&",
diff --git a/app/modules/components/filter/filter.scss b/app/modules/components/filter/filter.scss
index 55cfff4c..0f3abaf3 100644
--- a/app/modules/components/filter/filter.scss
+++ b/app/modules/components/filter/filter.scss
@@ -7,6 +7,8 @@ tg-filter {
     padding: 1rem 0;
     position: absolute;
     top: 0;
+    transform: translateX(-260px);
+    transition-duration: .5s;
     width: 260px;
     z-index: 1;
     .filters-applied {
@@ -28,18 +30,7 @@ tg-filter {
         right: .7rem;
         top: .7rem;
     }
-    &.ng-hide-add {
-        transform: translateX(0);
-        transition-duration: .5s;
-    }
-    &.ng-hide-add-active {
-        transform: translateX(-260px);
-    }
-    &.ng-hide-remove {
-        transform: translateX(-260px);
-        transition-duration: .5s;
-    }
-    &.ng-hide-remove-active {
+    &.open {
         transform: translateX(0);
     }
 }
diff --git a/app/partials/kanban/kanban.jade b/app/partials/kanban/kanban.jade
index 2e65ebe2..9cc9cb0d 100644
--- a/app/partials/kanban/kanban.jade
+++ b/app/partials/kanban/kanban.jade
@@ -6,7 +6,7 @@ div.wrapper(tg-kanban, ng-controller="KanbanController as ctrl"
 
     section.main.kanban
         tg-filter(
-          ng-show="ctrl.openFilter"
+          open="{{ctrl.openFilter}}"
           q="ctrl.filterQ"
           filters="ctrl.filters"
           custom-filters="ctrl.customFilters"
diff --git a/app/partials/taskboard/taskboard.jade b/app/partials/taskboard/taskboard.jade
index d9e85720..1a0d0e62 100644
--- a/app/partials/taskboard/taskboard.jade
+++ b/app/partials/taskboard/taskboard.jade
@@ -5,7 +5,7 @@ div.wrapper(tg-taskboard, ng-controller="TaskboardController as ctrl",
     tg-project-menu
     section.main.taskboard
         tg-filter(
-          ng-show="ctrl.openFilter"
+          open="{{ctrl.openFilter}}"
           q="ctrl.filterQ"
           filters="ctrl.filters"
           custom-filters="ctrl.customFilters"
diff --git a/app/styles/layout/issues.scss b/app/styles/layout/issues.scss
index 52e9deff..4c9e48fb 100644
--- a/app/styles/layout/issues.scss
+++ b/app/styles/layout/issues.scss
@@ -3,4 +3,7 @@
         position: relative;
         width: 260px;
     }
+    tg-filter {
+        transform: translateX(0);
+    }
 }