From 6aba10bea426d62a9a87e31fab39f125ea584536 Mon Sep 17 00:00:00 2001
From: Tobias Reich <tobias.reich.ich@gmail.com>
Date: Sun, 29 Mar 2015 19:22:39 +0200
Subject: [PATCH] Reduced attr changes to improve performance

---
 dist/main.css               | Bin 34587 -> 35615 bytes
 dist/main.js                | Bin 172493 -> 172328 bytes
 src/scripts/album.js        |   7 ++-----
 src/scripts/albums.js       |   7 +++----
 src/scripts/search.js       |   5 ++---
 src/styles/_animations.scss |  16 +---------------
 src/styles/_content.scss    |  31 +++++++++++++++++++++++++++++++
 src/styles/_sidebar.scss    |   2 +-
 8 files changed, 40 insertions(+), 28 deletions(-)

diff --git a/dist/main.css b/dist/main.css
index 954d3cc267295960539d77a0baec6d761c69d6f9..76cb355dcda5be74afa21cac9691e517ea7c37a4 100644
GIT binary patch
delta 812
zcmbQ;$25N$(}vUBlht_yC%@z7n#`@kHTglL=;U)ey!Fb-`FSO&c_n&KIx0Uu*E3H+
zFEJ;nG*<_gY)WQXW=d)iPWgh2{E~dEvi_wd$c9^^+YOe-XFON|*!;<>cvL2z&J&m%
z#UoX(S&Pf9H1!G0rIT0lC~vmnog~X>J=uU)X7YhNX^^v+G;1g8^GHv=ugyAngBHu=
zk6Kcw3K%sf8|aB_?$D`VHz6$wz(G(wd3}@k<n@uVlOHxoGwT@@Ptp-bwLl4Xz(Cy&
zF=K<4%;X16GFZ)Uz-|UwRAP-uBv;z&$RoLO@}o%M$yU5VsICPDM?a4=V>L*js-AH%
z)<{K8A~45;gBIceV_+bNG8-48M8xKA#=2^gFK}^9K9wg3j2XGfr?`bSn?@aBo$Mzf
OG5Jos>}HdM=V|~<W+(Fi

delta 272
zcmbO~jcIlt(}vUBll9^R8FeO~=9ZqU-7YYRS8B2VH{0Yh+yayD@z_lM5X(O~r-*0r
zIy33XXLwX5-!bEr*GtaND@n~OiOSE<^~}>j=K7bGK#Y2=Ej;-%x6tN2ypv=nFVwbI
zs6|$WsjGUjV!PBNUTH>aptZJ>%;b4dG)z|H6q&4F#5TDh)=<c(7)1_f=j8Jy5|b57
zSSCL+m7e^{lndx&E+(Vm$%Y0Zo85IP*f(D^S617s8+VNr=pi7E;hB6-gln>NiY(Bx
LtedS;o~i)=mmXwH

diff --git a/dist/main.js b/dist/main.js
index e9c43a4c489b113209d0f4fce2f7079cf440b918..fe56cbbc179b2b2140262b52f45f928ef5ea5c0b 100644
GIT binary patch
delta 182
zcmX?mm}|u$u7)j)#`V+nyO<<Im2{Mn^Ycnl^Gc%f^K<=6OO!Nq@}@s*U=-cHx}Nbl
z<8=EjCXVe38X2`^z)Y+fQXv`)=P?#TG)!MLpD`PvRe1s9>X7Z{zc2<dGIDKK{KlB<
j4VK_TwR!qcN2V<h9qmp`Ck&<s6f>CsHMA5ndFlZGQ$;`_

