Content overflow hiding back button on webkit

couchpotato/core/media/movie/_base/static/manage.js

@@ -59,7 +59,7 @@ var MoviesManage = new Class({
 					)
 				)
 			});
-			$(self.list).inject(self.el);
+			$(self.list).inject(self.content);
 
 			// Check if search is in progress
 			self.startProgressInterval();

couchpotato/core/media/movie/_base/static/page.js

@@ -13,7 +13,7 @@ Page.Movies = new Class({
 		self.parent(parent, options);
 
 		self.navigation = new BlockNavigation();
-		$(self.navigation).inject(self.el, 'top');
+		$(self.navigation).inject(self.content, 'top');
 
 	},
 

couchpotato/core/media/movie/_base/static/wanted.js

@@ -37,7 +37,7 @@ var MoviesWanted = new Class({
 				'menu': [self.manual_search, self.scan_folder],
 				'on_empty_element': App.createUserscriptButtons().addClass('empty_wanted')
 			});
-			$(self.list).inject(self.el);
+			$(self.list).inject(self.content);
 
 			// Check if search is in progress
 			self.startProgressInterval.delay(4000, self);
@@ -101,7 +101,7 @@ var MoviesWanted = new Class({
 				});
             };
 
-            self.folder_browser.inject(self.el, 'top');
+            self.folder_browser.inject(self.content, 'top');
             self.folder_browser.fireEvent('injected');
 
             // Hide the settings box

couchpotato/core/plugins/log/static/log.js

@@ -41,7 +41,7 @@ Page.Log = new Class({
 					self.showSelectionButton.delay(100, self, e);
 				}
 			}
