Floating movie navigation

couchpotato/core/plugins/movie/static/list.js

@@ -141,6 +141,16 @@ var MovieList = new Class({
 			}
 		});
 
+		self.nav_scrollspy = new ScrollSpy({
+			min: 10,
+			onEnter: function(){
+				self.navigation.addClass('float')
+			},
+			onLeave: function(){
+				self.navigation.removeClass('float')
+			}
+		});
+
 	},
 
 	reset: function(){
@@ -211,8 +221,8 @@ var MovieList = new Class({
 
 	loadMore: function(){
 		var self = this;
-
-		self.getMovies()
+		if(self.offset >= self.options.limit)
+			self.getMovies()
 	},
 
 	store: function(movies){

couchpotato/core/plugins/movie/static/movie.css

@@ -5,7 +5,7 @@
 */
 
 .movies {
-	padding: 20px 0;
+	padding: 50px 0 20px;
 }
 
 	.movies .movie {
@@ -215,7 +215,20 @@
 
 .movies .alph_nav {
 	overflow: hidden;
+	transition: box-shadow .4s linear;
+	position: fixed;
+	z-index: 2;
+	top: 0;
+	padding: 100px 7px 7px;
+	margin: -7px;
+	width: 960px;
 }
+
+	.movies .alph_nav.float {
+		box-shadow:  0 0 10px rgba(0,0,0,0.4);
+		border-radius: 4px;
+		background: #4e5969;
+	}
 	
 .movies .alph_nav ul {
 	list-style: none;

couchpotato/static/style/main.css

@@ -153,12 +153,12 @@ body > .spinner, .mask{
 	height: 60px;
 	position: fixed;
 	width: 99%;
-	z-index: 2;
-	box-shadow:  0 0 5px rgba(0,0,0,0.1);
+	z-index: 5;
+	box-shadow:  0 0 5px rgba(0,0,0,0.05);
 	transition: box-shadow .4s cubic-bezier(0.9,0,0.1,1);
 }
 	.header.with_shadow {
-		box-shadow:  0 0 50px rgba(0,0,0,0.3);
+		box-shadow:  0 0 20px rgba(0,0,0,0.3);
 	}
 
 .header > div {