delta 313
zcmZ2+i0kZOu7)j)#`T68IhDy7si}I2d6~J1C8-)pdWktnrMWr^dIcHzCHYD^O3C?o
zC8>EOQTh3~{-q^K)BiazNr@`xrDT?6rlb}D6{IDmq=IBLx5w5q{%7PvHDP;7BcryA
z0;(VmW5ux=tCKoCp`KA}`=PmvMT~3^gQnZeXUs;oY5jc0)gg>r+oQfP1~G15`;{@-
pTal2xn$xd4F{w@0ab#MDZrmeBrV|E?T+>$-F_~<?U&Q382LPI+Zc6|F

diff --git a/src/scripts/album.js b/src/scripts/album.js
index fb5ff13..4f0ce42 100644
--- a/src/scripts/album.js
+++ b/src/scripts/album.js
@@ -34,10 +34,7 @@ album.load = function(albumID, refresh) {
 
 	password.get(albumID, function() {
 
-		if (!refresh) {
-			lychee.animate('.album, .photo', 'contentZoomOut');
-			lychee.animate('#content .divider', 'fadeOut');
-		}
+		if (!refresh) lychee.animate('#content', 'contentZoomOut');
 
 		startTime = new Date().getTime();
 
@@ -82,7 +79,7 @@ album.load = function(albumID, refresh) {
 				view.album.init();
 
 				if (!refresh) {
-					lychee.animate('.album, .photo', 'contentZoomIn');
+					lychee.animate('#content', 'contentZoomIn');
 					header.setMode('album');
 				}
 
diff --git a/src/scripts/albums.js b/src/scripts/albums.js
index d38140c..cf73c72 100644
--- a/src/scripts/albums.js
+++ b/src/scripts/albums.js
@@ -15,8 +15,7 @@ albums.load = function() {
 		durationTime,
 		waitTime;
 
-	lychee.animate('.album, .photo', 'contentZoomOut');
-	lychee.animate('#content .divider', 'fadeOut');
+	lychee.animate('#content', 'contentZoomOut');
 
 	startTime = new Date().getTime();
 
@@ -41,7 +40,7 @@ albums.load = function() {
 			setTimeout(function() {
 				header.setMode('albums');
 				view.albums.init();
-				lychee.animate('.album', 'contentZoomIn');
+				lychee.animate('#content', 'contentZoomIn');
 			}, waitTime);
 		});
 
@@ -50,7 +49,7 @@ albums.load = function() {
 		setTimeout(function() {
 			header.setMode('albums');
 			view.albums.init();
-			lychee.animate('.album, .photo', 'contentZoomIn');
+			lychee.animate('#content', 'contentZoomIn');
 		}, 300);
 
 	}
diff --git a/src/scripts/search.js b/src/scripts/search.js
index 10c181c..cb344d2 100755
--- a/src/scripts/search.js
+++ b/src/scripts/search.js
@@ -53,8 +53,7 @@ search.find = function(term) {
 
 					$('.no_content').remove();
 
-					lychee.animate('.album, .photo', 'contentZoomOut');
-					lychee.animate('.divider', 'fadeOut');
+					lychee.animate('#content', 'contentZoomOut');
 
 					search.hash = data.hash;
 
@@ -65,7 +64,7 @@ search.find = function(term) {
 							$('body').append(build.no_content('magnifying-glass'));
 						} else {
 							lychee.content.html(html);
-							lychee.animate('.album, .photo', 'contentZoomIn');
+							lychee.animate('#content', 'contentZoomIn');
 							$('img[data-type!="svg"]').retina();
 						}
 
diff --git a/src/styles/_animations.scss b/src/styles/_animations.scss
index efbb271..31e0031 100755
--- a/src/styles/_animations.scss
+++ b/src/styles/_animations.scss
@@ -7,27 +7,13 @@
 	animation-name: fadeIn;
 	animation-duration: .3s;
 	animation-fill-mode: forwards;
-	animation-timing-function: $timingBounce;
+	animation-timing-function: $timing;
 }
 
 .fadeOut {
 	animation-name: fadeOut;
 	animation-duration: .3s;
 	animation-fill-mode: forwards;
-	animation-timing-function: $timingBounce;
-}
-
-.contentZoomIn {
-	animation-name: zoomIn;
-	animation-duration: .2s;
-	animation-fill-mode: forwards;
-	animation-timing-function: $timing;
-}
-
-.contentZoomOut {
-	animation-name: zoomOut;
-	animation-duration: .2s;
-	animation-fill-mode: forwards;
 	animation-timing-function: $timing;
 }
 
diff --git a/src/styles/_content.scss b/src/styles/_content.scss
index 51ff992..6d97316 100644
--- a/src/styles/_content.scss
+++ b/src/styles/_content.scss
@@ -20,6 +20,37 @@
 
 	&.sidebar { width: calc(100% - 300px); }
 
+	/* Animations ------------------------------------------------------------------- */
+	&.contentZoomIn .album,
+	&.contentZoomIn .photo {
+		animation-name: zoomIn;
+		animation-duration: .2s;
+		animation-fill-mode: forwards;
+		animation-timing-function: $timing;
+	}
+
+	&.contentZoomIn .divider {
+		animation-name: fadeIn;
+		animation-duration: .2s;
+		animation-fill-mode: forwards;
+		animation-timing-function: $timing;
+	}
+
+	&.contentZoomOut .album,
+	&.contentZoomOut .photo {
+		animation-name: zoomOut;
+		animation-duration: .2s;
+		animation-fill-mode: forwards;
+		animation-timing-function: $timing;
+	}
+
+	&.contentZoomOut .divider {
+		animation-name: fadeOut;
+		animation-duration: .3s;
+		animation-fill-mode: forwards;
+		animation-timing-function: $timing;
+	}
+
 	/* Albums and Photos ------------------------------------------------*/
 	.album,
 	.photo {
diff --git a/src/styles/_sidebar.scss b/src/styles/_sidebar.scss
index 966597a..5c2e24f 100644
--- a/src/styles/_sidebar.scss
+++ b/src/styles/_sidebar.scss
@@ -12,7 +12,7 @@
 	background-color: rgba(25, 25, 25, .98);
 	border-left: 1px solid black(.2);
 	transform: translateX(0);
-	transition: transform .3s $timingBounce;
+	transition: transform .3s $timing;
 
 	&.active { transform: translateX(-320px); }