Tabindex (#3)

* Feature/scroll to center (#1)

* Auto scroll to the center of transcripts block.

* Fix bower.json syntax.

README.md

@@ -55,6 +55,11 @@ object may contain any of the following properties:
 
 Set to false to disable autoscrolling.
 
+#### scrollToCenter
+**Default:** false
+
+By default current row shows on the bottom on autoscrolling. Set to true to show it in the center
+
 #### clickArea
 **Default:** 'line'
 

bower.json

@@ -2,7 +2,7 @@
   "name": "videojs-transcript",
   "version": "0.1",
   "dependencies": {
-    "video-js": "5.13.1",
+    "video-js": "5.13.1"
   },
   "homepage": "https://github.com/raccoongang/videojs-transcript",
   "authors": [

dist/videojs-transcript.js

@@ -97,6 +97,7 @@ var defaults = {
   showTitle: true,
   showTrackSelector: true,
   followPlayerTrack: true,
+  scrollToCenter: false,
   stopScrollWhenInUse: true,
 };
 
@@ -246,17 +247,21 @@ var scrollerProto = function(plugin) {
       var elementOffsetBottom = element.offsetTop + element.clientHeight;
       var relTop = element.offsetTop - parent.offsetTop;
       var relBottom = (element.offsetTop + element.clientHeight) - parent.offsetTop;
+      var centerPosCorrection = 0;
       var newPos;
 
+      if (plugin.settings.scrollToCenter){
+        centerPosCorrection = Math.round(parent.clientHeight/2 - element.clientHeight/2);
+      }
       // If the top of the line is above the top of the parent view, were scrolling up,
       // so we want to move the top of the element downwards to match the top of the parent.
-      if (relTop < parent.scrollTop) {
-        newPos = element.offsetTop - parent.offsetTop;
+      if (relTop < parent.scrollTop + centerPosCorrection) {
+        newPos = element.offsetTop - parent.offsetTop - centerPosCorrection;
 
       // If the bottom of the line is below the parent view, we're scrolling down, so we want the
       // bottom edge of the line to move up to meet the bottom edge of the parent.
-      } else if (relBottom > (parent.scrollTop + parent.clientHeight)) {
-        newPos = elementOffsetBottom - parentOffsetBottom;
+      } else if (relBottom > (parent.scrollTop + parent.clientHeight) - centerPosCorrection) {
+        newPos = elementOffsetBottom - parentOffsetBottom + centerPosCorrection;
       }
 
       // Don't try to scroll if we haven't set a new position.  If we didn't