Make buttons more touch friendly

fix #1416

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

@@ -236,7 +236,11 @@ var MovieList = new Class({
 							self.changeView(el.get('data-view'));
 							this.addClass(a);
 
-							el.inject(el.getParent(), 'top')
+							el.inject(el.getParent(), 'top');
+							el.getSiblings().hide()
+							setTimeout(function(){
+								el.getSiblings().setStyle('display', null);
+							}, 100)
 						}
 					}
 				}),

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

@@ -268,6 +268,11 @@
 					top: 0;
 					margin: 0;
 				}
+					.touch_enabled .movies.list_list .info .title {
+						display: inline-block;
+						padding-right: 55px;
+					}
+				
 				.movies .info .title span {
 					display: inline-block;
 					text-overflow: ellipsis;
@@ -340,6 +345,10 @@
 					color: #FFF;
 				}
 				
+				.touch_enabled .movies.list_list .movie .info .year {
+					font-size: 1em;
+				}
+
 			.movies .info .description {
 				top: 30px;
 				clear: both;
@@ -367,6 +376,13 @@
 				display: none;
 			}
 		
+			.touch_enabled .movies.list_list .movie .data .quality {
+				position: relative;
+				display: inline-block;
+				margin: 0;
+				top: -4px;
+			}
+		
 			@media all and (max-width: 480px) {
 				.movies .data .quality {
 					display: none;
@@ -439,7 +455,8 @@
 				}
 			}
 		
-			.movies .movie:hover .data .actions {
+			.movies .movie:hover .data .actions,
+			.touch_enabled .movies .movie .data .actions {
 				opacity: 1;
 				display: inline-block;
 			}
@@ -676,6 +693,9 @@
 					height: 100%;
 					top: 0;
 				}
+					.touch_enabled .movies .movie .trynext {
+						display: none;
+					}
 				
 					@media all and (max-width: 480px) {
 						.movies .movie .trynext {
@@ -686,7 +706,8 @@
 					.wanted .movies .movie .trynext {
 						padding-right: 30px;
 					}
-					.movies .movie:hover .trynext {
+					.movies .movie:hover .trynext,
+					.touch_enabled .movies.details_list .movie .trynext {
 						opacity: 1;
 					}
 					
@@ -717,7 +738,8 @@
 						.movies .movie .trynext a:last-child {
 							margin: 0;
 						}
-						.movies .movie .trynext a:hover {
+						.movies .movie .trynext a:hover,
+						.touch_enabled .movies .movie .trynext a {
 							background-color: #369545;
 						}
 

couchpotato/static/scripts/couchpotato.js

@@ -30,6 +30,12 @@ var CouchPotato = new Class({
 		History.addEvent('change', self.openPage.bind(self));
 		self.c.addEvent('click:relay(a[href^=/]:not([target]))', self.pushState.bind(self));
 		self.c.addEvent('click:relay(a[href^=http])', self.openDerefered.bind(self));
+		
+		// Check if device is touchenabled
+		self.touch_device = 'ontouchstart' in document.documentElement;
+		if(self.touch_device)
+			self.c.addClass('touch_enabled');
+
 	},
 
 	getOption: function(name){