diff --git a/client/index.html b/client/index.html index 29dc3492..c6c9f291 100644 --- a/client/index.html +++ b/client/index.html @@ -5,7 +5,7 @@ Shout — The modern IRC client - + diff --git a/client/js/chat.js b/client/js/chat.js index 8f63be23..c68a8096 100644 --- a/client/js/chat.js +++ b/client/js/chat.js @@ -60,7 +60,7 @@ $(function() { .find(".window") .last() .find(".chat") - .sticky({speed: 400, overflow: "auto"}) + .sticky() .end() .find(".input") .tabComplete(commands, {hint: false}); @@ -88,7 +88,7 @@ $(function() { .prev(".show-more") .show(); chat.find(".chat") - .sticky({speed: 400, overflow: "auto"}) + .sticky() .end(); var networks = $("#networks") @@ -112,6 +112,9 @@ $(function() { } } + var viewport = $("#viewport"); + var touchDevice = ($("#detect").css("display") == "none"); + var z = 1; sidebar.on("click", "a", function(e) { e.preventDefault(); @@ -120,6 +123,7 @@ $(function() { if (!target) { return; } + viewport.removeClass(); sidebar.find(".active").removeClass("active"); link.addClass("active") .find(".badge") @@ -130,9 +134,11 @@ $(function() { .removeClass("active") .end() .css("z-index", z++) - .addClass("active") - .find("input") - .focus(); + .addClass("active"); + + if (!touchDevice) { + window.find("input").focus(); + } }); sidebar.on("click", ".close", function() { @@ -215,18 +221,14 @@ $(function() { }); // Toggle sidebars - var viewport = $("#viewport"); var toggle = "click"; - if ($("#detect").css("display") == "none") { + if (touchDevice) { toggle = "touchstart"; } chat.on(toggle, ".lt, .rt", function() { var btn = $(this); viewport.toggleClass(btn.attr("class")); }); - chat.on("focus", ".input", function() { - viewport.removeClass(); - }); function escape(text) { var e = { diff --git a/client/js/jquery.plugins.js b/client/js/jquery.plugins.js index 7ea94d24..613e4eef 100644 --- a/client/js/jquery.plugins.js +++ b/client/js/jquery.plugins.js @@ -1,17 +1,17 @@ /*! - * stickyScroll - * https://github.com/erming/stickyScroll + * stickyscroll + * https://github.com/erming/stickyscroll * * Copyright (c) 2014 Mattias Erming * Licensed under the MIT License. * - * Version 1.2.1 + * Version 1.3.1 */ (function($) { $.fn.sticky = function(options) { var settings = $.extend({ disableManualScroll: false, - overflow: 'scroll', + overflow: 'auto', scrollToBottom: true, speed: 0 }, options); @@ -24,11 +24,12 @@ } self.css('overflow-y', settings.overflow); + self.css('-webkit-overflow-scrolling', 'touch'); if (settings.scrollToBottom) { self.scrollToBottom(); } - var timer; + var resizeTimer; var resizing = false; $(window).on('resize', function() { self.finish(); @@ -37,8 +38,8 @@ // while resizing the browser. resizing = true; - clearTimeout(timer); - timer = setTimeout(function() { + clearTimeout(resizeTimer); + resizeTimer = setTimeout(function() { resizing = false; }, 100); @@ -47,12 +48,16 @@ } }); + var scrollTimer; var sticky = true; self.on('scroll', function() { if (settings.disableManualScroll) { self.scrollToBottom(); } else if (!resizing) { - sticky = self.isScrollAtBottom(); + clearTimeout(scrollTimer); + scrollTimer = setTimeout(function() { + sticky = self.isScrollAtBottom(); + }, 50); } }); self.trigger('scroll');