fixes #167 #165

mkoryak · Mar 10, 2015 · 9fcea8b · 9fcea8b
1 parent 864a7bb
commit 9fcea8b
Show file tree

Hide file tree

Showing 5 changed files with 101 additions and 35 deletions.
diff --git a/dist/jquery.floatThead-slim.js b/dist/jquery.floatThead-slim.js
@@ -94,6 +94,12 @@
     window && window.console && window.console.log && window.console.log("jQuery.floatThead: " + str);
   }
 
+  //returns fractional pixel widths
+  function getOffsetWidth(el) {
+    var rect = el.getBoundingClientRect();
+    return rect.right - rect.left;
+  }
+
   /**
    * try to calculate the scrollbar width for your browser/os
    * @return {Number}
@@ -439,6 +445,14 @@
           $table.css('minWidth', tableWidth($table, $fthCells)); //#121
         }
       }
+      var isHeaderFloatingLogical = false; //for the purpose of this event, the header is/isnt floating, even though the element
+                                           //might be in some other state. this is what the header looks like to the user
+      function triggerFloatEvent(isFloating){
+        if(isHeaderFloatingLogical != isFloating){
+          isHeaderFloatingLogical = isFloating;
+          $table.triggerHandler("floatThead", [isFloating, $floatContainer])
+        }
+      }
       function changePositioning(isAbsolute){
         if(useAbsolutePositioning != isAbsolute){
           useAbsolutePositioning = isAbsolute;
@@ -478,7 +492,7 @@
             unfloat();
             var widths = [];
             for(i=0; i < numCols; i++){
-              widths[i] = $rowCells.get(i).offsetWidth;
+              widths[i] = getOffsetWidth($rowCells.get(i));
             }
             for(i=0; i < numCols; i++){
               $headerCells.eq(i).width(widths[i]);
@@ -542,7 +556,7 @@
           if(!isTableHidden && floatTableHidden) {
             floatTableHidden = false;
             setTimeout(function(){
-              $table.trigger("reflow");
+              $table.triggerHandler("reflow");
             }, 1);
             return null;
           }
@@ -579,7 +593,7 @@
             return null; //event is fired when they stop scrolling. ignore it if not 'absoluteToFixedOnScroll'
           }
 
-          tableOffset = $table.offset();
+          tableOffset = $table[0].getBoundingClientRect();
           if(haveCaption && captionAlignTop){
             tableOffset.top += captionHeight;
           }
@@ -590,45 +604,53 @@
             if (tableContainerGap >= scrollingContainerTop) {
               var gap = tableContainerGap - scrollingContainerTop;
               top = gap > 0 ? gap : 0;
+              triggerFloatEvent(false);
             } else {
               top = wrappedContainer ? 0 : scrollingContainerTop;
               //headers stop at the top of the viewport
+              triggerFloatEvent(true);
             }
             left = tableLeftGap;
           } else if(!locked && useAbsolutePositioning) { //window scrolling, absolute positioning
             if(windowTop > floatEnd + tableHeight + captionScrollOffset){
               top = tableHeight - floatContainerHeight + captionScrollOffset; //scrolled past table
-            } else if (tableOffset.top > windowTop + scrollingTop) {
+            } else if (tableOffset.top > scrollingTop) {
               top = 0; //scrolling to table
               unfloat();
+              triggerFloatEvent(false);
             } else {
-              top = scrollingTop + windowTop - tableOffset.top + tableContainerGap + (captionAlignTop ? captionHeight : 0);
+              top = scrollingTop - tableOffset.top + tableContainerGap + (captionAlignTop ? captionHeight : 0);
               refloat(); //scrolling within table. header floated
+              triggerFloatEvent(true);
             }
             left =  0;
           } else if(locked && !useAbsolutePositioning){ //inner scrolling, fixed positioning
             if (tableContainerGap > scrollingContainerTop || scrollingContainerTop - tableContainerGap > tableHeight) {
-              top = tableOffset.top - windowTop;
+              top = tableOffset.top;
               unfloat();
+              triggerFloatEvent(false);
             } else {
-              top = tableOffset.top + scrollingContainerTop  - windowTop - tableContainerGap;
+              top = tableOffset.top + scrollingContainerTop - tableContainerGap;
               refloat();
+              triggerFloatEvent(true);
               //headers stop at the top of the viewport
             }
-            left = tableOffset.left + scrollContainerLeft - windowLeft;
+            left = tableOffset.left + scrollContainerLeft;
           } else if(!locked && !useAbsolutePositioning) { //window scrolling, fixed positioning
             if(windowTop > floatEnd + tableHeight + captionScrollOffset){
               top = tableHeight + scrollingTop - windowTop + floatEnd + captionScrollOffset;
               //scrolled past the bottom of the table
-            } else if (tableOffset.top > windowTop + scrollingTop) {
-              top = tableOffset.top - windowTop;
+            } else if (tableOffset.top > scrollingTop) {
+              top = tableOffset.top;
               refloat();
+              triggerFloatEvent(false); //this is a weird case, the header never gets unfloated and i have no no way to know
               //scrolled past the top of the table
             } else {
               //scrolling within the table
               top = scrollingTop;
+              triggerFloatEvent(true);
             }
-            left = tableOffset.left - windowLeft;
+            left = tableOffset.left;
           }
           return {top: top, left: left};
         };