From 52018b40e8089294f0e28aa2130344edfa6c35f6 Mon Sep 17 00:00:00 2001
From: RainLoop Team <support@rainloop.net>
Date: Tue, 18 Oct 2016 22:49:54 +0300
Subject: [PATCH] Add login background animation

---
 dev/Screen/User/Login.js                      | 34 +++++++++++++++++++
 dev/Styles/Layout.less                        |  6 ++--
 .../0.0.0/app/templates/Themes/template.less  |  2 +-
 3 files changed, 38 insertions(+), 4 deletions(-)

diff --git a/dev/Screen/User/Login.js b/dev/Screen/User/Login.js
index 3091865f1..58f25a6ee 100644
--- a/dev/Screen/User/Login.js
+++ b/dev/Screen/User/Login.js
@@ -1,4 +1,9 @@
 
+import $ from '$';
+import _ from '_';
+
+import {$win} from 'Common/Globals';
+
 import {AbstractScreen} from 'Knoin/AbstractScreen';
 
 import {LoginUserView} from 'View/User/Login';
@@ -13,6 +18,35 @@ class LoginUserScreen extends AbstractScreen
 
 	onShow() {
 		getApp().setWindowTitle('');
+		this.initFunBackgroud();
+	}
+
+	getHeightAndWidth() {
+		const
+			height = $win.height(),
+			width = $win.width();
+
+		return {height, width};
+	}
+
+	initFunBackgroud() {
+
+		const
+			$bg = $('#rl-bg'),
+			movementStrength = 25,
+			winHeight = $win.height(),
+			winWidth = $win.width(),
+			height = movementStrength / winHeight,
+			width = movementStrength / winWidth,
+			winHeightHalf = winHeight / 2,
+			winWidthHalf = winWidth / 2;
+
+		$('#rl-app').on('mousemove', _.throttle((e) => {
+			$bg.css({
+				top: height * (e.pageY - winHeightHalf) * -1 - movementStrength,
+				left: width * (e.pageX - winWidthHalf) * -1 - movementStrength
+			});
+		}, 1));
 	}
 }
 
diff --git a/dev/Styles/Layout.less b/dev/Styles/Layout.less
index a642498af..10901b90a 100644
--- a/dev/Styles/Layout.less
+++ b/dev/Styles/Layout.less
@@ -2,10 +2,10 @@
 #rl-bg {
 	z-index: -1;
 	position: absolute;
-	left: 0;
-	right: 0;
+	left: -0;
+	right: -25px;
 	top: 0;
-	bottom: 0;
+	bottom: -25px;
 }
 
 #rl-content {
diff --git a/rainloop/v/0.0.0/app/templates/Themes/template.less b/rainloop/v/0.0.0/app/templates/Themes/template.less
index fdda184eb..b4ebb2ab4 100644
--- a/rainloop/v/0.0.0/app/templates/Themes/template.less
+++ b/rainloop/v/0.0.0/app/templates/Themes/template.less
@@ -310,7 +310,7 @@ html.glass {
 					text-shadow: none !important;
 				}
 
-				&:focus {
+				&:focus, &:hover {
 					border-color: @glass-color;
 				}
 			}