Release 0.4.2.

Patch notes 1. Change the logic to detect touch devices. 2. Add minScrollbarLength setting.
Fix the formula between scroll position and scrollbar position.
2013-08-01 01:09:15 +09:00 · 2013-08-01 01:03:33 +09:00 · 2013-07-31 08:42:40 -07:00 · 2013-07-17 12:53:02 -04:00 · 2013-07-08 23:25:24 +09:00 · 2013-07-08 23:08:49 +09:00
12 changed files with 78 additions and 22 deletions
--- a/.travis.yml
+++ b/.travis.yml
@@ -0,0 +1,5 @@
+language: node_js
+node_js:
+  - "0.10"
+before_script:
+  - npm install -g grunt-cli
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -82,5 +82,6 @@ module.exports = function (grunt) {

  grunt.registerTask('lint', ['jshint', 'csslint']);
  grunt.registerTask('build', ['clean', 'uglify', 'cssmin']);
+  grunt.registerTask('travis', ['lint']);

 };
--- a/README.md
+++ b/README.md
@@ -62,7 +62,10 @@ Default: 10
 If this option is true, when the scroll reach the end of the side, mousewheel event will be propagated to parent element.  
 Default: false

-
+### minScrollbarLength
+When set to an integer value, the thumb part of the scrollbar will not shrink below that number of pixels
+Default: null
+ 
 How to Use
 ----------

@@ -85,7 +88,8 @@ With optional parameters:
 ```javascript
 $("#Demo").perfectScrollbar({
  wheelSpeed: 20,
-  wheelPropagation: true
+  wheelPropagation: true,
+  minScrollbarLength: 20
 })
 ```

