From 3e712cafe10c6ec1146e9e6906a9b8dbb2408d89 Mon Sep 17 00:00:00 2001
From: psychobunny <rodrigues.andrew@gmail.com>
Date: Tue, 25 Aug 2015 16:30:13 -0400
Subject: [PATCH] Revert "removed old slide-in code"

This reverts commit 3143c130d8219efa8937534b80dba4263c037c7a.
---
 less/mobile.less            |  0
 less/persona.less           |  2 +-
 less/slide-menu.less        | 50 +++++++++++++++++++++++++++++++++++++
 lib/persona.js              | 44 ++++++++++++++++++++++++++++----
 templates/partials/menu.tpl |  4 +--
 5 files changed, 92 insertions(+), 8 deletions(-)
 delete mode 100644 less/mobile.less
 create mode 100644 less/slide-menu.less

diff --git a/less/mobile.less b/less/mobile.less
deleted file mode 100644
index e69de29..0000000
diff --git a/less/persona.less b/less/persona.less
index 4c71a15..10a013a 100644
--- a/less/persona.less
+++ b/less/persona.less
@@ -18,7 +18,7 @@
 @import "posts_list";
 @import "register";
 
-@import "mobile";
+@import "slide-menu";
 
 @import "helpers";
 @import "keyframes";
diff --git a/less/slide-menu.less b/less/slide-menu.less
new file mode 100644
index 0000000..299dbca
--- /dev/null
+++ b/less/slide-menu.less
@@ -0,0 +1,50 @@
+@media (max-width: @screen-xs-max) {
+	#header-menu #nav-dropdown.navbar-slide-in {
+		width: 45%;
+		background: @gray-dark;
+		right: -45%;
+		min-height: 1000px;
+		position: fixed;
+		margin-top: -20px;
+		padding: 20px;
+		box-shadow: inset 2px 0px 12px black;
+		top: 0px;
+
+		a, a:hover, a:focus, a:active {
+			color: @gray-lighter;
+		}
+
+		> ul {
+			overflow: hidden;
+			
+			> li {
+				.transition(.40s ease-in-out transform);
+				transform: translate3d(-50px, 0, 0);
+				-webkit-transform: translate3d(-50px, 0, 0);
+			}
+
+			border-bottom: 1px solid lighten(@gray-dark, 10%);
+		}
+	}
+
+	#header-menu .navbar-nav>.active>a,
+	#header-menu .navbar-nav>.active>a:focus,
+	#header-menu .navbar-nav>.open>a,
+	#header-menu .navbar-nav>.open>a:focus {
+		background: inherit;
+	}
+
+	body {
+		.transition(.40s ease-in-out transform);
+
+		&.slide-in {
+			transform: translate3d(-45%, 0, 0);
+			-webkit-transform: translate3d(-45%, 0, 0);
+
+			#header-menu #nav-dropdown.navbar-slide-in > ul > li {
+				transform: translate3d(0, 0, 0);
+				-webkit-transform: translate3d(0, 0, 0);
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/lib/persona.js b/lib/persona.js
index 24eca0c..11c2c03 100644
--- a/lib/persona.js
+++ b/lib/persona.js
@@ -3,8 +3,7 @@
 /*globals ajaxify, config, utils, NProgress*/
 
 $(document).ready(function() {
-	setupNProgress();
-	setupTaskbar();
+	setupSlideMenu();
 	setupEditedByIcon();
 	setupPaginator();
 
@@ -16,17 +15,50 @@ $(document).ready(function() {
 		});
 	}
 
-	function setupNProgress() {
+	function setupSlideMenu() {
+		$('[data-toggle="slide-in"]').on('click', function(ev) {
+			$('body').toggleClass('slide-in');
+
+			if ($('body').hasClass('slide-in')) {
+				var top = ($('html').scrollTop() || $('body').scrollTop()) + $('header-menu').height(),
+					transform = 'translate3d(0, ' + top + 'px, 0)';
+
+				$('#header-menu').css({
+					'-webkit-transform': transform,
+					'-moz-transform': transform,
+					'-ms-transform': transform,
+					'-o-transform': transform,
+					'transform': transform
+				});
+
+				$('html').css('overflow-y', 'hidden');
+			} else {
+				$('body').one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend", function() {
+					$('#header-menu').css({
+						'-webkit-transform': 'none',
+						'-moz-transform': 'none',
+						'-ms-transform': 'none',
+						'-o-transform': 'none',
+						'transform': 'none'
+					});
+
+					$('html').css('overflow-y', '');
+				});
+			}
+		});
+
 		$(window).on('action:ajaxify.start', function() {
+			if ($('body').hasClass('slide-in')) {
+				$('.navbar-header button').click();
+			}
+
 			NProgress.set(0.7);
 		});
 
 		$(window).on('action:ajaxify.end', function() {
 			NProgress.done();
 		});
-	}
 
-	function setupTaskbar() {
 		$(window).on('filter:taskbar.push', function(ev, data) {
 			data.options.className = 'taskbar-' + data.module;
 
@@ -156,4 +188,6 @@ $(document).ready(function() {
 
 		$(window).on('action:posts.loading', appendPageNumber);
 	}
+
+
 });
\ No newline at end of file
diff --git a/templates/partials/menu.tpl b/templates/partials/menu.tpl
index a071fe0..66e72c3 100644
--- a/templates/partials/menu.tpl
+++ b/templates/partials/menu.tpl
@@ -1,5 +1,5 @@
 			<div class="navbar-header">
-				<button type="button" class="navbar-toggle">
+				<button type="button" class="navbar-toggle" data-toggle="slide-in" data-target=".navbar-slide-in">
 					<span class="notification-icon fa fa-fw fa-bell-o" data-content="0"></span>
 					<span class="icon-bar"></span>
 					<span class="icon-bar"></span>
@@ -20,7 +20,7 @@
 				</div>
 			</div>
 
-			<div id="nav-dropdown">
+			<div class="navbar-slide-in" id="nav-dropdown">
 				<!-- IF !maintenanceHeader -->
 				<!-- IF loggedIn -->