-		}).inject(self.el);
+		}).inject(self.content);
 
 		Api.request('logging.get', {
 			'data': {
@@ -74,7 +74,7 @@ Page.Log = new Class({
 						'events': {
 							'change': function () {
 								var type_filter = this.getSelected()[0].get('value');
-								self.el.set('data-filter', type_filter);
+								self.content.set('data-filter', type_filter);
 								self.scrollToBottom();
 							}
 						}
@@ -110,7 +110,7 @@ Page.Log = new Class({
 				}).inject(nav);
 
 				// Add to page
-				navigation.inject(self.el, 'top');
+				navigation.inject(self.content, 'top');
 
 				self.scrollToBottom();
 			}

couchpotato/core/plugins/userscript/static/userscript.js

@@ -16,7 +16,7 @@ Page.Userscript = new Class({
 	indexAction: function(){
 		var self = this;
 
-		self.el.adopt(
+		self.content.grab(
 			self.frame = new Element('div.frame.loading', {
 				'text': 'Loading...'
 			})

couchpotato/static/scripts/combined.base.min.js

@@ -664,11 +664,11 @@ var PageBase = new Class({
         self.setOptions(options);
         self.el = new Element("div", {
             class: "page " + self.getPageClass() + (" level_" + (options.level || 0))
-        });
+        }).grab(self.content = new Element("div.content"));
         App.addEvent("load", function() {
             setTimeout(function() {
                 if (!App.mobile_screen) {
-                    self.el.addEvent("scroll", self.preventHover.bind(self));
+                    self.content.addEvent("scroll", self.preventHover.bind(self));
                 }
             }, 100);
         });
@@ -724,8 +724,8 @@ var PageBase = new Class({
                 elements = self[action + "Action"](params);
             }
             if (elements !== undefined) {
-                self.el.empty();
-                self.el.adopt(elements);
+                self.content.empty();
+                self.content.adopt(elements);
             }
             App.getBlock("navigation").activate(self.name);
             self.fireEvent("opened");
@@ -1014,7 +1014,7 @@ Page.Home = new Class({
                 App.on("movie.searcher.ended", after_search);
             }
         });
-        $(self.available_list).inject(self.el);
+        $(self.available_list).inject(self.content);
     },
     createSoon: function() {
         var self = this;
@@ -1036,7 +1036,7 @@ Page.Home = new Class({
                 self.chain.callChain();
             }
         });
-        $(self.soon_list).inject(self.el);
+        $(self.soon_list).inject(self.content);
     },
     createSuggestions: function() {
         var self = this;
@@ -1055,7 +1055,7 @@ Page.Home = new Class({
                 self.chain.callChain();
             }
         });
-        $(self.suggestions_list).inject(self.el);
+        $(self.suggestions_list).inject(self.content);
     },
     createCharts: function() {
         var self = this;
@@ -1064,7 +1064,7 @@ Page.Home = new Class({
                 self.chain.callChain();
             }
         });
-        $(self.charts_list).inject(self.el);
+        $(self.charts_list).inject(self.content);
     },
     createLate: function() {
         var self = this;
@@ -1086,7 +1086,7 @@ Page.Home = new Class({
                 self.chain.callChain();
             }
         });
-        $(self.late_list).inject(self.el);
+        $(self.late_list).inject(self.content);
     }
 });
 
@@ -1126,7 +1126,7 @@ Page.Settings = new Class({
         Object.each(self.params, function(param, subtab_name) {
             subtab = param;
         });
-        self.el.getElements("li." + c + " , .tab_content." + c).each(function(active) {
+        self.content.getElements("li." + c + " , .tab_content." + c).each(function(active) {
             active.removeClass(c);
         });
         if (t.subtabs[subtab]) {
@@ -1146,7 +1146,7 @@ Page.Settings = new Class({
         if (onComplete) Api.request("settings", {
             useSpinner: true,
             spinnerOptions: {
-                target: self.el
+                target: self.content
             },
             onComplete: function(json) {
                 self.data = json;
@@ -1166,7 +1166,7 @@ Page.Settings = new Class({
     showAdvanced: function() {
         var self = this;
         var c = self.advanced_toggle.checked ? "addClass" : "removeClass";
-        self.el[c]("show_advanced");
+        self.content[c]("show_advanced");
         Cookie.write("advanced_toggle_checked", +self.advanced_toggle.checked, {
             duration: 365
         });
@@ -1226,7 +1226,7 @@ Page.Settings = new Class({
             });
         });
         setTimeout(function() {
-            self.el.adopt(self.navigation, self.tabs_container, self.containers);
+            self.content.adopt(self.navigation, self.tabs_container, self.containers);
             self.fireEvent("create");
             self.openTab();
         }, 0);

couchpotato/static/scripts/combined.plugins.min.js

@@ -942,7 +942,7 @@ var MoviesManage = new Class({
                     }
                 })))
             });
-            $(self.list).inject(self.el);
+            $(self.list).inject(self.content);
             self.startProgressInterval();
         }
     },
@@ -2081,7 +2081,7 @@ Page.Movies = new Class({
         var self = this;
         self.parent(parent, options);
         self.navigation = new BlockNavigation();
-        $(self.navigation).inject(self.el, "top");
+        $(self.navigation).inject(self.content, "top");
     },
     defaultAction: function(action, params) {
         var self = this;
@@ -2289,7 +2289,7 @@ var MoviesWanted = new Class({
                 menu: [ self.manual_search, self.scan_folder ],
                 on_empty_element: App.createUserscriptButtons().addClass("empty_wanted")
             });
-            $(self.list).inject(self.el);
+            $(self.list).inject(self.content);
             self.startProgressInterval.delay(4e3, self);
         }
     },
@@ -2336,7 +2336,7 @@ var MoviesWanted = new Class({
                     }
                 });
             };
-            self.folder_browser.inject(self.el, "top");
+            self.folder_browser.inject(self.content, "top");
             self.folder_browser.fireEvent("injected");
             self.folder_browser.directory_inlay.hide();
             self.folder_browser.el.removeChild(self.folder_browser.el.firstChild);
@@ -2982,7 +2982,7 @@ Page.Log = new Class({
                     self.showSelectionButton.delay(100, self, e);
                 }
             }
-        }).inject(self.el);
+        }).inject(self.content);
         Api.request("logging.get", {
             data: {
                 nr: nr
@@ -3006,7 +3006,7 @@ Page.Log = new Class({
                     events: {
                         change: function() {
                             var type_filter = this.getSelected()[0].get("value");
-                            self.el.set("data-filter", type_filter);
+                            self.content.set("data-filter", type_filter);
                             self.scrollToBottom();
                         }
                     }
@@ -3041,7 +3041,7 @@ Page.Log = new Class({
                         }
                     }
                 }).inject(nav);
-                navigation.inject(self.el, "top");
+                navigation.inject(self.content, "top");
                 self.scrollToBottom();
             }
         });