--- a/examples/options-minScrollbarLength.html
+++ b/examples/options-minScrollbarLength.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <title>perfect-scrollbar example - use wheelSpeed to change speed of scrolling</title>
+        <link href="../src/perfect-scrollbar.css" rel="stylesheet">
+        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
+        <script src="../src/jquery.mousewheel.js"></script>
+        <script src="../src/perfect-scrollbar.js"></script>
+        <style>
+          .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: hidden; }
+          .contentHolder .content { background-image: url('./azusa.jpg'); width: 12800px; height: 7200px; }
+          .spacer { text-align:center }
+        </style>
+    <script>
+      jQuery(document).ready(function ($) {
+        "use strict";
+        $('#Default').perfectScrollbar();
+        $('#LongThumb').perfectScrollbar({minScrollbarLength:100});
+      });
+    </script>
+  </head>
+  <body>
+    <h1 style="text-align:center">No minimum</h1>
+    <div id="Default" class="contentHolder">
+      <div class="content">
+      </div>
+    </div>
+    <h1 style="text-align:center">100px minimum</h1>
+    <div id="LongThumb" class="contentHolder">
+      <div class="content">
+      </div>
+    </div>
+  </body>
+</html>
--- a/min/perfect-scrollbar-0.4.1.min.js
+++ b/min/perfect-scrollbar-0.4.1.min.js
@@ -1,4 +0,0 @@
-/*! perfect-scrollbar - v0.4.1
-* http://noraesae.github.com/perfect-scrollbar/
-* Copyright (c) 2013 HyeonJe Jun; Licensed MIT */
-(function(e){var t={wheelSpeed:10,wheelPropagation:!1};e.fn.perfectScrollbar=function(o,r){return this.each(function(){var l=e.extend(!0,{},t);if("object"==typeof o?e.extend(!0,l,o):r=o,"update"===r)return e(this).data("perfect-scrollbar-update")&&e(this).data("perfect-scrollbar-update")(),e(this);if("destroy"===r)return e(this).data("perfect-scrollbar-destroy")&&e(this).data("perfect-scrollbar-destroy")(),e(this);if(e(this).data("perfect-scrollbar"))return e(this).data("perfect-scrollbar");var n,s,a,c,i,p,f,u,d=e(this).addClass("ps-container"),h=e("<div class='ps-scrollbar-x'></div>").appendTo(d),g=e("<div class='ps-scrollbar-y'></div>").appendTo(d),v=parseInt(h.css("bottom"),10),b=parseInt(g.css("right"),10),m=function(){var e=parseInt(u*c/s,10);d.scrollTop(e),h.css({bottom:v-e})},w=function(){var e=parseInt(p*a/n,10);d.scrollLeft(e),g.css({right:b-e})},T=function(){h.css({left:p+d.scrollLeft(),bottom:v-d.scrollTop(),width:i}),g.css({top:u+d.scrollTop(),right:b-d.scrollLeft(),height:f})},C=function(){n=d.width(),s=d.height(),a=d.prop("scrollWidth"),c=d.prop("scrollHeight"),a>n?(i=parseInt(n*n/a,10),p=parseInt(d.scrollLeft()*n/a,10)):(i=0,p=0,d.scrollLeft(0)),c>s?(f=parseInt(s*s/c,10),u=parseInt(d.scrollTop()*s/c,10)):(f=0,u=0,d.scrollTop(0)),u>=s-f&&(u=s-f),p>=n-i&&(p=n-i),T()},I=function(e,t){var o=e+t,r=n-i;p=0>o?0:o>r?r:o,h.css({left:p+d.scrollLeft()})},L=function(e,t){var o=e+t,r=s-f;u=0>o?0:o>r?r:o,g.css({top:u+d.scrollTop()})},y=function(){var t,o;h.bind("mousedown.perfect-scroll",function(e){o=e.pageX,t=h.position().left,h.addClass("in-scrolling"),e.stopPropagation(),e.preventDefault()}),e(document).bind("mousemove.perfect-scroll",function(e){h.hasClass("in-scrolling")&&(w(),I(t,e.pageX-o),e.stopPropagation(),e.preventDefault())}),e(document).bind("mouseup.perfect-scroll",function(){h.hasClass("in-scrolling")&&h.removeClass("in-scrolling")})},P=function(){var t,o;g.bind("mousedown.perfect-scroll",function(e){o=e.pageY,t=g.position().top,g.addClass("in-scrolling"),e.stopPropagation(),e.preventDefault()}),e(document).bind("mousemove.perfect-scroll",function(e){g.hasClass("in-scrolling")&&(m(),L(t,e.pageY-o),e.stopPropagation(),e.preventDefault())}),e(document).bind("mouseup.perfect-scroll",function(){g.hasClass("in-scrolling")&&g.removeClass("in-scrolling")})},D=function(){var e=function(e,t){var o=d.scrollTop();if(0===o&&t>0&&0===e)return!l.wheelPropagation;if(o>=c-s&&0>t&&0===e)return!l.wheelPropagation;var r=d.scrollLeft();return 0===r&&0>e&&0===t?!l.wheelPropagation:r>=a-n&&e>0&&0===t?!l.wheelPropagation:!0};d.bind("mousewheel.perfect-scroll",function(t,o,r,n){d.scrollTop(d.scrollTop()-n*l.wheelSpeed),d.scrollLeft(d.scrollLeft()+r*l.wheelSpeed),C(),e(r,n)&&t.preventDefault()})},X=function(){var t=function(e,t){d.scrollTop(d.scrollTop()-t),d.scrollLeft(d.scrollLeft()-e),C()},o={},r=0,l={},n=null,s=!1;e(window).bind("touchstart.perfect-scroll",function(){s=!0}),e(window).bind("touchend.perfect-scroll",function(){s=!1}),d.bind("touchstart.perfect-scroll",function(e){var t=e.originalEvent.targetTouches[0];o.pageX=t.pageX,o.pageY=t.pageY,r=(new Date).getTime(),null!==n&&clearInterval(n),e.stopPropagation()}),d.bind("touchmove.perfect-scroll",function(e){if(!s&&1===e.originalEvent.targetTouches.length){var n=e.originalEvent.targetTouches[0],a={};a.pageX=n.pageX,a.pageY=n.pageY;var c=a.pageX-o.pageX,i=a.pageY-o.pageY;t(c,i),o=a;var p=(new Date).getTime();l.x=c/(p-r),l.y=i/(p-r),r=p,e.preventDefault()}}),d.bind("touchend.perfect-scroll",function(){n=setInterval(function(){return.01>Math.abs(l.x)&&.01>Math.abs(l.y)?(clearInterval(n),void 0):(t(30*l.x,30*l.y),l.x*=.8,l.y*=.8,void 0)},10)})},Y=function(){h.remove(),g.remove(),d.unbind(".perfect-scroll"),e(window).unbind(".perfect-scroll"),d.data("perfect-scrollbar",null),d.data("perfect-scrollbar-update",null),d.data("perfect-scrollbar-destroy",null)},x=function(t){d.addClass("ie").addClass("ie"+t);var o=function(){var t=function(){e(this).addClass("hover")},o=function(){e(this).removeClass("hover")};d.bind("mouseenter.perfect-scroll",t).bind("mouseleave.perfect-scroll",o),h.bind("mouseenter.perfect-scroll",t).bind("mouseleave.perfect-scroll",o),g.bind("mouseenter.perfect-scroll",t).bind("mouseleave.perfect-scroll",o)},r=function(){T=function(){h.css({left:p+d.scrollLeft(),bottom:v,width:i}),g.css({top:u+d.scrollTop(),right:b,height:f}),h.hide().show(),g.hide().show()},m=function(){var e=parseInt(u*c/s,10);d.scrollTop(e),h.css({bottom:v}),h.hide().show()},w=function(){var e=parseInt(p*a/n,10);d.scrollLeft(e),g.hide().show()}};6===t&&(o(),r())},S=/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),A=function(){var e=navigator.userAgent.toLowerCase().match(/(msie) ([\w.]+)/);e&&"msie"===e[1]&&x(parseInt(e[2],10)),C(),y(),P(),S&&X(),d.mousewheel&&D(),d.data("perfect-scrollbar",d),d.data("perfect-scrollbar-update",C),d.data("perfect-scrollbar-destroy",Y)};return A(),d})}})(jQuery);
--- a/min/perfect-scrollbar-0.4.1.with-mousewheel.min.js
+++ b/min/perfect-scrollbar-0.4.1.with-mousewheel.min.js
--- a/min/perfect-scrollbar-0.4.2.min.css
+++ b/min/perfect-scrollbar-0.4.2.min.css
@@ -1,4 +1,4 @@
-/*! perfect-scrollbar - v0.4.1
+/*! perfect-scrollbar - v0.4.2
 * http://noraesae.github.com/perfect-scrollbar/
 * Copyright (c) 2013 HyeonJe Jun; Licensed MIT */