@@ -3626,7 +3626,7 @@ Page.Userscript = new Class({
     },
     indexAction: function() {
         var self = this;
-        self.el.adopt(self.frame = new Element("div.frame.loading", {
+        self.content.grab(self.frame = new Element("div.frame.loading", {
             text: "Loading..."
         }));
         var url = window.location.href.split("url=")[1];

couchpotato/static/scripts/page.js

@@ -23,13 +23,15 @@ var PageBase = new Class({
 		// Create main page container
 		self.el = new Element('div', {
 			'class': 'page ' + self.getPageClass() + (' level_' + (options.level || 0))
-		});
+		}).grab(
+			self.content = new Element('div.content')
+		);
 
 		// Stop hover events while scrolling
 		App.addEvent('load', function(){
 			setTimeout(function(){
 				if(!App.mobile_screen){
-					self.el.addEvent('scroll', self.preventHover.bind(self));
+					self.content.addEvent('scroll', self.preventHover.bind(self));
 				}
 			}, 100);
 		});
@@ -104,8 +106,8 @@ var PageBase = new Class({
 				elements = self[action+'Action'](params);
 			}
 			if(elements !== undefined){
-				self.el.empty();
-				self.el.adopt(elements);
+				self.content.empty();
+				self.content.adopt(elements);
 			}
 
 			App.getBlock('navigation').activate(self.name);

couchpotato/static/scripts/page/home.js

@@ -79,7 +79,7 @@ Page.Home = new Class({
 			}
 		});
 
-		$(self.available_list).inject(self.el);
+		$(self.available_list).inject(self.content);
 
 	},
 
@@ -106,7 +106,7 @@ Page.Home = new Class({
 			}
 		});
 
-		$(self.soon_list).inject(self.el);
+		$(self.soon_list).inject(self.content);
 
 	},
 
@@ -129,7 +129,7 @@ Page.Home = new Class({
 			}
 		});
 
-		$(self.suggestions_list).inject(self.el);
+		$(self.suggestions_list).inject(self.content);
 
 	},
 
@@ -143,7 +143,7 @@ Page.Home = new Class({
 			}
 		});
 
-		$(self.charts_list).inject(self.el);
+		$(self.charts_list).inject(self.content);
 
 	},
 
@@ -170,7 +170,7 @@ Page.Home = new Class({
 			}
 		});
 
-		$(self.late_list).inject(self.el);
+		$(self.late_list).inject(self.content);
 
 	}
 

couchpotato/static/scripts/page/settings.js

@@ -53,7 +53,7 @@ Page.Settings = new Class({
 			subtab = param;
 		});
 
-		self.el.getElements('li.'+c+' , .tab_content.'+c).each(function(active){
+		self.content.getElements('li.'+c+' , .tab_content.'+c).each(function(active){
 			active.removeClass(c);
 		});
 
@@ -83,7 +83,7 @@ Page.Settings = new Class({
 			Api.request('settings', {
 				'useSpinner': true,
 				'spinnerOptions': {
-					'target': self.el
+					'target': self.content
 				},
 				'onComplete': function(json){
 					self.data = json;
@@ -108,7 +108,7 @@ Page.Settings = new Class({
 		var self = this;
 
 		var c = self.advanced_toggle.checked ? 'addClass' : 'removeClass';
-		self.el[c]('show_advanced');
+		self.content[c]('show_advanced');
 
 		Cookie.write('advanced_toggle_checked', +self.advanced_toggle.checked, {'duration': 365});
 	},
@@ -209,7 +209,7 @@ Page.Settings = new Class({
 		});
 
 		setTimeout(function(){
-			self.el.adopt(
+			self.content.adopt(
 				self.navigation,
 				self.tabs_container,
 				self.containers

couchpotato/static/style/combined.min.css

@@ -565,9 +565,10 @@ input,select,textarea{font-size:1em;font-weight:300;padding:6.67px;background:#F
 .content h1,.content h2,.content h3{padding:0;margin:0}
 .content .pages{width:100%}
 .content .footer{position:fixed;bottom:0;height:20px;width:100%}
-.page{position:absolute;top:0;left:0;right:0;bottom:0;display:none;padding:20px 0;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
+.page{position:absolute;top:0;left:0;right:0;bottom:0;display:none;padding:20px 0;-webkit-overflow-scrolling:touch}
 .page.home{padding:0 0 20px}
 .page.active{display:block}
+.page>.content{overflow:hidden;overflow-y:auto}
 .page h1,.page h2,.page h3,.page h4{font-weight:300}
 .page h2{font-size:24px;padding:20px}
 .page .navigation{z-index:2;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;position:fixed;top:0;height:80px;left:152px;right:20px;background:#FFF;border-radius:3px 0 0}

couchpotato/static/style/main.scss

@@ -386,8 +386,6 @@ input, textarea, select {
 	bottom: 0;
 	display: none;
 	padding: $padding 0;
-	overflow: hidden;
-	overflow-y: auto;
 	-webkit-overflow-scrolling:touch;
 
 	&.home {
@@ -398,6 +396,11 @@ input, textarea, select {
 		display: block;
 	}
 
+	> .content {
+		overflow: hidden;
+		overflow-y: auto;
+	}
+
 	h1, h2, h3, h4 {
 		font-weight: 300;
 	}