--- a/min/perfect-scrollbar-0.4.2.min.js
+++ b/min/perfect-scrollbar-0.4.2.min.js
--- a/min/perfect-scrollbar-0.4.2.with-mousewheel.min.js
+++ b/min/perfect-scrollbar-0.4.2.with-mousewheel.min.js
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "perfect-scrollbar",
-  "version": "0.4.1",
+  "version": "0.4.2",
  "engines": {
    "node": ">= 0.8.0"
  },
@@ -11,5 +11,8 @@
    "grunt-contrib-cssmin": "~0.6.1",
    "grunt-contrib-csslint": "~0.1.2",
    "grunt-contrib-clean": "~0.4.1"
+  },
+  "scripts": {
+    "test": "grunt travis --verbose"
  }
 }
--- a/perfect-scrollbar.jquery.json
+++ b/perfect-scrollbar.jquery.json
@@ -2,7 +2,7 @@
  "name": "perfect-scrollbar",
  "title": "perfect-scrollbar",
  "description": "Tiny but perfect jquery scrollbar plugin.",
-  "version": "0.4.1",
+  "version": "0.4.2",
  "author": {
    "name": "HyeonJe Jun",
    "email": "noraesae@yuiazu.net",
--- a/src/perfect-scrollbar.js
+++ b/src/perfect-scrollbar.js
@@ -6,7 +6,8 @@
  // The default settings for the plugin
  var defaultSettings = {
    wheelSpeed: 10,
-    wheelPropagation: false
+    wheelPropagation: false,
+    minScrollbarLength: null
  };

  $.fn.perfectScrollbar = function (suppliedSettings, option) {
@@ -55,17 +56,24 @@
          scrollbarYRight = parseInt($scrollbarY.css('right'), 10);

      var updateContentScrollTop = function () {
-        var scrollTop = parseInt(scrollbarYTop * contentHeight / containerHeight, 10);
+        var scrollTop = parseInt(scrollbarYTop * (contentHeight - containerHeight) / (containerHeight - scrollbarYHeight), 10);
        $this.scrollTop(scrollTop);
        $scrollbarX.css({bottom: scrollbarXBottom - scrollTop});
      };

      var updateContentScrollLeft = function () {
-        var scrollLeft = parseInt(scrollbarXLeft * contentWidth / containerWidth, 10);
+        var scrollLeft = parseInt(scrollbarXLeft * (contentWidth - containerWidth) / (containerWidth - scrollbarXWidth), 10);
        $this.scrollLeft(scrollLeft);
        $scrollbarY.css({right: scrollbarYRight - scrollLeft});
      };

+      var getSettingsAdjustedThumbSize = function (thumbSize) {
+        if (settings.minScrollbarLength) {
+          thumbSize = Math.max(thumbSize, settings.minScrollbarLength);
+        }
+        return thumbSize;
+      };
+
      var updateScrollbarCss = function () {
        $scrollbarX.css({left: scrollbarXLeft + $this.scrollLeft(), bottom: scrollbarXBottom - $this.scrollTop(), width: scrollbarXWidth});
        $scrollbarY.css({top: scrollbarYTop + $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: scrollbarYHeight});
@@ -77,8 +85,8 @@
        contentWidth = $this.prop('scrollWidth');
        contentHeight = $this.prop('scrollHeight');
        if (containerWidth < contentWidth) {
-          scrollbarXWidth = parseInt(containerWidth * containerWidth / contentWidth, 10);
-          scrollbarXLeft = parseInt($this.scrollLeft() * containerWidth / contentWidth, 10);
+          scrollbarXWidth = getSettingsAdjustedThumbSize(parseInt(containerWidth * containerWidth / contentWidth, 10));
+          scrollbarXLeft = parseInt($this.scrollLeft() * (containerWidth - scrollbarXWidth) / (contentWidth - containerWidth), 10);
        }
        else {
          scrollbarXWidth = 0;
@@ -86,8 +94,8 @@
          $this.scrollLeft(0);
        }
        if (containerHeight < contentHeight) {
-          scrollbarYHeight = parseInt(containerHeight * containerHeight / contentHeight, 10);
-          scrollbarYTop = parseInt($this.scrollTop() * containerHeight / contentHeight, 10);
+          scrollbarYHeight = getSettingsAdjustedThumbSize(parseInt(containerHeight * containerHeight / contentHeight, 10));
+          scrollbarYTop = parseInt($this.scrollTop() * (containerHeight - scrollbarYHeight) / (contentHeight - containerHeight), 10);
        }
        else {
          scrollbarYHeight = 0;
@@ -352,7 +360,7 @@
        }
      };

-      var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
+      var supportsTouch = (('ontouchstart' in window) || window.DocumentTouch && document instanceof window.DocumentTouch);

      var initialize = function () {
        var ieMatch = navigator.userAgent.toLowerCase().match(/(msie) ([\w.]+)/);
@@ -364,7 +372,7 @@
        updateBarSizeAndPosition();
        bindMouseScrollXHandler();
        bindMouseScrollYHandler();
-        if (isMobile) {
+        if (supportsTouch) {
          bindMobileTouchHandler();
        }
        if ($this.mousewheel) {
Author	SHA1	Message	Date
Hyunje Alex Jun	bdda167317	Release 0.4.2. Patch notes 1. Change the logic to detect touch devices. 2. Add minScrollbarLength setting.	2013-08-01 01:09:15 +09:00
Hyunje Alex Jun	123b1d724b	Fix the formula between scroll position and scrollbar position. With @Mordhak's suggestion, fixed the formula to calculate the values. This patch will resolve the scroll position problem when the minScrollbarLength setting is applied.	2013-08-01 01:03:33 +09:00
Hyunje Alex Jun	68032d168b	Merge pull request #48 from itsdrewmiller/master Add minScrollbarLength setting.	2013-07-31 08:42:40 -07:00
Drew Miller	ab2a018c93	minScrollbarLength setting I couldn't figure out the rebasing stuff so I just deleted my fork and redid the work. I believe I followed the contributing guidlines correctly as well.	2013-07-17 12:53:02 -04:00
Zeno Zeng	68c297fe2c	Use `supportsTouch` instead of `isMobile`.	2013-07-08 23:25:24 +09:00
Hyunje Alex Jun	09c0fb89d2	Use travis-ci.	2013-07-08 23:08:49 +09:00